Vibe Learning Club

Blocs Contenu

8 types de blocs pour le contenu textuel et structuré des leçons.

← Retour à la documentation

texte

alias: text

alias: paragraph

alias: content

Paragraphe HTML enrichi avec contexte visuel. Le contexte détermine l'icône et les couleurs.

Propriétés

Propriété	Type	Description
type	'texte'	Type du bloc
ordre	number	Position dans la leçon
contexte	string	Contexte visuel (obj, meth, ex, rem, adv, warning, def, intro, synth...)
contenu.text	string	Contenu HTML du bloc
contenu.titre	string	Titre optionnel

{
  "type": "texte",
  "ordre": 1,
  "contexte": "obj",
  "contenu": {
    "contexte": "obj",
    "text": "<h3>Objectifs</h3><p>À la fin de cette leçon...</p>"
  }
}

Aperçu

OBJECTIF

Objectifs de cette leçon

À la fin de cette leçon, vous serez capable de :

Comprendre les principes fondamentaux de la cuisine italienne
Maîtriser la technique de préparation des arancini
Appliquer les bonnes pratiques de cuisson

Contextes visuels disponibles

obj (Objectif)

meth (Méthode)

def (Définition)

ex (Exemple)

rem (Remarque)

adv (Conseil)

warning (Attention)

synth (Synthèse)

Autre exemple : Contexte méthode

MÉTHODE

Méthode recommandée

Pour obtenir les meilleurs résultats, suivez cette approche en 4 étapes clés :

Préparez tous les ingrédients à l'avance
Respectez les temps de repos
Contrôlez la température de cuisson
Testez la texture avant de servir

liste_ordonnee / liste_non_ordonnee

alias: list

alias: ordered_list

alias: unordered_list

alias: bullet_list

Listes numérotées (ol) ou à puces (ul) pour énumérer des étapes ou des éléments.

Propriétés

Propriété	Type	Description
type	'liste_ordonnee' \| 'liste_non_ordonnee'	Type de liste
ordre	number	Position dans la leçon
titre	string	Titre de la liste
items	string[]	Éléments de la liste (HTML autorisé)

{
  "type": "liste_ordonnee",
  "ordre": 2,
  "titre": "Les étapes de préparation",
  "items": [
    "Cuire le riz dans le bouillon pendant 18 minutes",
    "Laisser refroidir complètement (2 heures minimum)",
    "Former des boulettes de la taille d'une orange",
    "Ajouter la garniture au centre",
    "Refermer et lisser la surface"
  ]
}

Aperçu

Les étapes de préparation

Cuire le riz dans le bouillon de légumes pendant 18 minutes
Laisser refroidir complètement le riz (2 heures minimum)
Former des boulettes de la taille d'une orange
Creuser un trou et ajouter la garniture
Refermer et lisser la surface

Liste non ordonnée

Ingrédients nécessaires

300g de riz arborio
1L de bouillon de légumes
150g de mozzarella
100g de chapelure
2 œufs battus
Huile de friture

tableau

alias: table

alias: grid

alias: data_table

Données structurées en tableau avec en-têtes et alignement des colonnes.

Propriétés

Propriété	Type	Description
type	'tableau'	Type du bloc
ordre	number	Position dans la leçon
titre	string	Titre du tableau
colonnes	Column[]	Définition des colonnes (titre, alignement, largeur)
lignes	Row[]	Lignes de données (type, cellules)

{
  "type": "tableau",
  "ordre": 3,
  "colonnes": [
    { "titre": "Ingrédient", "alignement": "left" },
    { "titre": "Quantité", "alignement": "center" },
    { "titre": "Notes", "alignement": "left" }
  ],
  "lignes": [
    { "type": "header", "cellules": ["Ingrédient", "Quantité", "Notes"] },
    { "cellules": ["Riz arborio", "300g", "Préférez le riz italien"] },
    { "cellules": ["Mozzarella", "150g", "Di bufala recommandé"] }
  ]
}

Aperçu

Ingrédient	Quantité	Notes
Riz arborio	300g	Préférez le riz italien
Mozzarella	150g	Di bufala ou fior di latte
Chapelure	100g	Fine pour meilleur croustillant
Huile	1L	Huile de tournesol ou arachide

exemple

alias: example

alias: demo

alias: case_study

Cas pratique illustré avec contexte, calculs ou démonstrations étape par étape.

Propriétés

Propriété	Type	Description
type	'exemple'	Type du bloc
ordre	number	Position dans la leçon
titre	string	Titre de l'exemple
contenu.html	string	Contenu HTML de l'exemple
code	string	Code source optionnel

{
  "type": "exemple",
  "ordre": 4,
  "titre": "Exemple : Calcul du temps de cuisson",
  "contenu": {
    "titre": "Exemple : Calcul du temps de cuisson",
    "html": "<p><strong>Données :</strong> T = 180°C, D = 8cm</p><p><strong>Formule :</strong> Temps = D × 0.5 min</p><p><strong>Résultat :</strong> 4 minutes</p>"
  }
}

