Na co weboví designéři útočí. Fáze vytváření koncepce designu

Umělecká ředitelka Asha Sahakyan a producentka Alyona Titova odhalují přístup agentury Nimax k vytváření koncepcí designu webových stránek.

Pokud jste někdy komunikovali s digitálními agenturami nebo webovými designéry, pravděpodobně jste slyšeli o fázi konceptu. V tomto článku projdeme krok za krokem vytvořením koncepce designu webových stránek na základě přístupu, který v Nimaxu procvičujeme. Tento materiál nemá být vodítkem, má poskytnout obecné porozumění procesům a jejich důležitosti.

Co je koncepce designu?

Koncept designu webu tvoří obecnou vizi vizuální části projektu s přihlédnutím ke všem zdrojům požadavků a přání designu:

• společnost kniha značek;
• stránka s obchodními úkoly;
• trendy;
• vize pracovní skupiny zákazníka;
• rozhodnutí konstrukční skupiny dodavatele.

Stručně řečeno: koncepce designu pomáhá zákazníkovi i dodavateli dívat se stejným směrem
. Takže další práce na designu stránek webu se stanou předvídatelnými a transparentními.

Jakou stránku byste měli použít jako příklad pro tento koncept?

Při vytváření koncepce designu je třeba vzít v úvahu co nejvíce různých typů bloků a prvků, které je možné předem předvídat: karty, posuvníky, textové bloky, navigační prvky.

Zároveň design stránek nemusí být konečný, vytváříme společnou vizi a vývojové cesty. Ve fázi koncepce probíhá vyhledávání:

• směr a styl;
• animační nápady;
• prvky identity (nebo nápady pro odhalení prvků podnikové identity na webu);
• rozložení a blokové kompozice;
• barevné schéma a písma;
• odkazy na obsah fotografií, náčrtky ilustrací atd.

Musí být také vybrány prioritní stránky.

1. Stránka s velkým počtem bloků obsahu různých typů – takto můžete zkontrolovat praktičnost konceptu.
2. Stránka s velkým provozem – tímto způsobem pochopíme, o jaké informace jde nejvyšší priorita pro uživatele a práce
   na jejím odeslání.
3. Hlavní stránka webu – vybírá se nejčastěji, protože je vizitkou společnosti a zároveň stránka s nejrůznějším obsahem.
4. Stránka, na které zákazník plánuje zobrazovat reklamu – tato stránka určuje prodej nebo nabídky.

Kdy tento koncept není potřeba?

Někdy se zákazníci obrátí na hotové návrhové systémy, na nichž jsou postavena rozhraní jednoho nebo několika projektů. V takových případech není
vývoj konceptu nutný.

Pokud rozumíte tomu, jak vylepšit stávající koncept, můžete vypracovat návrh a odeslat ho zákazníkovi se specifikací, zda má prostředky k aktualizaci. V seznamu návrhů je vhodné poznamenat, jak ovlivní celkové vnímání a řešení obchodních problémů projektu.

Zpracovat

Celý proces lze rozdělit do tří hlavních bloků: výzkum, vytvoření koncepce designu a jeho prezentace.

1. Fáze výzkumu: předprojektový audit a informační architektura.

2. Fáze vytváření konceptu designu: moodboard a styleboard, generování nápadů, náčrtky a výběr nápadů a tvorba rozvržení.

3. Prezentace konceptu.

Před konceptem – průzkum

Předprojektový audit

Chcete-li začít s koncepcí designu webu, musí celý tým porozumět mnoha bodům :

• obchodní úkoly a procesy klienta;

• specifika cílového publika;

• obsah;

• struktura webu;

• technická omezení.

Proto začínáme svou práci s fází předprojektového auditu. Tato fáze ve skutečnosti začíná prvním kontaktem zákazníka, poté se správce účtu (nebo jakákoli jiná kontaktní osoba) seznámí s obchodem zákazníka a provede úvodní briefing. Účet převede shromážděné informace týmu, který se ponoří do projektu společně se zákazníkem
na T-relacích.

