UX eCommerce pentru experiența mobilă

Termenul „comerț mobil” a fost introdus în urmă cu 20 de ani de Kevin Duffey, când a sugerat că un dispozitiv mobil ar putea funcționa ca un punct de vânzare cu amănuntul în buzunarul unui client. Având în vedere limitările tehnologice ale vremii, cine s-ar fi gândit că într-o zi vom putea explora, revizui și cumpăra cu ușurință bunuri pe un dispozitiv mic de buzunar?

Nu pot exagera modul în care mobilul schimbă modul în care interacționăm cu consumatorii noștri; trebuie să acceptăm aceste schimbări. – Joel Anderson, CEO al Walmart

Creșterea uluitoare a comerțului electronic a alimentat și creșterea comerțului electronic mobil, care acum valorează aproape 700 de miliarde de dolari. Comerțul electronic mobil este în prezent cea mai mare parte a pieței gigantice online. Peste 80% dintre americani au făcut o achiziție online în ultima lună — în urmă cu trei ani, numărul era de doar 11,6%.

Un raport de la Business Insider Intelligence a sugerat că comerțul mobil va crește cu până la 45% până în 2020. Cercetarea ComScore a fost de acord și, în 2016, a raportat o creștere de 44% a cheltuielilor prin intermediul dispozitivelor mobile comparativ cu 2015.

În ciuda cifrelor mari de vânzări, mai mult de 60% dintre utilizatori se simt în continuare îngrijorați de faptul că informațiile financiare le sunt piratate atunci când folosesc un telefon mobil. Cu toate acestea, satisfacția clienților este încă destul de ridicată, giganții retailului de telefonie mobilă precum Amazon și Apple primind ambii un rating de satisfacție de peste 80%.

Cele mai bune practici UX pentru comerțul electronic mobil pentru succes

Acceptă mărirea imaginii prin ciupire și gesturi cu atingere dublă

Oamenii sunt familiarizați cu gesturi precum atingerea dublă și ciupirea pentru a mări imaginile de pe mobil. În timpul unui studiu de utilizare a comerțului electronic mobil, Institutul Baymard a descoperit că, în mod firesc, cumpărătorii doresc să poată inspecta produsul în detaliu și sunt preocupați de micile detalii. Utilizatorii care erau interesați să achiziționeze un produs, dar nu l-au putut explora prin mărire, nu s-au simțit confortabil să-l cumpere și de multe ori nu s-au angajat să vândă.

Este destul de surprinzător că dintre cele 50 de aplicații mobile de comerț electronic cu cele mai mari încasări, mai mult de 40% nu au acceptat gesturi de zoom. Chiar și site-urile care au oferit versiuni de prim-plan ale imaginilor au înregistrat rate de respingere similare, ceea ce sugerează că suportul gesturilor de mărire a imaginii produsului într-o aplicație de comerț electronic mobil este fundamental.

Având în vedere dimensiunea mică a ecranului dispozitivelor mobile, aceasta este o problemă specifică platformei. Sprijinirea a cel puțin una dintre aceste caracteristici va pune o aplicație în compania primelor 50% dintre aplicațiile de comerț electronic, adică în lista cu cele mai încasări.

Câțiva factori de luat în considerare:

• Imaginile cu rezoluție scăzută sunt echivalentul imaginilor fără zoom. Utilizatorii sunt interesați să vadă clar detaliile unui produs și au nevoie de imagini de înaltă rezoluție pentru a face acest lucru. Opțiunea de a mări o imagine de calitate scăzută este aproape inutilă, deoarece nu permite utilizatorului să vadă detalii.
• Institutul Baymard a descoperit că 50% dintre aplicații nu indică utilizatorilor că pot ciupi sau atinge de două ori imaginile produselor. Este important să indicați disponibilitatea măririi imaginii. Deși aceste gesturi sunt cunoscute în mod obișnuit de utilizatorii de telefonie mobilă, totuși trebuie să se arate că sunt disponibile. Pentru a face acest lucru este recomandată utilizarea pictogramelor sau a reprezentărilor vizuale.

Furnizați o funcție „Salvare” pentru coșul de cumpărături

După cum am menționat mai devreme, dimensiunea mică a ecranului dispozitivelor mobile este un obstacol principal atunci când vine vorba de comerțul electronic mobil. Institutul Baymard a observat că mai mult de 61% dintre utilizatorii de telefonie mobilă își vor folosi adesea desktopurile pentru a finaliza o achiziție, mai degrabă decât telefonul.

