UX_UI S.jpg

USER EXPERIENCE & USER INTERFACE

Designportfolio

Jag går sista terminen av min kandidatexamen inom Data- och Systemvetenskap med inriktning Interaktionsdesign på Stockholms universitet. Programmet är främst inriktat på hur du uppnår bra UX - en viktig del av varje design. Vi har väl alla stött på den där webbplatsen som är helkonstig och lämnat den så snabbt som möjligt? Det kan helt enkelt inte bara se fint ut, det måste fungera bra också!

User experience handlar, precis som det låter som, om användarens upplevelse vid användandet av en produkt. Det kan vara digitala lösningar som till exempel hemsidor och appar men gäller egentligen allt vi stöter på i vår vardag, såsom kaffemaskinen eller kylskåpet i köket. När en designer tagit hänsyn till UX får vi en produkt eller ett system som är lätt att använda och som löser problemet på ett effektivt sätt. För att lyckas med det här krävs det att designern kommunicerar med användaren. Ofta används därför user research i någon form, det kan vara intervjuer, workshops, observationer eller användartester. User interface fokuserar istället mer på utseende och känsla och därmed de visuella element som användaren interagerar med. Ett sådant element kan till exempel vara en knapp. UI är designens yta och vägleder användaren visuellt genom gränssnittet. Dessa två begrepp är tillsammans nödvändiga för att skapa en bra användarupplevelse och därmed nöjda användare!

Under våren 2022 gör jag praktik på webbyrån West Art Communication. Här får jag chansen att testa och utveckla kunskaper inom både UX och UI. Hittills har jag bland annat fått arbeta med prototyping och webbdesign i Figma, Wordpress, logotyper och annat grafiskt material. Parallellt med detta skriver jag kandidatuppsats i samarbete med företaget Säkra tillsammans med en kurskamrat. Arbetet här innefattar bland annat att vi ska ta fram ett designförslag till en hemsida som skulle kunna effektivisera en del av den kundtjänst som idag sker via telefon och mail. Detta görs med hjälp av intervjuer samt prototypning och utvärderingar med intressenter.

Här nedan visar jag upp en del av det jag gjort hittills under min utbildning samt några hemsidor jag skapat. Efter avslutad praktik samt kandidatuppsats kommer det dyka upp fler projekt här!

Portfolio

Projekt från utbildningen.

Conscious Consumers
Under designprocessen av Conscious Consumers användes deltagande design, vilket är ett förhållningssätt där användare inkluderas i olika delar av processen. Bland annat deltog användare genom kontextuellt utforskande och framtidsverkstäder. Processen inleddes med undersökande intervjuer där det framkom att det i matvarubutiker finns många bra märkningar såsom Eko och Fairtrade. Hos klädkedjor är det dock inte lika vanligt förekommande och det kan vara svårt som konsument att göra bra val. Vi lät användarna skissa på designlösningar var för sig och därefter skapade vi en digital prototyp utifrån de bästa delarna från skisserna. Två prototyper tillverkades för att utvärderas med användarna där bland annat menyalternativen och sättet att visa betyget skiljde sig åt. Till vänster visas en av användarnas skisser som har ritats upp digitalt och till höger syns den slutgiltiga prototypen av applikationen.


Conscious Consumers var tänkt att hjälpa människor att konsumera kläder på ett mer hållbart sätt. Varumärken och plagg betygsattes utifrån vattenåtgång, mängden giftiga kemikalier, arbetsvillkor för anställda, växthusgasutsläpp samt hur hållbara material som användes. Genom att scanna en produkts streckkod alternativt söka på märket eller hitta det under rätt kategori guidas användaren med hjälp av betyg på skalan 0-10, ju högre betyg desto bättre. *Alla siffror i Conscious Consumers är påhittade och har ingen koppling till märken som nämns.*

Projektet gjordes tillsammans med Lina Kvarnström, Izabella Moore och Michelle Kisch.

CC.png

Mattemonstret
Mattemonstret var en tänkt applikation för barn som ska lära sig att räkna och talen visas därför både med siffror och jordgubbar för att illustrera antalet.


