Parantaa Malleja Periaatteiden Kanssa Sulkeminen Ja Kuva-Maa (Osa 2)

Author

Jon oli visuaalinen suunnittelija vuosia, ennen kuin teet että harppaus vuorovaikutuksen suunnittelu., Hänellä on maisterin tutkinto Ihmisten ja Tietokoneen Vuorovaikutuksen DePaul …Lisää aboutJon↬

oletko koskaan miettinyt, miten elementit tulevat yhdessä luoda onnistuneita malleja? Ei ole sattumaa, että vakuuttava muotoilu vain tuntuu toimivan., Mitä useimmat näistä mallit on yhteistä on käyttää gestalt ryhmittelyn periaatteet järjestää tietoa, joka auttaa meitä ymmärtämään suhteita ja eroja elementtejä. Suunnittelijoina Voimme käyttää näitä periaatteita luodaksemme Oman mukaansatempaavan ja menestyksekkään työmme.

aloitetaan Gestaltin sulkemisperiaatteella.

Sulkeminen

Mukaan Universal Principles of Design, tämä periaate todetaan, että meillä on taipumus hahmottaa joukko yksittäisiä elementtejä, kuten yksittäinen, tunnistettava kuvio, sen sijaan useita, yksittäisiä osia., Sulkemisen käyttäminen vähentää tehokkaasti monimutkaisuutta vähentämällä elementtejä pienimpiin mahdollisiin osiin, joita tarvitaan esineen viimeistelyyn. Jos meillä on tarpeeksi tietoa, täytämme puuttuvat osat luodaksemme kokonaisuuden. Tämä saavutetaan käyttämällä positiivista ja negatiivista tilaa.

alla olevassa esimerkissä mielemme täydentävät viivat muodostaen ympyrän, vaikka muotoa ei olekaan. Positiivinen ja negatiivinen avaruus muodostavat käsityksemme ympyrästä.,

Sulkeminen voidaan tehdä meidät hahmottaa esineitä tai kuvioita käyttämällä pienin määrä tietoa. Mielemme on niin innokas täyttämään puuttuvan tiedon, että se voidaan tehdä hyvin harvoilla elementeillä. Kuitenkin, jos meillä ei ole tarjota tarpeeksi tietoa, täydellinen kuvio, niin emme voi hahmottaa objektin ja sulkeminen epäonnistuu, jolloin ympyrä paljon vaikeampaa muodostaa mielessämme. Katso, pystytkö täydentämään sitä mielessäsi. Se on paljon vaikeampaa, eikö?, Emme voi nyt aivan yhdistää sitä annettujen tietojen vähäiseen määrään.

Luoda Tehokas Sulkeminen

edellä Olevat esimerkit ovat hyvin yksinkertaisia esimerkkejä siitä, miten me hahmottaa kuvioita muodossa sulkeminen. Todellisuudessa on monia visuaalisia elementtejä, joiden avulla voimme muodostaa tehokkaan sulkemisen:

• positiivinen ja negatiivinen tila. Kuten aiemmin mainittiin, positiivinen ja negatiivinen tila yhdistyvät sulkemisessa kokonaisuudeksi., Tämä voidaan saavuttaa etsimällä piilotettuja muotoja suunnittelun negatiivisessa tilassa tai tyypin sisällä. Lisäksi elementtien poistaminen etualalta voi luoda mielenkiintoisia negatiivisia muotoja, ja näin tehdessään yksinkertaistaa muotoilua.
• Kontrasti. Avain sulkemisen muodostamiseen on vahvan kontrastin luominen etualaelementtien ja taustan välille. Kuten aina, musta ja valkoinen luo parhaan kontrastin, mutta voit myös kokeilla täydentäviä värejä vahva kontrasti samoin.
• väri., Väri ei vain lisää elämän suunnittelu, sitä voidaan myös käyttää vahvistamaan suhteita, varsinkin jos käyttää abstrakteja muotoja edustavat muotoja.

kaikki sulkemiset käyttävät monia ellei kaikkia edellä mainittuja visuaalisia elementtejä. Käyttämällä näitä ja kokeilemalla vähentää malleja auttaa löytämään uusia muotoja. Katsotaan nyt tosimaailmassa, miten kaikki järjestyy.

Sulkeminen Käytännössä

Käyttämällä sulkeminen, voimme vähentää elementtejä, joita tarvitaan välittää visuaalista informaatiota, vähentää monimutkaisuutta ja tekee suunnittelee kiinnostavamman., Yksi yleisimmistä käytöstä sulkeminen on suunnittelussa yrityksen logot, juuri koska sulkeminen voi yksinkertaistaa suunnittelu nopeasti välittää brändin identiteetti.