O funcție „Salvați coșul de cumpărături” reduce numărul de abandonuri de coș și le permite cumpărătorilor să salveze articole pentru o achiziție ulterioară. Coșurile de cumpărături persistente le permit clienților să-și continue cumpărăturile fără a fi nevoie să caute produsul dorit la întoarcere - o caracteristică pe care 55% dintre cumpărători ar folosi-o.

Iată cum să păstrați acești clienți:

1. Faceți coșul să funcționeze ca o listă de dorințe salvând articolele adăugate în coș.
2. Creați o opțiune pentru a permite cumpărătorilor să primească e-mailuri cu articolele salvate. Afișați mementouri că își pot folosi desktopul pentru a finaliza achiziția.

Utilizați formulare descriptive, bine etichetate

Aplicarea celor mai bune practici pentru formularele mobile este o altă considerație. Este important ca designul UX al unei aplicații sau al site-ului de comerț electronic, în timp ce elimină orice confuzie, să permită utilizatorilor să completeze formularele cât mai repede posibil.

Iată cele mai bune practici pentru utilizarea formularelor mobile:

• Plasați etichetele formularului deasupra formularului pentru a îmbunătăți lizibilitatea, ușurința în utilizare și claritatea. Explicarea de ce sunt necesare anumite informații va reduce anxietatea utilizatorilor atunci când completează formulare de pe mobil.
• Potriviți textul introdus cu tastatura corespunzătoare. Afișați o tastatură atunci când introduceți numere de telefon și cifre ale cărților de credit și o tastatură de text când introduceți adrese și text. Acest lucru va reduce greșelile utilizatorului și va accelera completarea formularelor.
• Limitați numărul de câmpuri de introducere pentru a reduce efortul de tastare. Mai puține câmpuri de introducere vor genera un formular mai puțin încărcat și vor îmbunătăți fluxul de plată UX.
• Avansați automat fiecare câmp în sus pe ecran când este finalizat. Acest lucru nu va împiedica nicio vizualizare a câmpurilor incomplete.
• Folosiți stepper în loc de meniuri drop-down pentru a reduce efortul cumpărătorilor. Stepper-urile sunt folosite pentru a crește sau a scădea valoarea cu o cantitate constantă și sunt o soluție cu care se lucrează mai rapid și mai atrăgătoare pentru ochi.

Furnizați sugestie automată inteligentă, detectare automată, căutare adrese și erori

Scopul principal din spatele sugestiei automate este de a face mai ușor și mai rapid pentru utilizatori să completeze formularele. Sugestia automată prezice interogările frecvente de căutare și îi ajută pe cumpărători să găsească mai ușor produsele.

Utilizabilitatea mobilă poate fi îmbunătățită în continuare prin utilizarea detectării automate a tipului de card de credit. Detectarea automată simplifică procesul de cumpărare, oferind feedback imediat pentru tipurile de carduri acceptate. Automatizarea cât mai multor procese de introducere a datelor – de preferință cu elemente vizuale – îmbunătățește experiența utilizatorului și va afecta pozitiv ratele de conversie.

Căutarea și validarea adreselor accelerează procesul de finalizare a comenzii — diverse API-uri (cum ar fi Google Places și USPS) permit implementarea ușoară a acestei funcții.

Furnizarea de validare a intrărilor inline pentru erori este, de asemenea, o bună practică în designul UX mobil. Lipsa performanței rapide este o frustrare majoră pentru cumpărătorii de comerț electronic. Acest lucru poate fi ajutat oferindu-le utilizatorilor feedback în direct cu privire la progresul lor (în timpul plății, de exemplu), mai ales atunci când fac o greșeală involuntară. Acest lucru permite utilizatorilor să-și repare greșelile imediat, ceea ce afectează gradul de utilizare într-un mod pozitiv.

Utilizați microinteracțiuni pentru a îmbunătăți UX pentru cumpărături mobile

Microinteracțiunile sunt detalii din interfața unui produs menite să îndeplinească o singură sarcină, îmbunătățind în același timp fluxul natural al produsului. Aprecierea și evaluarea unui produs, alegerea unei culori și a unei dimensiuni și glisarea în jos pentru a reîmprospăta datele sunt toate exemple de microinteracțiuni.

