Constrângeri de design UX mobil, cele mai bune practici și lucrul cu dezvoltatorii

Putem obține experiențe mai bune pentru utilizatori urmând cele mai bune practici de design UX mobil, înțelegem constrângerile și facilităm o relație de lucru solidă cu dezvoltatorii.

Ce este Mobile UX Design?

Un articol recent de pe TechCrunch a subliniat că comerțul electronic mobil a reprezentat aproape o treime din toate vânzările online în perioada sărbătorilor de Ziua Recunoștinței din 2018, iar Digital Trends a raportat în 2017 că 5 miliarde de oameni din întreaga lume au acum un dispozitiv mobil. Google a anunțat, de asemenea, că indexarea pe mobil este utilizată acum pentru peste jumătate din paginile web din rezultatele căutării sale.

Oamenii depind de dispozitivele mobile în fiecare zi pentru comunicații, comerț electronic, consum de conținut, muncă, servicii bancare, direcții și din ce în ce mai mult ca singurul lor dispozitiv de calcul. În plus, folosesc o varietate de dispozitive, cum ar fi telefoane mobile, ceasuri inteligente, tablete, phablet-uri, purtabile și laptopuri hibride.

Designul experienței utilizatorului mobil (UX) se referă la proiectarea unor experiențe pozitive în timpul utilizării dispozitivelor mobile și a dispozitivelor portabile, precum și la aplicațiile sau serviciile care rulează pe astfel de dispozitive... Designul UX mobil se concentrează puternic pe eficiență și descoperire. - Fundația Interaction Design

Pentru designerii UX, aceste tendințe pentru dispozitivele mobile reprezintă atât provocări, cât și oportunități. Pe de o parte, trebuie să luăm în considerare varietatea de dispozitive și moduri în care sunt utilizate. Pe de altă parte, acest lucru deschide un set complet nou de domenii de interes în designul UX și asta înseamnă crearea de experiențe pozitive pentru o generație complet nouă de utilizatori.

Cele mai bune practici pentru Mobile UX Design

Designul UX mobil este complicat. După cum sa menționat anterior, trebuie să luăm în considerare atât de multe lucruri, inclusiv lista tot mai mare de dispozitive mobile, modurile în care oamenii interacționează cu ele și faptul că oamenii doresc experiențe consistente și plăcute pe toate tipurile de dispozitive.

Cele 25 de sfaturi Google pentru design UX mobil

În 2015, Google a publicat 25 de bune practici de design UX pentru dispozitive mobile bazate pe cercetări interne. Aceste sfaturi au fost actualizate recent pentru a le aduce mai la zi. Autorul include, de asemenea, un PDF descărcabil cu toate cele 25 de sfaturi, care este plăcut de ținut la îndemână pentru orice proiect UX mobil.

Ghidurile Apple pentru interfața umană

O altă resursă excelentă de ținut la îndemână este Ghidul pentru interfața umană de la Apple pentru designul mobil. Sunt ușor de citit, cu un aspect frumos și pline de cele mai bune practici, sfaturi și principiile de design ale Apple. Pentru designerii mobili UX, aceste linii directoare sunt o resursă excelentă pentru a oferi experiențe de înaltă calitate pentru utilizatori.

Cele mai bune practici suplimentare pentru mobil UX

Iată câteva dintre cele mai bune practici de design UX pentru dispozitive mobile, care ar putea să nu fie la fel de cunoscute ca cele ale Google, dar sunt la fel de importante de luat în considerare pentru designerii de telefonie mobilă.

