Die idee agter UX-ontwerp is eenvoudig: gelukkige, selfversekerde gebruikers sal waarskynlik meer van u koop. Dit is meer waarskynlik dat u op u sal vertrou, by u e-poslyste aanmeld of u program aflaai.
Ek dink gereeld aan gebruikerservaringsontwerp (of UX-ontwerp) as sielkunde eerder as ontwikkeling.
Goeie UX-ontwerp gaan oor die besoekers se kop.
Dit is die verwagting van elke stap en om 'n webwerf te skep wat eenvoudig, intuïtief en aangenaam is om te gebruik.
Daar is ongelukkig geen maklike antwoord of silwerkoeël vir goeie UX-ontwerp nie. Dit is die hoogtepunt van baie klein aanpassings. Elkeen verbeter die ervaring op u webwerf.
Met dit in gedagte het ek 'n kontrolelys van 25 klein (en maklike) aanpassings saamgestel wat jou UX-ontwerp sal laat skyn.
1 1. Spoed
2 2. Wie is jy en wat doen jy??
3 3. Sorg dat besoekers met u in kontak kan kom
4 4. Gee besoekers altyd 'n pad terug huis toe
5 5. Nog beter, laat broodkrummels sodat hulle weet waar hulle is
6 6. Verwyder alle herhalende handelinge
7 7. Gebruik wenke om hulp te verleen aan beginners (maar moenie die kundiges belemmer nie!)
8 8. Skep 'n groot, vet oproep tot aksie
9 9. Onderskei tussen primêre en sekondêre oproepe tot aksie
10 10. Gebruik hiërargie om gebruikers te wys waar hulle volgende moet gaan
11 11. Moenie met verwagte elemente gemors word nie!
12 12. Hou by 'n eenvoudige palet met 3 kleure
13 13. Waarom kry ek 'n fout? En wat doen ek nou?
14 14. Gee gebruikers 'n hoë vyf as hulle iets voltooi
15 15. Bly by net twee fontfamilies
16 16. Gebruik duidelike en konsekwente waarskuwingsboodskappe
17 17. BEPERK CAPS-SLOTTEKS
18 18. Groepeer verwante items saam
19 19. Hou alles konsekwent
20 20. Ontwerp die uitleg vir oogskandering
21 21. Bou vertroue met getuigskrifte en sosiale bewys
22 22. Laat gebruikers weet waarmee hulle kan speel!
23 23. Skep 'n sagte leerkurwe
24 24. Vind 'n manier om vinnig met jou besoeker empatie te wees
25 25. Gebruik mikro-interaksies om 'n dialoog te skep
Webwerf-spoed is u heel eerste kans om 'n goeie indruk te maak. Dit is jou eerste UX-hekkie.
Te stadig en jou besoekers is alreeds ontsteld en vertrou jou minder. Ons assosieer instinktief spoed met professionaliteit, en die meeste besoekers verwag dat u webwerf binne twee sekondes sal laai.
Enigiets stadiger as dit, en dit is 'n swak gebruikerservaring, van die begin af.
Maak seker dat u bediener se spoed te veel is, en maak die gewig van u werf noukeuriger sodat dit vinnig oopmaak.
2. Wie is jy en wat doen jy??
U volgende groot uitdaging is om u besoekers vinnig in te lig. Wie is jy? Wat doen jy? En watter waarde kan u aan hulle gee??
Dit word 'n waardeproposisie genoem, en dit is so belangrik dat ons 'n volledige blogpos daarop geskryf het. U het slegs 'n paar sekondes om u besoekers te oortuig, so laat dit tel!
Probeer dit nou: maak 'n opsomming van u hele webwerf in een sin en naamborde waar u wil hê dat besoekers volgende moet gaan.
3. Sorg dat besoekers met u in kontak kan kom
'N Kerndeel van UX-ontwerp is om die bekommernisse of bekommernisse wat u besoekers mag hê, uit te skakel.
Een van die grootste bekommernisse vir nuwe besoekers is of hulle u moet vertrou of nie – veral as u 'n nuwe webwerf is.
Een manier om hierdie angs te verwyder is deur aan te toon dat daar 'n regte persoon agter die skerms is. Voeg 'n besigheidsadres, 'n telefoonnommer en 'n regte e-posadres by. (NIE 'n kontakvorm nie – mense is geneig om hulle te vertrou in vergelyking met 'n e-pos adres).
Nog beter, gebruik 'n regstreekse kletsboks sodat gebruikers onmiddellik vrae kan vra.
As iets verkeerd gaan, is dit goed om te weet dat hulle maklik in kontak kan kom.
4. Gee besoekers altyd 'n pad terug huis toe
Ons het al vantevore op webwerwe verdwaal. U volg skakels en beland in 'n konyngat.
As dit gebeur, word u besoekers ontsteld en gefrustreerd. Hulle sal instinktief op die "X" -knoppie druk om die blaaier te sluit.
Sorg eerder dat daar 'n duidelike en gedefinieerde 'tuis'-knoppie is, sodat hulle altyd weer van voor kan begin. Gewoonlik verwag gebruikers dat u logo ook na die tuisblad sal skakel, maak dus seker dat dit wel doen.
5. Nog beter, laat broodkrummels sodat hulle weet waar hulle is
Gebruik 'broodkrummels' om vinnig weer te begin, om te verduidelik waar hulle aan die gang is.
Daar is groot vorderingstawe hiervoor. As dit byvoorbeeld tydens die afhandelingproses is, laat u gebruiker presies weet waar hy is, en wat moet hy nog doen?.
Weereens, dit is 'n eenvoudige sielkunde. Byvoorbeeld, om 'n draai te stap is baie meer vermoeiend as jy nie weet waar die einde is nie. Ons voel baie gemakliker as ons 'n kaart het. Dieselfde idee geld aanlyn.
6. Verwyder alle herhalende handelinge
Dit is baie frustrerend om dieselfde data twee keer op 'n vorm in te voer (soos 'n faktuuradres en gestuuradres). Probeer om ontslae te raak van enige herhalende aksies wat die aankoopproses vertraag.
Dit is dinge soos hierdie wat lei tot die verlating van karre. U besoekers sal elders kyk.
Nog beter, skep 'n stelsel wat u kliënte se voorkeure onthou. Dit sal hulle verras en verheug as alles weer daar wag. Dit is 'n eenvoudige ding wat die kanse op terugkeerkliënte verbeter.
7. Gebruik wenke om hulp te verleen aan beginners (maar moenie die kundiges belemmer nie!)
Sommige besoekers sal gereeld wees. Hulle sal deur u aanmeldblaaie en die aankoopproses blaai. Ander sal splinternuut wees, en daar is dalk 'n paar vrae onderweg.
Klein 'tool-tip'-ikone (wat dikwels met 'n vraagteken geïdentifiseer word), sal die beginners help om te verstaan ​​wat hulle moet doen. Maar terselfdertyd kom hulle nie in die pad van u kundiges nie.
U kan selfs kortpaaie of vinnige snitte verskaf om die kundiges te bespoedig. U sal byvoorbeeld gereeld die skakels 'slaan oor hierdie' op die meeste webwerf- en appuitleggers sien.
8. Skep 'n groot, vet oproep tot aksie
'N Oproep tot aksie vertel jou besoeker presies wat hy moet doen:' Meld aan 'of' Koop nou '. Maak seker dat dit eenvoudig is, en verduidelik die waarde daarvan.
Beter nog, maak dit 'n helder, vet kleur (groen en lemoene werk hier wonders), en omring dit met 'n wit ruimte. Dit moet u gebruikers se aandag daarop trek en hulle 'n duidelike aanduiding gee dat dit is wat u wil hê hulle moet doen.
9. Onderskei tussen primêre en sekondêre oproepe tot aksie
Met baie oproepe tot aksie, sien u twee opsies. 'Dien' in en 'kanselleer' byvoorbeeld. Of 'laai nou af' en 'gratis proeflopie'.
Dit is duidelik watter aksie u wil hê dat die besoeker moet doen, dus maak seker dat hy dit weet. Kyk na Spotify se tuisblad. Hulle het die 'go premium'-knoppie vet en opvallend gemaak. Hulle het die 'speelvry' -knoppie op die agtergrond laat vervaag.
Dit is net weer 'n eenvoudige sielkunde. U laat u gebruikers subtiel weet op watter een om te klik.
10. Gebruik hiërargie om gebruikers te wys waar hulle volgende moet gaan
Hopelik moet u 'n duidelike 'gebruikersreis' in gedagte hou. Gestel jy gee aanlynkursusse via jou webwerf. 'N Eenvoudige gebruikersreis kan so lyk:
Lees nuutste blog > laai gratis verslag af en teken aan op die poslys > skryf in vir u betaalde aanlynkursus.
As u 'n duidelike reis het, kan u 'n visuele hiërargie skep om gebruikers te rig waarheen u dit wil hê. In hierdie geval sou u seker maak dat u blog die eerste ding was wat hulle sien. Dan sal u baie skakels na u adreslys insluit.
11. Moenie met verwagte elemente gemors word nie!
Dit is dikwels moeilik om die drang te weerstaan ​​om kreatief te wees met uitlegte en elemente. Maar die ding is dat ons almal weet hoe 'n aanlynwinkel veronderstel is om te lyk. Ons verwag dat produkte in eenvoudige kategorieë uiteengesit sal word. Ons verwag produkbeskrywings, resensies en 'n bekende aankoopproses.
Moenie probeer om die wiel weer uit te vind met hierdie belangrike aspekte nie! Hou dit eenvoudig.
12. Hou by 'n eenvoudige palet met 3 kleure
Dit gaan weereens oor die verset teen die drang om dinge te kompliseer. Dit is moeilik om meer as 3 primêre kleure te kombineer en dit sal u gebruikers dikwels verwar.
Kleur is ook baie nuttig om die ervaring van u gebruiker te vorm, aangesien dit nou verband hou met sielkunde en emosie. Ons assosieer byvoorbeeld blou met vertroue (daar is 'n rede waarom Facebook blou gebruik!)
Pas u kleurpalet by u produk.
13. Waarom kry ek 'n fout? En wat doen ek nou?
Soms loop dinge verkeerd en is 404 foute onvermydelik. U kan dit egter in 'n positiewe gebruikerservaring verander.
Verduidelik presies waarom hulle hierdie fout ervaar deur aangepaste 404 en 504 bladsye te skep. Twitter se 'fail whale' was bekend hiervoor.
As u onbekende foute ken, moet u gebruikers gerusstel dat u daaraan werk, en dit terugstuur na u webwerf.
Onheilspellend, soos foutbladsye, is gevaarlik. Gebruikers reik natuurlik na die kruis. Stel hulle gerus, en stuur hulle terug.
14. Gee gebruikers 'n hoë vyf as hulle iets voltooi
Mense word gedryf deur 'n gevoel van prestasie en voltooiing. Laat weet hulle as hulle 'n taak voltooi, en wys hulle waarna hulle moet gaan.
U kan dit doen nadat hulle hul e-posadres ingedien het, nadat hulle 'n produk gekoop het, nadat hulle iets in hul mandjie gevoeg het, of bloot wanneer hulle aan die einde van 'n blogpos kom.
Dit is 'n eenvoudige, maklike, positiewe ervaring. Dit gee gebruikers ook 'n gevoel van samewerking; soos jy hulle eintlik help om hul doelwitte te bereik.
15. Bly by net twee fontfamilies
Konsekwentheid en handelsmerk is die sleutel tot 'n goeie gebruikerservaring.
Dit is baie verwarrend as jou logo-lettertipe Futura is, jou teks is Times New Roman, jou oproep tot optrede is Comic Sans, en jou opskrifte is Windings …
Hou by net twee fontfamilies. Dit is makliker om te lees en dit lyk meer professioneel en betroubaar.
16. Gebruik duidelike en konsekwente waarskuwingsboodskappe
Soms gaan u gebruikers verkeerd doen. Miskien het hulle hul wagwoord verkeerd ingevoer en kon hulle nie aanmeld nie. Miskien het hulle vergeet om 'n poskode op die registrasieblad in te voeg.
In hierdie gevalle wil u 'n eenvoudige, maar duidelike fout- of waarskuwingsboodskap hê. Maak seker dat dit in kleur en styl onderskei aan enigiets anders op u webwerf. Dit gee 'n duidelike aanduiding dat iets nodig is.
U moet hierdie waarskuwingsboodskappe ook konsekwent op u hele webwerf maak. Moenie 'n ander kleur, styl of plasing gebruik nie, want dit raak verwarrend.
17. BEPERK CAPS-SLOTTEKS
Dit is net irriterend.
Daar is eintlik meer belangrike redes as dit. Ons lees eintlik hoofletters stadiger as kleinletters. Dit is dus baie moeiliker om gelees te skandeer (dit is hoe ons die internet oor die algemeen lees).
Reserwe pette sluit wanneer u regtig 'n impak moet maak.
18. Groepeer verwante items saam
Dit is spesifiek vir webwerwe vir e-handel, maar dit werk dwarsdeur die reg.
Probeer om soortgelyke en verwante items op dieselfde plek te hou. Dit beteken dat u besoekers en kliënte 'n baie meer pasgemaakte diens kry, nes u van hul behoeftes verwag het.
U kan dit doen met fisiese produkte, soos Amazon se 'meer soos hierdie' keuse. U kan ook 'n soortgelyke ding doen met blogposte en -artikels deur 'n verwante inhoudsgedeelte te gebruik.
Dit laat besoekers deur u webwerf blaai, verminder u weieringstempo en skep 'n meer persoonlike ervaring.
19. Hou alles konsekwent
Die laaste ding wat u wil hê, is dat 'n besoeker op 'n skakel klik en voel asof hulle na 'n ander webwerf gaan.
Maak seker dat u navigasiebalk op dieselfde plek bly, ongeag waar u op die webwerf is. Sorg dat u logo altyd sigbaar is en dat die kleurpalet dieselfde is.
20. Ontwerp die uitleg vir oogskandering
Ons lees nie webwerwe soos ons 'n boek lees nie. Ons oë spring en soek na die belangrike inligting.
Gewoonlik lees ons webwerwe in 'n F-patroon, maar dit is ook bekend dat gewaagde beelde en oproepe tot die eerste keer die oog kry.
21. Bou vertroue met getuigskrifte en sosiale bewys
Die meeste besoekers aan u webwerf arriveer met hul hoede. Hulle is van nature versigtig vir nuwe werwe en is beslis nog nie gereed om by u te koop nie.
Soos ek gesê het, is die verwydering van hierdie hindernisse 'n belangrike deel van UX-ontwerp en om mense op hul webwerf gemaklik te laat voel. Enkele goed geplaasde getuigskrifte en faktoïede sal mense gemakliker laat voel. Ons wil graag sien dat ander mense (ideaal groot name) u produk en diens gebruik het en dit goedkeur.
22. Laat gebruikers weet waarmee hulle kan speel!
Webwerwe bestaan ​​gewoonlik uit twee dele: nommer een: inhoud – dit is staties en ons kan nie daarmee omgaan nie. En nommer twee: kontroles – dit is dinge waarmee ons kan klik en speel en met mekaar kan omgaan.
Twitter is wonderlik hiermee. Eenvoudige swart teks vir inhoud. Blou teks dui aan waarop u kan klik en op mekaar kan omgaan. Ikone word met kleur gevul as u oorskiet om te wys waarmee u kan speel.
Nooi mense uit om met u webwerf te speel!
23. Skep 'n sagte leerkurwe
Niemand hou daarvan om op 'n verwarrende en moeilike webwerf vas te hou nie.
Probeer om u besoekers vinnig vinnig te wen. Voer hulle in en maak dit eenvoudig – veral as u 'n moeilike sakevoorstel bied.
24. Vind 'n manier om vinnig met jou besoeker empatie te wees
Gebruikerservaring gaan alles oor die nabootsing van 'n menslike verhouding en die verbinding met u gebruiker. Empatie is 'n groot deel hiervan – wat is die doelstellings en drome van u besoekers? Wat het hulle tot dusver teruggehou??
Laat hulle onmiddellik weet dat u hul probleem verstaan. U kan dit doen met 'n beeld waarmee hulle kan verband hou, of met 'n sin wat hul grootste probleme opsom.
U besoeker sal dink 'hierdie webwerf kry my!', Wat 'n uitstekende gebruikerservaring is om te skep.
25. Gebruik mikro-interaksies om 'n dialoog te skep
Probeer om terugvoering aan u gebruiker te gee op elke klein deel van die reis. Dit sal 'n ware kommunikasie en verhouding skep waarop gebruikers reageer.
U kan dit doen met kopie, soos 'Goeie werk!' 'Ons het gedink u hou hiervan', 'wil u met 'n kundige praat?'
Of klein grafika en beeldmateriaal, soos 'n duim op, 'n glimlaggende gesig of 'n tikkende horlosie op 'n laai-bladsy.
Kombineer hierdie klein aanpassings, en u skep 'n gebruikerservaring wat vertroue opbou, verbind met u teikengehoor en laat hulle gelukkig en met 'n gevoel van prestasie voel.
Gebruik u een van hierdie UX-ontwerpstricks? Ek sal graag wil hoor van enige dinge wat ek misgeloop het! Laat weet my in die kommentaargedeelte.