Essential Design Trends, elokuu 2016
Väri ja kerrokset. Tämä design-elementtien pari on ollut monien vuoden trendien taustalla. Vaikka emme ole nähneet mitään ottaa haltuun, kuten tasainen muotoilu muutama vuosi sitten tai viime aikoina Material Design, molempien tyylien elementit ohjaavat suunnittelijoita tutkimaan uusia asioita.
Molemmilla värivalinnoilla ja kerroksilla näyttävät olevan juuret näissä suuremmissa suuntauksissa ja niitä käytetään suunnittelussa ilman täysin litteitä tai materiaalisia estetiikkaa. Tässä on trendi suunnittelussa tässä kuussa:
1. Paljon kerrostettuja elementtejä
Tasoitetut elementit ja kolmiulotteiset vaikutukset ovat 2D-web-tilan must-have-tekniikkaa. Kiitos hauskuustekniikoista ja entistä paremmasta toiminnasta, joka esiteltiin ensisijaisesti materiaalisuunnittelulla, kerrostetut elementit avautuvat kaikentyyppisissä projekteissa.
Mikä on erityisen mukavaa, se antaa sivustolle realistisemman tuntuman. Käyttäjä voi melkein tavoittaa ja napata elementtejä näytöllä. (Ja se on hyvä!) Uskomatonta on, että jokaisen kerroksen pitäisi näyttää todelliselta ja kevyeltä, ja kerrokset näyttävät luonnollisilta.
Seuraavassa on muutamia tapoja aloittaa kokeilemalla kerroksia suunnitteluprojekteissa:
- "Nosta" elementtejä taustalla yksinkertaisella varjolla tai animaatiolla. Olle tekee tämän useilla elementeillä eri tasoilla, mutta ne kaikki vetävät yhteen ja näyttävät luonnollisilta.
- Anna elementtien leikkautua. Teksti voi siirtyä kuvasta mieleen olevaan tilaan.
- Parallaksen vieritysominaisuudet ovat mielenkiintoinen tapa luoda kerroksellisia elementtejä (tausta, joka liikkuu taustalla) ilman liian ylivoimaa.
- Käytä geometrisia muotoja, animaatioita ja värivaihtoehtoja jäljitelläksesi syvyyttä suunnittelussa. Käyttäjien pitäisi tuntea, että he voivat melkein pudota näkyviin, kuten kokemus Poista toimisto .
- Luo kerroksia menemällä kankaan ulkopuolelle elementteillä, jotka menevät näytön taustan tai reunan ulkopuolelle.
- Salli elementtien leikkaaminen teksturoidun taustan päälle, jotta voidaan luoda erotus yläkerroksen (jota käyttäjät voivat kuvitella todella koskettamalla) ja taustakerroksen välillä.
2. Tumma värimaailma
Jonkin ajan kuluttua näytti siltä, että jokainen verkkosivusto oli minimalistinen ideaali, johon kuului myös ankara valkoinen tausta. Tämä suuntaus on muuttunut, kun lisää tummia värejä kehittyy suunnittelun suosikiksi.
Ja hyvästä syystä. Kiva tumma värimaailma voi olla huomiota herättävää ja ei ole yhtä kovaa kuin joidenkin käyttäjien silmät kirkkaana valkoisena. Päinvastoin, tumma estetiikka voi olla hieman hankalampi, jos teksti on pieni tai pienempiä näyttöjä (joten varmista, että kiinnität erityistä huomiota siihen, miten elementit tehdään mobiililaitteissa).
Elementtejä, jotka todella erottuvat pimeässä värimallissa, sisältävät viileän videokuvan ja animaation käytön, vaikka sitä ei tunnistettaisi; rohkea valkoinen typografia, kirkkaan värinen värejä korostaen puheluita tai tärkeitä tietoja ja sopivaa yleistä tunnelmaa.
Muista myös, että pimeä ei aina tarkoita mustaa. Tumma värimaailma voi juurtua erilaisiin sävyihin punaisilta bluesiin vihreihin. Vaikka mustat vaihtoehdot ovat tavallisimpia, on tärkeää valita rikkaat mustat, jotka on valmistettu erilaisista väriyhdistelmistä. Tasainen musta (tai "K musta", kuten tulostussuunnittelijat kutsuvat) jättää jotain toivomaan sivuston suunnittelussa.
Kun työskentelet tummien värimallien kanssa, tarkista, että elementtien välissä on oikea kontrasti ja että värit ja kuvat eivät mene häviämään suunnittelun tummasta luonteesta. Valkoinen voi olla hyvä vaihtoehto sekä muita ensisijaisia värejä, joilla on paljon kirkkautta tai kylläisyyttä. Muista myös kuvata koko kontrastia. Harkitse kaikkien tekstin elementtien kokoa 10-20 prosenttia, kun työskentelet tummalla kehyksellä luettavuuden varmistamiseksi.
3. Vyöhykkeet tekevät paluun
Gradientti - yksi niistä tekniikoista, joita pelkistetty muotoilu välttää - on paluuta. (Ja sitä käytetään jopa enimmäkseen tasomaisissa kuvioissa.)
Vyöhykkeet toimivat, koska he tekevät jotain, mistä monet ihmiset ajattelivat, että litteä muotoilu puuttuu, mikä auttaa luomaan ja vahvistamaan syvyyttä. Uutta kaltevuuksista tällä kerralla on, että niitä ei käytetä jäljittelemään tekstuureja tai ilman tarkoitusta. Nykypäivän trendi keskittyy sisällöltään korostavat kirkkaat värit. Koko näytön gradienttipeitteistä taustoihin melkein menee mitä tulee tekniikkaan ... niin kauan kuin se on rohkea.
Suunnittelijat hyödyntävät eniten kaltevuuden paluuta muutamilla eri tavoilla:
- Gradient- "flat-color" -parit yhdistävät molempia suunnitteluideoita rohkealle ulkonäölle, kuten verkkosivustolle WPcrew .
- Kaksisuuntaiset kaltevuudet ovat hauska värisäiliö, joka lisää mielenkiintoa kuvaan, joka saattaa olla hieman puutteellinen tai lisätä syvyyttä taustaan.
- Vaikka monet näistä kaltevuuksista näyttävät olevan suuremmassa mittakaavassa, niitä käytetään myös pienempiin elementteihin, kuten nappeihin tai kiinnittämään huomiota tiettyyn sisältöön.
On vielä muutama gradientti, jota ei pidä harkita. (Koska et halua, että malli näyttää kuin se hyppäsi heti 2012!)
- Ole varovainen pienistä kaltevuuksista. Kuvakkeiden käyttöä ei suositella.
- Älä hämätä sisältöä. Kuvassa oleva kaltevuuspinta voi olla mukava (vain ajattele joitain viileitä vaikutuksia, joita Spotify ominaisuuksia säännöllisesti), mutta valokuva on vielä havaittavissa.
- Lihavilla värikylläisillä on yleensä kevyt, pirteä tuntuma. Varmista, että tämä silmää sisältöäsi.
- Kiinnitä huomiota väriyhdistelmiin ja kontrastiin luettavuuden suhteen. Jotkut kaltevuudet voivat saada valoa ja valkoista tekstiä voi olla ongelma. Varmista, että voit testata luettavuutta värin, erilaisen reagoivan taittopisteen ja monikokoisten laitteiden varalta. (Kaltevuuksilla luettavuusongelmat voivat joskus näkyä paikoissa, joita et halua odottaa.)
johtopäätös
Suunnittelussa ei ole mitään hauskempaa kuin väri. Värin trendit ovat mukavia, koska ne ovat elementtejä, joita voit lisätä melkein mihin tahansa muotoiluun ilman täysimittaista uudistusta. Sama pätee kerrostettuihin elementteihin. Tämä on tekniikka, jota voidaan lisätä nykyiseen muotoiluun, jotta se olisi nykyaikaisempi.
Mitä suuntauksia olet rakastat (tai vihaa) juuri nyt? Haluaisin nähdä joitakin verkkosivustoja, joista olet kiehtonut. Pudota linkki Twitterissä ; Haluaisin kuulla sinusta.