Webdesign od nuly až po PRO - bezplatný kurz od Skillboxu, školení, Datum: 29. listopadu 2023.

Figma od nuly k PRO
Zvládnete nejoblíbenější program webdesignu na profesionální úrovni. Naučte se vytvářet interaktivní prototypy, předat návrhy vývojářům a ušetřit čas na rutinních úkolech.

Seznámení s Figmou
Pochopíte rozhraní a základní nastavení programu. Naučte se používat geometrické tvary, vrstvy a textová pole. Postavte svůj první prototyp.

Základní nástroje Figma
Zjistěte, co jsou snímky a jak se liší od vrstev. Naučte se kreslit jednoduché tvary, přidávat barvy, efekty a text. Naučte se základy prototypování.

Ikony, ilustrace a obrázky
Naučte se vytvářet vlastní ikony a manipulovat s obrázky pomocí interních nástrojů Figmy. Návrhová rozvržení můžete vytvářet od začátku bez použití editorů třetích stran.

Komponenty
Naučte se vytvářet komponenty a používat panel nastavení. Naučte se vytvářet interaktivní prototypy a ukažte zákazníkovi, jak budou lidé budoucí web používat.

Knihovny komponent a běžné styly
Pro standardizaci prvků rozhraní můžete vytvářet knihovny stylů a UI Kit. Naučte se vytvářet úhledná rozvržení pomocí modulárních mřížek.

Automatické rozvržení a varianty
Pochopíte, jak kombinovat rozložení do systému pomocí funkce Varianty. Budete schopni vytvářet a přizpůsobovat složité prvky rozhraní pro různá zařízení.

Složité vícestránkové dokumenty
Naučte se pracovat se základními obrazovkami a vytvořte strom stránek. Začněte s funkcí Pobočky beta. Pochopíte, jak organizovat práci týmu na různých verzích stejného rozvržení.

Další funkce a komunita autorů
Zjistěte, které pluginy vám pomohou rychle vytvářet koncepty projektů a pracovat s úpravami. Naučte se přidávat animace do prototypů.

Příprava layoutu pro vývojáře
Můžete vývojáři ukázat technické aspekty projektu a kód komponent. Naučte se optimalizovat práci svého týmu pomocí pluginu Figma Jam.

Webdesign od nuly až po PRO
Ponoříte se do profese webdesignéra. Naučíte se pracovat na projektu – od první schůzky s klientem až po hotové webové stránky. Naučte se přicházet s kreativními nápady a čerpat z výzkumu UX. Zdokonalujte své dovednosti prostřednictvím designových sprintů.

Úvod do profese webdesignéra
Zjistěte, jaké problémy webdesignéři řeší a proč jsou tito specialisté tak žádaní. Seznamte se s odbornými termíny a nástroji.

První objednávka: komunikace se zákazníkem a technické specifikace
Naučte se komunikovat se zákazníkem: zjistěte cíle a omezení projektu, prodiskutujte reference, plánujte termíny. Pochopíte, jak nastavit správná očekávání od práce a neslibovat příliš mnoho. Sestavte technické specifikace.

Hledejte nápad
Pochopíte, jak vám pozorování pomáhá najít ty nejlepší nápady na design. Naučte se analyzovat své konkurenty, vytvářet moodboardy a vybírat úspěšné reference pro svůj projekt.

Modulární mřížky
Každé rozvržení začíná modulární mřížkou. Seznámíte se s jeho druhy a naučíte se vybrat ten správný. Přečtěte si o nuancích mřížek pro mobilní a plné verze.

Vertikální rytmus
Naučte se ovládat pozornost uživatelů pomocí kompetentní kompozice a vertikálního rytmu. Přečtěte si o vizuální hierarchii a pochopte, jakou velikost by měl mít každý prvek na stránce.

Typografie
Naučte se vybírat písma a vzájemně je kombinovat. Pochopíte, jak vytvořit efektivní design s ohledem na pravidla typografie.

