Upload
others
View
0
Download
0
Embed Size (px)
Citation preview
Senior UX designerJana Melišová
Ako si neprekomplikovať
web
Kto som a co robim.. comu sa venujem
- Najradsej robim na velkych a dost zlozitych projektoch, pri ktorych musim rozmyslat nad kazdym jednym elementom na stranke.
- Zaroven vsak vydavam detske knihy a k tomu som si sama spravila eshop - samozrejme WP
780 police cars using this inteligent system
Real implementation
- slovakrail.sk
- vladny maual
- metais??
- a mnoho eshopov roznej urovne
- Preco o tom hovorim?
- Toto vsetko som robila ja.. vyvoj som vsak zacinala z cisteho papiera.. WP je iny, v nom zacinate vacsinou vyberom sablony. Funkcnost ma uz vopred danu.
- Co je vlastne UX a co teda v praci riesim..
- DIzajn musi podliehat dobre j pouzitelnosti.. musi byt co najmenej rusivy
- riesim pismo, jeho velkost a uemistnenie.. riesim samotn yobsaj a jeho rozmiestnenie.. riesim polohu dolezitych elementov (napr. buttony) a samozrejme ich farbu.. riesim logicku naslednost jednotlivych stranok a ich presny obsah
- pouzivatel stranky musi presne vediet, co po nom stranka chce a ako to ma urobit.
Veľké množstvo možností vám zamotá hlavu
Takýmto postupom sa navrhujú weby a aplikácie
a hoci možno nie ste profi dizajnér, zoberte si inšpiráciu
- V prvom rade potrebujete vedieť, co chcete. Maju to fakt zeny tazsie? :-D
- Napíšte si zoznam vecí, elementov a funkcií, ktoré vasa stranka musi mat pri prvom spusteni.
- NApiste si zoznam vecí, ktoré by mal amať v ideálnom prípade.
- NAkreslite si stranku, ako by mala vyzerat - Lo-Fidelity skicu
- NEchajte si to v hlave ulezat a stanovte si finalnu verziu.
- A az potom hladajte vhodny template a pluginy
- Preco toto vsetko?
- Vam to usetri neskutocne vela casu, ktory by ste inak stravili bludenim po tych internetoch
- navstevnici vasej stranky dostanu presne to, co im chcete ponuknut.
- K stranke sa nema dodavat navod, takze myslite na to, ze by mala byt co najnednoduchsia na ovladanie. Bebechajte sa zlakat roznymi pluginmi, ktorym neviete jednoducho bez programatora zmenit umiestnenie
- pouzivatelia vasho webu sa vratia, ak bude stranka poizivatelsky prijemna
Rýchla SKICA (low-
fidelity)
Potrebujeme k tomu fakt málo
LO-FI . skica je rýchla . lacná. ceruzka je vždy po ruke . ľahko ju zahodíte . jasný význam . minimum detailov
Použite post-it papieriky a premiestnujte ich, až kým im nenájdete správne miesto
Nakreslite si aj logiku procesu, ak to nie je úplne bežná stránka.
????
detailnejšia SKICA -
high fidelity
Toto som ucila aj studentov tu na tejto skole
ukazka hi-fi navrhu
Co potom?
- Ano, vytlacte si aspon jednu stranku a majte ju na ociach. Oplati sa.
- Vyberte sablonu, ktora sa vam nie len paci, ale sa co najviac priblizuje tomu, co chcete.
- po naistalovani sa pohrajte s CSS stylmi, aby ste sa co najviac priblizili vlastnej predstave.
- Ak vytvarate specificky alebo zlozitejsi projekt, ukazte ho niekomu este pred spustenim a pytajte si spravne spatnu vazbu. Zistite, ci vsetkemu rozumie a ci na stranke vie spravit to, co je jej podstatou.
- Ukazky z vlastneho eshopu, ako som ho zjednodusila
- povedat, akym nastraham som celila.. chcela som vela funkcii naraz.. bala som sa, z to musim vsetko naraz spravit, lebo co ked to ta sablona potom nezvladne a budem musiet za chodu menit?
- ukazka checkoutu original a mojho - poviem preco som spravila tie zmeny a preco som poskryvala 50% obsahu…
- a to este stale nie je tak, ako by to malo byt.. ale viac uz spravit neviem..
- rozdiel medzi US a europou
- budte narocny na pluginy, ktore instalujete. Hlavne ak vam davaju elementy na nespravne miesto