• Cercetare UX . La un moment dat, s-ar putea să ne simțim înclinați să intrăm direct în machete sau prototipuri, totuși, efectuarea unei cercetări UX adecvate este ceva ce nu poate fi subestimat. Amintiți-vă întotdeauna că „nu ești utilizatorul tău”, iar o experiență pozitivă a utilizatorului se bazează pe o cercetare amănunțită UX în fiecare caz. Iată ghidul cuprinzător al Adobe pentru metodele de cercetare UX pentru referințe suplimentare.
• Dezordinea . Cu toții am experimentat anxietatea unui desktop aglomerat – imaginează-l pe un dispozitiv mobil! Fiecare buton adăugat, imagine, conținut etc., face lucrurile mult mai complicate. Este o idee bună să scăpați de orice dintr-o interfață de utilizare mobilă care nu este absolut necesar. Un sfat grozav este să depuneți eforturi pentru minimalism, dar nu cu riscul unei bune utilizări. Acest lucru se poate realiza adesea prin prioritizarea unei acțiuni principale pe fiecare ecran.
• Prioritizează . Există tendința de a încerca să adăugați cât mai multe funcții posibil. Considerăm că lăsarea a ceva afară va crea cumva o experiență mai mică pentru utilizatori. Dimpotrivă, păstrați caracteristicile foarte concentrate pe baza obiectivelor de bază și perfecționați designul analizând care caracteristici sunt cele mai utilizate, apoi depuneți efortul pentru a face aceste caracteristici atât intuitive, cât și plăcute.
• Atingeți Ținte . Utilizatorii se pot enerva fizic și pot începe să-și lovească dispozitivele mobile atunci când apasă pe ceva și acesta nu răspunde. Un studiu realizat la MIT a constatat că atingeau ceva care avea o țintă tactilă prea mică. Cea mai bună practică este să creați comenzi, butoane, legături etc. (orice țintă tactilă) de cel puțin 7-10 mm, care este lățimea medie a vârfului degetului. De asemenea, este o idee bună să vă asigurați că există o distanță amplă între aceste elemente ale interfeței de utilizare.
• Text lizibil . Deoarece o mare parte din ceea ce fac utilizatorii se bazează pe consumul de conținut, pentru a oferi o experiență consecventă pe toate tipurile de dispozitive mobile, asigurați-vă că alegeți fonturi care funcționează bine în mai multe dimensiuni și greutăți. Dimensiunile fonturilor de cel puțin 11 puncte sunt recomandate pentru a reduce oboseala ochilor. Fonturile curate și ușor de citit, cum ar fi Roboto și Noto de la Google sau noul font San Francisco de la Apple, sunt alegeri excelente de explorat.
• Feedback UI . Aplicațiile bine concepute ne țin informați pe măsură ce interacționăm cu ele. Lipsa unui feedback bun poate deruta utilizatorii și îi poate determina să se întrebe dacă ceva s-a întâmplat, se întâmplă sau de ce s-a întâmplat/nu s-a întâmplat. O bună practică este utilizarea diferitelor forme de feedback (sunet, haptic, vizualizări), bazate pe elementul UI sau starea curentă a aplicației.
• Accesibilitate . Acesta este probabil unul dintre cele mai neglijate aspecte ale designului experienței utilizatorului și mai ales al designului UX mobil. 15% din populația lumii se confruntă cu o formă de handicap. Ghidul de accesibilitate a conținutului web este o resursă disponibilă gratuit și, pentru designerii digitali, este un „must have” ca parte a cutiei de instrumente.

Constrângeri de design UX mobil

Scopul majorității designerilor UX este să ofere experiențe plăcute și să vină cu modele grozave care să atingă atât capacitatea de descoperire (ce acțiuni sunt posibile), cât și înțelegerea (cum ar trebui să fie utilizat produsul). Cu mobil, totuși, există unele constrângeri introduse din cauza dimensiunii, portabilității și a mediilor în care sunt utilizate aceste dispozitive.

Constrângeri de stocare

Când au de-a face cu aplicații mobile native, designerii trebuie să ia în considerare faptul că unii utilizatori pot avea constrângeri de stocare.

O aplicație mobilă, spre deosebire de o aplicație web, utilizează stocarea chiar pe dispozitivul mobil. Acest lucru are un impact asupra designului UX mobil, deoarece introduce limitări potențiale asupra calității video, audio și imagini care pot fi utilizate.

Pentru aplicațiile native, dorim modele UX mobile care țin cont de constrângerile de stocare. Când un utilizator se confruntă cu o limitare de stocare, trebuie să ia decizii grele cu privire la ce să păstreze și ce să ștergă. Face o experiență proastă pentru utilizator atunci când îi forțăm pe utilizatori să fie nevoiți să facă acele alegeri.

Ecrane și comenzi

O altă constrângere cu care ne confruntăm cu designul UX mobil este dimensiunea ecranului și controalele de pe dispozitivele noastre mobile.

