🪄 3D Magic Zone
Text
Image
Audio
Video
Code
Magic
Lightweight CSS 3D animation — smooth on mobile too.
📚 Core Concepts (each in a neat colour)
The essentials of GenAI with tiny, reliable demos.
1) Synthetic Data Creation
Add “fake but useful” examples to help models generalise.
Accuracy vs Examples
2) Zero-/Few-shot Learning
- 0-shot: no examples → the model “guesses”.
- Few-shot: add a few examples in the prompt → better.
0-shot →
❤️🤖 (guess)
few-shot →
❤️🤖✨ (learned style)
3) Style Transfer
4) Creative Applications
Click the wand for ideas!5) RLHF — Human Feedback
Thumbs teach models what we prefer; reward goes up/down.
Reward: 0
6) Fine-tuning / Adapters
Adapter ON: The model suggests a 4-3-3 formation and high press tactics.
📖
Text
Read & write
🖼️
Images
See
🎧
Audio
Hear
🎬
Video
Watch
8) Diffusion Models
Move the slider: noise → clear image
9) GANs — Generator vs Discriminator
Realism Score
50%
10) Transformer Attention (toy)
Brighter cards ≈ higher attention weight (toy)
11) Autoencoders & Latent Space
Slide to “travel” the latent space → face morphs
12) Prompt Engineering
Helpful Templates
- You are a helpful teacher. Step-by-step: …
- Answer with bullet points and a friendly tone.
- Use simple words. Explain like I'm 10.
Output (simulated)
13) Text → Image
Describe a scene → picture.
Text → Video
Describe motion → clip.
Text → Audio
Describe a sound → audio.
“A cheerful jingle in C major” ♪
📈 Graphical Visualisation
More good data usually helps — but gains plateau.