Min passion for UX har fået mig til at videreudvikle mine UI-færdigheder. Jeg studerer UX på CPH Business for at kunne skabe bedre oplevelser, der opfylder brugernes og virksomheders behov.

Case studies

UX/UI
Koncept udvikling
Brand identity
Prototype
Data analyse

Green Horizont

Green Horizont’s kampagnewebsite er udviklet med fokus på lavt CO2-aftryk og bæredygtighed. Vi brugte optimerede medier og A/B-test for at forbedre performance. Med data fra Google Analytics og Hotjar samt vurdering fra Websitecarbon og Ecograder sikrede vi en miljøvenlig løsning.

UX/UI
Koncept udvikling
Brand identity
Prototype

EcoTrace

Vil du se, hvordan din internetbrug påvirker klimaet? Med EcoTrace får du et simpelt overblik over dit CO2-aftryk, pakket ind i en brugervenlig og flot designet app. Få personlige tips og gør en forskel for miljøet

UX/UI
Udvikling
Web design
Brand identity
Animation

Collectia

Hvordan jeg transformerede Collectias visuelle identitet til en legende og beroligende oplevelse i en traditionelt tung branche. Se hvordan design, animationer og et stærkt designsystem skabte en ny retning for inkassoverdenen. Klik her for at udforske hele casen!

Fisnik Lajqi
Multimediedesignerstuderende
CPH Business

Green Horizont

Rolle

Konceptudvikling • Design • Data analyse

Programmer

Figma • Hotjar • Google Analytics

Problemstilling

Problemstillingen var at udvikle en digital platform, der motiverer brugere til bæredygtige valg gennem teknologi og interaktivitet. Udfordringen var at skabe en engagerende og informativ løsning med nudging og gamification, samtidig med at vi implementerede bæredygtigt webdesign og optimerede brugeroplevelsen med A/B-tests.

Skitser og Mockup

Vi skitserede en landing page og fandt de vigtigste elementer for at opfylde brugerens behov og skabe en god forretningsmodel. Derefter lavede vi mockups i Figma med fokus på et rent og flot design, der er nemt at navigere.

Persona

Vi udviklede tre personas – en mor, far og datter – for at repræsentere husstandens forskellige motivationer, mål samt deres udfordringer og fordele. Dette gav os et solidt grundlag for at strukturere informationsarkitekturen og skabe en løsning, der effektivt imødekommer deres behov.

Landingpage A

Designet af landingpagen fokuserer på en god brugeroplevelse, så den er enkel, engagerende og let at bruge.

Navigationen er nem at forstå, så brugerne hurtigt kan finde information og få adgang til download og login.

Avatars skaber en følelse af fællesskab og opmuntrer til tilmelding, mens tilmeldingsformularen er placeret flere steder for at gøre processen nemmere.

Appens funktioner vises tydeligt, og CTA-knapper med kontrastfarver gør det let for brugerne at tage handling.

Footeren er enkel, mens farverige CTA’er fanger opmærksomhed. Den øverste del bruger kontrastfarver til at tiltrække og guide brugeren.

Samlet sikrer designet en enkel og engagerende rejse, der fremmer tilmelding.

Landingpage B & hypoteser

Vi brugte A/B-testning for at forbedre brugeroplevelsen ved at sammenligne forskellige designversioner og analysere, hvordan brugerne interagerede med dem.

Vi testede elementer som knapper, farver og layout for at finde ud af, hvilke versioner der gav højere konverteringsrater og bedst opfyldte brugernes behov.

Vi antog, at en sticky navbar ville øge antallet af klik ved at holde den synlig, mens brugeren scroller. For CTA-knapper forventede vi, at en mere kontrastfuld farve ville øge antallet af klik.

Til sign-up-formularen formodede vi, at en blødere farve ville gøre den mere attraktiv og føre til flere tilmeldinger. Vi testede også, om ombytning af grad

A/B-test af Scroll-adfærd og Time on Page

