Scriitorul și expertul în usability Jared Spool spunea: “Good design, when it’s done well, becomes invisible. It’s only when it’s done poorly that we notice it / Un design bun este atunci când nici nu îl observi. Doar atunci când este realizat greșit, ajungi să îl vezi”.

Dar cum îți dai seama ce înseamnă un design bun și unul nepotrivit? Și ce poți face pentru ca soluțiile pe care le alegi să fie cele corecte? Mai jos găsiți  3 exemple de Bad Design vs. Good Design din care putem învăța:

1. Ce informații alegi să oferi

Greșit: Semnele de parcare din Los Angeles. – Atunci când ne gândim la exemple de “prea multă informație”, ne vin în minte semnele de parcare din Los Angeles. Asta pentru că nu am vrut să aducem niciun exemplu local, ca să nu trezim discuții care nu își au rostul 🙂

Să revenim la semnele noastre de parcare. De ce nu sunt potrivite aceste bine gândite? Simplu: pentru că dau prea multe informații.

Corect: Semnul de parcare creat de Nikki Sylianteng – Rămând în același domeniu, am ales un semn de parcare creat de designer-ul american Nikki Sylianteng. De ce este unul eficient? Pentru că Nikki și-a dat seama că șoferii nu vor să afle decât dacă pot să parcheze în acel loc. Vor un răspuns simplu: da sau nu.

Mai mult decât atât, designer-ul ales de ea folosește visualuri, în locul textelor, iar lucrul acesta ajută la înțelegerea mai rapidă a informațiilor care sunt foarte intuitive: verde – OK, roșu – No Parking.

Ce înțelegem din acest exemplu?

• Un design bun se bazează pe înțelegerea nevoilor utilizatorilot tăi. Doar în acest fel vei putea știi ce informații să le oferi și ce poți evita.
• În plus, atunci când ai prea multe informații de spus poți folosi vizualuri în locul textelor.

Citește și: 10 blog-uri de design pe care ar fi bine să le urmărești

2. Cum structurezi navigația website-ului

Greșit: LazorOffice.com – De ce am ales acest site ca exemplu negativ? În primul rând pentru că folosește un tip de navigație numită Mystery Meat Navigation (MMN). Acesta presupune că un link nu este vizibil decât dacă userul pune cursorul deasupra lui sau dă click pe el, reducând astfel aproape de zero posibilitatea descoperirii sale. Mai mult decât atât, LazorOffice.com folosește o altă soluție pe care ar trebui să o evite orice UX – butonul “Click to find out!” de la finalul imaginii.

Corect: Interaction Design – Din fericire, problemele impuse de MMN pot fi foarte ușor de rezolvat. Ce trebuie să faci este să adaugi link-uri foarte ușor de descoperit. Poate chiar adaugarea unui efect de tipul “View project” care să se activeze la mouse hove ar putea să le rezolve problemele celor de la Lazor Office. Î

În exemplul ales de noi, cei de la Interaction Design Foundation au butonul “View Course” la finalul fiecărui card și, de asemenea, pentru a maximiza usabilitatea site-ului au la hover textul “Go to course”.

Ce înțelegem din acest exemplu?

Întotdeauna folosește o modalitate vizibilă de a evidenția link-urile inserate în site.

Citește și: Cele mai bune 5 sfaturi pentru un designer la început de drum

3. Cum alegi efectele potrivite

Greșit: iFly50.com – Alegerea efectelor trebuie să fie făcută cu foarte mare grijă. Uneori ne lăsăm purtați de gândul de a încerca ultimele inovații și uităm că obiectivul nostru este să îi oferim utilizatorului o experiență ușoară, plăcută și eficientă. Cel mai important lucru atunci când alegem să încercăm ceva nou este să îl testăm înaininte. Dacă nouă ne este ușor de folosit, atunci putem merge mai departe.

Un exemplu de așa nu, vine de la iFly50.com – un site aniversar realizat de KLM – care a ales să folosească un scrolling vertical, iar pentru fiecare dintre cele 50 de destinații era adăugat un buton în care userul era rugat să dea click și să țină apăsat buzonul pentru câteva secunde. O alegere foarte nepotrivită de UX și una care îngreunează foarte tare atât experiența utilizatorului, cât și încărcarea site-ului:

Corect: Elastic Scrolling @ iOS – Alegerea atentă a efectelor poate aduce, însă, plusul de care are nevoie design-ul tău pentru a fi unul cu adevărat spectaculos și eficient. Una dintre cele mai interesante inovații aduse de Apple în sistemul lor de operare este creare unui tip de scrolling elastic, așa cum puteți vedea mai jos:

Ce înțelegem din acest exemplu?

Ai grijă ce efecte folosești și testează-le întotdeauna înainte.