Ecranele mobile sunt mai mici: citirea printr-un vizor crește sarcina cognitivă și o face de aproximativ două ori mai greu de înțeles. - Jakob Nielsen, consultant pentru utilizare web.

Cel mai bun mod de a face față ecranelor și comenzilor este de a elimina cât mai multă frecare posibil. Restructurați informațiile, acordați atenție zonelor degetelor mari, reduceți clicurile (în special în cazul comerțului electronic) și acordați atenție procesului de conectare, care poate fi adesea frustrant.

Mediu inconjurator

Cu dispozitivele mobile, există factori de mediu care trebuie luați în considerare pentru designul UX. Utilizatorii sunt supuși renunțării offline-ului mult mai des și aceste situații trebuie luate în considerare în experiența generală a utilizatorului. Cum îi aducem înapoi acolo unde erau? Cum ne asigurăm că nu trebuie să înceapă de la capăt cu ceea ce făceau?

Un alt factor de mediu sunt distragerile. Când ne folosim telefoanele mobile sau tabletele, ne aflăm adesea într-un mediu zgomotos sau aglomerat, ceea ce face dificilă concentrarea. Cum putem asigura o experiență bună pentru utilizator atunci când distragerile concurează pentru atenția unui utilizator? Există modalități prin care putem salva stări și să permitem utilizatorilor noștri să salveze și stări?

Dimensiune mică a ecranului, fereastră unică

O altă constrângere cu care se confruntă designerii cu designul UX mobil este dimensiunea limitată a ecranului. Din această cauză, oamenii pot vedea doar o fereastră la un moment dat, ceea ce limitează enorm experiența utilizatorului.

Există eforturi pentru a încerca să se adapteze „multi-ecran” și „multi-tasking”, dar acestea nu sunt încă norma și vin cu propriile seturi de constrângeri.

Cheia pentru o mai bună UX mobilă cu această constrângere a ferestrei unice este că designul ar trebui să fie autosuficient. Orice lucru care trebuie făcut de către utilizator ar trebui să fie realizabil într-un singur ecran sau fereastră, adică nu ar trebui să părăsească aplicația pentru a găsi informații etc.

Când utilizatorii trebuie să părăsească aplicații sau să deschidă noi ecrane, acest lucru se adaugă la încărcătura cognitivă generală și asta înseamnă că lucrurile devin prea complexe și frustrante.

Cum dețin oamenii dispozitivele mobile

Există o ultimă constrângere de care trebuie să fii conștient: deținerea gadgeturilor noastre. Cum le țin oamenii și ce înseamnă acest lucru pentru designul UX mobil?

Conform cercetărilor realizate de Steven Hoober și prezentate în Design for Fingers, Touch, and People, Part 2, s-a descoperit că oamenii interacționează cu dispozitivele lor în mod diferit, în funcție de modul în care le țin, ceea ce are ulterior un impact asupra designului UX mobil.

Oamenii își țin dispozitivele mobile în mai multe moduri și își schimbă poziția tot timpul. Acest lucru are un impact asupra degetelor pe care le folosesc și asupra modului în care interacționează cu o interfață de utilizare mobilă (vezi mai jos). După cum se dovedește, utilizatorii preferă centrul ecranului și nu le place să facă clic pe elementele care sunt prea aproape de margini.

Iată câteva sfaturi suplimentare pentru UX mobil din cercetările lui Steven:

• Design pentru fiecare utilizator și pentru fiecare tip și dimensiune de dispozitiv mobil
• Design pentru toate modurile în care oamenii lucrează cu dispozitivele lor
• Luați în considerare că utilizatorii preferă să atingă centrul ecranului în majoritatea cazurilor
• Plasați acțiunile cheie în jumătatea din mijloc până la două treimi a ecranului
• Asigurați-vă că degetele și degetele mari nu ascund conținutul
• Elementele selectabile ar trebui să fie suficient de mari pentru a fi atinse confortabil

Lucrul cu Dezvoltatorii