Ved hjælp af Hotjar testede vi scroll-adfærd og tid brugt på siden for version A og B af landingpagen. Resultaterne viste, at version B havde flere brugere, der scrollede til bunden og længere tid på siden. Dette viser, at version B engagerede brugerne bedre end version A.

CO2 udledning

Vi brugte både Ecograder og Beacon til at analysere CO2-udledningen fra vores landingpage. Resultaterne viste, at version B havde en score på 82/100 og en CO2-udledning på 0,22 gram pr. sidevisning, med en sidevægt på 573,60 KB, hvilket var 175,05 KB lavere end version A. Selvom forskellen mellem version A og B var lille, var version B en smule mere miljøvenlig uden at gå på kompromis med brugeroplevelsen.

Refleksion

Vores A/B-test viste, at ændringer som en fast navigationsbar, tydelige CTA-knapper, bedre gradienter og smartere placering af tilmeldingsformularer øgede brugerengagementet. Landingpage B havde større scroll-depth og lavere CO2-udledning, hvilket viser, at små justeringer kan forbedre både brugeroplevelse og bæredygtighed.
 
Fremover kan vi fokusere på at forbedre tilmeldingsformularen, reducere sidevægten ved at minimere tredjepartsscripts og optimere billeder. Vi kunne også teste en interaktiv app-demo for at øge engagementet. Disse forbedringer kunne implementeres i en ny version A.

EcoTrace

Rolle

Konceptudvikling • Design

Programmer

Figma

Problemstilling

Hvordan kan vi udvikle en app, der fremmer bæredygtighed og har en positiv social effekt ved at hjælpe brugerne med at forstå og reducere deres CO2-aftryk ved at overvåge deres internet- og mobilbrug, samtidig med at vi skaber en app, der er nem og engagerende at bruge? For at gøre dette skal vi præsentere data på en klar og motiverende måde, tilføje funktioner, der holder brugerne interessered. Appen skal være brugervenlig og inspirere til små ændringer, som gør en stor forskel for miljøet.

User Journey

Denne User Journey Mapping viser, hvordan brugerne går fra at opdage EcoTrace til at bruge appens pro-version. I starten opdager brugeren appen og undersøger, hvad den kan tilbyde. De går fra at være nysgerrige til at blive lidt skeptiske, mens de sammenligner mulighederne.

Når de prøver den gratis version, bliver de mere interesserede og engagerede, især når de ser fordelene ved appen. Når brugeren opgraderer til pro-versionen, bliver de glade og tilfredse, da de let kan navigere rundt og bruge alle funktionerne.

Til sidst føler brugeren sig motiveret og eftertænksom over deres oplevelse, hvilket viser, at appen har gjort en positiv forskel i deres digitale vaner. Denne mapping hjælper med at forstå, hvad brugeren har brug for i hvert trin, så vi kan forbedre deres oplevelse.

Etisk og Uetisk

Under processen lavede vi en analyse af både etiske og uetiske designmetoder for at forstå, hvordan brugeroplevelsen kunne påvirkes. I den uetiske tilgang inkluderede vi elementer som misvisende tekster og designvalg, der gjorde det svært for brugeren at navigere frit. For eksempel blev farverne på knapper som “luk” (X) gjort mindre synlige for at gøre det sværere at afvise pop-ups. Desuden blev der konstant vist en opfordring til at opgradere til pro-versionen i hjørnet af skærmen, hvilket skabte en følelse af pres og frustration hos brugeren.

Non-human persona

Vi skabte en Non-human persona, en venlig isbjørn, som symboliserer beskyttelsen af Arktis og klimaet. Isbjørnen fungerer som en støttende guide, der hjælper brugerne med at træffe grønnere valg i hverdagen for at reducere deres CO2-aftryk og beskytte miljøet. Isbjørnen har en omsorgsfuld og bevidst personlighed og motiverer brugerne med ugentlige rapporter om deres miljøpåvirkning samt tips til at reducere energiforbrug og leve mere bæredygtigt. Budskabet er klart: “Sammen kan vi tage ansvar og beskytte både klimaet og min verden af is gennem dine små, men vigtige, handlinger.”

