En one page-portfolio i cyberpunkstil som blev grunden för mitt examensarbete inom UX, webbdesign och användarvänlighet.
Mörk bakgrund, neonrosa och lila, futuristiska detaljer – och en AI-genererad cyberpunkversion av mig själv med lila hår.
Den här portfoliohemsidan skapade jag under min YH-utbildning Webbutvecklare inom .NET. Jag designade och utvecklade webbplatsen själv och valde medvetet ett tydligt cyberpunktema för att skapa en portfolio med en egen visuell identitet.
Webbplatsen byggdes som en one page-hemsida där besökaren kunde navigera mellan sidans olika sektioner via menyn.
Den innehöll bland annat:
- presentation och hero
- projektgalleri
- information om mig
- kompetenser och tekniker
- nedladdningsbart CV
- kontaktformulär
- länkar till GitHub och LinkedIn
Från portfolio till examensarbete
Portfoliohemsidan blev senare grunden för mitt examensarbete ”En användarvänlig portfoliohemsida”.
Syftet var att undersöka hur design och funktionalitet på webbplatsen kunde förbättras för att ge besökaren en bättre användarupplevelse.
Jag fokuserade bland annat på:
- läsbarhet och typografi
- färger och kontraster
- navigation
- interaktiva funktioner
- användarvänlighet
Det innebar att projektet inte bara handlade om att skapa en visuellt annorlunda webbplats. Jag fick även möjlighet att utvärdera mina egna designval och se hur riktiga användare upplevde webbplatsen.
Användartestning
För examensarbetet genomförde jag en digital enkät där 16 personer fick utvärdera portfoliohemsidan.
Resultatet var övervägande positivt. Bland annat bedömde 75 % textens läsbarhet som ”väldigt bra”, och de interaktiva funktionerna som knappar, länkar och nedladdningar fick också mycket positiv respons.
Samtidigt gav undersökningen värdefull konstruktiv feedback.
Eftersom webbplatsen är byggd som en one page-hemsida upplevde några användare att det blev mycket scrollande. Det kom också synpunkter på den mörka designen, färgkontrasterna och tangentbordsnavigeringen.
Det blev en viktig del av projektet: att inte bara skapa något jag själv tyckte fungerade, utan att låta användare testa det och sedan analysera vad som faktiskt kunde förbättras.
Mitt arbete
Jag ansvarade själv för hela projektet, från idé och visuell identitet till utveckling och utvärdering.
Jag arbetade bland annat med:
- UX/UI
- webbdesign
- frontendutveckling
- responsiv design
- färg och typografi
- navigering och sidstruktur
- interaktiva element
- kontaktformulär
- användartestning
- analys av användarfeedback
Projektet gav mig möjlighet att kombinera flera områden som jag tycker om att arbeta med: webbutveckling, grafisk design och UX.
Vad jag tog med mig från projektet
En snygg design är inte automatiskt en användarvänlig design.
Cyberpunkstilen gav webbplatsen en tydlig identitet, men användartestningen visade samtidigt hur exempelvis mörka färger, kontraster och en lång one page-layout kan påverka upplevelsen.
Examensarbetet gav mig därför inte bara erfarenhet av att designa och utveckla en webbplats, utan också av att utvärdera den, ta emot konstruktiv feedback och identifiera förbättringar utifrån användarnas perspektiv.
Läs examensarbetet
Vill du läsa mer om processen, användarundersökningen och resultatet finns hela examensarbetet som PDF.
En användarvänlig portfoliohemsida
Examensarbete – Webbutvecklare inom .NET, 2024
Och det lila håret då?
En av deltagarna avslutade sin betydligt mer seriösa feedback om webbplatsens design och användarvänlighet med:
”P.S. Du klär i lila hårfärg! ”
Så om användartestet inte avgjorde om jag skulle behålla one page-layouten, fick jag åtminstone svar på en annan viktig fråga. 😄