Indiferent dacă lucrează într-un mediu UX agil/lean sau nu, dezvoltatorii sunt cei care trebuie să interpreteze și să implementeze design-urile care au fost atât de atent concepute. Este o idee bună să stabiliți câteva bune practici încercate și adevărate cu dezvoltatorii de la început pentru a vă asigura că proiectele sunt implementate conform intenției. Iată câteva sugestii și sfaturi.

Machete

Când pregătiți și predați machetele, încercați să păstrați numele fișierelor simple, consecvente și descriptive. Acest lucru va economisi mult timp de mers înainte și înapoi. De asemenea, este o idee bună să finalizați toate machetele înainte de a le partaja dezvoltatorilor, astfel încât aceștia să primească o singură versiune a fiecărui ecran. Un alt sfat pentru economisirea timpului este să testați toate interacțiunile cu prototipurile astfel încât acestea să funcționeze și să funcționeze. Instrumente bune pentru partajarea machetelor: InVision și Marvel .

Specificatii functionale

Cea mai mare parte a muncii depuse în calitate de designeri UX implică dezvoltatorii de la începutul proiectului, iar o modalitate excelentă de a facilita o înțelegere continuă a procesului de proiectare și de a crea o linie de comunicare mai bună este prin crearea și utilizarea unui document de specificații funcționale sau a unui „Func. -Spec.”

Documentul Func-Spec este similar cu un plan pe care arhitecții îl creează, cu excepția faptului că este partajat cu dezvoltatorii pe tot parcursul proiectului de design și le permite să înțeleagă cum va funcționa o aplicație sau un site web (vs. cum va arăta interfața de utilizare).

Un exemplu bun de funcționare Func-Spec este prezentat mai jos:

Copie

De obicei, există o mulțime de copii care trăiesc în afara unei machete care trebuie comunicate dezvoltatorilor. Iată o idee pe care o vor aprecia cu siguranță:

După cum sa văzut mai sus, contextul ajută dezvoltatorul să înțeleagă când ar trebui să apară sau să dispară mesajul. Ar trebui să informeze dezvoltatorul ce se întâmplă, astfel încât să nu fie nevoiți să ghicească. Mesajul este copia reală care va apărea. Folosiți copia reală și nu farfurie (adică lorem ipsum). Dezvoltatorii nu vor să fie copywriteri și vrem să facem lucrurile cât mai simple pentru ei.

Specificații

Aceasta este una dintre cele mai importante părți ale comunicării design-urilor cu dezvoltatorii. Iată unde instrumente precum Zeplin și InVision's Inspect strălucesc cu adevărat, deoarece se ocupă de comunicarea specificațiilor precum măsurători, ghiduri de stil, fonturi, fluxul experienței utilizatorului și modul în care funcționează fiecare parte a designului.

Comunicare IRL (în viața reală)

Designerii își iubesc instrumentele. Atât de mult încât poate fi foarte ușor să uiți să ridici telefonul, să inițiezi un apel video sau să mergi la dezvoltatori și să vorbești. S-a economisit mult timp prin simpla întâlnire cu dezvoltatorii după ce am predat o parte a unui design, deoarece orice întrebări sau nuanțe pot fi discutate la fața locului. Acest lucru este adesea uitat, dar dacă face parte din procesul normal de transfer, toată lumea va aprecia timpul pe care îl economisește.

Legând totul împreună

Mobilul nu dispare. În 2016, numărul de utilizatori care accesează web pe un dispozitiv mobil a depășit pentru prima dată utilizarea desktopului. Pentru designerii UX, adoptarea sporită a dispozitivelor mobile și proliferarea diferitelor tipuri de dispozitive vor face ca proiectarea experienței utilizatorului să fie mult mai dificilă.

Din aceste motive, aderarea la un set de bune practici, înțelegerea constrângerilor pe care mobilul le introduce și asigurarea unei relații de lucru fără probleme cu dezvoltatorii vor fi factori cheie în realizarea proiectelor care creează experiențe umane pozitive.

• • •

Citiri suplimentare pe Blogul Toptal Design:

• Principiile designului și importanța lor
• Cele mai bune portofolii de designeri UX – Studii de caz și exemple inspiratoare
• Explorarea principiilor Gestalt ale designului
• Adobe XD vs. Sketch – Ce instrument UX este potrivit pentru tine?
• Cele 10 produse UX pe care le folosesc designerii de top