Põhiline visuaalse kujunduse raamistik

Visuaalne disain kui oskuste komplekt on läbi teinud mitmeid etappe. Neile, kes on tööstuses uued, tõmbas paljud meist rolli just artefakt. Kogenud disaineritele on see läbimõeldud tootetöö füüsiline väljendus. Ehkki selle tähtsus on vaieldav, ei ole aspektid üksteist välistavad. Visuaalne disain on keeruline. Seda tuleks mõista selle laiuse, keerukuse ja paindlikkuse poolest.

Visuaalse kujunduse jaoks on vaja head silma.

Visuaalne kujundus on seotud maitse kontseptsiooniga - võime "teada", mis on hea või mitte. See on tunnusjoon, mis järgib enamikku disainerit perepidudel, kui neilt oodatakse kellegi elutuba kaunistama või perefotot pildistama.

Maitset peetakse tavaliselt dispositsiooniks - andekuseks. Selle tulemusel ületavad head visuaalsed oskused selle joone, mis on kas hea silmanägemise või aastatepikkuse praktika tulemus.

Arutelu selle üle, kas anne on tõeline või mitte, on suurem vestlus. Tõsi on aga see, et visuaalse disaini tööriistakomplekti osad võivad olla objektiivsed. Selle raamistiku eesmärk on liigitada need aspektid kolme dimensiooni, et saaksime oma visuaalseid külgi paremaks muuta ja luua keele, et sellest paremini rääkida.

Niisiis, kuidas saaksime visuaalset disaini uuesti määratleda?

Hea disain annab edasi täpselt seda, mida disainer kavandas. Paremale visuaalsele kujundusele lähenemiseks vaatame, kuidas kritiseerime visuaalset tööd. Me ei küsi „kas see näeb hea välja?“. Võrdleme kasutaja poolt kasutajaliidese tõlgendust kavandatuga. Küsime, kuidas on töö seotud toote ja selle kasutajate kõige olulisemate tulemustega. Me ütleme, et liidesed näevad välja ülerahvastatud või harjumatud.

Võime kokku võtta, et visuaalne kujundus toimib järgmiselt:

  1. Suhtleb ja korraldab olulist ja keerulist teavet.
  2. Soodustab kavandatud käitumist ja devalveerib teisi.
  3. Säilitab loetavuse ja tuttavuse.

Seetõttu võime seostada need eesmärgid kolme küsimusega, mida võime visuaalse töö hindamisel küsida.

  1. Kas see on kasulik? Kas kujundus pakub kasutajale väärtust või kasulikkust?
  2. Kas on selge? Kas kujundus julgustab kavandatud käitumist? Kas see järgib narratiivi, millel on mõtet?
  3. Kas see on meeldiv? Kas visuaalne teos tunneb end toote juures, milles ta töötab? Kas elemendid on tuttavad? Kas see on lihvitud?

1. Kas see on kasulik?

Tooted kasutavad teabe või funktsioonide edastamiseks visuaalseid esitusi. Ukse käepideme konks tagab puksiiri või tõmbamise. Kaugjuhtimispuldi patareihoidlas olevad harjad võimaldavad venitada.

Ka digitaalsetel liidestel on eeliseid. Tegelikult alustasime me sarnaste füüsiliste võimalustega, kasutades nuppudele karmide varjude ja läike ning ikoonide abil, mis nägid välja sarnased füüsiliste objektidega. Aja jooksul kaldkivid kadusid ja nupud muutusid tasaseks. Nad kujunesid uueks perekonnaks, mis erines välimuselt, kuid oli samasuguse kasulikkusega.

Utiliidikaartide kujundamine vastavalt vormile. Esiteks vaatame heuristikat, mis parandab seda, kui kiiresti me seda lihtsalt vaadates meelde jätame, mida midagi teeb.

Selles näites on siin tavalised eeldused digitaalsetes kasutajaliidestes. Tekst edastab tarbitavat teavet. Nupud annavad edasi toiminguid, mida kasutajad teevad. Navigeerimine näitab, kuidas kasutajad saavad rakenduse kaudu liikuda. Lõpuks võite lubada ka keerulisi visuaalseid väljendeid. Näitleja on inimese kujundus, mis on ühine toodetes, mida me igapäevaselt kasutame.

