UX/UI
PROJEKT
Moonlight Maze
Research och arbetsprocess
För att förstå användarnas behov inledde vi projektet med intervjuer. Vi började med en gemensam brainstorming i Miro där vi tillsammans formulerade 12 relevanta intervjufrågor. Efter att ha genomfört testintervjuer identifierade vi brister i frågorna och lade till två till, totalt 14 frågor.
Vi genomförde fem kvalitativa intervjuer (30–60 min vardera) som dokumenterades i Miro med färgkodade post-its för att skapa en tydlig överblick av vardera intervju. Under analysen insåg vi att ytterligare kvantitativ data behövdes, därför kompletterade vi med en enkät baserad på våra intervjufrågor. Totalt fick vi svar från 19 personer.
Nyckelinsikter från vår research
Behov av enkel kontakt med närstående i otrygga situationer (t.ex. under resor).
Möjlighet att dela sin plats i realtid med anhöriga.
Diskreta sätt att larma, exempelvis via app eller trygghetsknapp.
Större synlighet och tillgång till kvinnojourer och resurser för våldsutsatta kvinnor.
Tydlig information om hjälpinsatser.
Ökad utbildning om mäns våld mot kvinnor på skolor och arbetsplatser.
Baserat på våra insikter började vi skissa funktioner som kunde möta användarnas behov, genom att skapa pappersskisser. Nästa steg var att gemensamt utveckla flowcharts i Miro för att visualisera användarflöden och funktioner.
För att välja vilka funktioner vi skulle prioritera använde vi dot voting. Resultatet blev en gemensam flowchart som låg till grund för vår kommande mid-fidelity prototyp.
Gemensam flowchart
Idégenerering i Miro
Introduktion
Moonlight Maze är en webbapplikation utvecklad i ett fiktivt samarbete med ROKS och SOS Alarm, med syftet att erbjuda kvinnor i utsatta miljöer ett tryggt och dolt sätt att söka hjälp.
Genom användarcentrerad research designade vi ett verktyg som kombinerar stöd från kvinnojourer med en direktlänk till SOS Alarm. Applikationen innehåller funktioner som larmknapp (mån-ikonen), chatt, självskattningstest och en distraherande spelvy, allt för att ge snabb tillgång till hjälp i en potentiellt hotfull situation.
Mid-fidelity prototyp
Använda program:
Projekttid: 3 veckor
Roll: Vi var 4 studerande som alla hade rullande roller.
Vi alla arbetade med de olika delarna i projektet.
Visuell design och anpassning till ROKS
Designen inspirerades av ROKS visuella identitet. Vi valde att använda ROKS färger, typsnitt och knappdesign för att uppnå igenkänning och tydlighet. Färgval för knappar och text testades mot tillgänglighetsstandarder (WCAG) under processens gång för att få tydliga kontraster och för att följa WCAGs riktlinjer.
Vi har i teamet arbetat utefter tydliga designprinciper då vi utgått från textregler samt ramavstånd för att hålla samma standard mellan de olika vyerna.
Våra insikter har visat att varje iterering och förändring vi gjort har baserats på beslut från användartester.
Slutligen, en överblick av vår High-Fidelity prototyp:
Tekniska Museet
Introduktion
I detta projekt samarbetade vi med Tekniska museet för att ta fram förbättringsförslag som förlänger och fördjupar användarupplevelsen före, under och efter Domen, museets rymdutställning. Arbetet fokuserade på hur digitala lösningar kan stödja både yngre och äldre målgrupper, samt besökare med och utan egen mobiltelefon.
Använda program:
Projekttid: 4 veckor
Roll: Figma - Wireframes, prototyping, design
Hover / Click state
På mobil ersätter ett tryck hover-beteendet. När användaren trycker på en planet visas samma visuella feedback som i desktop versionen.
Active state
Användaren bekräftas efter val av planet, och kan enkelt navigera tillbaka med hjälp av pilen.
Default state
Visualisering av solsystemets planeter i ordning från solen och utåt.
Designprinciper
Alla förslag utgick från Tekniska museets befintliga visuella identitet och designriktlinjer, med fokus på tillgänglighet, tydlighet och en låg tröskel för interaktion.
Koncept 2:
I det andra konceptet designade vi en stationär tablet‑station inne i den fysiska rymdutställningen. Här kan besökaren själv välja vilka planeter eller teman de vill lära sig mer om, helt i sin egen takt.
Syftet är att:
skapa en förlängd och mer flexibel användarupplevelse efter själva domvisningen
erbjuda ett lugnt utrymme för fördjupning
tillgängliggöra information för alla tekniska nivåer och åldrar
Stationen fungerar både som en fristående upplevelse och som ett komplement till domen, vilket gör helheten mer sammanhängande och interaktiv.
Koncept 1:
För att göra utställningen mer interaktiv och lättillgänglig togs därför fram ett koncept där QR‑koder placeras på stolarna i domen.
Syftet är att besökare enkelt ska kunna använda sin mobiltelefon för att delta i snabba omröstningar eller reflektioner.
Vi utvecklade även en alternativ version riktad mot yngre målgrupper och skolklasser, där många saknar egen mobil. Här placeras i stället en stationär surfplatta vid ingången till domen som erbjuder samma funktioner på ett åldersanpassat sätt.
Prototyp från Figma - Koncept 2
Prototyp från Figma - Koncept 1
Academedia
Introduktion
I projektet samarbetade vi med AcadeMedia för att skapa en digital version av deras samtalskortlekar, som används i utbildningsmiljöer. Syftet var att göra kortlekarna mer tillgängliga och lekfulla. Genom intervjuer med skol- och förskolepersonal identifierade vi behov, styrkor och svagheter och utvecklade utifrån detta en prototyp i Figma: Play and Talk.
I Play and Talk kan användaren välja ämne, språk och svårighetsgrad samt spela på olika sätt, som frågesport, sällskapsspel eller kloss-spel. Vi har lagt fokus på en trygg och tilltalande visuell stil med möjlighet till bildstöd samt färger från AcadeMedias profil.
Använda program:
Projekttid: 4 veckor
Roll: Vi var 5 studerande som alla hade rullande roller i projektet.
