Documentation personnelle complète
- CLAUDE.md : Instructions compactes et enrichies
- personnalités/ : Profils Alexis, Tingting, Ben, Xiaoxiao + TingtingWork.md
- couple_backlog/ : Historique conflits (16-22 octobre 2025)
- conversation_topics/ : Système suivi sujets actifs
- Projects/ : Analyses techniques et projets
- ToRemember/ : Leadership socratique, suivi conversations
- Promesses_à_tenir.md, observations_patterns.md
PowerPoint skill
- .claude/skills/pptx/ : Skill officiel Anthropic (html2pptx)
- Identité visuelle Tingting : Bordeaux + Or antique + Crème
- Exemple : personnalités/Tingting_Class73_Elegant.pptx
Organisation
- planning/, stratégie/, topics/, plan_discussion/
- .gitignore : node_modules, *.pptx (sauf personnalités/), HTML/JS temp
🎯 Repo propre : 129 fichiers essentiels, 0 dependencies
178 lines
5.2 KiB
Markdown
178 lines
5.2 KiB
Markdown
# Tingting Work - PowerPoint Style Guide
|
|
|
|
## Identité visuelle pour les présentations professionnelles de Tingting
|
|
|
|
Ce document décrit le style visuel élégant développé pour les présentations PowerPoint de Tingting (professeure, contexte scolaire chinois).
|
|
|
|
---
|
|
|
|
## 🎨 Palette de couleurs
|
|
|
|
### Couleurs principales
|
|
- **Bordeaux profond** : `#6B2C3E` - Élégance, sérieux professionnel
|
|
- **Or antique** : `#B8974F` - Raffinement, tradition chinoise subtile
|
|
- **Crème ivoire** : `#F5F1E8` - Fond chaleureux, doux pour les yeux
|
|
- **Gris ardoise** : `#4A5568` - Texte principal
|
|
- **Encre chinoise** : `#2D3748` - Accents sombres, fonds dramatiques
|
|
|
|
### Couleurs d'accent (optionnelles)
|
|
- **Vert sauge pâle** : `#A8B5A0` - Touche européenne subtile
|
|
- **Bleu encre dilué** : `#7891A8` - Modernité chinoise
|
|
|
|
---
|
|
|
|
## 📐 Principes de design
|
|
|
|
### 1. **Minimalisme moderne avec touches traditionnelles**
|
|
- Beaucoup d'espace blanc (ou crème)
|
|
- Éléments visuels épurés
|
|
- Bordures fines (1-2pt maximum)
|
|
- Ombres très subtiles, presque imperceptibles
|
|
|
|
### 2. **Typographie**
|
|
- **Titres** : Georgia (serif) pour l'élégance
|
|
- **Corps de texte** : Arial ou équivalent system font
|
|
- **Tailles** :
|
|
- H1 (titre principal) : 42-52pt
|
|
- H2 (sous-titres) : 38-42pt
|
|
- H3 (titres de sections) : 16-22pt
|
|
- Corps : 12-15pt
|
|
- Citations : 17-22pt en italique
|
|
|
|
### 3. **Éléments chinois ultra-subtils**
|
|
- Caractères chinois en **filigrane/watermark** : opacity 8-12% maximum
|
|
- Positionnés de façon décorative (pas au centre)
|
|
- Taille massive (280-420pt) mais ultra-transparent
|
|
- Exemples : 师 (professeur), 魂 (âme/esprit), 学 (étude)
|
|
|
|
### 4. **Structure visuelle**
|
|
- **Cartes/boxes** : fond blanc, bordure fine or antique, border-radius 6-8pt
|
|
- **Badges numérotés** : cercles bordeaux avec chiffres crème
|
|
- **Dividers** : lignes fines (1pt) or antique, jamais plus de 150-180pt de large
|
|
- **Listes** : utiliser `<ul>` avec discs, espacement généreux (line-height 1.4-1.7)
|
|
|
|
---
|
|
|
|
## 🏗️ Templates de slides types
|
|
|
|
### Slide 1 : Introduction/Titre
|
|
```
|
|
- Watermark character (师) ultra-léger en haut à droite
|
|
- Titre principal (H1) centré-gauche, bordeaux
|
|
- Divider horizontal or fin sous le titre
|
|
- Sous-titre en gris italique
|
|
- Barre auteur en bas avec bordure top or antique
|
|
```
|
|
|
|
### Slide 2 : Index/Priorités (4 boxes grid)
|
|
```
|
|
- Titre H2 en haut
|
|
- 4 boxes blanches en grille 2x2
|
|
- Chaque box :
|
|
- Badge numéroté bordeaux en haut à gauche
|
|
- H3 pour le titre de la priorité
|
|
- Texte descriptif court
|
|
- Border or antique 1pt
|
|
```
|
|
|
|
### Slide 3 : Détail d'une initiative (3 cartes verticales)
|
|
```
|
|
- Titre H2 + sous-titre italique
|
|
- Divider fin or antique
|
|
- 3 feature cards empilées verticalement
|
|
- Border-left 3pt or antique (au lieu de border complète)
|
|
- Cercle décoratif subtil en bas à droite (opacity 0.3)
|
|
```
|
|
|
|
### Slide 4 : Slide dramatique (fond sombre)
|
|
```
|
|
- Background : #2D3748 (encre chinoise)
|
|
- Watermark character (魂) énorme et ultra-léger
|
|
- Titre or antique
|
|
- Box central bordeaux avec bordure or
|
|
- Texte crème/ivoire pour contraste
|
|
```
|
|
|
|
### Slide 5 : Conclusion
|
|
```
|
|
- Background bordeaux
|
|
- Cercle décoratif or en haut à droite (opacity 0.15)
|
|
- Titre H2 crème
|
|
- Liste à puces or antique
|
|
- Divider fin or en bas du centre
|
|
- Citation finale centrée, italique, crème
|
|
```
|
|
|
|
---
|
|
|
|
## ⚙️ Contraintes techniques (html2pptx)
|
|
|
|
### Règles strictes à respecter
|
|
1. **Dimensions** : `width: 720pt; height: 405pt;` pour 16:9
|
|
2. **Marges** : Minimum 36pt (0.5") depuis le bord **inférieur**
|
|
3. **Pas de gradients CSS** : uniquement couleurs solides
|
|
4. **Bordures** : uniquement sur `<div>`, JAMAIS sur `<p>`, `<h1-6>`, `<ul>`, `<ol>`
|
|
5. **Listes** : toujours utiliser `<ul>/<ol>`, jamais de bullets manuels (•, -, *)
|
|
6. **Fonts** : web-safe uniquement (Georgia, Arial, Times New Roman, Helvetica)
|
|
|
|
### Structure HTML type
|
|
```html
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<style>
|
|
html { background: #ffffff; }
|
|
body {
|
|
width: 720pt;
|
|
height: 405pt;
|
|
margin: 0;
|
|
padding: 0;
|
|
background: #F5F1E8;
|
|
font-family: Arial, sans-serif;
|
|
display: flex;
|
|
}
|
|
.slide-content {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: relative;
|
|
}
|
|
/* Styles avec position: absolute pour placements précis */
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="slide-content">
|
|
<!-- Contenu ici -->
|
|
</div>
|
|
</body>
|
|
</html>
|
|
```
|
|
|
|
---
|
|
|
|
## 💡 Philosophie du style
|
|
|
|
Ce style allie :
|
|
- **Élégance européenne** (français/anglais) : typographie serif, espacement, minimalisme
|
|
- **Modernité** : design épuré, cartes, grilles
|
|
- **Traditionalisme chinois subtil** : caractères en filigrane, or antique, rouge bordeaux
|
|
- **Professionnalisme** : adapté au contexte scolaire chinois, sérieux sans être austère
|
|
|
|
### Mots-clés
|
|
- Sophistiqué mais accessible
|
|
- Chaleureux mais professionnel
|
|
- Moderne mais respectueux de la tradition
|
|
- Élégant mais jamais "trop flashy"
|
|
|
|
---
|
|
|
|
## 📝 Usage
|
|
|
|
Quand Tingting demande de l'aide pour un PowerPoint :
|
|
1. Utiliser cette palette de couleurs
|
|
2. Appliquer ces principes de design
|
|
3. Respecter les contraintes techniques html2pptx
|
|
4. Adapter le contenu selon le contexte (réunion, présentation parents, collègues)
|
|
5. Garder cette identité visuelle cohérente pour toutes ses présentations
|
|
|
|
**Fichier de référence** : `Tingting_Class73_Chinese.pptx` (septembre 2025)
|