25+ Students
Creative Cohort
Junior high students learning visual design hierarchy
01THE TEACHING SPRINT & NARRATIVE
The 3-Second Rule: Deconstructing Visual Noise for Junior High Designers
How teaching digital composition in Figma helped students discover that good design is about visual clarity, not decorative excess.
"Good design isn't about making things loud; it's about making information clear, respectful, and effortless to understand."
Chapter 01
Eliminating Visual Noise
Middle school students often believe that a good poster must use every font and color available. At MTs Yasmine, I introduced the '3-Second Rule': if a passerby cannot identify what event is happening and when within three seconds, the design has failed. We examined real-world posters together, analyzing how headline size, white space, and high contrast guide the viewer's eyes naturally.
Chapter 02
Crafting Original Works in Figma
Using Figma's vector alignment tools and typography controls, each student built their own promotional poster for a fictional school festival or community cause. Helping them limit their color palettes to three harmonious tones immediately elevated their work from chaotic to professional.
02WORKSHOP CURRICULUM & PILLARS
Visual Poster Design & Layout Syllabus
A structured 3-part guide to visual communication, layout grids, and modern digital poster composition.
Module 01Composition
Visual Hierarchy & The 3-Second Rule
Understanding how the human eye scans information, focal points, and prioritizing essential headlines over background clutter.
- Focal Point Identification
- The 3-Second Information Scan
- Rule of Thirds & Grid Systems
Module 02Styling
Typography Hierarchy & Color Harmony
Pairing heading and body typefaces, managing line spacing, and selecting 3-color palettes with high legibility.
- Headline vs Body Font Pairings
- Tracking & Leading Adjustments
- Color Contrast Ratios & Mood
Module 03Production
Vector Assets & Export Formats
Sourcing royalty-free vectors, masking imagery cleanly, and exporting high-resolution digital files for print and web.
- Vector Shape Drawing in Figma
- Image Masking & Framing
- Exporting PNG & PDF Formats
03PEDAGOGICAL RETROSPECTIVE
Reflections on Teaching Composition
Lessons on simplifying visual communication for young creators.
Restraint is the True Mark of Good Design
Teaching young students to embrace white space rather than filling every pixel showed that clarity requires knowing what to leave out.
Visual Skills Accelerate Engineering
Learning how to organize visual information at fourteen gave me an immense competitive advantage when building frontend web interfaces years later.
04ON-SITE DOCUMENTATION & ARCHIVES
Classroom Records & Student Art
Photographic archives documenting digital design training sessions at MTs Yasmine.
Classroom Session
Visual Hierarchy & Poster Layout Training
Explaining typography hierarchy, grid alignment, and visual balance on the whiteboard and classroom projector.