Usability webinar GPEC - Gomag

Post on 12-Apr-2017

162 views 4 download

Transcript of Usability webinar GPEC - Gomag

Buneprac*ciinusabilitypentrumagazineleonline

GPeC.ro

Us@a#%bil<:i#ty

“…is#$&>?theextenttowhich!@a*&%$$productcan|”:”>%^&$beusedby^@$#><>?specifiedusersto~~!?+{:”|{achievespecified#@&!()goals#$@!(witheffecOveness<:{~+_,efficiency,$%@,.:”>”!andsaOsfacOonina^&*#_)!specifiedcontextof“:<@%$use.”

Us@a#%bil<:i#ty

“…is#$&>?theextenttowhich!@a*&%$$productcan|”:”>%^&$beusedby^@$#><>?specifiedusersto~~!?+{:”|{achievespecified#@&!()goals#$@!(witheffecOveness<:{~+_,efficiency,$%@,.:”>”!andsaOsfacOonina^&*#_)!specifiedcontextof“:<@%$use.”

Us@a#%bil<:i#ty

“…is#$&>?theextenttowhich!@a*&%$$productcan|”:”>%^&$beusedby^@$#><>?specifiedusersto~~!?+{:”|{achievespecified#@&!()goals#$@!(witheffecOveness<:{~+_,efficiency,$%@,.:”>”!andsaOsfacOonina^&*#_)!specifiedcontextof“:<@%$use.”

Usability

“…istheextenttowhichaproductcanbeusedbyspecifieduserstoachievespecifiedgoalswitheffecOveness,efficiencyandsaOsfacOoninaspecifiedcontextofuse.”–sursa:ISO9241-11:GuidanceonUsability(1998)

Ce intelegem, in principiu, prin uzabilitate? § eficientasiusurintafolosiriiuneipaginiwebsauauneiinterfeteelectronicedecatreunuOlizator,inscopulsaOsfaceriinevoiloracestuia;

§ site-ulpecaremaafluesteusordefolosit,intuiOv,simplu,explicit;§ gasesccuusurintainforma*iledecareamnevoie;§ nutrebuiesaapelezlainstrumenteajutatoarepentrua-miindepliniobiecOvul;§ link-uriledinsitesuntfunc*onalesiraspundintocmaiasteptarilormele(ex.:maasteptcaapasandbutonulde“adaugaincos”,produsulmeusafieintrodusexplicitincosuldecumparaturi)

§ informa*ileesen*alesunteviden*atesi“laindemana”(ex.:maasteptsavadclarpretulunuiprodus,cumselivreaza,cegaranGeareetc.)

§ procesuldecomandaonlinefunc*oneazaperfect(nuamerorilacompletareaformulareloretc.)

Cat de importanta este uzabilitatea in mixul de factori care contribuie la succesul unui

magazin online?

Uzabilitatea este importanta, dar nu inseamna totul!

Succesulunuimagazinonlinenudepindeexclusivdeuzabilitate,cidenumerosifactoriinterconectaO:§ planuldeafaceri§ niveluldeinvesOOesiadministrareabugetelorpeparcurs/cashflow§ poliOcadecomunicaresimarkeOng§ documentareaproduselor§ calitateaserviciilorsiOmpulderaspunsfatadeclient§ grijapentrusoluOonareaproblemelorclienOlordejaexistenO§ service&garanOi§ SEO§ etc.etc.etc.

Uzabilitatea este piatra de temelie a unui magazin online

§ GandiO-valauzabilitatecalafunda*auneiconstruc*i!DacafundaOaesubreda,risculdeprabusirealcladiriiestemare!

§ Website-ulunuimagazinonlineestecarteadevizitainfataclientului,estevitrinaunuimagazintradiOonal!Dacawebsite-ulesteneingrijitsi,maiales,greudefolosit,veOpierdeclienO!

§ ScopulunuimagazinonlineestedeaVINDE.Daca–dincauzauneiproasteuzabilitaO-vizitatoriisite-uluidvs.(potenOaliclienO)parasescsite-ul,vadeziceOdelascopuldeaVINDE.

§ Nimanuinu-iplaclucrurilecomplicate,greudeurmarit,lipsitedeergonomie.Atuncicandvaconstrui*site-ul,gandi*-vacumarfisade*ne*unautomobilcareareschimbatoruldevitezeamplasatsubscaunulsoferului!

Uzabilitatea este piatra de temelie a unui magazin online

§ Uzabilitateavaajutalacrestereanumaruluideconversii