SDGs

I vores projekt har vi valgt at fokusere på Verdensmål 13 – Klimaindsats, Verdensmål 12 – Ansvarligt forbrug og produktion, og Verdensmål 7 – Bæredygtig energi. EcoTrace-appen hjælper brugerne med at forstå og reducere deres CO2-aftryk, bidrager til at bekæmpe klimaforandringer, giver tips til ansvarligt forbrug og energireduktion, og motiverer til at vælge bæredygtige energiløsninger. Ved at fokusere på disse mål viser vi, hvordan EcoTrace gør det nemt for brugerne at handle og skabe en positiv forskel for miljøet og samfundet.

Skitseer & Wireframes

Vi har arbejdet med at lave skitser og wireframes som en del af udviklingen af EcoTrace-appen. Skitserne hjalp os med hurtigt at udvikle idéer til layout og gav os mulighed for at eksperimentere med forskellige opbygninger, så vi kunne finde den mest effektive måde at præsentere information på. Denne fase gjorde det muligt for os at identificere og løse potentielle designudfordringer tidligt i processen og skabte en fleksibilitet, der fremmede kreativiteten og innovationen i vores designløsninger.

Wireframes blev derefter brugt til at give en mere detaljeret visualisering af layoutet og indholdsplaceringen. De tjente som et blueprint for appens opbygning og var afgørende for at skabe en intuitiv brugeroplevelse. Med wireframes kunne vi teste og tilpasse forskellige funktioner og navigationselementer, hvilket sikrede, at designet forblev brugervenligt og opfyldte vores mål om at levere en app, der hjælper brugerne med at forstå og reducere deres CO2-aftryk.

UX projekt brief

I vores UX projekt brief for EcoTrace beskriver vi, at appen er designet til at hjælpe brugerne med at forstå internettets påvirkning på klimaet og reducere deres CO2-udslip.

Apple, der allerede arbejder bæredygtigt, giver appen en mulighed for at udvide denne indsats og inddrage brugerne i kampagnen.

Projektets mål er at oplyse brugerne om internettets CO2-påvirkning og guide dem til at reducere deres udslip ved hjælp af appens anbefalinger.

Succesen måles gennem øget bevidsthed, reduktion af CO2-udslip og en engagerende brugeroplevelse, der motiverer til fortsat brug.

Målgruppen er klimaorienterede personer og virksomheder med fokus på bæredygtighed. Appen kræver en telefon og netværksadgang for at fungere optimalt.

En udfordring kan være, at appen potentielt kan bruge for meget energi, hvis den er åben for længe. Projektets leverancer inkluderer en færdig mobilapp og en rapport, der viser, hvordan den har hjulpet brugerne med at reducere deres CO2-udslip.

Accessibility

Vi har arbejdet med at sikre, at EcoTrace-appen er tilgængelig for alle brugere, uanset deres behov. For at gøre appen brugervenlig for personer med forskellige former for farveblindhed har vi taget højde for protanopia (rød-mangel), deuteranopia (grøn-mangel), tritanopia (blå-gul farveblindhed) og monokromasi (total farveblindhed). Dette indebærer, at vi har valgt farveskemaer og kontraster, der er synlige og tydelige for brugere med disse udfordringer.

Derudover har vi sikret, at appens kontrastniveauer opfylder standarderne for læsbarhed, hvilket hjælper brugerne med at skelne mellem forskellige elementer på skærmen. Touch targets er blevet optimeret, så de er store og lette at trykke på, hvilket gør navigationen mere brugervenlig, især for dem med motoriske udfordringer. Vi har også arbejdet med typografien for at sikre, at den er letlæselig og klar, hvilket gør informationen i appen tilgængelig for alle brugere.

Disse tiltag er med til at sikre, at EcoTrace-appen kan bruges af en bred vifte af brugere og leverer en inkluderende oplevelse, hvor alle kan få gavn af appens funktioner og budskaber.

