Suunnittelun ammattilaisena olet perehtynyt (ja mahdollisesti osallistunut) ympyröiden lisääntyneeseen käyttöön kaikissa suunnittelun elementeissä.

Piirilevyt ovat kaikkialla kodin sisustustuotteista, kuten pyöreästä kehystetystä peilistä ja tulosteista käsityökaluihin rautakauppaan. Ympyrät ovat jopa kierrättäneet tietä verkkosivustoihimme, jotka näkyvät otsikoissa, valikoissa ja joskus smack dabissa sivun keskellä.

Muutamat suunnittelutyökalut ovat jopa luoneet blogiviestejä, mukaan lukien suuret kuvakaappaukset piirien luovan käytön web-suunnittelussa. Kuitenkin vähän on sanottu psykologiasta, kun käytetään piirejä suunnittelussa tai miten käyttäjän vastaus piireihin voidaan tehokkaasti sisällyttää kasvavaan ilmiöön mobiilikäyttöön.

Tiedämme, että pidämme piireistä, mutta miksi? Ja miten web-suunnittelija voi parhaiten käyttää piirejä optimoimaan käyttäjäkokemuksen reagoivasta suunnittelusta?

Ympyrät ja aivot

Kognition ja käsitys

Ympyrät valitsevat ihmisiä, koska ne ovat helpommin ymmärrettäviä kuin muodot ja esineet, joilla on kovaa viivaa.

Silmä on piirretty piireihin ja sisältämän informaation piiriin, ja ne ovat nopeampia ja helpompia aivojen prosessille kuin kovakärkiset neliöt ja suorakaiteet.

Sveitsiläinen matemaatikko ja fyysikko Jurg Nonni, Visual Perceptionin kirjoittaja, ehdottaa, että reunojen poistamisen avulla voimme nopeammin havaita esineen. Nonniin mukaan "suorakulmio, jossa terävät reunat, vie todellakin hieman enemmän kognitiivista näkyvää vaivaa kuin esimerkiksi saman kokoinen ellipsi. "Fovea-silmä" on vielä nopeampi ympyrän tallennuksessa. Reunoilla on muita hermosolujen kuvaustyökaluja. Prosessi hidastuu näin ollen. "

Tunnetut ja lohdulliset käyrät

Aivojen kognitiivisen kyvyn käsitellä piirejä nopeammin kuin pystyy käsittelemään neliöitä ja suorakulmioita käsittelemme tuttuja tietoja ja objekteja nopeammin kuin ne, joita emme tunnista.

Jokainen tunnistaa piirejä ja ihmiset oppivat yhdistämään muodot erityisiin toimiin ja tuloksiin, kuten universaali punaisen kahdeksankulmion "STOP" -merkki. Mukaan Applen OS X Human Interface -suuntaviivojen mukaan "ihmiset oppivat yhdistämään tietyt käyttäytymiset tiettyihin elementteihin niiden ulkonäköön perustuen. Esimerkiksi ihmiset tunnistavat painonapit pyöreällä tavalla. "

Azonmedia

Käytä piireissä tehokasta käyttöä symbolisissa valikkokohteissa Azonmedia Palvelusivulla.

Näemme piirejä, soikeita ja pyöreitä reunoja monissa lämpimissä ja ei-uhkaavissa tavoissa eri kulttuureissa ja ympäristöissä. Pilvet, munat, aurinko ja kuu luonnossa ovat kaikki pyöristettyjä paljain silmin. Smiley kasvot, kakut, piirakat, kaarevat luvut ovat kaikki miellyttäviä aisteille.

Aivot reagoivat hyvin ympyröihin ja kaareihin, kun taas tuntevat kovan reunan kohteet kovemmiksi, tarkemmin määritellyiksi ja mahdollisuuksiltaan uhaksi.

Ympyrät ja käyttökokemus

Piirit ovat tehokkaita web-suunnittelussa juuri näistä syistä.

Verkkokäyttäjät ovat tunnetusti kärsimättömiä ja koska piirejä on helpommin havaittavissa ja ymmärretty, niiden käsittelyyn kuluu vähemmän aikaa.

Matkapuhelimen käyttäjät ovat entistä kärsimättömiä. He ovat myös kiireisiä, usein liikkeellä, monitoimikunnossa ja käyttävät indeksisuuntaista sormea ​​tai peukaloa kämmenlaitteensa navigoimiseen. He haluavat tietojaan NYT. Piirit auttavat mobiilikäyttäjiä löytämään etsimäsi tiedot tehokkaammin.

Ympyrät ja peukalot

Toinen reittipiiristä on hyötyä liikkuvassa ensimmäisessä ja reagoivassa suunnitteluympäristössä, koska niiden soveltuvuus elementteinä kosketusnäytön rajapinnoissa.

Koska kosketusnäytölliset älypuhelimet ja tablet-käyttäjät sormella napauttamalla, liu'uttamalla tai peukaloimalla haluamansa tiedon, on järkevää käyttää piirejä käyttäjän ohjaamiseen. Ei vain he jäljittelevät sormen muotoista muotoa, yhdistämme ympyrät ja pyöreät reunat painikkeilla ja aivot nopeuttavat nopeasti tarvittavat toimet.

Gosling

Web-kehittäjä Oliver James Gosling

Kun olet liittänyt piirejä kosketusnäytön mobiilirajapintaan, suunnittele pienimmälle näytölle. Ympyrän sisällä olevat tekstit tai kuvat on silti helposti lukea, ja koon on oltava vähintään sormenpään koko tai 44 pikseliä.

Ympyrät ja näytön tila

Hyviä uutisia ympyröiden käytöstä herkässä suunnittelussa on se, että CSS3 yksinkertaistaa huomattavasti koodausvaatimuksia.

Huono uutinen on, että piireissä otetaan paljon kiinteistöjä ja johtavat avoimempiin näyttöalueisiin.

Koska älypuhelimien ja tablettien näytön tila voi olla melko pieni, miten voit lisätä piirejä huolehtimatta siitä, että ne tulevat niin pieniksi, että niitä ei voi lukea, napauttaa tai napsauttaa?

Yksinkertainen mobiililiitäntä

Se auttaa pitämään mobiililaitteen käyttöliittymän yksinkertaisena. Kun silmä on piirretty ympyrää silti, ei ole mitään syytä ryöstää ylhäältä ruutua sisältämällä sisältöä, jota käyttäjä kaipaa.

Jos ne eivät ole osa otsikkoa tai logoa, pidä ympyrän käyttöä vähintään yhdellä tai kahdella sivulla. Yritä käyttää pyöreää hakupainiketta tai käyttää puhelintasi toimia esimerkiksi "soita täällä" tai "kirjaudu tänne".

Gravitate

Gravitate Design käyttää ympyröitä ja värejä houkuttelemaan silmää etusivun logoon, salkkuun ja tekstiin.

Taustat ja jakopainikkeet

Kuten minkä tahansa muotoilun kannalta, piireissä on käytettävä sivuston sisältöä, tuotetta tai palvelua, tyyliä ja brändiä. Sen pitäisi parantaa käyttökokemusta ja yksinkertaistaa käyttöliittymää.

Jos toiminnon käyttö ei ole sopiva sivustoon tai jos navigointi- ja valikkokohteet eivät yksinkertaisesti toimi ympyrän sisällä, harkitse ympyrän sisällyttämistä taustalle. Käytä suurempaa ympyrää taustalla vetääksesi silmän sivun tärkeimmälle sivulle (puoliksi läpinäkyvä teksti takana).

Muista, että sisältö on mitä mobiilikäyttäjä täällä on. Kannustetaan käyttäjien sitoutumista valitsemalla pyöreitä sosiaalisen median jakamispainikkeita suorakulmaisten vaihtoehtojen sijasta.

Pyöreät kuvakkeet herkässä suunnittelussa

Yksi suosituimmista tavoista sisällyttää piirejä verkkosivustoihin on kuvakkeet valikossa. Tämä sopii herkästi muotoiluun, sillä se korvaa pitkän ja / tai hämmentävän tekstin, jossa on yksinkertaisempi kuva.

Buza

Buza käyttää piirejä täydentämään pystysuuntaista mobiilivalikkoa.

Pyöreä kuvake vie vähemmän tilaa, mikä lisää tilaa sisällölle. Se näyttää hyvältä ja käyttäjä käsittelee nopeasti sitä, mitä se edustaa.

Soikeat tai pyöristetyt suorakulmiot

Ehkä et ole valmis käsittelemään käsiäsi suuren vanhan ympyrän ympärillä. Ei se mitään. Mutta älä tartu kovilla reunoilla.

Lisää pyöreitä suorakulmioita tai soikeita reagoivaan suunnittelutyökaluun. Sileät kulmat helpottavat keskittymiskykyä käyrän sisälle, sen sijaan, että kiinnität huomiota ulkoreunoihin.

Lopullinen sana

Vaikka web-suunnittelijat saattavat viettää tunteja tuskissaan ympyrän tai pyöreän suorakulmion ansioiden ja terävien reunojen ansiosta, kun kyse on miellyttävästä käyttäjältä mobiilisuunnittelulla, kyse on sisällöstä. Käyttäjä haluaa kiinnostavan ja hyödyllisen sisällön, joka on esitetty yksinkertaisessa ja helppokäyttöisessä käyttöliittymässä. Kaikki muu on toissijaista.

Vaikka reagoiva web-suunnittelu pyrkii reagoimaan ympäristöön, sen pitäisi myös vastata käyttäjän tarpeisiin. Käyttäjät tunnistavat ympyrän tunnetun muodon, havaitsevat sen nopeasti ja pystyvät helposti näkemään napsautettavan pisteen näytöllä. Käytä yksinkertaista ympyrää seuraavassa herkässä suunnitteluprojektissa. Käyttäjät kiittävät sinua.

Käytätkö piirejä soittopyyntösi? Pelaatko sitä turvallisesti hienosti pyöreillä suorakulmioilla? Kerro meille alla olevissa huomautuksissa.

Esitetty kuva / pikkukuva, piireissä kuva kautta Shutterstock