Käyttäjäystävällinen ja visuaalisesti vetovoimainen verkkosivu-uudistus
Liikala, Noora (2025)
Liikala, Noora
2025
All rights reserved. This publication is copyrighted. You may download, display and print it for Your own personal use. Commercial use is prohibited.
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-2025053018425
https://urn.fi/URN:NBN:fi:amk-2025053018425
Tiivistelmä
Tämän toiminnallisen opinnäytetyön tavoitteena oli suunnitella ja toteuttaa käyttäjäystävällinen sekä visuaalisesti houkutteleva verkkosivuprototyyppi toimeksiantajayritykselle. Uudistuksen taustalla oli toimeksiantajayrityksen kokema tyytymättömyys nykyiseen verkkosivustoonsa, joka ei enää vastannut sen tarpeita. Verkkosivusto toimii yrityksen ainoana digitaalisen markkinoinnin kanavana, ja sen kehittämisellä pyrittiin parantamaan asiakaskokemusta sekä tukemaan uusasiakashankintaa.
Työ rajattiin koskemaan ainoastaan verkkosivuston visuaalisen prototyypin suunnittelua ja luomista. Prototyyppi laadittiin ulkoasultaan vastaamaan mahdollisimman tarkasti valmista verkkosivustoa. Suunnittelussa keskityttiin erityisesti sivuston rakenteeseen, visuaaliseen ilmeeseen ja käyttäjäkokemuksen parantamiseen. Rajaus tehtiin, koska työn ensisijaisena tavoitteena oli visuaalisen suunnittelun kehittäminen, ei tekninen toteutus tai sisällöntuotanto.
Työn teoriaosuus muodostuu käyttäjäkokemuksen (UX), käyttöliittymäsuunnittelun (UI), visuaalisen suunnittelun sekä palvelumuotoilun keskeisistä periaatteista. Näiden osa-alueiden pohjalta rakentuu kokonaisvaltainen suunnitteluprosessi, jonka tavoitteena on käyttäjälähtöinen ja visuaalisesti houkutteleva verkkosivusto. Palvelumuotoilu toimii työn viitekehyksenä, ja sen tuplatimantti-malli ohjaa suunnittelua käyttäjien tarpeista lähtien. UX keskittyy käyttäjäkokemuksen parantamiseen, kun taas UI painottaa visuaalista ja käytettävyyteen liittyvää suunnittelua. Teoriaosuus tarjoaa näin vahvan perustan työn käytännön
toteutukselle.
Työn toiminnallinen osuus toteutettiin palvelumuotoilun tuplatimantti-mallin mukaisesti, joka jakaa suunnitteluprosessin kahteen päävaiheeseen. Ensimmäisessä vaiheessa kartoitettiin nykyisen verkkosivuston tilanne yhteistyössä toimeksiantajan kanssa sekä käyttäjätestauksen avulla. Näin saatiin esiin kehitystarpeet ja määriteltiin, mitä muutoksia tarvitaan käyttäjäkokemuksen ja visuaalisen ilmeen parantamiseksi. Toisessa vaiheessa suunnitteluprosessi eteni ideoinnista konkreettiseen kehittämiseen. Ideointivaiheessa hyödynnettiin vertailukehittämistä ja tunnelmataulua inspiraation lähteinä. Näiden pohjalta laadittiin rautalankamalli, joka toimi rakenteellisena pohjana lopulliselle visuaaliselle prototyypille.
Työ osoitti, että visuaalisella suunnittelulla on olennainen rooli käyttäjäkokemuksen muodostumisessa, sillä se vaikuttaa merkittävästi niin ensivaikutelmaan, käytettävyyteen kuin sisällön
hahmottamiseen. Lopputuotoksena syntynyt visuaalinen prototyyppi vastasi toimeksiantajan tavoitteita, ja työ koettiin kokonaisuudessaan onnistuneeksi. Prototyyppi toimii konkreettisena ja hyödyllisenä työkaluna verkkosivuston jatkokehityksessä.
Työ rajattiin koskemaan ainoastaan verkkosivuston visuaalisen prototyypin suunnittelua ja luomista. Prototyyppi laadittiin ulkoasultaan vastaamaan mahdollisimman tarkasti valmista verkkosivustoa. Suunnittelussa keskityttiin erityisesti sivuston rakenteeseen, visuaaliseen ilmeeseen ja käyttäjäkokemuksen parantamiseen. Rajaus tehtiin, koska työn ensisijaisena tavoitteena oli visuaalisen suunnittelun kehittäminen, ei tekninen toteutus tai sisällöntuotanto.
Työn teoriaosuus muodostuu käyttäjäkokemuksen (UX), käyttöliittymäsuunnittelun (UI), visuaalisen suunnittelun sekä palvelumuotoilun keskeisistä periaatteista. Näiden osa-alueiden pohjalta rakentuu kokonaisvaltainen suunnitteluprosessi, jonka tavoitteena on käyttäjälähtöinen ja visuaalisesti houkutteleva verkkosivusto. Palvelumuotoilu toimii työn viitekehyksenä, ja sen tuplatimantti-malli ohjaa suunnittelua käyttäjien tarpeista lähtien. UX keskittyy käyttäjäkokemuksen parantamiseen, kun taas UI painottaa visuaalista ja käytettävyyteen liittyvää suunnittelua. Teoriaosuus tarjoaa näin vahvan perustan työn käytännön
toteutukselle.
Työn toiminnallinen osuus toteutettiin palvelumuotoilun tuplatimantti-mallin mukaisesti, joka jakaa suunnitteluprosessin kahteen päävaiheeseen. Ensimmäisessä vaiheessa kartoitettiin nykyisen verkkosivuston tilanne yhteistyössä toimeksiantajan kanssa sekä käyttäjätestauksen avulla. Näin saatiin esiin kehitystarpeet ja määriteltiin, mitä muutoksia tarvitaan käyttäjäkokemuksen ja visuaalisen ilmeen parantamiseksi. Toisessa vaiheessa suunnitteluprosessi eteni ideoinnista konkreettiseen kehittämiseen. Ideointivaiheessa hyödynnettiin vertailukehittämistä ja tunnelmataulua inspiraation lähteinä. Näiden pohjalta laadittiin rautalankamalli, joka toimi rakenteellisena pohjana lopulliselle visuaaliselle prototyypille.
Työ osoitti, että visuaalisella suunnittelulla on olennainen rooli käyttäjäkokemuksen muodostumisessa, sillä se vaikuttaa merkittävästi niin ensivaikutelmaan, käytettävyyteen kuin sisällön
hahmottamiseen. Lopputuotoksena syntynyt visuaalinen prototyyppi vastasi toimeksiantajan tavoitteita, ja työ koettiin kokonaisuudessaan onnistuneeksi. Prototyyppi toimii konkreettisena ja hyödyllisenä työkaluna verkkosivuston jatkokehityksessä.
