UX/UI design se zaměřením na interaktivní design reklamy je vzrušující kombinací světa grafického, multimediálního a dotykového designu. Absolvent tohoto oboru navrhuje vizuální prototypy a následně z nich vytváří plně funkční (interaktivní a animovaná) rozhraní digitálních produktů. Uvedené postupy se v praxi využívají skutečně široce – od tvorby běžných animovaných reklamních bannerů, přes vývoj herního či edukativního obsahu, multimediálních prezentací, až po speciální digitální produkty jako jsou různé uživatelské obrazovky, infokiosky, mapy, navigace, displeje, samoobslužné dotykové obrazovky atp. To vše s výstupem pro webovou stránku jako HTML5 obsah, videoformáty pro web, sociální média, Full HD či 4K, ale také pro nativní aplikace iOS / Android pro mobilní zařízení.

Uvedený akreditovaný odbor primárně vyučujeme ve dvojici programů Adobe XD + Adobe Animate. V případě zájmu je po dohodě možnost výuky v alternativním softwaru – Adobe Figma (UX/UI složka studia).

INFORMACE

Organizační forma výuky: Kombinovaná, viceformní (PREZENČNĚ V UČEBNĚ nebo PREZENČNĚ ONLINE + DISTANČNĚ v online učebně mLearning LMS)

  • PREZENČNĚ V UČEBNĚ nebo PREZENČNĚ ONLINE – přednášky, nácvik, demonstrace, cvičení, designové rozbory praktických projektů, tipy a triky, konzultace, otázky a odpovědi
  • DISTANČNĚ V ONLINE UČEBNĚ LMS – teoretické předměty, podrobné videokurzy – kompletní přehledy teoretických předmětů a videokurzů

Požadované vstupní vzdělání

  • Minimálně SŠ vzdělání, obvyklá práce s PC
  • Vhodné pro začátečníka v grafice a designu: ano

Jazykové prostředí

  • Během prezenční výuky: čeština nebo slovenština
  • Online systém: čeština a slovenština (teorie), angličtina (videokurzy)

Metody a formy výuky

  • Teoretická příprava v online učebně
  • Startovací a pokročilá softwarová školení v online učebně
  • Přednášky a praktický výcvik prezenčně v učebně nebo prezenčně online
  • Praktické cvičení a zadání (kombinovane)
  • Pokročilá témata a techniky, diskuze (kombinovaná)
  • Podrobněji o formách vzdělávání v sekci: >> Formy vzdělávání

Ceny a přihláška

Rozsah a termíny

  • Rozsah kurzu: 72,00 hodin / 3-6 týdnů (dle intenzity střetek)
  • Vyhlášení termínů: veřejné termíny nebo individuálně dle zájmu, na míru
  • Slevy za více oborů: ano, dohodou

Rozvrh výuky

  • 1 týden: Přístup do vzdělávacího systému, přípravné kurzy, teorie, předměty – distanční LMS
  • 2. týden: Teorie a dovednosti práce v aplikacích – prezenčně + studium v online učebně a domácí úkoly
  • 3. týden: Teorie a dovednosti práce v aplikacích – prezenčně + studium v online učebně a domácí úkoly
  • 4. týden: Řešení praktických úkolů a projektů – prezenčně + studium v online učebně a domácí úkoly
  • 5. týden: Řešení praktických úkolů a projektů – prezenčně + studium v online učebně a domácí úkoly
  • 6. týden: Vypracování projektu, závěrečný test, obhajoba závěrečné práce

Poznámka: rozvrh je přizpůsobitelný požadavkům účastníků, pokud se celá skupina kompromisně dohodne na úvodním online setkáni.

UČEBNÍ OSNOVY A PLÁNY

AKR4: UX/UI design – Interaktivní animace aplikace

Principy UX/UI designu a interakce

  • Co je UX/UI design – specifika designování pro interaktivní obrazovky
  • Co je interaktivní design
  • Ještě dříve než začneme vyrábět produkt – design & prototyping
  • Nejčastěji interaktivní digitální produkty
  • Vývoj a životní cyklus interaktivních digitálních produktů
  • UI: Vizuální složka rozhraní produktu – design, layout
  • UX: Uživatelská složka rozhraní produktu – struktura, navigace, uživatelská přístupnost
  • Teorie interakce pro produkty na mobilních obrazovkách
  • Teorie multimédií – technologické a funkční principy
  • Software a vývojová prostředí pro interaktivní animace a aplikace
  • Praktická doporučení

Adobe XD / Figma I. – základní softwarový trénink

