Matyas.
SlužbyProjektyZkušenostiBlogKontakt
ENOzvěte se
Zpět na slovník
ux

Wireframe

Wireframe je nízko-věrnostní vizuální reprezentace uživatelského rozhraní, která znázorňuje strukturu, rozložení a hierarchii obsahu bez detailního stylování nebo barev. Wireframy se zaměřují na to, jaké prvky se na stránce objeví a jak jsou uspořádány, a slouží jako plán před začátkem vizuálního designu. Pomáhají týmům sladit se na funkcionalitě a uživatelském toku v rané fázi procesu, kdy jsou změny nejlevnější.

#ux

Související pojmy

Správa fokusu

Správa fokusu je praxe řízení toho, který prvek přijímá klávesový fokus ve webové aplikaci, zejména při dynamických změnách obsahu. Když se otevře modální okno, fokus by se měl přesunout do něj; když se zavře, fokus by se měl vrátit na spouštěcí prvek. Správná správa fokusu je nezbytná pro uživatele klávesnice a čteček obrazovky a zahrnuje techniky jako focus trapping, roving tabindex a programatické nastavení fokusu pomocí `element.focus()`.

Design tokeny

Design tokeny jsou nejmenší jednotky designového systému — pojmenované hodnoty reprezentující barvy, rozestupy, typografii, zaoblení rohů a další vizuální vlastnosti. Fungují jako jediný zdroj pravdy, který lze převést do formátů specifických pro danou platformu (CSS proměnné, Swift konstanty, XML resources). Změnou hodnot tokenů na jednom místě lze aktualizovat vzhled celé aplikace napříč platformami najednou.

Figma

Figma je webový kolaborativní designový nástroj používaný pro tvorbu UI designů, prototypů a designových systémů. Její real-time editace pro více uživatelů, systém komponent, auto layout a dev mode z ní udělaly průmyslový standard pro produktový design. Vývojáři používají Figmu k prohlížení designů, extrakci CSS hodnot, exportu assetů a — prostřednictvím pluginů a API — k automatizaci procesu od designu ke kódu.

Tmavý režim

Tmavý režim je barevné schéma rozhraní, které používá světlý text a prvky na tmavém pozadí. Snižuje únavu očí při slabém osvětlení, může šetřit baterii na OLED displejích a stal se očekávanou funkcí moderních aplikací. Implementace obvykle využívá CSS custom properties nebo design tokeny, které přepínají mezi světlým a tmavým tématem, často s respektováním systémového nastavení uživatele pomocí media query `prefers-color-scheme`.

Mikrointerakce

Mikrointerakce je malý, ohraničený moment v uživatelském rozhraní, který plní jeden úkol — animace tlačítka při kliknutí, přepínač, gesto potáhnutí pro obnovení nebo animace srdíčka u „lajku". Tyto drobné designové detaily poskytují zpětnou vazbu, vedou uživatele a dodávají rozhraní osobitost. Dobře navržené mikrointerakce dodávají produktu pocit propracovanosti a responzivity, aniž by uživatele zahlcovaly.

Afordance

Afordance je designová vlastnost, která naznačuje, jak by se měl prvek používat — vystupující tlačítko vypadá klikatelně, úchyt vypadá přetahovatelně, podtržený text vypadá jako odkaz. V UI designu vnímané afordance vedou uživatele ke správným interakcím bez explicitních instrukcí. Když afordance chybí nebo jsou zavádějící (například text, který vypadá klikatelně, ale není), uživatelé zažívají zmatení a frustraci.

Všechna slova
Matyas.

Weby, mobilní appky a automatizace s AI. Pomáhám firmám šetřit čas i peníze technologií, která opravdu funguje.

Odkazy

  • Služby
  • Projekty
  • Zkušenosti
  • Blog
  • Slovník
  • Kontakt

Připravuji

  • Případové studieBrzy
  • Zdroje

© 2026 Matyas Prochazka. Všechna práva vyhrazena.