Vizuális szándék (VIS) megfogalmazása

Day 5 of 30 · The Playbook 2026 – Mesterkurzus Designereknek

Írsz egy egymondatos, mérhető vizuális szándékot, ami minden döntésnek irányt ad.


Tanulási cél

  • Megírsz egy tömör Visual Intent Statementet (hang, tonalitás, sűrűség, merészség, mozgás).
  • Felállítasz 3-5 tengelyt (pl. melegség ↔ technikai, játékos ↔ komoly).
  • Készítesz vizuális példákat (jó/rossz) a szándékhoz.
  • Összekötöd a szándékot a tokenekkel (pl. színtartomány, tipó súlyok, mozgás-idők).
  • Beépíted a Playbook elejére.
  • Biztosítod, hogy minden döntésnél alkalmazod a szándékot.

Miért fontos

  • Egységes irányt ad, csökkenti a vita-időt.
  • Segít, hogy minden komponens ugyanazt az élményt közvetítse.
  • Segít dönteni, mikor utasíts el egy trendet.

Magyarázat

Visual Intent Statement (VIS)

  • 1 mondat: „A termékünk vizuális nyelve [hangulat], miközben [üzleti cél]; a [sűrűség], [merészség], [mozgás] skálán itt helyezkedik el.”
  • Legyen mérhető (pl. „CTA kontraszt min. 7:1”, „animáció 150–250 ms ease-in-out”).

Tengelyek

  • Melegség ↔ Technikai
  • Barátságos ↔ Formális
  • Sűrű ↔ Levegős
  • Statikus ↔ Mozgékony
  • Merész ↔ Visszafogott

Példák

Jó: „Visual Intent: barátságos-tech, levegős, visszafogott mozgás. CTA #FAB908, szöveg #111827, tipó Inter 600, spacing 8-12-16, animáció 180 ms ease.”

Rossz: „Legyen menő, startupos.” – nem mérhető, nem irány.


Gyakorlat (vezetett, 10-15 perc)

  1. Írd meg a VIS-t az 5 tengellyel, 1 mondatban.
  2. Kapcsold össze tokenekkel: fő színpár, tipó súlyok, spacing skála, animáció időzítés.
  3. Adj 2 vizuális példát (jó/rossz) és rövid magyarázatot.

Gyakorlat (önálló, 5-10 perc)

Mutasd meg egy fejlesztőnek a VIS-t, kérd, hogy értelmezze 1 komponensre (pl. kártya), és finomítsátok.


Önellenőrzés

  • Van 1 mondatos VIS.
  • A VIS összekötve tokenekkel és komponensekkel.
  • Van jó/rossz példa, ami illusztrálja.
  • A VIS a Playbook elején szerepel.

Opcionális mélyítés