Share
Recent, am publicat un articol despre impactul curent al schimbării pe comprimarea tabletelor în designul web. Aceasta este o schimbare majoră pentru industria tehnologică, dar și pentru designerii de web care sunt acum încurajați să ia în considerare compatibilitatea platformei tabletelor. Cu toate acestea, în același timp, există o altă schimbare: o tranziție de la interfețele orientate spre mouse-ul către cele orientate spre aplicații.
O aplicație web este, pur și simplu, o aplicație care se bazează pe o conexiune la internet pentru a funcționa. Nimic nu este stocat local și totul este în nor. Există o serie de avantaje în acest sens: totul este accesibil pretutindeni, există probleme de performanță reduse, defectarea unității de hard disk nu înseamnă pierderea muncii și cele mai multe sunt cross-platform. Prin urmare, pentru dezvoltatorii de aplicații, aceasta este o propunere atractivă care ar putea însemna că aplicațiile sunt disponibile pentru un segment mai larg al publicului lor potențial.
Există o diferență distinctă între o rețea web aplicaţia și o rețea webteren. Totuși, această dezbatere nu este subiectul articolului. În schimb, vom analiza o altă schimbare în design-ul web ca și aplicația centrică, designul cu mai multe platforme devine mult mai popular și totul, de la navigare la formulare, este afectat.
Aceasta este, probabil, cea mai mare importanță în această schimbare. Cazul cu orice aplicație este că trebuie să fie cât mai simplu cu putință pentru a nu frustra un utilizator. Totuși, fiecare aplicație are un scop și un obiectiv de realizat în urma interacțiunii unui utilizator. Prin urmare, aplicațiile web trebuie să se concentreze asupra funcțiilor cheie mult mai mult decât un site web convențional.
Pagina de pornire a Facebook-ului când ați ieșit. Acest accent este evident nu numai în cadrul aplicațiilor web în sine, ci și în paginile lor de tip splash înainte de autentificare. Dacă luăm Facebook ca exemplu, cea mai mare parte a paginii este formularul de înregistrare, deoarece aceasta este scopul principal al paginii: câștiga mai mulți utilizatori.
Există, de asemenea, o rotație secundară orientată către utilizatori pe această teorie. De exemplu, dacă o persoană completează un formular pe pagina web, există o șansă mică în care va dori să reseta formularul respectiv. Șansa de a-și scrie numele exact pentru prima dată este mai mare și, prin urmare, ar trebui să existe un accent mai mare pe butonul de depunere.
Formularul de conectare al lui ThemeForest are un buton de depunere destul de mare, deoarece aceasta este acțiunea pe care majoritatea utilizatorilor vor să o ia. Cu toate acestea, există, de asemenea, link-urile "Forgot Password / Username" pentru cei care au nevoie de ele, dar acestea sunt mai mici.
Această idee este o tulpină a ierarhiei vizuale în sensul că obiectivul principal al unei pagini web este elementul cel mai proeminent și mai vizibil pe acea pagină.
O altă consecință este o creștere a unui anumit stil de design al aplicațiilor web în sine. Ați întâlnit vreodată un site web care pare să aparțină docului dvs. (sau meniul Start dacă sunteți pe Windows)? Ei bine, există câteva exemple care fac ca o aplicație web să pară nativă pe platforme într-un mod elegant, prin utilizarea unei varietăți de gradienți și umbre frumoase.
Nu numai că acest lucru este evident în aplicațiile web destinate utilizării desktop-ului, dar și în aplicațiile mobile. Mulți dezvoltatori mai mici aleg să creeze aplicații web mobile peste aplicații native pentru a economisi costuri și curbe de învățare. Această metodă funcționează nu numai cu crearea de aplicații web originale, ci și cu popularizarea unor teme populare, cum ar fi WordPress (așa cum descrie sesiunea MobileTuts +).
Arătați utilizatorului ce are nevoie, nu tot ce nu are.
A fost un moment în care, dacă doriți să efectuați o acțiune într-o aplicație web complexă, va trebui să parcurgeți și să treceți prin mai multe "nivele" diferite înainte de a realiza un astfel de lucru. Cu toate acestea, cu navigarea specifică contextului, acest proces este mult mai simplu. Teoria generală din spatele ei este că un utilizator nu are nevoie de acces la fiecare opțiune în fiecare moment și că numai aceia care sunt relevanți pentru situația sa actuală ar trebui să fie arătați.
Acest tip de navigare specific scenariului este, în general, realizată prin utilizarea navigației de nivel secundar. Cea mai apropiată analogie care nu se bazează pe web pe care pot să o vină este spre Microsoft Office și cum folosește o structură de panglică pentru uzabilitate. Secțiunile cheie sunt intitulate și la un simplu clic al mouse-ului, toate opțiunile relevante apar.
O modalitate simplă de a înscrie acest lucru este să îi arătăm utilizatorului ce are nevoie, nu tot ce nu are. Și aceeași teorie bazată pe context poate fi aplicată și altor elemente cum ar fi casete modale pop-up care afișează elementele necesare doar dacă utilizatorul o vrea.
Microsoft Office este un exemplu de utilizare pe scară largă a unui meniu contextual. Acest lucru pare să fie un pic o scădere de la subiectele discutate anterior, dar aceste trei elemente pot avea un impact mare asupra unui design web. Adăugarea de umbre la un buton, de exemplu, face să fie popout și aproape se desprinde ca un design care nu mai este plat.
Luați în considerare adăugarea umbrelor într-o fereastră modală și analizați modul în care acestea creează un sentiment de definiție între conținutul original și noul cadru. Doar asta poate face ca un site să pară mai interactiv, deoarece devine multi-strat ca o aplicație nativă. Apoi, luați în considerare efectele ca opacitate schimbări de conținut în circumstanțe diferite pentru a crea o dimensiune globală nouă pentru conținutul în sine.
Optarea pentru pante poate avea, de asemenea, un impact durabil asupra unui proiect final. La fel ca gradienti construi, design-ul doar "apare" mai mult și pare 3D atunci când este utilizat în unison cu umbra interior.
Observați cum arată imaginea corectă că are două straturi, în timp ce cea din stânga nu are. Deoarece o aplicație web este menită să se comporte ca o bucată de software care rulează la nivel local, un sentiment al tuturor lucrurilor împreună este extrem de important. Iar dezvoltatorii principali pot comunica acest sens prin design. Aș provocați să găsiți o aplicație web care are întreaga interfață cu utilizatorul fiind construită cu elemente de stoc HTML pure, fără stil personalizat.
Nu puteți? Nici o surpriză acolo! De fapt, desenele web sunt menite să aibă un stil consistent în întreaga și în aplicațiile web, utilizarea controalelor și a zonelor de intrare sunt elemente importante de luat în considerare. Ceva la fel de simplu ca adăugarea unei culori de fundal personalizate și suprascrierea marginii unui buton de depunere poate avea un impact enorm în unitatea designului dvs..
Observați în captura de ecran GMail cum doar stilul meniurilor și butoanelor cu taste cheie "se potrivesc doar" cu designul general. Oh și da, am o comandă de la magazinul Angry Birds! ; P
Restul elementelor stoc este un lucru, dar crearea de noi este chiar mai bună. Luați MyBankTracker ca un exemplu care utilizează un glisor personalizat, care încă se potrivește cu designul lor alb și albastru.
În timp ce cercetăm o perspectivă alternativă asupra designului aplicațiilor web, am găsit un citat interesant de la fostul executor de marketing Microsoft Office, Chris Capossela, unde a spus ceva de genul: "Când am întrebat [ce caracteristici au vrut utilizatorii în] Office, de nouă ori din zece, au numit ceva deja în produs, nu au putut găsi ". Acest tip de legături revin ideii de navigație optimizată în funcție de situație.
Când am întrebat [ce caracteristici le-au dorit utilizatorii în] Office, de nouă ori din zece, au numit ceva deja în produs; tocmai nu au găsit-o.
Faptul este, dacă încercați să strângeți o mulțime de caracteristici într-un spațiu mic, fiecare caracteristică devine mai puțin semnificativă. Și utilizatorul va petrece mult mai mult în căutarea funcției pe care o doresc. Și utilizatorul va fi frustrat. Și utilizatorul va pleca. Nu vrei asta. Pentru a pune acest lucru într-o perspectivă mai bună, încercați să reduceți rezoluția afișajului la cel mai mic posibil și să lansați cea mai mare aplicație intensivă pe care ați instalat-o. Încearcă să-l folosești și îmi vei prinde driftul după aceea.
O altă sugestie este să ascultați utilizatorii, dar nu prea mult. Pe măsură ce utilizatorii solicită tot mai multe funcții, puteți deveni înclinați să aruncați noi opțiuni aici și acolo.
Depășind ceea ce ar trebui / puteți folosi, să trecem peste doar trei lucruri importante pe care le faceți nu ar trebui atunci când lucrați la un UI bazat pe aplicații.
Imaginați-vă că ați întâlnit pe cineva pe stradă. Le întrebați unde este cel mai apropiat Starbucks și care răspund într-o altă limbă. Se pare că ați luat un cuvânt pe care îl percepeți ca fiind un înrudit, dar se dovedește a fi greșit și are un înțeles complet deformat. Asta suna cam mult timp pentru o anologie, dar punctul pe care încerc să-l subliniez este că ai putea percepe ceva din cauza limbii tale naturale, dar designerul ar putea să viseze la ceva complet diferit. De exemplu, dacă generați rubricile dvs. ca niște butoane, utilizatorul ar putea să încerce să facă clic pe el, considerând că face parte din aplicația web și poate continua să se simtă frustrat de lipsa de funcții și de confuzie.
Prima mea post aici de la WebDesignTuts + a discutat validarea formularului și importanța acestuia pentru utilizatori. În calitate de utilizator, aș vrea să știu ce greșesc dacă nu pot lucra cu aplicația dvs. și este întotdeauna recomandat să construiți spațiu pentru feedback de la început.
Neconcordanța în proiectare este o experiență frustrantă deoarece, așa cum un utilizator se obișnuiește cu un mod de a face lucrurile, se confruntă cu altul. Un exemplu foarte simplu este pe Expedia unde calendarul de plecare și de întoarcere schimbă luni când selectați o dată.
Iată o listă scurtă de șase site-uri web și aplicații web care demonstrează în mod clar unele dintre principiile de proiectare pe care le-am discutat în acest articol de la designul aplicației native la accentul cheie.
Pentru a rezuma acest articol, există o influență clară asupra webului din aplicațiile tradiționale, native. Cu toate acestea, fiecare decizie de proiectare care implică aplicații web duce la uzabilitate. Aplicațiile trebuie să fie simple, trebuie să aibă accent pe funcțiile cheie, astfel încât un utilizator să treacă ușor prin site.
.
Accentsconagua