Având în vedere cât de comune sunt, microinteracțiunile pot face sau distruge UX-ul unei aplicații de comerț electronic mobil.

Microinteracțiunile pot fi folosite pentru:

• Ghidați utilizatorul prin aplicație într-un mod mai intuitiv;
• Transmite un sentiment mai bun de încredere, reduce anxietatea cumpărătorilor și sporește confortul psihologic general datorită interacțiunilor mai fluide și mai naturale;
• Preveniți erorile viitoare și oferiți feedback imediat utilizatorilor pe baza activităților pe care le-au finalizat; și/sau
• Îmbunătățiți interacțiunea utilizatorului cu aplicația răspunzând la notificări.

Oferă interacțiune ușoară, orientată spre degetul mare

Înțelegerea celor mai obișnuite moduri în care cumpărătorii își țin dispozitivele mobile îmbunătățește experiența utilizatorului de comerț electronic mobil și capacitatea de utilizare. În 2013, Steven Hoober a întrebat „Cum dețin utilizatorii cu adevărat dispozitivele mobile?” și a observat modul în care oamenii interacționează cu și își țin smartphone-urile și a observat trei modele comportamentale principale care ar trebui să ghideze designul UX mobil.

Adaptarea interfețelor la modul în care oamenii folosesc în mod natural telefoanele mobile va crește confortul utilizatorului și va reduce anxietatea cumpărătorilor. Dispozitivele mobile și dimensiunile ecranului variază, dar „zona degetului mare”, un aspect critic al designului și experienței utilizatorului, rămâne aceeași.

Proiectarea în jurul „zonei degetului mare”:

• Rezolvă probleme potențiale de navigare și explorare
• Îmbunătățește interacțiunea prin gesturi mai adaptate și atingerea degetelor
• Transformă mai bine și îmbunătățește utilizarea prin plasarea elementelor importante în zone „ușor de accesat”.

Considerații pentru designul de comerț electronic mobil orientat spre conversie

Transmiteți un sentiment de securitate în aplicațiile mobile de comerț electronic

Securitatea este una dintre cele mai mari preocupări pentru utilizatori în timpul cumpărăturilor de pe dispozitive mobile. Comunicarea faptului că tranzacțiile lor sunt sigure adaugă multă valoare la percepția pozitivă pe care o au cumpărătorii față de un magazin.

Iată câteva tehnici de design UX care comunică securitatea utilizatorilor și reduc anxietatea utilizatorului:

• Faceți etichetele butoanelor sugestive și clare în ceea ce privește unde se îndreaptă cumpărătorii. Cuvinte precum „continuare”, „securizat” și „criptat” vor întări confortul psihologic al utilizatorilor.
• Folosiți simboluri de lacăt pentru a asigura cumpărătorilor că tranzacțiile lor sunt sigure.
• Utilizați insigne de încredere de la furnizori de securitate precum McAfee Secure și Norton. Acest lucru ajută utilizatorii să perceapă un site web în mod pozitiv (studiu Baymard Institute).
• Aplicați principiile psihologiei culorilor în design pentru o percepție și mai bună a încrederii de către cumpărători. Unele dintre aceste principii includ culori orientate spre public și specifice genului.

Prioritizează căutarea (și păstrează-o deasupra paginii)

Cumpărătorii folosesc un site sau o aplicație de comerț electronic mobil pentru a explora produse sau pentru a cumpăra un anumit produs; în consecință, o căutare bine concepută capătă o importanță critică pentru o aplicație de comerț electronic mobil. eBay consideră că căutarea pe site-ul său este una dintre cele mai importante caracteristici pentru cumpărătorii de pe mobil și o subliniază prin plasarea acesteia în centru și deasupra pliului de pe interfață.

Considerații importante pentru căutarea mobilă:

• Asigurați-vă că este vizibil! Menținerea barei de căutare ușor de accesat și deasupra pliului oferă cumpărătorilor o modalitate de a căuta produse fără efort.
• Oferiți căutare anticipată utilizând datele obținute din modele de căutare obișnuite și afișați produse similare în paginile cu rezultatele căutării.
• Oferiți opțiuni avansate de filtrare care permit clienților să găsească produsele dorite rapid și fără efort.

