WEB (UX/UI) DESIGN

PRVNÍ TÝDEN – Úvod do UX designu

• Úvod do fází projektu návrhu uživatelského rozhraní.
• Přehled různých typů webových stránek a digitálních produktů a jejich účel.
• Pochopení designu zaměřeného na uživatele (user-centered)  a design thinking.
• Úvod do metod uživatelského výzkumu UX, analýza získaných poznatků.

Praktická práce: identifikace zvoleného typu webu, uživatele a jeho cílů, vytvoření mapy cesty uživatele a schémata toku uživatelů. 

DRUHÝ TÝDEN – Informační architektura a adaptivní design

• Principy a součásti informační architektury.
• Úvod do adaptivního designu. Zobrazování obsahu na různých velikostech obrazovky: adaptivní a responzivní metody, použití mřížky (grid) a bodů zlomu (breakpoints).
• Vlastnosti uživatelských rozhraní mobilních zařízení.
• Tvorba a nácvik sketchů (user-flow, wireframes).

Praktická práce: analýza informační architektury vyvíjeného webu a tvorba mapy stránky a wireframů. Práce s programy Adobe XD / Figma.

TŘETÍ TÝDEN – Grafický design

• Úvod do vývoje stylu značky. Vytvoření náladové tabule (moodboard)
• Skicování a tvorba loga.
• Teorie písma a principy tvorby měřítek typografie pro digitální rozhraní.
• Teorie barev a návrh palety.
• Principy kompozice. Gestaltovy zákony vizuálního vnímání a jejich aplikace při návrhu digitálních rozhraní.
• Tvorba, použití a aplikace ilustrací a fotografií v práci UI designéra.

Praktická práce: vývoj loga a nápisů na webu – fonty, barevná paleta, ilustrace a fotografie. Úprava wireframe.

ČTVRTÝ TÝDEN – Principy UI designu

• Systémy designu a výzvy spojené s rozvojem digitálních produktů.
• Vytvoření knihovny UI komponent (stickersheet), UI komponenty: ikony, ovládací prvky výběru, tlačítka, nabídky, karty, tvary, filtry a další.
• Interaktivní komponenty uživatelského rozhraní. Mikrointerakce.
• Přehled stylů a trendů UI designu, výběr vizuálních prostředků pro řešení problémů uživatele vybraného webu.

Praktická práce: vytvoření knihovny UI komponent. Animace komponenty UI (filtr, nabídka, karta atd.) v aplikacích XD nebo Figma.

PÁTÝ TÝDEN – Přenos UI design souborů. Příprava pracovního portfolia.

• Jaké postupy a nástroje používají UI designéři pro přenos souborů pro programátory.
• Seznámení se strukturou a syntaxí HTML / CSS dokumentu, čtení HTML souboru ve webovém prohlížeči.
• Příprava hotového portfolia designu webu – grafická příprava jednotlivých fází, tvorba popisů procesů.

Praktická (závěrečná) práce: příprava finálního designu webu ve verzi pro web a mobilní verzi. Vytvoření portfolia a grafické znázornění fází procesu projektu v portfoliu.

ŠESTÝ TÝDEN – Prezentace finálního projektu

Během kurzu si vytvoříte svoji vlastní webovou aplikaci a pracovní portfolio s využitím nových dovedností a procesů, které jste se naučili. Také se dozvíte, na co se zaměřit při prezentaci svého portfolia na pracovních pohovorech.