first commit
This commit is contained in:
30
sn-infographic/references/styles/instructional-visual.md
Normal file
30
sn-infographic/references/styles/instructional-visual.md
Normal file
@@ -0,0 +1,30 @@
|
||||
# instructional-visual
|
||||
|
||||
Illustrated instructional design. Clear step-by-step guidance through simple, universal visuals.
|
||||
|
||||
## Color Palette
|
||||
|
||||
- Primary: Neutral base with 2–3 functional accent colors
|
||||
- Background: White or very light gray
|
||||
- Accents: Action color (blue/green), warning color (orange/red)
|
||||
|
||||
## Visual Elements
|
||||
|
||||
- Simple line-art illustrations of hands, objects, actions
|
||||
- Numbered step indicators (bold circles or squares)
|
||||
- Arrow connectors showing sequence
|
||||
- Do/Don't visual pairs with clear marking
|
||||
- Minimal detail—silhouette-level clarity
|
||||
- Consistent character/object style throughout
|
||||
- No photorealism—abstract enough to be universal
|
||||
|
||||
## Typography
|
||||
|
||||
- Clear sans-serif, medium weight
|
||||
- Short imperative labels ("Press", "Insert", "Rotate")
|
||||
- Large step numbers
|
||||
- Minimal prose—visuals carry the meaning
|
||||
|
||||
## Best For
|
||||
|
||||
Assembly instructions, how-to guides, safety procedures, onboarding flows, product usage, educational step-by-step content
|
||||
Reference in New Issue
Block a user