ROZHRANÍ: Design (XD) / Draft (Figma)

  • Rozhraní návrhu návrhu,
  • Vytváření projektů,
  • Oblasti návrhu,
  • Zoming a navigace v dokumentech,
  • Text,
  • Systémový nástroj pro správu písem,
  • Základní nástroje pro geometrické tvary,
  • Nástroj Pero,
  • Kombinování tvarů,
  • Barvy, přechody, výplně,
  • Import grafiky – bitmapy, vektory, nativní soubory AI, PS (XD),
  • Správa objektů Assets, vrstvy,

ROZHRANÍ: Protoype (XD) / Wireframing (Figma)

  • Jak funguje prototypování,
  • Spojování obrazovek,
  • Propojení obrazovek pomocí objektů,
  • Možnosti časování animací a přechodů,

SPECIÁLNÍ FUNKCE PRO PROTOTYPING

  • UI Kits – hotové ikony prvků a rozhraní – Android, iOS, Windows,
  • Komponenty – koncept, práce,
  • Menu pluginů a rozšíření,
  • Export obsahu,

Ukázka prototypu webu od úplných základů až po funkční prototyp a export.

Adobe Animate I.+II. – rozšířený softwarový trénink

ZAČÍNÁME S APLIKACÍ ANIMATE

  • Rozhraní, příkazy, nástroje
  • Panely a plochy
  • Vytváření prvního dokumentu – platformy HTML5 Canvas, Adobe AIR
  • Panel Vlastnosti
  • Knihovna zdrojů Library
  • Časová osa
  • Vrstvy
  • Základní ovládání dokumentu – lupa, ručička

KRESLENÍ, VÝPLNE, TEXT

  • O režimech kreslení
  • Režim tvarů
  • Tahy a výplně tvarů – koncept, vybarvování, úpravy
  • Režimy kombinování tvarů
  • Režim objektu – koncept, vybarvovaní, úpravy
  • Zarovnání objektů
  • Přechody a vzorky
  • Průhlednost
  • Práce s textem – statický, dynamický

IMPORT MÉDIÍ

  • Import externí grafiky JPG, PNG
  • Import nativních souborů Illustratoru a Photoshopu
  • Import souborů Premiere Pro a AfterEffects
  • Import audia a videa

ANIMACE – MOTION TWEEN, SHAPE TWEEN

  • Princip animace a pohyblivé grafiky v Animatu
  • Tvorba a typy symbolů – movie clip, button
  • Instance symbolů
  • Motion tween – princip, použití v časové ose
  • Animovatelné vlastností symbolů
  • Editor pohybu
  • Vnořené animace a stavy – symboly, scény
  • Shape tween – animace tvarů
  • Přehled dalších speciálních animací – 3D, Morfing, IK, Warp, Rigs, Camera
  • Praktické tipy na časové ose

INTERAKTIVITA

  • O jazycích a platformách AIR / Action Script 3 a HTML5 Canvas / JavaScript
  • Panel Akce / Actions
  • Vestavěné knihovny skriptů / Code snippets
  • Odkazy (linky) a události tlačítek
  • Akce Stop a GoToFrame – řízení časové osi
  • Skripty pro načítání externího obsahu
  • Vestavěna knihovna komponent
  • Panel Component parameters
  • Knihovny tlačítek a zvuků
  • Knihovna výukových interakcí
  • Publikování obsahu HTML5 Canvas
  • Publikovanie videa – web, full HD, 4K
  • Publikování aplikací pro iOS a Android (Harman AIR)

Praktická a projektová část

  • Projekt interaktivního aplikačního cvičení
  • Projekt 1: Vytvoření reklamního banneru v HTML5
  • Projekt 2: Tvorba interaktivní aplikace s multimédií – prototyp + reální produkt

Forma závěrečné zkoušky

závěrečný test (požadovaná úspěšnost 85%) + obhajoba závěrečné práce (vytvořené produkty – vizitka, leták, reklama, plakát, webové obrázky a reklamní banner pro sociální sítě, vytvořené na cvičení).

Studijní materiály

  • interaktivní přednášky, demonstrace, simulace, elektronické testy, podrobné videokurzy o software (slovensky a anglicky), odborná školení
  • >> Přejít do online učebny

Knihovna

Software pro studium našich kurzů

  • ADOBE: Na  stránce www.adobe.com si  nejprve vytvořte bezplatný účet Adobe ID. Jako účastníci řádného státem akreditovaného studia máte nárok na zakoupení studentské verze Creative Cloud za 19,50 € / měsíc, s kompletní funkčností!  Ušetříte až 65% z ceny za celý rok!
  • Pro vzdělávací program AKR4: UX/UI design – interaktivní animace a aplikace si stáhněte a nainstalujte Adobe XD (alebo Adobe Figma) a Adobe Animate z rozhraní Creative Cloud.

VÍCE INFO:
Tel.: 0703 351 198
Email: info@mlearning.cz