Ehkki lisatasud parandavad ootuste eraldamist, võtavad need teid vaid osaliselt. Granulaarsel tasemel on üksikasju, mis paremini teie liidest kirjeldavad.

  • Kui nupp täidab konkreetset funktsiooni, peate valima keele, mis kirjeldab toimingut paremini.
  • Kui tekstimärgistel on kordumatu olek (st lugemata kiri), saate selle eristamiseks kasutada värvi või kaalu.
Selle näite korral võimaldavad kasutajatel ostukorvi lisada ja osta kohe kasutajatel liikuda ostutorustiku kaudu. Keel eeldab siiski kahte erinevat tulemust. Lisa ostukorvi võimaldab kasutajatel hiljem otsuseid vastu võtta ja osta korraga mitu kaupa, näiteks rõivapoest. Osta kohe võimaldab kasutajatel ostu lõpule viia nagu lennupileti ostmisel.

2. Kas see on selge?

Microsoft Word 2010 tööriistariba

10 aastat tagasi pakkusid sellised tööriistad nagu Microsoft Word ja Adobe Photoshop oma toodetes häid eeliseid. Neil olid selged nupud, sildid ja ikonograafia. Nad mahutasid erinevaid kasutusvõimalusi, millel olid erinevad funktsioonid. Mõnda funktsiooni kasutati vaevalt, kuid teisi kasutati kogu aeg.

Visuaalsed kujundused on nüüd redutseerivad ja vaevatud. Need võimaldavad inimestel probleeme ja ärieesmärke konkreetsete toimingute ja teabe andmiseks. Nad kaardistavad komponendid intuitiivseteks vaimseteks mudeliteks, julgustades samas ka vaimseid mudeleid, mis on toote jaoks kasulikud.

Selle keskmes on selgus, mis loob eeldused narratiiviks. Narratiivid võimaldavad teil selgemalt mõista liidese voogu ja toote eesmärki. Mõned levinumad neist on pärit geštaltpsühholoogiast.

  1. Silmapaistvus: kasutage valjemaid visuaalseid raviprotseduure, et komponendid tunneksid end olulisemana ja kergem oleks nende jaoks, mida vähem.
  2. Lähedus: pange omavahel seotud sisu üksteisele lähemale.
  3. Sarnasus: hoidke sarnasusi sarnaste komponentidega.
  4. Sulgemine: sulgege omavahel seotud komponendid.
  5. Järjepidevus: paigutage sisu lineaarselt (nt voos), et näidata sarnasust mitme komponendi vahel.
See on näide silmapaistvusest. See võtab nupu põhikomponendi, kuid kasutab siis heleda kontuuriga võrreldes rasket tausttäidet. Mõlemad juhivad tähelepanu sellele, mida kasutaja tõenäoliselt teeks ja mida toode soovib, et kasutaja teeks - tehingu lõpule viia.

3. Kas see on meeldiv?

Kasulikud komponendid, mis on rühmitatud selgelt, annavad edasi funktsiooni ja arvamuse selle kohta, mida kasutaja peaks tegema. Meie ajud töötlevad seda teavet igal juhul. See otsib sarnaseid näiteid varasematest liidestest ning otsime mustreid ja neid, mis neid lõhuvad - mõlemad põhjustavad meie ajule lisaenergia töötlemist. Liiga palju neist hetkedest avaldub pettumuse või segadusena. Neid probleeme näeme ka reaalses elus - kui meie näol on väike plekk või kui juuksed pole paigast ära. Ehkki me ei suuda 24pt ja 25pt fondi erinevust selgesõnaliselt tuvastada, saame seda tunda. Me ei saa seda täpselt tajuda, kuid meie aju teab, et midagi tunneb end halvasti.

Mõnusate visuaalsete elamuste kujundamiseks peame kehtestama redutseerivad ja tähendusrikkad reeglid selle kohta, mis on erinev ja mis on sarnane, et luua mustreid, mis on lihtsad, äratuntavad ja järjekindlad.

Kuidas saaksime erinevusi näidata?