alla nähty on kuuluisa logo, jonka tunnistamme NBC Peacockiksi. Kun vertaat nykyistä logoa (oikealla) vanhaan logoon, näet, että ne eivät ole villisti erilaisia. Mutta vähentämällä elementtejä ja työskentelemällä negatiivisessa tilassa nykyinen logo muuttuu paljon yksinkertaisemmaksi ja tyylikkäämmäksi., Sulkeminen on onnistuneesti saavuttaa käyttämällä tiukasti ryhmitelty, positiivinen muotoja kuin höyhenet, meidän käsitys riikinkukon kehon muodostettu käyttämällä negatiivisia valkoinen tila keskellä.

Toinen hyvin-tunnustettu logo, joka työllistää sulkeminen onnistuneesti on FedEx., Tässä logossa sulkeminen tapahtuu negatiivisella valkoisella avaruudella käyttäen suuraakkosen E ja lowercase x osia muodostaakseen tutun eteenpäin liikkuvan nuolen. Suunnittelija kokeillut monia malleja, lopulta vetämällä kirjaimet lähemmäksi ja lähemmäksi toisiaan, kunnes hän näki nuolen muodostaen välillä e ja x. Tämä osoittaa, että kokeilemalla vähentäminen malleja, ja etsivät tilojen välillä, voi tuottaa upeita tuloksia. Jutun logon luomisen takana on Matthew Mayn suuri artikkeli Fast Companyssa. Näetkö logossa olevan nuolen?, Et tule koskaan kaipaamaan sitä tästä lähtien!

edellä Olevat esimerkit ovat tunnettuja logoja, jotka käyttävät sulkeminen jokseenkin ilmeinen tapoja. On kuitenkin vähemmän tunnettuja logoja, jotka käyttävät sulkemista hienovaraisemmin. Esimerkiksi Houzz työllistää sulkemista käsitteellisemmin. Ensisilmäyksellä vihreät, mustavalkoiset muodot saattavat muistuttaa hyllyä, rakennuksen osaa tai seinäkuviota, mikä viittaa siihen, mistä sivustolla on kyse., Mutta lähempi tarkastelu paljastaa myös jotain muuta. Mielemme on halu täyttää tilat ja täydellinen kuvioita antaa meille mahdollisuuden yhdistää eri muotoja kokonaisuudeksi, muodostaen isoja S kolmiulotteisessa avaruudessa.

Kun sulkeminen on hyvä luoda mielenkiintoisia logot, se voi toimia muilla tavoin., Verkkosivustot voivat myös käyttää positiivista ja negatiivista tilaa käyttöliittymiensä suunnittelussa tehokkaan sulkemisen aikaansaamiseksi. Alla Uncrate-logo käyttää positiivista tilaa mustaa, negatiivista taustaa vasten muodostaakseen logonsa kirjaimet ja luodakseen sivuston brändäyksen. Tämä on myös hyvä esimerkki luku-maa, johon pääsemme pian.

Käyttämällä Sulkeminen, Kun Luodaan Kuvakkeet

Kuvakkeet ovat hyödyllisiä, kun meidän täytyy välittää viestin tai vahvistaa käsite pieneen tilaan. Niiden on oltava yksinkertaisia ja riisuttuja peruselementteihinsä, jotta ihmiset ymmärtävät nopeasti niiden merkityksen. Sulkeminen toimii hyvin luomisessa kuvakkeet, hyödyntäen positiivinen ja negatiivinen tila vähentää monimutkaisuutta, mutta silti ehdottaa muotoja tai esineitä, jotka näemme kokonaisuuksia, kuten näissä esimerkeissä substantiivi projektin verkkosivuilla.,

Abstrakti Sulkeminen

Sulkeminen voi saada varsin abstrakti ja silti antaa meille mahdollisuuden muodosta tunnistettavia kuvioita. Yksi suosikkini käytöstä sulkeminen on Google doodle., Google työllistää sulkeminen usein sen doodles, luottaa meidän luontainen tarve täyttää puuttuvat tiedot, voit luoda koko esine. Google doodles riippuu meidän perehtyneisyys Google logo, jonka avulla voimme lukea kuvan alla huolimatta sisältävät hyvin abstrakteja muotoja. Tässä, väri auttaa vahvistamaan suhdetta jokaisen kirjeen Googlen logo samoin.,

Kuten näette, käyttämällä positiivisia ja negatiivisia tilaa luovasti, ja vähentää elementtejä meidän malleja, voimme luoda joitakin todella mielenkiintoisia malleja kanssa sulkeminen. Voimme hyödyntää tarvetta täyttää puuttuvat osat vähentää monimutkaisuutta ja yksinkertaistaa malleja., Seuraavaksi katsomme, miten voimme käyttää positiivista ja negatiivista tilaa luomaan hyviä kuva-maasuhteita.

