mirror of
https://github.com/JimLiu/baoyu-skills.git
synced 2026-07-22 10:19:46 +08:00
Jim Liu 宝玉
108 lines
4.3 KiB
Markdown
108 lines
4.3 KiB
Markdown
# ohmsha
|
||
|
||
Ohmsha Manga Guide style - educational manga with visual metaphors
|
||
|
||
## Core Philosophy
|
||
|
||
Educational manga where every concept becomes a visual metaphor or action. NO talking heads - characters must DO things, not just explain.
|
||
|
||
## Visual Style
|
||
|
||
- **Type**: Manga-style educational comic
|
||
- **Orientation**: Portrait (vertical), optimized for scrolling
|
||
- **Colors**: Full color, bright and clean anime/manga aesthetic
|
||
- **Lines**: Clean manga lines (1.5-2px), smooth curves, expressive
|
||
|
||
## Character Design (Manga Style)
|
||
|
||
- Anime/manga proportions: slightly larger eyes, expressive faces
|
||
- **Student character**: Confused expressions, question marks (？), sweat drops, represents reader
|
||
- **Mentor character**: Confident poses, explanatory gestures, produces gadgets/tools
|
||
- Clear emotional indicators using manga conventions (！, ？, sweat drops, sparkles)
|
||
- Consistent character designs across all panels
|
||
|
||
## Background Treatment
|
||
|
||
- Simplified backgrounds during dialogue/explanation
|
||
- Detailed "imagination spaces" for concept visualization
|
||
- Technical diagrams styled as holographic displays or magical blueprints
|
||
- Screen tone effects for atmosphere
|
||
|
||
## Visual Metaphor Requirements (CRITICAL)
|
||
|
||
Every technical concept MUST be visualized as:
|
||
|
||
| Concept Type | Visualization Approach |
|
||
|-------------|----------------------|
|
||
| Algorithm | Gadget/machine that demonstrates the process |
|
||
| Data structure | Physical space characters can enter/explore |
|
||
| Mathematical formula | Transformation visible in environment |
|
||
| Abstract process | Tangible flow of particles/objects |
|
||
|
||
**Wrong approach**: Character points at blackboard explaining
|
||
**Right approach**: Character uses "Concept Visualizer" gadget, steps into metaphorical space
|
||
|
||
### Visual Metaphor Examples
|
||
|
||
| Concept | Wrong (Talking Head) | Right (Visual Metaphor) |
|
||
|---------|---------------------|------------------------|
|
||
| Attention mechanism | Character points at formula on blackboard | "Attention Flashlight" gadget illuminates key words in dark room |
|
||
| Gradient descent | "The algorithm minimizes loss" | Character rides ball rolling down mountain valley |
|
||
| Neural network | Diagram with arrows | Living network of glowing creatures passing messages |
|
||
| Overfitting | "The model memorized the data" | Character wearing clothes that fit only one specific pose |
|
||
|
||
## Panel Layout for Ohmsha
|
||
|
||
- Vertical scroll optimized (webtoon style)
|
||
- Single column, panels stack vertically
|
||
- Generous whitespace between major beats
|
||
- Panels can bleed to edges for impact
|
||
- "Float" elements between panels for emphasis
|
||
|
||
## Special Visual Elements
|
||
|
||
- **Gadget reveals**: Dramatic unveiling with sparkle effects
|
||
- **Concept spaces**: Rounded borders, glowing edges for "imagination mode"
|
||
- **Information displays**: Holographic UI style for technical details
|
||
- **Aha moments**: Radial lines, light burst effects
|
||
- **Confusion**: Spiral eyes, question marks floating above head
|
||
|
||
## Text Elements (Ohmsha)
|
||
|
||
- Hand-lettered manga style
|
||
- Sound effects integrated visually (ドキドキ, ピカーン, etc.)
|
||
- Speech bubbles: rounded for normal, spiky for excitement/shock
|
||
- Thought bubbles for internal process visualization
|
||
- Technical terms in bold with furigana-style annotations if needed
|
||
|
||
## Color Palette
|
||
|
||
- Primary: Bright blue (#4299E1), warm orange (#ED8936), soft green (#68D391)
|
||
- Skin: Anime-style warm (#FEEBC8)
|
||
- Background: Clean white, soft gradients
|
||
- Gadgets: Metallic accents (#FFD700, #C0C0C0), vibrant highlights
|
||
- Concept spaces: Pastel backgrounds, glowing accents
|
||
|
||
## Quality Markers (Ohmsha)
|
||
|
||
- ✓ Every concept is a visual metaphor, not just explained
|
||
- ✓ Characters are DOING things, not just talking
|
||
- ✓ Clear student/mentor dynamic
|
||
- ✓ Gadgets and props drive the explanation
|
||
- ✓ Expressive manga-style emotions
|
||
- ✓ Information density through visual design, not text walls
|
||
|
||
## Character Setup (Required)
|
||
|
||
Define characters before generating:
|
||
|
||
| Role | Default | Traits |
|
||
|------|---------|--------|
|
||
| Student (Role A) | 大雄 | Confused, asks basic but crucial questions, represents reader |
|
||
| Mentor (Role B) | 哆啦A梦 | Knowledgeable, patient, uses gadgets as technical metaphors |
|
||
| Antagonist (Role C, optional) | 胖虎 | Represents misunderstanding, or "noise" in the data |
|
||
|
||
## Best For
|
||
|
||
Technical tutorials, complex concepts (ML, physics, math), self-study material
|