Un aspect important de luat în considerare la afișarea formularelor de căutare este că acestea sunt valoroase doar în primele etape ale interacțiunii utilizatorului cu aplicația. De obicei, utilizatorii caută aplicația la începutul călătoriei lor de cumpărături și pot exista situații în care afișarea unui formular de căutare mai târziu în călătorie poate dăuna UX.

De exemplu, în timpul procesului de finalizare a comenzii, căutarea nu mai este utilă și va distrage atenția, deoarece ar putea face utilizatorii să-și piardă concentrarea și să renunțe la angajamentul lor față de achiziție.

Oferiți o comandă lină, ușoară și rapidă

Studiile au arătat că procesul de checkout este cea mai stresantă parte a finalizării unei achiziții online. Institutul Baymard raportează o rată de 35% pentru abandonarea coșului din cauza cerinței de a crea un cont înainte de a cumpăra. Pentru a scădea ratele de abandon al coșului, este important să proiectați un proces de finalizare a comenzii ușor și rapid, care să nu solicite cumpărătorilor să se înregistreze mai întâi.

Studiile de utilizare au descoperit că mai mult de 60% dintre utilizatori au avut dificultăți în a găsi opțiunea de checkout pentru oaspeți; prin urmare, opțiunea de checkout pentru oaspeți trebuie să fie clar vizibilă și ușor de accesat.

Iată câteva sugestii pentru un flux îmbunătățit de plată pentru comerțul electronic:

• Pentru a promova implicarea utilizatorilor, etichetați fiecare pas al procesului de achiziție numerotând și afișând pasul activ în prezent.
• Utilizați reprezentări vizuale, cum ar fi barele de progres, pentru a afișa avansarea în procesul de finalizare a comenzii.
• Oferiți o opțiune de înregistrare și de conectare în timpul procesului de finalizare a comenzii, dar alegeți.
• Pentru a reduce anxietatea și ratele de respingere, sugerați utilizatorilor să se conecteze sau să se înregistreze după finalizare, dacă au trecut la check-out ca oaspete.
• Aplicați tehnici de dezvăluire progresivă pentru a îmbunătăți concentrarea utilizatorului și pentru a încărca conținutul cu 30% mai rapid.

În rezumat: Care sunt câteva caracteristici cheie ale designului de succes al comerțului electronic mobil?

• Oferă fluxuri rapide și ușoare ale procesului de înregistrare și de plată
• Insuflă un sentiment de securitate și încredere prin afișarea pictogramelor, insignelor, recenziilor și mărturiilor adecvate
• Oferă interacțiune proiectată în jurul zonelor prietenoase cu degetul mare
• Utilizează o navigare consistentă și condensată
• Încorporează căutarea rapidă și filtrarea ușoară a produselor
• Înțelege legătura directă dintre stresul utilizatorului, anxietatea și ratele de conversie pentru aplicațiile mobile
• Oferă experiențe de încărcare rapidă și receptive ale site-urilor mobile
• Acceptă gesturi pentru mărirea imaginii produsului

Spațiul de comerț electronic mobil se va mări

Tendințele comerțului electronic mobil arată că piața comerțului electronic mobil este în creștere exponențială, iar creșterea industriei a creat o multitudine de beneficii pentru vânzători. Cu toate acestea, odată cu acestea au venit multe bune practici și standarde pentru designul de comerț electronic mobil pe care vânzătorii trebuie să le urmeze dacă doresc să aibă succes.

Cumpărătorii se așteaptă la o aplicație mobilă care funcționează bine, arată frumos și care este adaptată comportamentelor lor. Deși fiecare aplicație este diferită, cu propriile limitări și obiective, respectarea principiilor fundamentale prezentate în acest articol va ajuta la crearea de aplicații de comerț electronic mobil de succes.

Descărcați o fișă pentru îmbunătățirea UX pentru comerțul electronic mobil

• • •

Citiri suplimentare pe Blogul Toptal Design:

• Tendințe proeminente în comerțul electronic și influența lor asupra designului (cu infografic)
• eCommerce UX – O privire de ansamblu asupra celor mai bune practici (cu infografic)
• eCommerce UX – Strategii și principii de design esențiale
• Ghidul suprem pentru designul site-urilor de comerț electronic
• Comerțul electronic reproiectat: cum modificările minore au adus îmbunătățiri majore UX