T-relace – Jedná se o strategické zasedání skupiny, kde jsou spojeny hluboké odborné znalosti zákazníků v jejich oboru a široké odborné znalosti agentury.

Výsledkem předprojektového auditu je, že tým obdrží odpovědi na otázky:

• jaké úkoly by měl web vyřešit;
• co je struktura budoucího projektu;
• který segment cílového publika bude hlavním návštěvníkem webu;
• jaké jsou hodnoty a jedinečnost produktu/služby atd. .;
• jaké emoce by měl design projektu vyvolat;
• jaké reklamní kampaně jsou plánovány pro klienta při spuštění.

Vytváření úplného obrazu o projektu a vytváření závěrů za pomoci specialistů v různých oblastech má na starosti stratég nebo obchodník.

Jedním z nejúčinnějších způsobů, jak ponořit tým do projektu, je domluvit si schůzku v kanceláři zákazníka, absolvovat prohlídku, ukázat a dotknout se produktu, představit službu.

Alena Titova producentka Nimax

Co děláme?

1. Provádíme rozhovory (jeden nebo několik) se zákazníkem.

Během rozhovoru si celý tým vytvoří představu o specifikách podnikání, o produktech, službách a USP společnosti, cílové skupině, konkurence, obchodní logika
a procesy …

2. Provádíme audit.

I když má zákazník podrobné umístění společnosti, analýzu konkurence, definuje mezeru a je připraven poskytnout všechny materiály dodavateli, bude nutné použít všechny tyto informace na webu
.

3. Formulujeme závěry a úkoly.

Jasně formulované závěry a úkoly pomohou dodavateli být ve stejném informačním poli se zákazníkem a sebevědomě přejít do další fáze.

Jaký je výsledek:

• Cíle projektu jsou formulovány;

• byl vypracován podrobný popis projektu se závěry;

• byl vypracován mandát projektu.

Nástroje, které používáme pro předprojektový audit:

• Miro pro obecnou strukturu;
• Readymag pro prezentace;
• Dokumenty Google pro ukládání všech informací o projektu;
• ActiveCollab pro plánování práce a správu úkolů.

Informační architektura

Výsledkem fáze informační architektury budou strukturované prototypy stránek budoucího webu se srozumitelným obsahem
a uživatelskými skripty.

Příklad: díky propracované informační architektuře bude uživatel schopen rychle najít požadovaný produkt ve velkém katalogu,
a zákazník bude kreslit pozornost kupujících na sezónní zboží.

Co děláme?

1. Shromažďujeme podrobný strom webu.
2. Strukturujeme a organizujeme obsah stránek.
3. Vytvoříme přístupnou navigaci.
4. V případě potřeby vytvoříme technické specifikace obsahu.

Výsledkem je:

• byl sestaven podrobný strom budoucího webu;
• byly vytvořeny prototypy stránek;
• byly vypracovány podmínky pro obsah, pokud nebyl předem připraven.

Nástroje, které používáme k vytváření informační architektury:

• Miro pro celkovou strukturu;
• Readymag pro prezentace;
• Dokumenty Google pro ukládání všech informací o projektu;
• ActiveCollab pro plánování práce a správu úkolů.

Fáze vytváření koncepce designu

Poté fázích analytiky a informační architektuře máme dostatečný počet vstupů do projektu a můžeme začít vytvářet koncept.

Moodboard a Styleboard

Moodboard – deska odrážející náladu projektu. Může obsahovat text, fotografie a ilustrace. Moodboard by neměl vyjadřovat styl projektu.

MoodoBard může být vytvořen souběžně s fází výzkumu produktu nebo služby v procesu poznávání zákazníka a jeho podnikání. S jeho pomocí zobrazujeme obecnou náladu budoucího webu, charakter
a umístění značky.

