Miksi jotkin brändit näyttävät heti luotettavilta, kun taas toiset tuntuvat amatöörimäisiltä hyvistä tuotteista huolimatta? Osa vastausta on käyttöliittymäsuunnittelun periaatteissa. Et tarvitse suunnittelijan tutkintoa kehittyäksesi. Tarvitset selkeän määritelmän ja muutaman käytännön tarkistuksen.
Käyttöliittymäsuunnittelun periaatteisiin kuuluvat johdonmukaisuus, palaute, näkyvyys ja virheiden ehkäisy. Tässä luvussa kerrotaan selkeästi, mitä se tarkoittaa, miksi se vaikuttaa verkkosivustoosi ja markkinointiisi ja miten sitä käytetään ilman jargonia. Näet myös, miten mitä on ui kuuluu samaan kuvaan. Käydään se läpi vaihe vaiheelta.
Käyttöliittymäsuunnittelun periaatteiden ydin
Käyttöliittymäsuunnittelun periaatteisiin kuuluvat johdonmukaisuus, palaute, näkyvyys ja virheiden ehkäisy.
Ne pitävät käyttöliittymät opittavina ilman käyttöohjeita.
Visuaalisen suunnittelun periaatteet tukevat käyttöliittymän selkeyttä hierarkian ja kontrastin avulla.
Käytäntöön
Näytä selkeä onnistumis- tai virheilmoitus jokaisen lomakkeen lähettämisen jälkeen.
Tutustu lukuihin käyttäjälähtöinen suunnittelu ja UX-suunnittelu yritykselle, niin liität tämän aiheen muuhun moduuliin.
Pienet johdonmukaiset parannukset voittavat satunnaiset kokonaisuudistukset, kun vasta opettelet.
Käytännön tarkistuslista tälle päivälle
Näytä selkeä onnistumis- tai virheilmoitus jokaisen lomakkeen lähettämisen jälkeen.
Kun tarkastat sivua, kysy, näkyvätkö käyttöliittymäsuunnittelun periaatteet jo ensimmäisessä vierityksessä mobiilissa. Jos eivät, vaihda osioiden järjestystä, ennen kuin hiot yksityiskohtia.
Tallenna kuvakaappaukset ennen muutoksia ja niiden jälkeen, niin opit, mikä auttoi käyttöliittymäsuunnittelun periaatteissa sivustollasi.
Jaa lista kaikille, jotka päivittävät sivustoasi, jotta mitä on ui pysyy yhtenäisenä uusilla sivuilla.
Valitse yksi mittari, jota seuraat tässä kuussa, esimerkiksi sivulla vietetty aika tai lomakkeen aloitukset. Silloin suunnittelumuutokset sidotaan liiketoiminnan tuloksiin, ei pelkkään makuun.
Miten tämä aihe liittyy laajempaan brändiisi
Visuaaliset valinnat eivät tavallisesti jää yhdelle sivulle. Visuaalisen suunnittelun periaatteet tukevat käyttöliittymän selkeyttä hierarkian ja kontrastin avulla.
Somejulkaisujesi, sähköpostiesi ja painettujen materiaalien tulisi toistaa samaa hierarkiaa, värejä ja kirjasinsääntöjä kuin verkossa.
Kun brändin visuaalit alkavat erkaantua toisistaan, asiakkaat aistivat hienoisen epäsuhdan, vaikka eivät osaisi selittää sitä.
Käytä lukua mobiilisovelluksen suunnittelu vertaillaksesi muistiinpanoja tämän moduulin toiseen lukuun.
Ne pitävät käyttöliittymät opittavina ilman käyttöohjeita.
Kysymykset, jotka usein unohdetaan
Lisätermit, kuten mitä on ui ja visuaalisen suunnittelun periaatteet, auttavat löytämään syvempiä esimerkkejä ja vertaamaan työtäsi yleisiin standardeihin.
Visuaalisen suunnittelun periaatteet tukevat käyttöliittymän selkeyttä hierarkian ja kontrastin avulla.
Kirjoita ylös yksi ennen ja jälkeen -muutos, jota testaat toimivalla sivulla tällä viikolla. Pienet mitatut muokkaukset päihittävät epämääräiset suunnitelmat.
Yhteinen sanasto käyttöliittymäsuunnittelun periaatteista vähentää korjauskierroksia suunnittelijoiden ja toimistojen kanssa.
Työkalut, jotka helpottavat visuaalisia päivityksiä
Monen asettelu- ja tyyliongelman korjaamiseen ei tarvita omaa koodia. Visuaalisessa editorissa säädät välit, värit ja typografian ja esikatselet samalla mobiili- ja työpöytänäkymät.
WEMASYn Sivustonrakentajassa on visuaalinen muokkaus, joten voit julkaista muutokset ilman, että odotat kehittäjää jokaisen säädön takia. Avaa Sivustonrakentaja, kun haluat soveltaa oppimaasi.
Kun julkaiset päivityksiä, tarkista uudelleen luvut käyttäjälähtöinen suunnittelu ja UX-suunnittelu yritykselle, jotta moduuli pysyy mielessäsi kokonaisuutena.
Sinulla on nyt toimiva näkökulma käyttöliittymäsuunnittelun periaatteisiin. Käytä sitä, kun arvioit sivustoasi, hyväksyt markkinointimateriaalia tai briefaat suunnittelijaa. Jatka lukuihin UX-suunnittelu yritykselle ja mobiilisovelluksen suunnittelu, niin vauhti säilyy tässä moduulissa.
Käyttöliittymäsuunnittelun periaatteet ovat taito, joka kehittyy vähitellen. Palaa tähän lukuun, kun olet julkaissut yhden parannuksen, jotta ideat siirtyvät lukemisesta tavaksi. Pienet toistuvat tarkistukset toimivat paremmin kuin se, että yrität ahtaa kaikki säännöt päähän kerralla. Kirjaa muistiin, mikä toimi yleisöllesi, niin seuraava päivitys on nopeampi.
Usein kysytyt kysymykset
Kuinka kauan käyttöliittymäsuunnittelun periaatteiden parantaminen kestää?
Useimmat pienyritykset näkevät selkeämpiä sivuja muutamassa keskittyneessä istunnossa, kun soveltavat tämän luvun perusteita. Aloita etusivusta ja ota samat säännöt sitten käyttöön palvelu- ja yhteystietosivuilla.
Tarvitsetko suunnittelijan käyttöliittymäsuunnittelun periaatteisiin?
Suunnittelija auttaa monimutkaisissa brändiuudistuksissa, mutta moni käyttöliittymäsuunnittelun periaatteisiin liittyvä korjaus onnistuu itse, kun tiedät, mitä katsoa. Käytä lukua käyttäjälähtöinen suunnittelu tämän luvun rinnalla.
Voiko WEMASY auttaa soveltamaan käyttöliittymäsuunnittelun periaatteita verkkosivustollasi?
WEMASYn Sivustonrakentajassa on visuaalinen editori, jolla säädät asettelua, värejä ja typografiaa ilman koodia. Avaa Sivustonrakentaja päivittääksesi mallit ja esikatsellaksesi muutokset mobiilissa.
Mikä on yleisin virhe käyttöliittymäsuunnittelun periaatteissa?
Ihmiset yrittävät korjata kaiken kerralla sen sijaan, että menisivät yksi sivu kerrallaan. Valitse yksi ykkösasia, kuten luettavuus tai kontrasti, ja katso sitten seuraavaa parannusta varten UX-suunnittelu yritykselle.
Miten käyttöliittymäsuunnittelun periaatteet liittyvät SEO:hon?
Selkeä visuaalinen hierarkia ja luettava teksti pitävät kävijät sivulla pidempään, mikä tukee hakukoneiden seuraamia sitoutumissignaaleja. Yhdistä suunnittelukorjaukset vankkaan sisältörakenteeseen, niin tulokset ovat parhaat.
Mitä kannattaa opiskella seuraavaksi käyttöliittymäsuunnittelun periaatteiden jälkeen?
Jatka lukuihin käyttäjälähtöinen suunnittelu ja UX-suunnittelu yritykselle tässä kirjassa, niin rakennat brändillesi kokonaisen visuaalisen järjestelmän verkkoon.