Sprint 1
Drahé a minimalistické: vytváříme design vstupní stránky na základě typografie

Úloha textů v rozhraních
Přečtěte si o požadavcích na texty pro rozhraní. Naučte se základy UX copywritingu. Budete moci upravovat texty tak, aby byly pro uživatele srozumitelné a dokonale zapadaly do layoutu.

Barvy, pozadí a stíny
Osvojte si teorii barev a seznamte se s jejími funkcemi v rozhraní. Pochopíte, jak vybrat paletu pro web a zvýraznit prvky, které jsou pro uživatele nejdůležitější. Můžete vytvářet realistické stíny pro tlačítka a další součásti designu.

Kontrast a čitelnost
Naučte se vizuálně zvýraznit důležité bloky na stránce a učinit text čitelnějším. Seznamte se s principy inkluzivního designu a umět tvořit webové stránky pro široké publikum.

Prototyp první stránky
Vytvořte drátěný model – prototyp, který se zaměřuje spíše na strukturu a logiku než na vizuální design. Osvojte si dva designové přístupy: blok a volný styl.

Sprint 2
UX psaní: vytvoříme vstupní stránku a připravíme texty pro všechny prvky rozhraní.

Obrazovka první stránky
Seznamte se s metodou atomic design, která urychlí tvorbu webových stránek. Už na první obrazovce pochopíte, jak upoutat pozornost uživatelů. Naučte se vytvářet tlačítka, ikony, pole pro zadávání dat a formuláře v konzistentním stylu a měřítku.

Uživatelský průzkum: Mapa cesty zákazníka a tok uživatelů
Naučte se, jak při návrhu zohlednit potřeby vaší cílové skupiny. Naučte se vytvářet mapu cesty zákazníka a tok uživatelů, vyhodnocujte chování uživatelů v každé fázi interakce s webem.

Navigace
Pochopte typy navigace. Pochopíte, pro jaké úkoly a zařízení je každý z nich vhodný.

Návrh hlavních bloků
Naučte se vytvářet produktové karty, posuvníky, bloky s výhodami, tarify a reklamou. Dáte dohromady plnohodnotnou stránku a pochopíte, jak ji klientovi prezentovat. Budete schopni vysvětlit svá návrhová rozhodnutí, adekvátně přijmout úpravy a pracovat s námitkami zákazníků.

Adaptabilita a komponenty
Seznamte se s responzivním webdesignem a jeho principy. Podívejme se na oblíbené adaptivní sítě. Přečtěte si, jak vytvořit kvalitní mobilní verzi webu.

Sprint 3
Vzhled stránky přizpůsobíme pro počítač, tablet a mobilní telefon.

Prezentace projektu zákazníkovi
Naučte se prezentovat projekt v efektivní a srozumitelné prezentaci. Naučte se vysvětlovat zákazníkovi svá řešení a odpovídat na typické i neočekávané otázky.

Předání rozložení vývojářům
Dáte do pořádku vrstvy a jejich názvy, vytvoříte jednoduchou animaci prvků a přechodů mezi stránkami a vytvoříte specifikaci. Naučte se provádět kontrolu návrhu po rozvržení.

Sprint 4
Techniky pro působivé portfolio: vytvoření případu na Behance.

Portfolio pouzdro
Přijdete na to, co je lepší pro propagaci – vizitkový web nebo portfolio na designových platformách. Naučte se vytvářet pouzdra na Behance, aby si vaší práce všimli a ocenili ji. Přečtěte si o placených a bezplatných metodách propagace.

Bonusové moduly

1. Zásady úspěšné práce se zákazníkem
2. Kde hledat objednávky
3. Jak designéři pracují ve velkých týmech

Absolventský projekt

Koncepce designu webových stránek
Vyberte si jednoho ze skutečných zákazníků a vytvořte design webových stránek pro jeho firmu. Používejte principy vyprávění, abyste hovořili o své práci.