V tomto kurzu se dozvíte, jak využívat Adobe Photoshop pro tvorbu grafiky webových stránek a uživatelského rozhraní (UI – User Interface) mobilních i desktopových aplikací. Nejdříve se teoreticky seznámíte se základními pojmy z webové a UI [...]
  • PHSH4
  • Délka 2 dny
  • 0 ITK bodů
  • 3 termíny
  • Praha (6 600 Kč)

    Brno (6 600 Kč)

    Bratislava (290 €)

  • Mírně pokročilý

V tomto kurzu se dozvíte, jak využívat Adobe Photoshop pro tvorbu grafiky webových stránek a uživatelského rozhraní (UI – User Interface) mobilních i desktopových aplikací. Nejdříve se teoreticky seznámíte se základními pojmy z webové a UI grafiky – typy layoutů a zařízení, barevná schémata, formáty souborů, optimalizace, používání mřížek (gridů). Poté prozkoumáte funkce Adobe Photoshopu, které vám mohou pomoci při efektivní tvorbě grafiky – inteligentní objekty, řezy, styly, masky, vektorové kreslení apod. V průběhu kurzu vytvoříte kompletní layout webu a návrh uživatelského rozhraní aplikace od skici, přes prototyp až po hotovou grafiku. Nakonec se seznámíte s možnostmi použití hotových, na webu volně dostupných komponent pro vaše návrhy.

»

Kurz je určen grafikům webových stránek a designerům UI mobilních i desktopových aplikací pracujícím v programu Adobe Photoshop.

  • základní koncepty návrhu webu a UI
  • práci s barvami, vrstvami a textem
  • přípravu wireframes
  • tvorbu modelu webu/UI
  • optimalizaci grafiky pro web a UI

Znalost Adobe Photoshopu na úrovni základního kurzu.

Základní koncepty
  • tvorba designu pro obrazovku
  • velikost a rozlišení obrazovky
  • PSD-to-HTML workflow
  • nastavení Photoshopu pro web a UI design
  • tvorba nového dokumentu pro web a UI
  • principy layoutů
  • CSS
Barvy
  • nastavení barev
  • webové barvy
  • barevná paleta/barevné schéma
  • Kuler
Vrstvy
  • vektorové a bitmapové vrstvy
  • inteligentní objekty
  • maskování
  • skupiny vrstev
  • ořezové skupiny
  • import grafiky
  • formátování vrstev tvarů
  • styly vrstev
  • filtrování vrstev
  • kompozice vrstev
Text
  • text vs. textový obrázek
  • vyhlazování textu
  • znakové a odstavcové styly
  • webové fonty
Příprava wireframes
  • plánování projektu
  • vodítka, mřížka, pravítka
  • grid systém
  • responsivní design
  • návrh layoutu s pomocí vrstev
Tvorba modelu webu/UI
  • organizace a struktury návrhu
  • hlavní elementy návrhu
  • pozadí
  • tvorba navigace
  • příprava textu
  • příprava grafiky
  • příprava fotografií
  • tlačítka
  • další formulářové prvky
  • simulace chování pomocí kompozic vrstev
Optimalizace grafiky pro web a UI
  • formáty
  • řezy vs. vrstvy
  • grafika vs. CSS
  • průhlednost
  • tvorba image spritů
Spolupráce s dalšími aplikacemi
  • Adobe Illustrator
  • Adobe Dreamweaver
  • Adobe XD
Aktuální nabídka
Školicí místo
Jazyk kurzu

Uvedené ceny jsou bez DPH.