Yhtenäisyys ja koherenssi

Mikä tekee designista yhtenäisen?

Yhtenäisyys on se ominaisuus, joka saa designin tuntumaan yhdeltä asialta eikä osien kokoelmalta. Kun sivulla on yhtenäisyys, et huomaa yksittäisiä elementtejä — koet kokonaisuuden. Kun yhtenäisyys puuttuu, huomaat jokaisen palan taistelevan huomiosta.

Yhtenäisyys syntyy jaettujen ominaisuuksien toistosta: sama kirjasintyyppi, sama välistysrytmi, sama värilämpötila, sama reunakäsittely. Mitä enemmän ominaisuuksia elementit jakavat, sitä yhtenäisemmiltä ne tuntuvat.

Jokainen tämän sivuston tyyli saavuttaa yhtenäisyyden — mutta eri keinoin. Bauhaus saavuttaa sen yhdellä kirjasintyypillä ja matemaattisella johdonmukaisuudella. Victorian saavuttaa sen johdonmukaisella lämmöllä ja tiheydellä. Web-brutalismi saavuttaa sen johdonmukaisella poissaololla.

Mikä visuaalinen ääni on ja miten sitä ylläpidetään?

Visuaalinen ääni on se 'persoonallisuus', joka kulkee designin jokaisen elementin läpi — kuin kirjailijan ääni kulkee jokaisen lauseen läpi. Se ei ole mikään yksittäinen ominaisuus vaan kaikkien ominaisuuksien yhdistelmä, joka luo johdonmukaisen luonteen.

Art Decon ääni on käskevä ja täsmällinen: versaaliotsikot, geometrinen koriste, kulta-aksentti, tiukka symmetria. Jokainen elementti puhuu samaa kieltä.

Cottagecoren ääni on lämmin ja käsintehty: antiikvafontit, vaimeat maavärit, antelias rivinkorkeus. Jokainen elementti tuntuu ihmiskäden koskettamalta.

Web-brutalismin ääni on rehellinen ja raaka: järjestelmäfontit, ei koristelua, välittömät siirtymät, koko leveys. Jokainen elementti kieltäytyy olemasta enempää kuin on.

Ääntä ylläpidetään rajoituksella. Sillä hetkellä kun tuot elementin joka puhuu eri kieltä (pyöristetty kulma Art Decossa, koristefontti Bauhausissa), ääni murtuu.

Miten luodaan koherenssi eri sivutyyppien välillä?

Verkkosivustolla on monia sivutyyppejä — etusivu, artikkeli, galleria, lomake. Koherenssi tarkoittaa että ne kaikki tuntuvat samalta sivustolta, vaikka palvelevatkin eri tarkoituksia.

Työkalut: johdonmukainen typografia (samat fontit kaikilla sivuilla), johdonmukainen väri (sama paletti), johdonmukainen välistys (sama rytmi), johdonmukaiset interaktiokuviot (samat hover-tilat, samat siirtymät).

Tällä sivustolla oppimissivut ja tyylisivut ovat rakenteellisesti erilaisia — mutta tuntuvat samalta sivustolta, koska ne jakavat samat CSS-muuttujat. Fontti, värit, välistys ja koristeet mukautuvat yhdessä. Vaihda tyyli, ja kaikki muuttuu johdonmukaisesti.

Tämä on StyleShiftin ydinopetus yhtenäisyydestä: järjestelmä luo koherenssin, ei yksittäinen suunnittelija. Hyvin suunniteltu järjestelmä tuottaa yhtenäisyyden automaattisesti minkä tahansa sisällön kohdalla.

Milloin epäjohdonmukaisuus on paikallaan?

Kaiken ei pitäisi olla johdonmukaista. Tarkoituksellinen epäjohdonmukaisuus luo korostuksen — kuten aksenttiväri neutraalissa paletissa tai lihava otsikko tavallisessa leipätekstissä.

Avainsana on tarkoituksellinen. Tahaton epäjohdonmukaisuus (yksi kortti 12px pyöristyksellä, toinen 8px, ilman syytä) luo levottomuutta. Tarkoituksellinen epäjohdonmukaisuus (koko leveyden hero joka rikkoo muuten kapean asettelun) luo merkitystä.

Memphis on tyyli joka ymmärtää tarkoituksellisen epäjohdonmukaisuuden parhaiten. Sen törmäävät värit, rikotut gridit ja sekoitetut kirjasintyypit eivät ole sattumanvaraisia — ne ovat johdonmukaisia epäjohdonmukaisuudessaan. Sääntö on: riko sääntöjä. Ja tätä sääntöä noudatetaan kaikkialla.

Testi: jos voit selittää miksi jokin on erilainen, se on tarkoituksellista. Jos et voi, se on virhe.