Kuva-Kentällä

Mikä on periaate kuva-maahan? Mukaan Universal Principles of Design, kuva-maa on valtion, jossa näemme elementtejä joko esineitä keskittyä tai tausta. Kuten sulkeminen, Kuva-maa toimii käyttämällä positiivista ja negatiivista tilaa. Figure-ground on käytännössä kaikessa mitä visuaalisesti havaitsemme, olipa kohtaus, koostumus, verkkosivusto, logo tai kuvake.,

Kuva-maa on vakaa, kun esineet erottuvat taustasta eikä taustalla ole kiinnostusta. Vakaa figure-ground tarjoaa puitteet esineille ja antaa meille mahdollisuuden keskittää huomiota sinne, minne haluamme. Näemme esimerkiksi alla olevan kuvan taustalla olevana ympyränä. Ympyrä on painopiste ja kiinnittää huomiomme, vaikka tausta ei juuri kiinnosta. Tämä esimerkki esittelee vahva luku-maahan vakautta niin, että kuva on kunnossa ja pidetään edessä, kun tausta on muodoton, jatkuva takana luku on edelleen syvyys.,

Kun kuva-maa ei ole vakaa, kuten alla olevassa esimerkissä, havainto-epäselvyys on otettu käyttöön ja suhteet elementtien välillä tullut epäselvä. Tässä tarkoituksella yksinkertaistettu esimerkki, kuva ja maa ovat palautuvia, aiheuttaa meille vuorotellen nähdä yksi kohde ja sitten toinen luku ja sitten maahan.

Kuitenkin, epäselvyys ei ole välttämättä huono asia., Tätä vakauden puutetta voidaan hyödyntää suunnittelussa. Tarkoituksella horjuttaa kuva-maahan suhde voi esitellä eripuraa tai jännitystä, lisäämällä jännitystä ja kiinnostusta meidän malleja. Yksi suosikkini käyttää tätä jännitettä kuva-maahan on Alamaailman juliste-sarjan Simon C. Sivu. Täällä, Sivulta tarkoituksella horjuttaa kuva ja maahan, piste-periaatetta vastaan itse, koska kuva ja maahan taistelemaan huomiomme, aivan kuten sankari ja konna juliste taistelu toisiaan vastaan.,

Luoda Hyvä Kuva-Maahan Suhteita

On olemassa monia visuaalisia elementtejä, joita voimme käyttää vahvistamaan luku-maahan suhde meidän malleja. Käyttämällä näitä elementtejä voi auttaa meitä kiinnittämään huomiota, missä emme halua sitä, avustaminen muistettavuus verkkosivuilla tai muita design:

• Kontrasti., Valkoinen tai musta, pariksi väri, kuten nähdään rikollinen alamaailman julisteissa, luo hyvin voimakkaan kontrastin. Samoin täydentävät värit ovat erinomaisia kontrastin luomiseen. Jos puhtaat värit ovat liian voimakkaita, muuttaa arvoa (kuinka tumma tai vaalea väri on) luoda tehokkaampi kontrasti.
• väri. Lämpimät värit, kuten keltaiset, appelsiinit ja punaiset, koetaan lähestyy ja sitä voidaan käyttää vahvistamaan kuva. Viileät värit, kuten purppura, blues ja vihreät, koetaan väistyviksi ja niitä voidaan käyttää vahvistamaan maaperää.
• Koko., Kun suuri elementti täyttää suurimman osan maasta, se nähdään lukuna. Toisaalta lukuna pidetään pientä elementtiä suuren maan sisällä.
• asema. Elementit on sijoitettu alemman alueilla mielletään kuva, kun elementit on sijoitettu ylä-alueet mielletään maahan. Tämä on meidän käsitys etäisyyden, koska me havaitsemme esineitä sijoitettu alemman alueilla olla lähempänä meitä ja esineitä sijoitettu ylä-alueita kauemmas.
• Focus., Elementit, jotka ovat keskittyneet mielletään luku, kun taas elementit, jotka ovat epätarkka, hämärtynyt, haalistunut, tai sävytetty, koetaan maahan.

useimmat hyvät kuva-maasuhteet syntyvät monien näiden visuaalisten elementtien yhdistelmällä. Seuraavaksi tarkastellaan joitakin reaalimaailman esimerkkejä ja katsotaan, miten nämä elementit toimivat yhdessä luoda onnistunut kuva-alalla.,