Návrh by měl být vhodný: smyslný, jemný, v pastelových odstínech, možná s použitím patkových písem a plynulé animace.

Stylboard – deska odrážející stylistické směřování projektu.

Návrhář se dívá na reference, sbírá nápady podle stylu – tvoří styl. Odkazy lze seskupit podle pokynů:

• písma;

• animace;

• < p> ilustrace;

• barevná schémata;

• geometrie;

• mřížky a složení.

Pro efektivní práci doporučujeme projednat s klientem reference, abyste s ním mohli synchronizovat a ujistit se, že se pohybujete správným směrem.

Co děláme?

1. Sbíráme obrázky, které ukazují náladu projektu.
2. Podíváme se na reference.
3. Nabízíme řešení pro typografii.
4. Vypracujeme barevná schémata.
5. Rozhodneme se pro styl fotografie.
6. Najdeme vhodné kompoziční řešení pro bloky webu.

Jaký je výsledek:

• byla sestavena náladová deska;
• byla sestavena stylová deska;
• byl sestaven seznam odkazů s komentáři od návrháře.

Nástroje, které používáme k vytvoření desky nálady a stylu:

• Figma k vytvoření desky s komentáři;
• Pinterest k vytvoření desky ;
• Dokumenty Google pro ukládání všech informací o projektu;
• ActiveCollab pro plánování práce a správu úkolů.

Generování nápadů, náčrtky

Nápady může generovat jeden designér nebo celý tým,
v závislosti na složitosti a rozsahu projektu. Vytvoření prvních skic, skic a ilustrací – tyto kroky tvoří druhou fázi přípravy konceptu. Je důležité rozhodnout, jak budou na webu zveřejněny identifikátory podnikové identity a zda by měly být vytvořeny nové vizuály.

V této fázi je celý tým již ponořen do procesů.

Čím více informací a závěrů, tím více filtrů, které nás vedou ke správným rozhodnutím pro produkt, včetně vizuálních.

Asha Sahakyan, umělecká ředitelka společnosti Nimax

Pravidelné pohledy na práci špičkových designérů a agentur, studium trendů, weby s konkurenčními pracemi, tematické přehledy pomáhají vytvářet škálovatelné a netriviální nápady.

Ve fázi útoků na nápady musíte shromáždit maximální počet možností
bez podrobností a ponoření do mikrořešení, protože hlavním úkolem vytvoření koncepce designu je analýza hypotéz. Nápady mohou mít formu textu, skic, skic nebo snímků obrazovky.

Na této obrazovce můžete vidět obrys myšlenek v důsledku vnitřního napadení webových designérů Nimax.

Nejvhodnější kritéria pro vyhodnocení výsledku jsou vybrána z různých možností.

• Pomůže myšlenka vyřešit obchodní problémy?
• Odporuje myšlenka podnikové identitě?
• Je myšlenka flexibilní a škálovatelná?
• Je nápad vhodný pro cílové publikum projektu?
• Je myšlenka proveditelná v rámci zdrojů, které klient a implementační tým mají?

Co děláme?

1. My útočí.
2. skicování nápadů
3. popis nápadů.

výsledek:

• byl sestaven seznam nápadů s popisy;
• byly pro ně vytvořeny náčrtky stránek a ilustrace nebo byly vybrány odkazy;
• představeny nápady.

Nástroje, které používáme ve fázi generování nápadů:

• Figma;
• Photoshop/Illustrator;

< li> Pinterest;

• ActiveCollab pro plánování práce a správu úkolů.

Výběr nápadu a vytváření rozvržení

Z velkého množství nápadů v průběhu obecného útoku jsou vybrány ty nejúspěšnější, ty, které nejpřesněji pomohou vyřešit úkoly webu: vizuální a funkční.

Někdy jeden nápad doplňuje jiný a jsou sloučeny do jednoho promyšleného řešení.

U některých projektů má smysl zapojit do výběru tým zákazníka, protože tito lidé jsou nositeli obchodních znalostí a rychle pomohou zahodit nevhodné nápady. To může být relevantní pro různé situace:

• myšlenka má zásadní vliv na cenu projektu, vyžaduje zapojení dalších specialistů nebo více času na implementaci
  do vývoje.
• zákazník je připraven na časté hovory a rychlou zpětnou vazbu.
• v případě speciálních projektů, kdy je vizuální nápad nebo scénář klíčovou součástí projektu a ovlivňuje funkčnost.

V této fázi není úkol ukázat zákazníkovi tolik nápady, jak je to možné. Stačí mít závažný argument pro jeden, ale ten nejvhodnější.

Při vytváření rozvržení na základě nápadu a zvolených stylistických rozhodnutí si musíte pamatovat, že nastavíme rytmus pro velký počet stránek
s různými typy obsahu. Proto je důležité současně vyzkoušet řešení pro jiné stránky, zohlednit různé entity a podrobně si prostudovat prototyp
a budoucí obsah.

Co to děláme?

1. Bouříme se s týmem a spojujeme zákazníka s výběrem nápadů.
2. Vybíráme nejlepší nápad a doplňujeme ho.

< li> Vyzkoušejte myšlenku na stávajících prototypech

Výsledkem je:

• rozložení je nakresleno;
• bloky jsou animované;
• byla vytvořena prezentace.

Nástroje, které používáme ve fázi výběru nápadů a vytváření rozvržení:

• Figma;
• Photoshop/Illustrator;
• Readymag;
• Princip;
• ActiveCollab pro plánování práce a správu úkolů.

Prezentace konceptu a jeho budoucí život

Posledním krokem je představení konceptu zákazníkovi. Projekt může být chráněn samotným projektantem nebo projektovým manažerem. V každém případě je důležitá přítomnost návrháře během schůzky nebo telefonního hovoru. Bude schopen odpovědět na otázky spojené s návrhem rozvržení z profesionálního hlediska.

Vždy zahájíme prezentaci s prohlášením o problému, stručným popisem budoucího projektu a jeho publika.

Poté jsou karty odhaleny. Na diapozitivech načrtneme celou cestu, kterou tým prošel: od auditu a nápadů až po hotový design. Takto ukážeme, že rozložení nebyly získány náhodou, ale metodou výzkumu
a analýzou.

Nejlepším příkladem rozložení je animace, takže můžete předem odpovědět
mnoho otázek, které mohou nastat u zákazníka.

Pokud na prezentaci není přítomen celý tým zákazníka, často pro pohodlí a správný přenos konceptu posíláme videoprezentaci.

Shrnutí

Ve výsledku je vytvořena sada pravidel a stylistických rozhodnutí, která budou platit pro všechny ostatní stránky projektu. Výsledkem je alespoň jedna vykreslená stránka k prokázání myšlenky, na jejímž základě tým představí projekt zákazníkovi.

Jelikož tým zákazníka chápe, kterým směrem se návrh pohybuje, čas pro vykreslení interních stránek se zkrátí a proces schvalování se zjednoduší. Zbytek stránek webu bude vypadat ve stejném stylu a pro nový obsah nebudete muset znovu objevovat design od nuly.

I když je projekt předán jiným návrhářům, pak při správném dodržování vyvinutých pravidel budou rozložení různých stránek vypadat holisticky a v jediném vizuálním systému.

Mimochodem, škola Nimax School společně se vzdělávací platformou Design Line zahájila nový online kurz vytváření konceptu designu od nuly. Pod vedením kurátorů projdou studenti od analýzy a výběru nápadu k obraně konceptu designu před skutečným klientem. Přijďte do kurzu a naučte se, jak vytvářet hluboké a smysluplné koncepty webových stránek.

Jak vytvořit koncept webové stránky od nuly. Ukážeme vám speciální přístup k designu webových stránek, který vám umožní vytvářet koncepty webových stránek v podmínkách … nimax.dsgnline.ru