§ Crestereanumaruluideconversiiinseamnamaimultecomenzionorate,asadarmaimultevanzariàmaimulObanipentrudvs.

§ UzabilitateaestestranslegatadeCustomerExperience.DacaexperientauOlizatoruluicuunsiteesteplacutasiDACAserviciilemagazinuluisuntcalitaOve,veOfirecomandatsicatreprieteni/alOclienOàmaimulObanipentrudvs.

§ Uzabilitateainseamnasaiiofericlientuluitautoateinstrumentelenecesare“laindemana”inasafelincatsaiicreezioexperientadecumparareplacuta.Uzabilitateainseamnasagandes*precumclientulsisaraspunziintocmailaasteptarilelui!

§ Iaincalculca*mpulpanalaluareadecizieideacon*nuarasfoireaunuisitesaudea-lparasi,sesitueazala6secunde...Sitotscade...

Nu confunda clientul cu un expert!

Celemaifrecventegreselipecarelefacsiteownerii,dezvoltatoriisauoameniitehnicisuntlegatedefaptulcaTOTIUITACANUSUNTCONSUMATORIOBISNUITI!§ programatoriiau–dedeparte–oexperientabogataasuprasite-uluipecareildezvoltadecatvaaveavreodatacelcarenavigheazasiuOlizeazasite-ul

§ siteowneriiacOveazazilnicinacelasidomeniu,folosescterminologiisielementedejargonspecificedomeniuluisiuitacapentruconsumatoriiobsinuiOacesteasuntSF-uri.

§ anumiteaspectepotfi“crystalclear”pentruspecialisO,pentrusiteowneri,pentrudezvoltatori,pentruceicuexperienta–darunadevaratIADpentruconsumatoriiobisnui*(caresuntceimaimul*)

Campul de cautare / Bara de Search

Tendintein2017

Lista categoriilor de produse din site

Recomandari:§ DacavindeOmulteprodusesortateinmultecategoriisisubcategorii,puneOcategoriileprincipaleincoloanadinstangasi3-4categoriisecundarevizibilexpandatesaucuopeninlateral§ Tendintaeste,insa,deaaerisisite-ulcatmaimult

Amazonin2011

Amazonin2017

Highlight pe meniu si categorii, promotii in lista de categorii, nu se acopera banner-ul central

• Listadecategoriideprodusepoatefiamplasatasiintr-unmeniuorizontal;• PuteO,inclusiv,avealistadecategoriideproduseintr-unmeniuorizontalsialtulverOcalpecoloanadinstanga–doardacavindeOmulteprodusegrupateinmultecategoriisisubcategorii

Pozitionarea Banner-ului central din homepage

Recomandari:§ Centrulhomepage-uluiinparteasuperioaraestefavoritpentrubanner§ Tendintaestedeaaveabannerecatmaimaricadimensiuni,iarimaginilefolositesafiedeinaltarezoluOe§ NuuitaOdedelimitareacadrelorbanneruluisideposibilitateadeanavigaprinacestea§ NufolosiOmaimultdemaximum5cadreintr-uncarusel§ NupromovaOaltesite-uriinsite-ulvostru

www.gpec.ro

Amplasarea sectiunii de Cont / Sign-up / Login

Recomandari:§ Inprimafaza,oferiOposibilitateadeCheckoutasGuest(pemasuracenotorietateabrand-uluivostrucreste,puteOcerecreareaunuicontobligatoriupentrucomanda)§ FaceOmicro-conversiiinpaginadeThankYou,dupaplasareacomenzii(ex.:cereOatuncicreareaunuicont)§ DacafolosiOContul,amplasaO-linaceeasizonaundeseaflacosuldecumparaturi–coltdreaptasus§ InformlaruldecrearecontcereOnumaiinformaOileesenOale(celedecareaveOnevoiepentrulivrareacomenzii).

Amplasarea Cosului de cumparaturi – colt dreapta-sus, vizibil in toate paginile din site

Recomandari:§ Uneori,odatacuadaugareaunuiprodusincos,estebinesaduceOclientuldirectinprocesuldecheckoutpentrufinalizareacomenzii§ Exista,insa,excepOi–aceleadeaaveaunCoscumaimulteprodusepemajoritateacomenzilor–testaOcumemaibinepentrubusinessulvostru§ RenuntaOlaoricealteelementedinsite–inclusivlacoloaneledecategoriiinpaginadeCos.

Exemplu mai vechi de pagina de Cos la PC Garage - dezbatere

Sectiunile de Help / Support – tot in zona din dreapta-sus, pe langa Cos, Cont, Contact etc.

