Amanoba Logo
Back to Course

Ismeretlen tartalomra tervezés

Day 15 of 30 · The Playbook 2026 – Mesterkurzus Designereknek

Megtanulod, hogyan tartsd meg a struktúrát ismeretlen vagy változó tartalomhossz mellett.

Tanulási cél

  • Placeholder és üres állapot szabályok.
  • Változó címhossz, többnyelvűség kezelése (wrap/truncate).
  • Folyamatos terhelés: skeleton vs spinner.
  • Dokumentált minták kártyára, listára, táblázatra.

Miért fontos

  • Valódi adat eltér a mocktól.
  • Folyamatosság: betöltéskor se törjön a layout.
  • Többnyelvű szöveg nyúlhat.

Magyarázat

  • Szövegkezelés: wrap 2 sorig, utána truncate + tooltip/link.
  • Üres állapot: ikon + rövid üzenet + CTA.
  • Skeleton: stabil méret, ne ugráljon.

Példák

Rossz: Hosszú cím kilóg, törik az elrendezés.

Jó: Max. 2 sor, utána ellipszis + tooltip; üres állapot definiálva.

Gyakorlat (vezetett, 10-15 perc)

  1. Készíts szövegkezelési szabályt (wrap/truncate) kártyára és listára.
  2. Definiáld az üres állapot komponensét (ikon, szöveg, CTA).
  3. Írj szabályt skeleton használatra.

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

Alkalmazd egy többnyelvű tartalomra (pl. hosszabb német/angol), screenshotold.

Önellenőrzés

  • Wrap/truncate szabályok léteznek.
  • Üres állapot komponens dokumentálva.
  • Skeleton szabály megvan.

Opcionális mélyítés