En hel del webapplikationer er begyndt at bruge grå (sort) skala ikoner, for eksempel Github, ny Google Analytics osv. Selv applikationer som Firefox 4, Chrome , IE9, iTunes, Mac OS, har droppet farverige ikoner.

Hvad er ræsonnementet bag skiftet fra de farverige ikoner til gråtoner / monokrome ikoner?

Eksempler:

Opdatering: Det ser ud til, at Apple først introducerede det i Aqua under Designe ikoner til værktøjslinjekontrol i rektangulær stil :

Ikoner, der ser godt ud i værktøjslinjekontroller i rektangulær stil, er strømlinede, sorte billeder, der formidler mening gennem kontur og kontur, ikke interne detaljer. Da dine ikoner skal ekko udseendet af de eksisterende Mac OS X-billeder inden i kontrolpaneler i rektangulær stil, skal du bruge de skabelonbilleder, der leveres af systemet, som en vejledning. Når du designer et ikon til en værktøjslinjekontrol i rektangulær stil, skal du huske følgende punkter:

  • Gør omridset skarpt og klart
  • Brug et lige perspektiv
  • Brug fuld sort og et par gråtoner for at antyde dimensionalitet
  • Brug anti-aliasing
  • Sørg for, at billedet er visuelt centreret i kontrolelementet (bemærk, at visuelt centreret er muligvis ikke det samme som matematisk centreret)

Ikoner til kontrol i værktøjslinjens regulære størrelse i rektangulær stil må ikke måle mere end 19 x 19 pixels.

Kommentarer

  • Kan du give et billede af det, du taler om? Jeg kiggede bare på Google Analytics og kunne ikke ' ikke se noget som det, du siger.
  • Undskyld for det. Opdateret indlægget med to links! Her er et par flere: Firefox 4 mozilla.com/en-US/firefox/features Chrome (se på bagsiden / fremad / hjem / favoritter) google.com/chrome Itunes apple.com/itunes/what-is/player.html
  • Godt spørgsmål og tak for opdateringen. +1, og en anden +1 klipper du og indsætter opdateringen i et nyt svar. 🙂

Svar

Jeg tror, at denne tendens kom sammen med ideen om adskillelse af indhold og præsentation. Ikoner er en del af krom / ui og bør ikke være for iøjnefaldende for ikke at konkurrere med selve indholdet.

En anden grund kan være, at det er lettere at tiltrække opmærksomhed på et element, når det er kun en med et farverigt ikon, og alt andet er gråtoner. For eksempel et grønt logon-hængelåsikon i kombination med gråtoner-menuikoner. At lave noget pop-out i en gruppe farverige elementer tager meget mere dygtighed og tid, som du skal tænk på meget mere end bare farve (som ikke længere spiller den primære rolle i at tiltrække brugerens opmærksomhed).

Kommentarer

  • Præcis hvad jeg ville sige. Google Chrome er et perfekt eksempel, fordi det var designet til at komme ud af vejen. Den øverste bjælke, knapper, ikoner er alle monokrome og kondenseret pænt. Så Chrome UI stjæler ikke ' t for meget opmærksomhed fra den webside, du ' forsøger at se på. Og jeg har ' bemærket, at Microsoft har en lignende filosofi med IE9.
  • Den del, der gør mig rasende (givet Microsoft ' s seneste meddelelse blogs.msdn.com/b/visualstudio/archive/2012/02/23/… ) er, at dette kun fungerer for visse typer brugergrænseflader, især dem, der ikke ' t har hundrede knapper, trævisninger og paneler over hele grænsefladen. Hvornår vil UI-designere begynde at indse, at dette bare er en meget specifik designmetafor og ikke noget seje mode? Farvede ikoner fungerer, når der er mange ikoner, der kan ses.

Svar

  • De ser ofte godt ud uanset layout, så du kan beholde dem, hvis layoutet ændres.
  • Du kan kombinere ikoner fra forskellige kilder (Substantivprojektet, symbolskrifttyper, eksisterende ikoner, der bruges på platforme som iPhone osv.) , da de for det meste ligner hinanden.
  • Det er nemt at gøre dit eget.

Personligt synes jeg det generelt er en dårlig tendens. Vores hjerner behandler farve forsigtigt (før vi endda bevidst ser det); vi er rigtig gode til opgaver som “finder det røde ikon på en liste over farvede ikoner.” Vi er ikke så gode til en opgave som “find det ikon, der ligner en lille lastbil på en liste med sorte ikoner.” At gøre alle ikoner til samme farve gør dit produkt sværere at bruge.

Der er selvfølgelig undtagelser.

Skriv et svar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *