Flat 2.0 & Miten se ratkaisee Flat Designin käytettävyysongelmat

Litteä muotoilu on ollut käytössä jo 1950-luvulta lähtien, kun kansainvälinen typografinen tyyli kehitettiin. Viime aikoina se on saanut suuren suosion Microsoftin uuden käyttöönoton jälkeen geometria- ja typografiakeskeinen Metro-suunnittelu uudessa Windows Phoneissa vuonna 2010, sitten Windows 8: ssa vuonna 2012.

Litteä muotoilu on ominaista kolmiulotteisten vaikutusten ja kiiltävien visuaalisten elementtien puute saavuttamiseksi puhtaus, minimalismi, ja selkeys. Se on ristiriidassa aiemmin vallitsevan muotoilun, skeuomorfismin kanssa, joka käyttää kiiltäviä painikkeita ja kuvia, jotka jäljittelevät todellisia 3D-objekteja.

Litteä muotoilu pyrkii tehostamaan sivustoja, lisäämään keskittymistä sisältöön, tarjoamaan intuitiivisempia vuorovaikutuksia ja tarjoamaan nopeamman ja toimivamman käyttäjäkokemuksen. On myös helppo käyttää yksinkertaisia, laatikkomaisia ​​elementtejä ja verkkoon perustuvia asetteluja reagoivaan suunnitteluun.

Flat Designin käytettävyysongelmat

Vaikka litteä muotoilu antaa meille valtavan avun ja suuren työkalupaketin, joka tarjoaa käyttäjillemme nopeat ja sotkuiset sivustot, se voi aiheuttaa tiettyjä käytettävyysongelmia varsinkin, kun se on liikaa.

Ei näkyviä merkkejä napsautettavuudesta

Jos käytämme kolmiulotteisia vaikutuksia, se antaa luonnollisesti kuvien syvyyden illuusion. Tämä auttaa käyttäjiä nopeasti löytää interaktiivisia elementtejä, ne, jotka joko napsauttavat (kuten painikkeet ja kuvakkeet) tai täytetään (kuten lomakekentät). Yksi tärkeimmistä huolenaiheista on se, että käyttäjillä on vaikeuksia tunnistaa napsautettavat elementit.

Ennen litteää aikakautta web-suunnittelijat ilmoittivat yleensä napsautettavuudesta käyttämällä visuaalisia ratkaisuja, kuten kaltevuudet, tekstuurit, kohotetut reunat tai varjostukset painikkeiden ja muiden napsautettavien kohteiden näyttäminen näyttää olevan painettuna.

Litteässä mallissa ei ole näitä visuaalisia merkkejä, ja sen on ratkaistava sama tehtävä paljon pienemmällä työkalurivillä: värit, muodot, läheisyys, ja kontekstuaaliset elementit.

Miksi tämä on ongelma? Kokeile kokeilua.

Katso alla olevaa kuvakaappausta. Yritä arvata, mitkä elementit ovat napsautettavissa tämän kuvakaappauksen perusteella. Se ei ole sellaista, jota te ensin ajattelette. Voimme löytää monia muita samanlaisia ​​käytettävyysongelmia kaikkialla verkossa.

Pienempi havaittavuus ei Z-akselin vuoksi

Todellisessa elämässä olevat ihmiset löytävät esineet ja liikkuvat kolmessa ulottuvuudessa: x-, y- ja z-akselilla. Kun he joutuvat minimalistisesti suunnitellulle, tasaiselle verkkosivulle ilman 3D-efektejä, he saavat kokemuksen, joka on erilainen kuin mitä he ovat tottuneet siihen, mitä he ovat pääasiassa kuuluisat.

Tämä tarkoittaa sitä, että heidän täytyy käyttää enemmän ponnisteluja löytääksesi objektien väliset suhteet, ja ymmärtää visuaalista hierarkiaa sivuston. Esimerkiksi Microsoftin kehittäjäverkoston kotisivulla on käytettävä enemmän aikaa dekoodata tiedot visuaalisesti ja sivuston eri elementtien tarkoitus..

UX-mallin peukalo on aina yrittää minimoida käyttäjän kognitiivinen kuormitus käytettävyyden maksimoimiseksi. Kuten voimme nähdä monissa tapauksissa, tämä ei aina tapahdu tasaisella muotoilulla.

Matala informaatiotiheys

UX-asiantuntija Nielsen-Norman Group on myös kritisoinut litteän muotoilun riskiä pienelle tietotiheydelle.

Heidän kritiikkinsä Windows 8: n käytettävyydestä he käyttivät esimerkkejä Windows Storen sovelluksista ja Los Angeles Timesin verkkosivustosta näyttääkseen ongelmat, jotka alhainen tietotiheys (joiden aloitusnäytössä on vähän tarinoita, otsikot ilman tiivistelmiä, tuskin tunnistettavissa olevat ryhmittelyt jne.) voivat aiheuttaa käytettävyyden näkökulmasta.

Toisesta näkökulmasta vähemmän informaatiota voidaan nähdä myös häiritsevinä tekijöinä, jolloin käyttäjät voivat keskittyä vain tärkeisiin asioihin, mutta jos minimalismi on ylimitoitettu, se voi helposti uhrata sivuston ensisijaisen tavoitteen eli muuntaa tiedot katsojiksi.

Litteän 2.0 nousu

Kun yhä useammat suunnittelijat tunnustavat tasaisen suunnittelun käyttökelpoisuuden puutteet, uusi, kypsempi versio siitä on noussut, jota kutsutaan “Tasainen 2.0” tai “Lähes tasainen” design. Vaikka muutos skeuomorfismista tasaiseksi oli radikaali, tasaisen muotoilun kehittyminen on paljon vaikeampaa.

Uusi tyyli on edelleen tasainen, mutta se onkin lisää pienet kolme ulottuvuutta takaisin malleihin muodossa hienovaraiset varjot, kohokohdat, ja kerroksia. Flat 2.0 - jos sitä käytetään hyvin - voi korjata edellä mainitut käytettävyysongelmat tuomalla takaisin hieman realismia (skeuomorismia) ja lisäämällä syvyyttä ja yksityiskohtia säilyttäen minimalismin edut, kuten virtaviivaiset verkkosivut, selkeys ja nopeampi latausaika.

Materiaalisuunnittelu

Googlen uusi design-kieli, nimeltään Material Design, on luultavasti merkittävin esimerkki Flat 2.0 -tyylistä. Google julkaisi Materiaalisuunnittelun Android L -sovelluksella vuonna 2014. Vaikka materiaalisuunnittelussa säilytetään litteän muotoilun pääominaisuudet, se käyttää tietyt fysiikan metaforat auttamaan käyttäjiä löytämään nopeasti analogiat reaalimaailman ja digitaalisen maailman välillä.

Materiaali Design käyttää z-akselia, antaa hieno syvyys suunnitteluun ja käyttää älykkäästi kerroksia erotetaan heidät varjossa ja animaatiot. Googlella on superkoolin kuvaus siitä, miten se toimii, ja on todella syytä lukea sen läpi ymmärtääkseen sen tärkeimmät periaatteet ja säännöt.

johtopäätös

Koska hyvät suunnittelijat pyrkivät aina parantamaan käyttäjien kokemusta, web-suunnitteluteollisuus muuttuu jatkuvasti. Litteä muotoilu on korvannut skeuomorfismin nopeasti, jolloin tuloksena on grid-pohjaiset, minimalistiset ja yksinkertaiset elementit että viime aikoina on ylitetty web (tämä on synnyttänyt puhetta web-suunnittelusta tulossa tylsäksi tai jopa kuolemaan, mutta se ei voinut olla kauempana totuudesta).

Flat 2.0 antaa vastaukset tasaisen suunnittelun havaittuihin ongelmiin. Se on älykäs kompromissi toiminnallisuuden, esteettisyyden ja käytettävyyden välillä. Emme tietenkään tarvitse käyttää materiaali-käyttöliittymiä joka paikassa, mutta sen taustalla olevan filosofian ymmärtäminen voi antaa meille vankan taustan miten kehittää omaa tyyliämme käyttäjän kokemusten suunnittelun viimeisimpien havaintojen mukaisesti.