Kuva-Kentällä Käytännössä

esimerkiksi kuva-maahan Alamaailman julisteen sarja edellä esitetty periaate, epävakaa valtio, jossa kuva ja maahan taistelu toisiaan huomiota. Epävakaa Kuva-maa toimii hyvin, kun elementtejä on vähän ja muotoilu on yksinkertainen. Tämä ei kuitenkaan välttämättä ole toivottu periaatteen käyttö verkkosivuja suunniteltaessa, vaikka se riippuu sivuston sisällöstä ja kontekstista. Verkkosivustojen on välitettävä monimutkaista tietoa ja oltava edelleen selkeitä ja käyttökelpoisia., Vakaa kuva-maahan, voimme ohjata huomiota missä me haluamme sen ja välttää mahdolliset epäselvyydet viestin yritämme kommunikoida.

katso alla oleva esimerkki Apple Music sivusto. Todennäköisesti katse kiinnittyy älypuhelimen kuvaan, joka sen vasemmalla puolella olevan kopion ohella on luku-elementtejä. Vaikka tausta alkaa taistella huomiomme puolesta, hahmoelementtejä tehostetaan käyttämällä useita visuaalisia elementtejä. Ensinnäkin kuva vahvistuu suuren kopion ja älypuhelimen suuren koon kautta., Älypuhelimen sijoittaminen näytön alareunaan auttaa myös hahmon eteenpäin viemisessä. Luku on entisestään sävytys takaisin video, animaatio, tausta, aiheuttaen maahan väistyä. Lopuksi kontrasti kirkkaan näytön ja tumman taustan välillä antaa hyvän eron kuvan ja maanpinnan välillä.

seuraavassa esimerkki, Naya n verkkosivuilla, koko kuva on vahvin visuaalinen elementti, jota käytetään luoda hyvä kuva-maahan. Täällä havaitsemme naisen(ja hänen erittäin suuri hattu!) niin luku kuin hän täyttää suurimman osan maasta. Lisäksi käytetään viileä väri taustalla, sekä näppärä käyttää päällekkäisiä elementtejä, auttaa auttaa taustalla väistyä. Lopuksi, kuten Apple Music-esimerkissä, etualalla on hyvä kontrasti, joka erottaa taustasta.,

Lopuksi, erinomainen kontrasti kuvassa ja maa on voimaa R/m Suunnittelu Koulun verkkosivuilla. Tässä valikossa on vahva kontrasti, kirkkaan värin ja mustan avulla erottaa kuvan maasta. Lisäksi lämmintä väriä käytetään vahvistamaan käsitystä meitä kohti tulevasta hahmosta. Etkö vain halua ottaa niitä punaisia laattoja?,

Johtopäätös

Ymmärtäminen miten käyttää sulkeminen ja kuva-maahan auttaa sinua rakentamaan vahvoja suhteita ja eroja elementtejä malleja.,

• Katso negatiivinen tilaa yhtä paljon kuin positiivisia tilaa löytää mielenkiintoisia muotoja;
• Leikkiä poistamalla elementtejä etualalla ja käyttö negatiivinen tilaa muodostaa muotoja sen sijaan;
• Lopuksi, sekoita visuaalisia elementtejä, kuten kontrasti, väri, koko, sijainti ja keskittyä luomaan sekä vakaa ja epävakaa kuva-maa suhteita.

nyt kun osaat käyttää näitä kahta periaatetta työssäsi, mene eteenpäin ja luo omia mukaansatempaavia ja onnistuneita mallejasi!,

tämän sarjan kolmannessa ja viimeisessä osassa keskitytään jatkon ja yhteisen kohtalon periaatteisiin, joihin liittyy sekä epäsuoraa että animoitua liikettä suhteiden luomiseksi.

Resources And Good Reads

• ”Gestalt Principles” on Scholarpedia.
• Universal Principles of Design tarkistettu ja päivitetty: 125 tapoja parantaa käytettävyyttä, vaikuttaa käsitys, lisätä valittaa, tehdä paremman suunnittelun päätöksiä, ja opettaa läpi design by William Lidwell, Holden, Kritina ja Jill Butler. Rockport Pub, 2010.,
• Information visualization: perception for design by Colin Ware. Elsevier, 2012.

• Design-Periaatteet: näköhavainnon Ja Periaatteet Gestalt
• Yhdistää Ja Erottaa Elementtejä Kautta Kontrasti Ja Samankaltaisuus
• Koostumusta Tasapaino, Symmetria Ja Epäsymmetria
• Miten Parantaa sähköpostiisi Työnkulkua Modulaarinen Suunnittelu

(ml, da, og, jb, il)