Sfaturi pentru UX excelent în aplicații web progresive

By jack123 | Tehnologie | 0 Comments

Ați instalat vreodată o aplicație și v-ați gândit că veți rămâne fără memorie sau că mobilul dvs. este deja mult prea plin de diverse aplicații? Poate că sunteți unul dintre acei oameni care dorește să încerce și aplicații de modă, tech, sănătate sau care caută mereu aplicații care să-i ajute să-și controlezei rutina de lucru. 

Sinceri să fim, majoritatea utilizatorilor instalează o aplicație și uită de ea în câteva zile. Aplicația rămâne apoi pe mobil și așteaptă să fie eliminată. Din fericire, companiile de dezvoltare de aplicații mobile au inventat aplicații web progresive. Dacă nu ați auzit încă de ele, vă vom explica.

Ce sunt aplicațiile web progresive?

Aplicațiile web progresive sunt site-uri web care arată și funcționează la fel ca aplicațiile mobile . Motivul pentru care există este de a economisi utilizatorilor problemele descărcării și instalării aplicațiilor pe telefoanele lor mobile. Acestea împiedică utilizatorii să intre în magazinul de aplicații, să găsească aplicația, să o descarce și să o instaleze, apoi să o folosească de câteva ori înainte de a o șterge definitiv.

Cu ajutorul aplicațiilor web progresive, utilizatorii pot pur și simplu deschide browserul de pe smartphone-ul lor, pot introduce adresa URL și vor fi direcționați către PWA a aplicației lor mobile respective. 

Alte avantaje ale aplicațiilor web progresive sunt:

• Au un design web receptiv.
• Se încarcă rapid chiar și fără conexiune la internet.
• Oferă o experiență bună de utilizare .
• Rezolvă problema App Gap.

Aliexpress, Twitter și Forbes sunt câteva exemple celebre de site-uri web care au dezvoltat unele PWA-uri excepționale. Aplicațiile lor web i-au ajutat să își îmbunătățească gradul de utilizare și să atragă mai mulți utilizatori.

Acum, că am înțeles pe deplin conceptul din spatele aplicațiilor web progresive, să aruncăm o privire asupra modului în care o companie de dezvoltare de aplicații mobile poate asigura o experiență excelentă a utilizatorului în aplicațiile web progresive.

Optimizați timpul de încărcare și performanța

Când un utilizator introduce aplicația dvs. web, nu ar trebui să simtă că folosește browserul și nu ar trebui să aștepte încărcarea paginii. Ar trebui să se încarce bine chiar și fără conexiune la internet. Google a recomandat ca aplicația să urmeze modelul PRPL pentru a reduce problemele cauzate de conexiunile lente.

Arhitectura PRPL

PRPL este modelul folosit pentru a structura site-urile web și aplicațiile pentru a funcționa bine pe smartphone-uri și alte dispozitive, fără probleme în rețelele nesigure. Arhitecturile PRPL:

• împing resursele critice către calea URL inițială
• redau calea inițială
• verifică în prealabil rute rămase

Modelul PRPL servește pentru a îmbunătăți timpul de răspuns al aplicației dvs. web, în special în primele interacțiuni ale celor mai comune dispozitive mobile. PRPL continuă să îmbunătățească eficiența aplicațiilor web progresive pe măsură ce sunt lansate noi actualizări și cache-ul devine mai eficient.

Cache cu lucrătorii de service

Lucrătorii de service sunt o caracteristică uimitoare a platformei web care permite caracteristici, cum ar fi stocarea răspuns cache la adresa URL . Această funcționalitate permite aplicațiilor web progresive să funcționeze offline.

Serviciile lucrătorilor vă permit să salvați cereri ca script – uri, fișiere CSS, pagini, imagini, etc . ca date cache. Atunci când un utilizator face o solicitare online, trece prin lucrătorul de service și dvs. decideți să returnați răspunsurile memorate în cache sau să răspundeți la cerere online.

Redarea pe partea de server

Google recomandă utilizarea redării pe partea de server pentru aplicații web progresive, deoarece înseamnă că utilizatorul va obține datele mai rapid, chiar dacă JavaScript este dezactivat. Când un utilizator intră în aplicația dvs. web progresivă, nu ar trebui să simtă că folosește browserul.

Concentrați-vă pe recrearea nativului

Amintiți-vă că un aspect PWA ar trebui să arate și să se simtă ca aplicația dvs. mobilă nativă . De ce? Pentru că simțirea familiarității este o caracteristică esențială a aplicațiilor web progresive.

Să luăm exemplul Instagram-ului. Utilizatorii sunt obișnuiți cu design-ul, funcționalitatea și navigarea aplicației. Dacă Instagram ar crea un design PWA care funcționează și seamănă mai mult cu site-ul, de ce ar dori oamenii să petreacă timp pe el? Acest lucru ar merge împotriva așteptărilor lor și probabil că vor reveni la aplicație.

Nu uitați să evitați următoarele erori dacă doriți ca utilizatorii dvs. să aibă o experiență optimă.

Probleme de scroll

Site-urile web uneori au probleme cu derularea/scroll-ul, cum ar fi paginile goale care apar atunci când parcurgeți un site infinit, cum ar fi Twitter. Twitter a rezolvat problema de derulare folosind liste virtuale.

Listele virtuale fac vizibile partea de conținut care se află în punctul de vedere al utilizatorului. Dincolo de acest punct de vedere, acesta dezvăluie în mod incremental elemente din mai multe cadre utilizând API requestAnimationFrame, păstrând în același timp poziția de derulare pe ecrane. Mai mult, când proiectați o aplicație web progresivă, nu uitați că ar trebui să aibă aspectul unei aplicații mobile native.

Probleme de tranziție în rețea

Când creați PWA-uri, asigurați-vă că aveți un design pentru un răspuns agil. Aplicația dvs. web trebuie să răspundă la interacțiunea utilizatorului. Problemele de tranziție în PWA apar atunci când utilizatorii ating un buton sau un link, trebuie să aștepte și să se uite la ecranul pe care se află înainte de a fi redirecționat brusc către noul ecran de conținut.

Acest lucru lasă clientul să se simtă fără răspuns și enervat, în timp ce într-un PWA ar trebui să se simtă ca și cum toate informațiile sunt deja stocate pe telefon și datele pot fi accesate instantaneu. Pentru a preveni acest lucru, puteți încorpora afișaje de schelet în PWA. Ecranele schelet sunt practic ecrane goale care sunt afișate utilizatorului după o interacțiune.

Gesturi necunoscute

Faceți navigarea să fie cât mai simplă și cât mai aproape de aplicația nativă. După cum sa menționat mai sus, ar trebui să faceți un design în concordanță cu așteptările utilizatorilor, păstrând în același timp familiaritatea.

Incorporează surse de sistem

Cea mai bună modalitate de a adăuga un sentiment de familiaritate aplicației dvs. web progresive este printr-un design care se potrivește cu sistemul de operare (OS) al utilizatorului. Puteți începe prin implementarea fonturilor de sistem pentru sistemele de operare individuale, iOS, Windows, Android etc.

Folosirea Google (Roboto) , Apple (San Francisco), Microsoft (Segeo) și altele vă pot ajuta în mod eficient să îmbunătățiți experiența de utilizare a aplicației dvs. mobile . Dacă doriți să fiți creativi, puteți utiliza fonturi personalizate în titluri sau sigle.

Optimizați interacțiunile de conținut

Datorită limitării spațiului pe dispozitivele mobile, designerii trebuie să fie foarte atenți pentru a evita saturația conținutului. Spațiile înguste pot provoca comportamente nedorite, cum ar fi deschiderea accidentală a unui articol atunci când derulați o listă.

De exemplu, în Google Chrome, chiar și o simplă atingere pe un anumit conținut ar putea fi interpretată ca o interacțiune. Poate fi o experiență destul de enervantă pentru utilizatori dacă atingerea „conținutului simplu” se transformă în selecții și redirecționează utilizatorii către rezultate nedorite.

În plus, proiectarea butoanelor radio și a conținutului interactiv ca text simplu poate fi, de asemenea, o experiență extrem de confuză pentru utilizator. Puteți preveni acest lucru utilizând CSS pentru a marca elemente fără conținut.

De asemenea, dacă PWA necesită interacțiuni tactile avansate, cum ar fi glisarea pentru a renunța la un meniu de navigare, puteți face acest lucru posibil, dar va trebui să vă asigurați că funcționează ireproșabil pe dispozitive reale.

Concluzie

Cu ajutorul unor strategii precise de dezvoltare și proiectare, veți oferi o experiență de utilizator de neuitat în aplicațiile dvs. web progresive. Aplicațiile web progresive au fost întâmpinate cu brațele deschise chiar de Google, deci sunt cu siguranță următorul lucru important din perspectiva utilizatorului și a afacerii. Sperăm că acest articol a clarificat unele dintre îndoielile dvs., dacă nu, nu ezitați să ne întrebați, vom fi bucuroși să vă ajutăm.