Câteva aplicații web au început să utilizeze pictograme la nivel de gri (negru), de exemplu Github, Google Analytics nou etc. Chiar și aplicații precum Firefox 4, Chrome , IE9, iTunes, Mac OS, au renunțat la pictograme colorate.
Care este raționamentul din spatele trecerii de la pictograme colorate la pictograme în tonuri de gri / monocrom?
Exemple:
- Pictogramă setări Google Analytics
- Github (uitați-vă la butoanele cu pictograme din dreapta sus)
- iTunes 10 a trecut la pictogramele monocrome
Actualizare: se pare că Apple l-a introdus prima dată în Aqua sub Proiectarea pictogramelor pentru comenzile barei de instrumente în stil dreptunghiular :
Pictogramele care arată bine în comenzile din bara de instrumente în formă dreptunghiulară sunt imagini simplificate, negre, care transmit semnificație prin contur și contur, nu prin detalii interne. Deoarece pictogramele dvs. ar trebui să facă ecou aspectului imaginilor Mac OS X existente în interiorul comenzilor din bara de instrumente în stil dreptunghiular, utilizați ca ghid imaginile șablon furnizate de sistem. Pe măsură ce proiectați o pictogramă pentru un control al barei de instrumente în formă dreptunghiulară, țineți cont de următoarele puncte:
- Faceți conturul clar și clar
- Utilizați o perspectivă directă
- Folosiți negru complet și câteva nuanțe de gri pentru a sugera dimensionalitatea
- Utilizați anti-aliasing
- Asigurați-vă că imaginea este centrată vizual în control (rețineți că vizual centrat s-ar putea să nu fie același cu centrat matematic)
Pictogramele pentru controalele barei de instrumente în formă dreptunghiulară de dimensiuni normale nu ar trebui să măsoare mai mult de 19 x 19 pixeli.
Comentarii
- Puteți oferi o imagine a ceea ce vorbiți? Tocmai m-am uitat la Google Analytics și nu ' nu văd nimic asemănător cu ceea ce spui.
- Ne pare rău pentru asta. Actualizarea postării cu două linkuri! Iată câteva altele: Firefox 4 mozilla.com/en-US/firefox/features Chrome (uită-te la spate / înainte / acasă / favorite) google.com/chrome Itunes apple.com/itunes/what-is/player.html
- Întrebare bună și mulțumiri pentru actualizare. +1 și un alt +1 pe care îl tăiați și lipiți actualizarea într-un răspuns nou. 🙂
Răspuns
Cred că această tendință a venit împreună cu ideea separării conținutului și a prezentării. Pictogramele fac parte din chrome / ui și nu ar trebui să fie prea evidente pentru a nu concura cu conținutul în sine.
Un alt motiv poate fi acela că este mai ușor să atragi atenția asupra unui element atunci când este doar una cu o pictogramă colorată și orice altceva este în tonuri de gri. De exemplu, o pictogramă verde de lacăt în log în combinație cu pictogramele meniului în tonuri de gri. A face ceva pop-out într-un grup de elemente colorate necesită mult mai multă abilitate și timp pe măsură ce trebuie să gândiți-vă la mult mai mult decât la culoare (care nu mai joacă rolul principal în atragerea atenției utilizatorului).
Comentarii
- Exact ceea ce eu avea să spună. Google Chrome este un exemplu perfect prin faptul că a fost conceput pentru a ieși din cale. Bara de sus, butoanele, pictogramele sunt toate monocrome și condensate frumos. Așadar, interfața de utilizare Chrome nu ' nu fură prea multă atenție din pagina web pe care ' reîncercați să o priviți. Și am ' am observat că Microsoft are o filozofie similară cu IE9.
- Partea care mă înfurie (dată fiind Microsoft ' ultimul anunț blogs.msdn.com/b/visualstudio/archive/2012/02/23/… ) este că acest lucru funcționează numai pentru anumite tipuri de interfețe de utilizator, în special cele care nu au ' t au o sută de butoane, vederi de copac și panouri pe toată interfața. Când vor începe proiectanții de interfață de utilizare să-și dea seama că aceasta este doar o metaforă de proiectare foarte specifică și nu o modă grozavă? Pictogramele colorate funcționează atunci când există multe pictograme de văzut.
Răspuns
- De multe ori arată bine , indiferent de aspect, astfel încât să le puteți păstra dacă aspectul se schimbă.
- Puteți combina icoane din diferite surse (The Noun Project, simboluri fonturi, pictograme existente utilizate pe platforme precum iPhone etc.) , deoarece acestea arată în mare parte similare.
- Este ușor să-ți faci propriile.
Personal, cred că este, în general, o tendință proastă. Creierele noastre procesează culoarea cu precauție (înainte chiar să o vedem în mod conștient); „suntem foarte buni la sarcini precum„ găsim pictograma roșie într-o listă de icoane colorate. „Nu suntem atât de buni la o sarcină precum„ găsim icoana care arată ca un camionet într-o listă de icoane negre ”. Dacă faceți toate pictogramele aceeași culoare, produsul dvs. este mai greu de utilizat.
Desigur, există excepții.