Forma és ritmus: milyen érzetet kelt?
Day 8 of 30 · The Playbook 2026 – Mesterkurzus Designereknek
Megtanulod, hogyan közvetít jelentést a forma (kerek vs. szögletes), a ritmus (ismétlődés), és hogyan kerüld a vizuális zajt.
Tanulási cél
- Formákhoz jelentést rendelsz (bizalom, technikai, játékos).
- Ritmust építesz: ismétlődés, mintázat, modul.
- Definiálsz állapot- és affordance-jelzéseket (shadow, border, radius).
- Elkerülöd a zajt: következetes kerekítések, moduláris grid.
Miért fontos
- Forma érzelmet közvetít.
- Ritmus segít a navigációban.
- Következetlen radius vagy shadow bizalomvesztést okoz.
Magyarázat
Forma-jelentés
- Kerek: barátságos, safe.
- Szögletes: technikai, határozott.
- Radius skála: xs, sm, md, lg, full – használati szabályokkal.
Ritmus
- Ismétlődő modul (pl. 8px alap), következetes gap-ek.
- Shadow és border csak akkor, ha affordance-t jelez.
Példák
Rossz: Minden kártya más radius, véletlenszerű shadow.
Jó: Radius skála: kártya md, gomb lg, chip full; shadow csak kattintható elemen.
Gyakorlat (vezetett, 10-15 perc)
- Határozd meg a radius skálát (xs/sm/md/lg/full) és rendeld hozzá komponensekhez.
- Definiáld, mikor használhatsz shadowt/bordert (affordance-szabály).
- Írj rövid jelentés-táblát: kerek ↔ barátságos, szögletes ↔ tech.
Gyakorlat (önálló, 5-10 perc)
Alkalmazd egy kártyarácsra: radius, shadow, gap, modul-ritmus.
Önellenőrzés
- Radius skála létezik, komponensekhez rendelve.
- Shadow/border szabályok dokumentálva.
- Jelentés-tábla készen van.
- Jó/rossz példák dokumentálva.
Opcionális mélyítés
- IBM Carbon Radius tokens: https://carbondesignsystem.com/elements/shape
- A design affordance alapok: https://www.nngroup.com/articles/affordances-heuristics/