Refleksion

Refleksionen over arbejdet med EcoTrace har været en lærerig proces, hvor vi har kombineret bæredygtighed med social impact og arbejdet med relevante SDG-mål. Vi har fået dybere indsigt i, hvordan design kan skabe en positiv forskel og engagere brugerne til at tage ansvar for deres digitale vaner. Det har været værdifuldt at udforske både etiske og uetiske designmetoder for at sikre, at vores løsninger er brugervenlige og gennemsigtige. Isbjørnen som non-human persona tilføjede en unik dimension, der gjorde appen mere personlig og motiverende for brugerne. Skitser og wireframes var afgørende for at skabe en intuitiv oplevelse, og vores fokus på tilgængelighed gjorde appen mere inkluderende for alle.

Collectia

Rolle

Konceptudvikling • Design • Kode (Wordpress)

Programmer

Figma • Wordpress • SVGator • Adobe CC

Problemstilling

Hvordan kan man designe en brandidentitet og digital oplevelse for en inkassovirksomhed, så den føles imødekommende og betryggende i stedet for truende? Collectia, som er en inkassovirksomhed, har som mål at præsentere deres services og værdier på en måde, der er indbydende og informativ fremfor afskrækkende. Projektet omfattede en fuld redesign af Collectias visuelle identitet og hjemmeside for at skabe en oplevelse, der appellerer både til dem, der søger Collectias tjenester, og dem, der allerede har modtaget kommunikation fra virksomheden.

Designsystem

Et omfattende designsystem blev bygget i Figma med fokus på at skabe et konsistent og indbydende design, der appellerer både til dem, der søger Collectias tjenester, og til dem, der allerede har modtaget kommunikation fra virksomheden. Systemet indeholdt farvepaletter, typografi og UI-komponenter, som sikrede ensartethed på tværs af hjemmesidens forskellige sektioner og skabte en sammenhængende brugeroplevelse.

Brand Identitet

Brandidentiteten for Collectia blev designet med fokus på at gøre inkasso mindre skræmmende og mere imødekommende. Grafiske elementer og ikoner blev udformet med et playful præg for at skabe en venlig og tryg atmosfære. Identiteten blev understøttet af en nøje udvalgt farvepalet og visuelle elementer, der signalerer åbenhed og tillid, hvilket gjorde det muligt at skabe en positiv oplevelse for både dem, der søger Collectias tjenester, og dem, der allerede har modtaget kommunikation fra virksomheden.

Hi-fi Design

High-fidelity mockups blev udviklet i Figma med udgangspunkt i designsystemet, som omfattede farvepaletter, typografi og UI-komponenter. Farverne blev brugt til tydeligt at adskille de to hovedsektioner af hjemmesiden: én for nye kunder og én for dem, der allerede har modtaget kommunikation fra Collectia. Dette sikrede, at brugerne nemt kunne finde den information, de havde brug for, og navigere intuitivt.

Wordpress

Hjemmesiden blev udviklet i WordPress ved hjælp af YooTheme-temaet, hvilket gjorde det muligt at skabe en fleksibel og responsiv løsning. Denne tilgang sikrede en effektiv implementering af designet og en smidig brugeroplevelse på tværs af forskellige enheder.

Refleksion

Arbejdet med Collectia gav mig indsigt i, hvordan jeg kan kombinere kreative designløsninger med en følsom tilgang for at skabe en digital oplevelse, der er både professionel og empatisk. Det var lærerigt at se, hvordan et veludført designsystem og en gennemtænkt brandidentitet kan påvirke brugerens opfattelse af en virksomhed positivt. Selvom jeg opnåede en sammenhængende og imødekommende løsning, er der altid plads til at forbedre interaktionsmulighederne og gøre hjemmesiden endnu mere tilgængelig. Opgaven har styrket min forståelse for, hvordan design kan ændre brugerens opfattelse og skabe en tillidsfuld oplevelse, selv i komplekse brancher som inkasso.