Design je proces

Grafický design je proces pokrývající několik různých disciplín sociologie, ergonomie a psychologie, jejichž výsledkem je atraktivní element, který kompletně koresponduje s moderními trendy, byznys cíli a klientskými očekáváními.

V Blueberry pevně veříme, že design je proces a rozdělujeme ho do několila kroků.

Kick-off meeting

Úvodní meeting, jehož se obvykle účastní i klient a je pro designéra úvodem do projektu. Designér je představen klientovi a vzájemně prodiskutují své potřeby a vize. Posléze společně definují obchodní cíle nového projektu a odhalí potenciální problémy či limity.

Nástroje: Evernote, Sketchnoting

Design studio

Design studio je rozšiřujícím kreativním meetingem. Tento meeting se dělá z důvodu kreativní a detailní analýzy cílových skupin a definice jejich očekávání a problémů, které u nového projektu musí být vyřešeny. Výsledkem design studia je základní obsahová struktura a první návrh wireframů.

Nástroje: MindNode, Sketch

Wireframing / Prototyping

S použitím informací z kick-off a design meetingů vytváří designér wireframy společně s prvními koherentními a klikacími prototypy. Wireframy se využívají k představení základní myšlenky, dispoziční struktury a prioritizace obsahu. Wireframy se nerovnají vizuálnímu designu, popisují však ergonomiku a vysoký komfort uživatele.

Nástroje: Sketch, InvisionApp, Marvel, UXPin

Moodboarding

Moodboardy jsou vlastně kreativními mapami vizuálního designu. Designér přes ně studuje obecné elementy a specifické body zájmu. (např. běžné vizuální elementy pro automobilový průmysl, konstrukci apod.). Moodboardy také obsahují designy konkurenčních webových stránek/aplikací. Výsledkem je obsáhlá vizuální mapa prezentována zákazníkovi jako soutěžní studie, stejně jako podpora v definování originálních grafických řešení.

Nástroje: Pixave, Invision Boards

Inspirace: Dribbble, Behance, Awwwards, UPlabs, CSSDesignAwards

Tvorba vizuálního konceptu

Vizuální koncept je první verzí webového/aplikačního designu. Designér dodržuje všechna ergonomická pravidla a komplexní konstrukci z Wireframe a UX studie a inspiruje se z Moodboardu. Vizuální koncept, stejně tak jako wireframy, je prezentován v koherentním klikacím prototypu. Klient má téměř identickou představu finální formy jeho/jejího webu/aplikace. Pokud designér zamýšlí specifické interakce s designem nebo speciálními efekty, nahraje také krátkou video stopu s náhledy.

Nástroje: Sketch, Photoshop, Invision, Principle

Sketch plugins: Craft, Magic Mirror 3, ToolBox, Map Generator

Finalizace

Tento krok pokračuje v rámci kódování. Designér je zodpovědný za dodržování vizuálu a setu typografických pravidel. Designér také pomáhá kodérovi při případném dokončování ikon a jiných elementů. Před spuštěním projektu do produkce provede designér finální kontrolu.

Nástroje: Principle, Avocode

Videozáznam z mé prezentace si můžete prohlédnout zde.