ExemplumaivechidelaJapora.ro–DezbatereOK–totulgrupatincoltdreapta-sus:telefoane,Contact,Cont,Cos,InformaOidespreprocesuldecumpararesilivrareetc...Si,totusi,maiexistaosecOunenumitaInformaOi–cevaspuneaceastasecOune?

Voiladevezi!J

Sectiunea de Contact si amplasarea link-ului de Contact

Recomandari:§ Link-uldeContactpoatefiamplasatincoltuldindreapta-sus(grupatcuCosul,Contul),darsidublatinfooter§ OferiOinformaOidetaliatedecontactinpaginadeContact:telefoane,email,adresapostalacompleta,datedesprefirmacareadministreazamagazinul,numedepersoaneresponsabilepeanumitedepartamente,programuldelucrucupublicul,hartaamplasariisediuluietc.ToateconferauOlizatoruluiincredereinmagazin!

Seciunea de Termeni si conditii (amplasare in footer)

Recomandari:§ EsteesenOalsaaveOosecOuneT&Cbinepusalapunct,chiardacanuocitestenimeni§ NucopiaOT&Cdepealtesite-urisaumacaradaptaO-lelabusiness-ulvostrucudeosebitaatenOe§ AsiguraO-vacaindepliniOobligaOilelegaleinT&CàinscriereinCompeOOaGPeC(beneficiaOsideunauditTrusted.ro)§ NupuneObifaByDefaultpeT&Cinprocesuldecheckout

Breadcrumbs (Lantul de Navigare) – de ce e important?

- SEO- NavigareausoaraauOlizatorilorinsitefarasafienecesaraintoarcereaincategoriileprincipaledeproduse

Filtre si sortari

Recomandari:§ amplasarepecoloanadinstanga,darsipeorizontaladeasupralisteideprodusedincategorie§ folosiOcatmaimultefiltreàajutauOlizatorulsaidenOficerapidproduseledecareesteinteresat§ suntesenOalefiltrelecaresorteazaproduseleduparaOng-ulsaucomentariilealtorclienOàwordofmouthestedinceincemaiimportantindeciziadecumparare§ nufolosiOdenumiridefiltreambiguesaufiltrecarenuisiaurostul

www.gpec.ro

Imaginea produsului (atat in pagina de categorie, cat si in pagina de produs)

Recomandari:§ folosiOimaginicatmaisugesOve,cuorezoluOebunasifuncOedezoomfuncOonala§ incercaOsafolosiOimaginileincontextulfolosiriiprodusuluipentruacreaemoOeuOlizatoruluisiaimpulsionacumparatura§ pelangapozeledelaproducator,faceOsivoipoze(chiardacanufoarteprofi)àobisnuintavinedinSocialMedia§ arfiidealsaaveOsivideo-prezentarideprodus(ex.:unboxing…)§ pozeleprodusuluidinmaimulteunghiurisauincomparaOecuobiecteuzuale,convingmaiusoruOlizatoriisacumpere(ex.:suntemhandicapaOpeonlinesiavemnevoiesasOmcatdesubOreeunMacBookAir–asadaropozaalaptop-uluilangaunpix,nepoateajutarapidsanefacemidee)

Titlul, Pretul produsului, Adauga in Cos

Recomandari:§ inpaginadeproduscelemaiimportantesunt:Titlul,Imaginea,Pretul(catmaivizibilsiincluzandtoatetaxele)siButonuldeAdaugainCos–toatetrebuieevidenOate!–folosiOcromaOcapentruevidenOereabutoanelordeacOune.§ NuneglijaOinsaopiniilealtorclienO,informaOiledelivrare,garanOisi–evident–descriereaproduselor.

Scurte Concluzii / Sfaturi § Keepitsimple!Multemagazinesunttentatesaafisezefoartemultemodule,funcOunietc.dindorintadea-siajutaclienOi.Infapt,maimultiiincurcaO!

§ Direc*ona*consumatorulcatreac*uneprindesignsiculoare!

§ Eviden*a*doarinforma*ileesen*ale,careconvertesc.EvitaOaglomerareacuinformaOicaredistragatenOauOlizatoruluidelaacumpara(elementedeOp“noise”).

§ Folosi*sintagma“adaugaincos”inloculsintagmei“cumpara”pebutonuldecumparare(puteOfaceA/BtestesaincercaO)

§ Odataadaugatunprodusincos,ave*grijasanuintrerupe*fluxuldecomanda.

§ Respecta*uzanteleinvigoare,gandi*precumconsumatorulobisnuitsi…

§ INTOTDEAUNATESTATI!