Melko harvat verkkosovellukset ovat alkaneet käyttää harmaasävyisiä (mustia) asteikkokuvakkeita, esimerkiksi Github, uusi Google Analytics jne. Jopa sovellukset, kuten Firefox 4, Chrome , IE9, iTunes, Mac OS ovat pudottaneet värikkäitä kuvakkeita.
Mikä on syynä siirtymiseen värikkäistä kuvakkeista harmaasävy- / yksivärisiin kuvakkeisiin?
Esimerkkejä:
- Google Analytics -asetuskuvake
- Github (katso oikean yläkulman kuvakepainikkeita)
- iTunes 10 siirtyi yksivärisiin kuvakkeisiin
Päivitys: Vaikuttaa siltä, että Apple esitteli sen ensin Aquassa kohdassa Kuvakkeiden suunnittelu suorakulmaisille työkalupalkin ohjaimille :
Kuvakkeet, jotka näyttävät hyviltä suorakaiteen muotoisissa työkalurivin ohjaimissa, ovat virtaviivaisia, mustia kuvia, jotka välittävät merkityksen ääriviivojen ja muotojen kautta, ei sisäisten yksityiskohtien kautta. Koska kuvakkeiden tulisi toistaa olemassa olevien Mac OS X -kuvien ulkonäkö suorakaiteen muotoisissa työkalurivin ohjaimissa, käytä järjestelmän toimittamia mallikuvia oppaana. Suunnitellessasi suorakulmaisen työkalupalkin ohjaimen kuvaketta pidä mielessä seuraavat seikat:
- Tee ääriviivasta terävä ja selkeä
- Käytä suoraa perspektiiviä
- Käytä kokomustaa ja muutama harmaa sävyä ehdottaaksesi mittasuhteita
- Käytä liimausta
- Varmista, että kuva on visuaalisesti keskitetty ohjaimeen (huomaa, että visuaalisesti keskitetty ei välttämättä ole sama kuin matemaattisesti keskitetty)
Säännöllisen kokoisten suorakaiteen muotoisten työkalurivien ohjainten kuvakkeiden tulisi olla korkeintaan 19 x 19 pikseliä.
Kommentit
- Voitteko antaa kuvan siitä, mistä puhut? Katsoin juuri Google Analyticsia ja en ' näe mitään vastaavaa kuin sanot.
- Anteeksi siitä. Päivitetty viesti kahdella linkillä! Tässä on muutama lisää: Firefox 4 mozilla.com/en-US/firefox/features Chrome (katso taaksepäin / eteenpäin / koti / suosikit) google.com/chrome itunes apple.com/itunes/what-is/player.html
- Hyvä kysymys ja kiitos päivityksestä. +1 ja toinen +1 leikataan ja liitetään päivitys uuteen vastaukseen. 🙂
vastaus
Uskon, että tämä suuntaus liittyi ajatukseen sisällön ja esityksen erottamisesta. Kuvakkeet ovat osa kromia / ui, eivätkä ne saisi olla liian näkyviä, jotta ne eivät kilpailisi itse sisällön kanssa.
Toinen syy voi olla se, että huomion kiinnittäminen elementtiin on helpompaa, kun se on vain yksi värikkäällä kuvakkeella, ja kaikki muu on harmaasävy. Esimerkiksi vihreä kirjaudu lukkokuvake yhdessä harmaasävyjen valikkokuvakkeiden kanssa. Jonkin ponnahdusikkunan tekeminen värikkäiden elementtien ryhmässä vie paljon enemmän taitoa ja aikaa kuin sinun on ajatella paljon muutakin kuin vain värejä (joilla ei enää ole ensisijaista roolia käyttäjän huomion herättämisessä).
Kommentit
- Täsmälleen mitä minä aikoi sanoa. Google Chrome on täydellinen esimerkki siitä, että se on suunniteltu poistumaan tieltä. Yläpalkki, painikkeet, kuvakkeet ovat kaikki yksivärisiä ja tiivistettyjä hienosti. Joten Chrome-käyttöliittymä ei ' ei varastaa liikaa huomiota verkkosivulta, jota yrität tarkastella '. Ja olen ' huomannut, että Microsoftilla on samanlainen filosofia IE9: n kanssa.
- Osa, joka saa minut raivostumaan (kun otetaan huomioon Microsoft ' s uusin ilmoitus blogs.msdn.com/b/visualstudio/archive/2012/02/23/… ) on, että tämä toimii vain tietyntyyppisille käyttöliittymille, etenkin niille, joilla ei ole ' sataa painiketta, puunäkymää ja paneelia kaikkialla käyttöliittymässä. Milloin käyttöliittymän suunnittelijat alkavat ymmärtää, että tämä on vain hyvin spesifinen suunnittelumetafora eikä hieno villitys? Värilliset kuvakkeet toimivat, kun näkyvissä on monia kuvakkeita.
Vastaa
- Ne näyttävät usein hyviltä , riippumatta asettelusta, joten voit säilyttää ne, jos asettelu muuttuu.
- Voit yhdistää eri lähteistä tulevia kuvakkeita (Nimi-projekti, symbolifontit, olemassa olevat kuvakkeet, joita käytetään alustoilla, kuten iPhone jne.) , koska ne näyttävät enimmäkseen samanlaisilta.
- Se on helppo tehdä itse.
Henkilökohtaisesti mielestäni se on yleensä huono trendi. Aivomme prosessoivat väriä ennakoivasti (ennen kuin edes tietoisesti näemme sen); ”olemme todella hyviä tehtävissä, kuten” löydämme punaisen kuvakkeen värillisten kuvakkeiden luettelosta. ”Emme ole niin hyviä sellaisessa tehtävässä kuin” löydämme kuvakkeen, joka näyttää pieneltä kuorma-autolta, mustien kuvakkeiden luettelosta ”. Kaikkien kuvakkeiden tekeminen samanväriseksi tekee tuotteestasi vaikeamman käyttää.
On tietysti poikkeuksia.