Do hloubky o UX / UI designu. Rychle a srozumitelně.
Chceš se naučit efektivně tvořit aplikace a webové stránky? Nebo už nějaký čas programuješ a zajímá Tě, proč designéři nedají pokoj s úplnými maličkostmi? Začni tímhle kurzem. V kompaktní formě bez zbytečných řečí si představíme teoretické základy UI, UX a interakčního designu. Vše od pixelů, přes wireframy až po práci s pozorností uživatele. A celé to zabere jen jeden pracovní den.
Design pro obrazovky
Jsou lepší modré, nebo zelené buttony? Jak vytvořit poutavou animaci na Dribble? Jaký je rozdíl mezi UX designem a interakčním designem? To je úplně jedno. Tenhle kurz není o tom, jak v Sketch nebo Photoshopu založit nové plátno a nakreslit namakanou aplikaci. Naučíme se něco mnohem užitečnější: vysvětlíme si, co je design. Budeme mluvit o efektivním řešení problémů, historických kontextech a trochu i o budoucnosti celého odvětví. Projdeme mnoho témat od teorie počítačové grafiky, přes design uživatelských rozhraní, UX design až po interakci a trochu kódování. Tato videa by Tě měla nasměrovat správným směrem, pokud na vizitce máš už nějaký čas napsáno něco jako "designer" nebo "developer" a chceš se vývoji digitálních produktů věnovat více do hloubky. Zároveň je vše vysvětleno lidsky tak, aby to pochopili i úplní začátečníci.
Co se naučíme
První část je určena hlavně pro úplné začátečníky. Je to takový úvod do odvětví, do problematiky designu pro obrazovky a digitální produkty. V první části si tedy vysvětlíme:
- Kdo je to UI nebo UX designér a co je jejich úkolem?
- Jak se uplatnit na pracovním trhu v příštích 20 letech?
- Co jsou bitmapy, vektory, JPEG, PNG, SVG a tyto věci?
- Že Photoshop je na nic a vlastně design začíná kreslením diagramů.
- Proč je dobré naučit se programovat (a kódovat)?
- Jak vlastně fungují displeje: co jsou pixely a co body a co je retina a co je DPI?
V další části zůstaneme u fundamentálních témat, ale půjdeme již trochu více do hloubky:
- Hexadecimální a decimální kódy barev; jak souvisí s RGB modelem?
- Jak vybrat správné barvy: jaká je úloha barev v designu?
- Jak navodit feeling a dojem z designu; a proč je to důležité?
- Fonty! Jak vybrat písmo, co je serif a co je to H1 nadpis
- UI je metafora reálného světa a při animacích třeba přemýšlet
- Co najdeme v designové dokumentaci od Apple a Google
Třetí část je o informační architektuře a produktovém myšlení:
- Každá appka nebo web má svůj účel.
- Jak navrhnout strukturu aplikace?
- Uživatelské testování: jak udělat dobrou navigaci?
- Jak psát dobré texty?
- Něco o personach a metodologii „Jobs to be done“.
Co by to byl za designový kurz bez wireframov:
- Co je wireframe, na co ho používáme?
- Jak se dělá webová stránka: co je potřeba vědět o kódování?
- Jak přizpůsobit obsah různým displejům?
A nakonec si povíme i něco o tom, jak vytvářet pěkný design:
- Velké a malé gridy.
- Fittovo pravidlo a velikost elementů na displeji.
- Jak pracovat s prazno prostorem.
- Jak upoutat pozornost uživatele.
- Psychologické principy; tipy a triky v designu.
- Jak správně nakreslit tlačítko.
- Navigace na desktopech a telefonech.
- Jaký je rozdíl mezi modálním a nemodálním oknem a jak je použít.
- Jak navrhnout formulář tak, aby fungoval.
Seznam kapitol online kurzu
"Uděláme si nějaké to UX." LOL
- První video: O čem není tenhle kurz
- # 02: Co vlastně dělá UX / UI / IxD Ninja Guru Senior?
- # 03: O opravdové živé a hezké UX designérce až z Ameriky
- # 04: O teleportech, transkodérech a tvé transformaci
- # 05: Pixely, alfa kanály a eukleidovská geometrie
- # 06: Euklides by použil vektor
- # 07: Nákupní seznam pro tvůj torrent klient
- # 08: Framer je nejlepší věc na světě. A něco o analytice
Proseminář teoretické displejológie
- # 09: Ono se to nejmenuje "screen design" pro nic za nic
- # 10: Bod je tvůj nový imaginární kamarád
Started from the bottom
- # 11: O červené, zelené, modré a také fialové, nebo oranžové
- # 12: Proč má Instagram černobílé UI?
- # 13: O obdélnících, zaoblených rozích a stínech
- # 14: Stín má svou stinnou stránku
- # 15: Máma má Emu. Ema má Helveticu
- # 16: \ <h1> Co je toto? </ H1>
- # 17: O animaci, ízingoch a různých verzích minulosti
- # 18: Co se můžeme naučit od Mickeyho?
Pojď, přečteme si dokumentaci
- # 19: O tom, jak si prohlížím Human Intarface guidelines
- # 20: V tomhle videu skroluju přes Material Design
Toto můžeš přeskočit
- # 21: NEPOVINNÉ: O designových deadly skillech a o tom, co to tu vlastně děláme
- # 22: NEPOVINNÉ: Deadly skillz vol. 2
Stručný úvod do informační architektury
- # 23: O tom, že design nezačíná kreslením a že všechno má účel
- # 24: O plynutí uživatele tvým produktem
- # 25: Jak zjistit, co mají lidé v hlavě a jak tam dostat nové věci
Sice nevypadají, ale tato videa jsou o designu
- # 26: BONUS: Hádej, co je nejdůležitějším obsahem na webu
- # 27: O naplňování velkých potřeb a o tom, proč jsme všichni HR-isti
Drátěné modely voláme wireframes
- # 28: O drátech, kaskádách a o tom, že všechno je vlastně obdélník
- # 29: Web je pouze textový dokument, ve kterém jsou tabulky
- # 30: O responzivní a designovém masochizme
Toto se jmenuje defenzivní design
- # 31: Když se nedaří a všechno je špatně a je zima a já jsem hladový
Úvod do praktické layoutológie
- # 32: Neuvěřitelné! Slovák udělal TOTO a najednou kreslí hezké designy!
- # 33: Programátoři jsou líní a tak nějak celkově divní (Clickbait)
- # 34: Záhada čísla 8
- # 35: O tom, že rohy jsou nekonečně široké a jak si nevykloubit palec
- # 36: O prázdném prostoru a berlínské psychologické škole
- # 37: Zase o textech, ale tentokrát zase ještě trochu jinak
Hurá! Konečně videa o tom bájném UX
- # 38: Úvod do úvodu do User Experience designu a takové věci
- # 39: Jak přimět člověka, aby se podíval tam, kam chceš ty
- # 40: Pár divných termínů, které ti pomohou dělat dobrý design
- # 41: Affordance a vše, co s tím souvisí
- # 42: O lištách, drobcích a o tom, jak se prostě neztratit
- # 43: O rozhovorech, módech, nemódech a kolotočích
- # 44: hvězdičky, pole, čekboxy. A jak to nepototo
- # 45: UX Dark Patterns. Co to je a proč to nebudeš dělat
- # 46: Uživatelské testování je základ dobrého designu
Poslední video
- # 47: Ještě několik vět na konec dne
Online kurz Dizajn pre obrazovky je možné
vyzkoušet i zdarma!