Utvecklingen skedde i verktyget Processing som är gjort i programmeringsspråket Java. Exempelvis gör en if-sats att inmatat svar blir rött vid fel svar medan rätt svar gör det grönt. Detta samtidigt som monstret hoppar upp och ned av glädje. Olika ljud ges även för rätt eller fel för att förstärka. Efter tre rätta svar höjs nivån och talen blir svårare vilket innebär högre tal och fler jordgubbar! Ett antal while-loopar avgör var jordgubbarna ska ritas ut, det vill säga att en ny rad ska påbörjas när den föregående är full och så vidare. Varje gång som en ny nivå nås flyger ett flygplan förbi för att meddela detta. 

Projektet gjordes tillsammans med Lina Kvarnström och Selina Öberg.

Frame 15.png

Framtidens mat
Framtidens mat var ett projekt där vi skapade en interaktiv upplevelse riktad till familjer med barn i åldrarna 6 till 14 år. Tanken var att den skulle befinna sig i en museimiljö och därför gjordes två besök på museum för att hitta inspiration. Prototypens syfte var att lära barnfamiljer om vad som skulle kunna påverka vad vi ser i våra svenska kylskåp i framtiden.

 

För att samla in information genomfördes intervjuer med föräldrar och workshops på distans med barn där de själva fick skissa på idéer. Utifrån detta prototypade vi först lo-fi för att sedan göra en hi-fi-prototyp som visades upp på en utställning.

Prototypen bestod av två delar, en gamifierad del på en pekskärm samt ett projicerat kylskåp på väggen. På startskärmen fick användaren klicka på "Bina utrotas", "Begränsad import" eller "Torka". Dessa ledde till olika spel som vägledde användaren att exempelvis odla blommor för att rädda bina. Det som sedan hände i kylskåpet på väggen var att varorna som var beroende av scenariot i spelet försvann eller ersattes av andra varor.

Projektet gjordes tillsammans med Lina Kvarnström, Izabella Moore, Nadja Edström och Nils Grundström.

Frame 16.png

UltraPlanner
Under utbildningens allra första termin fick vi i uppgift att producera en möjlig designlösning för en applikation riktad till ultramaratonlöpare. Innan prototypningen påbörjades kontaktade vi därför målgruppen för att identifiera användarnas behov. Att se dagens aktivitet, veckans träning, kost samt statistik över progression var ett par viktiga saker som kom fram.

Projektet gjordes tillsammans med Izabella Moore, Daron Galal och Joel Flinkfeldt.

Frame 17.png

Portfolio

Hemsidor.

Salong Åkanten
https://www.salongakanten.com

Salong Åkanten är en frisörsalong i Norrtälje som jag haft kontakt med under en tid. För några år sedan hjälpte jag salongen att bygga en hemsida. Jag var även där för att fotografera lokalen samt tjejerna som jobbade på salongen för att kunna använda bilderna på hemsidan. 


Något år senare behövdes en uppdatering av både bilder och hemsida vilket jag då fick äran att åter igen göra. Den här gången önskades även en logga i samma stil som de befintliga visitkorten!

Frame 19.png

Rådmansö-Frötuna Företagarförening
https://www.roff.se

*Efter att jag levererade hemsidan har startsidan förändrats då båda bilderna bytts ut av den sidansvariga.*


Under 2019 kontaktade Rådmansö-Frötuna Företagarförening mig då de var intresserade av en ny hemsida. De hade sedan tidigare en hemsida men önskade en uppdatering av designen. Jag använde mig av informationen på den gamla sidan för att skapa en ny. På ett möte tillsammans med föreningens sidansvariga gick jag igenom hur hon gör för att redigera sidan, exempelvis lägga till nya medlemmar. 

Frame 21.png

Cyber Custom Bike Show
*Förslag på designlösning.*

Varje sommar anordnas Custom Bike Show i Norrtäljes socitetspark. Det är ett mästerskap i hojbygge med utställare från hela Sverige. Under 2020 hindrades eventet att ske i parken på grund av Covid-situationen. Twin Club började därför tänka i nya, digitala, banor. Utställningen behövdes göras digital och de behövde en sida för detta.


Jag fick vara med på ett hörn och presenterade ett förslag på både en första designlösning av hemsidan samt en prototyp för att illustrera hur de kunde placera sina sponsorer för att alla skulle synas på ett rättvist sätt.

Frame 22.png