Aperçu

📝

EXEMPLE

Exemple : Calcul du temps de cuisson

Données : Température de l'huile = 180°C, Diamètre de l'arancino = 8cm

Formule : Temps = (Diamètre × 0.5) minutes

Calcul : 8 × 0.5 = 4 minutes

Vérification : La couleur doit être dorée uniformément sur toute la surface.

attention

alias: alert

alias: warning

alias: note

alias: tip

Alertes visuelles avec différents niveaux de gravité pour attirer l'attention.

Propriétés

Propriété	Type	Description
type	'attention'	Type du bloc
ordre	number	Position dans la leçon
niveau	'info' \| 'astuce' \| 'attention' \| 'important'	Niveau de gravité
titre	string	Titre de l'alerte
contenu.html	string	Contenu HTML de l'alerte

{
  "type": "attention",
  "ordre": 5,
  "niveau": "important",
  "contenu": {
    "niveau": "important",
    "titre": "Point critique",
    "html": "<p>Ne jamais surcharger la friteuse !</p>"
  }
}

Aperçu

IMPORTANT

Point critique

Ne jamais surcharger la friteuse ! Maximum 3-4 arancini à la fois pour maintenir la température de l'huile.

Niveaux d'alerte disponibles

CONSEIL

Conseil pratique

Pour vérifier si l'huile est à bonne température, plongez un petit morceau de pain : il doit dorer en 30 secondes environ.

ASTUCE

Astuce

Un conseil pratique pour améliorer le résultat.

key_points

alias: points_cles

alias: summary

alias: takeaways

alias: a_retenir

Points clés à retenir avec différents styles d'affichage (liste, numéroté, cartes).

Propriétés

Propriété	Type	Description
type	'key_points'	Type du bloc
ordre	number	Position dans la leçon
title	string	Titre du bloc
points	string[] \| PointObject[]	Liste des points (texte ou objets avec icon, title, importance)
style	'list' \| 'numbered' \| 'cards'	Style d'affichage

{
  "type": "key_points",
  "ordre": 9,
  "title": "🎯 Points clés à retenir",
  "style": "numbered",
  "points": [
    "Le riz doit être complètement froid",
    "Température de friture : 180°C",
    "Cuisson : 3-4 minutes",
    "Égoutter sur papier absorbant"
  ]
}

Aperçu

🎯 Points clés à retenir

4 points clés

1
Le riz doit être complètement froid avant de former les boulettes
2
La température de friture idéale est de 180°C
3
Cuisson de 3-4 minutes jusqu'à coloration dorée uniforme
4
Égoutter sur papier absorbant avant de servir

pros_cons

alias: avantages_inconvenients

alias: comparison

alias: pour_contre

Comparaison avantages/inconvénients avec verdict optionnel et indicateur visuel de balance.

Propriétés

Propriété	Type	Description
type	'pros_cons'	Type du bloc
ordre	number	Position dans la leçon
subject	string	Sujet de la comparaison
pros	string[]	Liste des avantages
cons	string[]	Liste des inconvénients
verdict	string	Conclusion/verdict

{
  "type": "pros_cons",
  "ordre": 10,
  "subject": "Friture traditionnelle vs Four",
  "pros": [
    "Texture croustillante parfaite",
    "Cuisson rapide (4 min)",
    "Goût authentique"
  ],
  "cons": [
    "Plus calorique",
    "Odeurs de friture",
    "Nécessite surveillance"
  ],
  "verdict": [{ "text": "La friture reste la méthode de choix pour l'authenticité." }]
}

Aperçu

Friture traditionnelle vs Four

Avantages vs Inconvénients

Avantages

Texture croustillante parfaite
Cuisson rapide (4 min)
Goût authentique

Inconvénients

Plus calorique
Odeurs de friture
Nécessite surveillance

⚖️

Verdict

La friture reste la méthode de choix pour l'authenticité, mais le four convient pour une version plus légère au quotidien.

50%

VibeLearningClub

VLC

VibeLearningClub

VLC

Blocs Contenu

Propriétés

Aperçu

Objectifs de cette leçon

Contextes visuels disponibles

Autre exemple : Contexte méthode

Méthode recommandée

Propriétés

Aperçu

Les étapes de préparation

Liste non ordonnée

Ingrédients nécessaires

Propriétés

Aperçu

Propriétés

Aperçu

Exemple : Calcul du temps de cuisson

Propriétés

Aperçu

Point critique

Niveaux d'alerte disponibles

Conseil pratique

Astuce

Propriétés

Aperçu

🎯 Points clés à retenir

Propriétés

Aperçu

Friture traditionnelle vs Four

Avantages

Inconvénients

Verdict