Share
Aveți probleme la alegerea pictogramei corecte pentru o anumită problemă? Colaborați cu dezvoltatorul dvs. pentru a obține cel mai bun rezultat posibil pentru clientul dvs.? Acest articol vă va oferi o perspectivă asupra principiilor, rezolvării de probleme și a colaborării necesare pentru a veni cu ceva care se potrivește!
Icoanele sunt printre cele mai importante aspecte vizuale ale designului web. Nivelul de detaliu, stil și aplicare depind de o serie de lucruri diferite. Recent am lucrat la un număr de site-uri care necesită icoane foarte specifice pentru a comunica metafore subtile.
Această postare va trece printr-un exemplu recent, în care am fost obligat să creez o pictogramă de avertizare pentru o stare de eroare a documentelor. Acesta va fi un ghid liniar al procesului meu de gândire și a colaborării cu dezvoltatorul, dar și la următoarele etape de ghidare: -
Acest post nu ar trebui să fie cuprinzător, dar vă va aduce beneficii prin plimbarea printr-un exemplu real al lumii.
Uneori veți construi site-ul dvs. de la zero și trebuie să generați o serie de icoane pentru a comunica anumite lucruri vizual. De multe ori veți avea o cerere venită de la un dezvoltator sau client pentru o pictogramă unică. Solicitarea din acest exemplu a venit de la un dezvoltator. Avea nevoie de o pictogramă de stare de eroare pentru un document. La început, el a sugerat o pictogramă întunecată cu un X în spatele ei pentru a fi folosit în cazurile în care un tip de document nu este acceptat sau un document nu reușește să se încarce din anumite motive. Avea în minte așa ceva:
Nu-i rău? L-am dezbrăcat puțin și i-am trimis asta ...
Dar, am fost de acord că este necesar să se facă referire la pictograma documentului într-un fel, deoarece era specific pentru o eroare de încărcare a documentelor.
A trebuit să luăm în considerare setul de pictograme ca întreg, așa că l-am lovit cu alte câteva idei în jur.
"Și pictograma" alerte "?
ne-am gandit. Dar asta era deja folosit pentru alerte clinice.
Atunci când se ocupă de un set complet de pictograme, este important să aveți o înțelegere a setului de icoane. În caz contrar, este posibil să reutilizați din greșeală o metaforă care a fost deja folosită în altă parte.
Apoi am considerat pictograma documentului cu un triunghi în jurul său:
Aceasta a fost doar o sugestie din partea lui dev, dar experiența mi-a spus că era prea complexă. A făcut o metaforă incomodă, care nu comunicase suficient de direct.
Apoi am făcut sugestia că ar trebui să folosim un "X" mare într-un cerc.
Și acest lucru nu era optim, deoarece mesajul comunicat era unul dintre ele Pericol! Probabil a fost prea mult peste partea de sus.
Lecția de aici este să țineți cont de contextul icoanei voastre. Culoarea și greutatea vizuală reprezintă o modalitate importantă de a comunica acest lucru. De exemplu, roșu este folosit în mod tradițional pentru a avertiza oamenii, în timp ce culorile mai deschise ca gri sunt mai neutre și Sub - comunică că totul este în regulă!
Sub-comunicarea este un limbaj semiotic; ceva care este, de asemenea, eminent în tipografie.
De exemplu, un font decorativ sub-comunică un caracter feminin, în timp ce un font desenat manual poate sub-comunica ceva mai jucaus și copil.
Ce încerci să subcomunicați cu pictograma ta?
De exemplu, cu pictograma de eroare a documentului, am încercat să reamintesc mesajele de eroare care au sub-comunicat într-un mod care nu a generat prea multă panică.
Mi-am amintit de mesajele de eroare pe care le-aș primi când conexiunea la internet a scăzut; ele erau perfecte. Nu prea mult peste partea de sus, dar lăsând subtil utilizatorul să știe că ceva este greșit.
În mod clar, direcția cea bună.
Ultimul exemplu din browserul Chrome a fost perfect pentru ceea ce aveam nevoie! Subtil, dar permițând utilizatorului să știe că ceva nu este în regulă. Totul, de la mărimea pictogramei până la culoarea gri, ajută utilizatorul să înțeleagă gravitatea problemei, dar nu este atât de sus, încât să provoace panică.
Pictograma finală creată în acest caz a fost simplă, dar a comunicat și mesajul potrivit.
Arta folosirii icoanelor este ceva care are nevoie de un pic de experiență și un ochi de design, dar poate fi abordat prin respectarea unor principii, cum ar fi cele discutate. Dacă pictograma dvs. este prea ambiguă, dar se potrivește metaforă, atunci luați în considerare utilizarea unei etichete ca indicii vizuale pentru a ajuta utilizatorii să identifice informațiile. Vă mulțumim pentru lectură, nu ezitați să împărtășiți propriile experiențe de design icoane în comentarii!
Accentsconagua