Psühholoogias on just märgatav erinevus (JND) just muutuste summa, et erinevus oleks märgatav. Raskema raskuse märkamiseks või värvi teistsuguse värvuse märkimiseks on JND väärtus. Ehkki saame luua suuruselt ja värvilt astmelisi muudatusi, mis on pisut märgatavalt eristatavad, tahame siiski rõhutada eristamist, ilma et sellega üle pingutataks.

Visuaalsed eristajad peaksid olema tagasihoidlikud ja sisukad. Kas vajame vähem tähtsa sisu tähistamiseks teist kirjatüüpi? Ilmselt mitte. Kas peame kogu toote puhul kasutama nii ümmargust kui ka ruudukujulist profiilipilti? Ilmselt mitte. Kui visuaalseid eristajaid on liiga palju, on visuaalseid näpunäiteid raskem märgata ja tähendust omistada.

See on näide tekstitöötluse ja värvide redutseerivast paigutusest. Iga sammu suurus peaks olema eristatav ja kordumatu ning sellel peaks olema teatud tähendus.

Kuidas saame näidata sarnasust?

Lahtiselehelisele paberile kirjutades saate hõlpsalt järgmisele reale kirjutada, isegi vaatamata. Liinid kasutavad järjepidevat vahekaugust, et vähendada järgmise rea leidmise vaeva, luues visuaalse rütmi. Digitaalsed tooted teevad sama. Need loovad ootuse, korrates visuaalseid elemente ja organisatsioone, näiteks paigutades profiilipildi sisutüüpide vasakule ülaossa.

Sarnasuse üldiselt võib omistada sellele, et disainerid kasutavad sarnaseid töötlusi lihtsate vormide korral, näiteks sektsioonide ja alajaotiste jaoks kaks erinevat päise suurust. Nad saavad luua sama eeldatava käitumise keerukate vormide jaoks nagu inimesed ja ettevõtted.

Isegi granulaarsel tasemel võib see olla sama lihtne kui alati vea korral punase kasutamine või vihjete ja õppetekstide järjekindel käsitlus. Samuti võib see kasutada elementide vahel järjepidevaid vahereegleid.

Ülal on näide visuaalsest käsitlusest, kus kasutatakse veeriste ja polstrite loomiseks elementide vahel sammu 4pt. See hoiab ära teie meelevaldse olemise, kuid annab teie tootele ühtlase tühimiku.

Pannes selle kokku

Ükski põhimõte ei saa elada ilma teisteta. Ehkki see pole kõikehõlmav, tegeleb see algajate tasemel visuaalse kujundusega seotud suurte probleemidega. See võitleb impulsiga täita negatiivne ruum kasutu teabega või luua uusi visuaalseid paradigmasid, sest see näeb lahe välja. See hoiatab otsuste ülekoormamise eest, andes paljudele toimingutele sama kaalu. Samuti julgustab ta kuueteistkümnendsüsteemi, kirjasuuruse ja vahekauguse rakendamisel läbimõeldust ja järjekindlust.

Kolmeastmeline raamistik sunnib teid läbima iga põhimõtte ja sügavalt sukelduda. See võimaldab teil tuvastada, millises visuaalse kujunduse osas olete kõige nõrgem, ja võimaldab teistel teie tööd teravamalt kritiseerida. Püüame kõik paremaks saada, kuid selle tegemiseks on vaja lihtsalt sama sõnavara. Nii et järgmine kord visuaalse töö hindamisel küsige järgmisi küsimusi:

Kas see on kasulik? Kas on selge? Kas see on meeldiv?

___

Raamistikud ei määra seda, mis on õige, vaid loovad selle asemel sõnavara, mis viiks kokku mõisted, mida me kõik veel kasutame, kuid mida me ei sildista. Meil kõigil on mingi arvamus selle kohta, mida tähendab, et visuaalne töö oleks kasulik, selge või meeldiv. Seetõttu, kui te ei nõustu, võtke lahti oma definitsioonid, pakkige arutelu ja laskem joonduda. Mida kiiremini leiame sarnasusi, seda lihtsam on tõde pakendada ja seda rohkem inimesi saame koolitada paremate kogemuste loomiseks.

Aitäh Brad Birdsallile mõtete ja tagasiside eest!