Klient rapport redesign EAL´s hjemmeside

Klient rapport Evaluering og redesign af Erhvervsakademiets LillebĂŚlts hjemmeside.

Produceret af: Asa Lara Thorisdottir, Filippo Umberto Cleto Pagliai, Jesper Gaarslev Dahl, Niroson Vijayapalan.

Klasse OEAMM17EDA

Inhold

Forside Indhold Vores opgave Hvordan vil vi løse opgaven?

Metode: Usability test Metode: Personas & Scenarios Problemstilling Redesign af forside Redesign af undersiden Efteruddannelser Udviklingsprocess: sketches og wireframes Udviklingsprocess: personas og scenarios

Vores opgave

“

Vores klient er Erhvervsakademiet Lillebælt som er Region Syddanmarks største erhvervsakademi.

Vi skal udarbejde et forslag til et redesign til klientens webmaster Lise Borre.

Til at præsentere vores redesign for klienten, vil vi producere en ny version af klients forside og undersiden Efteruddannelse på klientens nuværende. Ved at producere både en forside og en underside har vi muligheden for at arbejde med to forskellige målgrupper.

Målgruppen der besøger forsiden vil være bredere, i mens undersiden er mere fokuseret. Målgruppen der besøger forsiden, består af besøgene fra mange forskellige baggrunde, der er interesseret i at starte på en uddannelse. Brugere der allerede er studerende. Samt virksomheder der ønsker eller allerede samarbejder med eal.

Målgruppen der besøger undersiden Efteruddannelse, er typisk en gruppe der er interesseret i uddannelse, men disse vil også allerede have en baggrund på arbejdsmarked og være lidt ældre. Undersiden kan også appellerer til virksomheder der ønsker at efteruddanne sine medarbejdere.

Hvordan vil vi løse opgaven?

Til at løse opgaven vil vi bruge udleveret materiale fra Lise Borre i form af brugerdata, designmanual, logo, billeder og ikoner. Vi vil gennemgå disse materialer grundigt.

Vi vil analysere brugervenligheden på klientens nuværende hjemmeside, med en usability test fra Nobanet. Testen er i form af et spørgeskema, der grundigt gennemgår retningslinjer for brugervenligt design. For at gennemgå denne analyse grundigt vil vi først gennemgå testen individuelt og derefter samlet, for at sammenligne vores resultater og nå til enighed om den nuværende hjemmesides niveau af brugervenlighed.

Vi vil udarbejde personas og scenarier, til at hjælpe os med at forstå sidernes målgrupper bedre.

Med det vi lærer og opdager ud fra disse metoder, vil vi begynde at visualisere vores redesign. til denne process vil vi udarbejde sketches, wireframe, mockups og en prototype.

Vi vil også udarbejde en klient rapport, hvor vi beskriver vores arbejdsprocess, resultater af arbejdet med vores metoder, og billeder der repræsentere vores visuelle proces, der leder til det færdige redesign.

Metode:

Usability test

“

EAL’s nuværende hjemmeside har mange gode ting i forvejen. Hjemmesiden er allerede stærkt visuelt. Den har en god opbygning og farvenuancerne gør den behagelig at se på Hovedsageligt fandt vi mindre problemer, som vi ikke vil arbejde så meget med i vores redesign men alligevel gerne vil nævne.

Mobile: Hjemmesiden fungere ikke så godt på mobiltelefoner. Den virker lidt langsommere, og mindre intuitiv. F.eks. er det svære at ramme de rigtigt knapper og der kunne gøres bedre brug af call to action.

Søgefunktion: Søgefunktion til efteruddannelser virker ikke særlig godt. F.eks. hjælper den ikke hvis man kommer til at lave en stavefejl. Søge filtrene virkede ikke så godt.

Chat: På undersiden Efteruddannelser er der en chat funktion. Dette er egentlig en god ting, da mål-

gruppen på denne underside typisk vil være lidt ældre. Denne gruppe kan måske have nogle brugere, der har lidt svære ved at bruge en pc, så live support til denne gruppe kan være en Hvordan vil vi løse opgaven?

Newsletter: På trods af at newsletter er ret stor og placeret midt på siden, så falder det nemt ind i

siden, og man bladre op eller ned på siden uden at lægge mærke til den. Newsletter sektionen er i samme farve som sidens primære farve. Der bør overvejes en anden farve for at styrke call to action. Når man har fået øje på newsletter, savnes der info om hvilken type indhold og hvor ofte man vil modtage et nyhedsbrev.

Metode:

Persona & Scenarios

Til at forstå vores målgruppe, og finde flere steder vi kunne forbedre Eals hjemmeside, benyttede vi os af personaer.

Vi udarbejde vores personaer, så de passede i målgruppen, der besøger undersiden Efteruddannelser. Vi byggede scenarier så vores personas havde mål med at besøge Eals hjemmeside. Hvorefter vi prøvede at sætte os i deres sted imens vi besøgte hjemmesiden, og prøvede at finde information der kunne opfylde deres mål. Under denne process fandt vi for alvor, de problem vi gerne ville arbejde med i vores redesign.

Det var svært at finde ud af hvilken type efteruddannelse vi skulle kigge efter, og savnede mere mere info herom på siden. Vi forsøgte at benytte søgefunktionen, men enten var der ikke nogle svar eller også var søgeresultatet overvældende.

Da vi begyndte at klikke rundt i efteruddannelsernes undersider, lagde vi mærke til at vi skulle igennem mange undersider, for endelig at få lov til at komme ind og læse det vi ville. Vi lagde også mærke til nogle ting vi kunne gøre anderledes på forsiden og undersiden.

Når vi kom ind på Eals forside, var det nemt at finde Efteruddannelse, som var den underside vi ville ind på. Men herefter blev det lidt svære for vores personas.

Problemstillinger Efter at analysere den nuværende hjemmeside ved hjælp af usability test, vores personas og vurdering ud fra udleveret materiale kom vi frem til tre punkter vi ville fokusere vores problemstilling og udarbejde vores redesign ud fra.

Revidere indhold: Vi vil vurdere indholdet på forsiden og undersiden. Vi vil se hvad der skal blive, hvad kan vi fjerne og hvad mangler der.

Kan nav gøres nemmere? Vi syntes at navigation på siden er gennemtænkt og det er svært at fare vild.

Men man skal engang imellem igennem mange undersider for at komme frem til det man vil.

Mere skriftlig indhold: Klientens hjemmeside ser meget pænt ud. Den har en stærk visuel stil, men målgruppen savner at der er mere skriftlig indhold til at præsentere siderne, som er hurtigt tilgængeligt.

Som siden ser ud nu skal man klikke sig ind på store billeder for at finde info. Vi vil gerne have tekst tilgængelig, der gør det nemmere brugere at finde relevant info med det samme, og gøre det nemmere for dem at bestemme sig til hvilke ikoner de vil trykke sig videre med, så de kommer det rigtige sted hen.

Redesign:

EAL´s forside

Den nye side har lysere farver og mere indhold med velkomst tekst

“

I vores redesign af forsiden har vi forsøgt at implementere forbedringer ud fra målgruppens problemstilling.

Vi kunne godt lide den nuværende header og navigation øverst på siden og beholdte disse.

Vi valgte at fravælge det store banner øverst på siden, for at få plads til indhold i form af en tekst, der skal byde brugere velkommen og præsentere brugeren for Erhvervsakademiet Lillebælt og resten af hjemmeside. Dette er indhold vi særligt syntes manglede på den nuværende side.

Under velkomst teksten præsentere vi uddannelserne. Dette et punkt vi beholder fra den nuværende hjemmeside. Men vi har omarrangeret elementerne, for at give et nyt visuelt udtryk, samt styrke overblikket og hjælpe call to action.

Herunder har vi en slider, der giver brugeren mulighed for at læse artikler om nyheder og events. Dette er også et punkt der er at finde på den nuværende hjemmeside. Vi mener det er en ting at have med, da det giver et indtryk af liv, ak-

tivitet og identitet på skolen. Med vores løsning med at implementere dette punkt, bruger vi lidt mindre plads på siden, men samtidig giver vi brugeren mulighed for at se og vælge imellem flere artikler, end det er muligt nu.

I forlængelse med de gode ting fra punktet med events og nyheder. Indtrykket af liv, aktivitet og identitet.

Har vi i bunden af forsidens indhold tilføjet et instagram filter, der viser billeder fra klientens undervisningssted.

Allernederst på siden har vi beholdt footeren fra den nuværende side.

Redesign:

EAL´s underside

Den nye side har lysere farver og nemmere navigation

“

I vores redesign af undersiden har vi igen beholdt header men gjort navigation nemmere.

Vi har igen gjort plads til indhold i toppen, i form af en tekst der præsentere brugeren for efteruddannelse og de forskellige typer herunder.

Dette er noget vi savnede meget da vi gennemgik undersiden med vores personas. Med denne tekst vil det være nemmere for brugeren, at finde ud af hvilken type efteruddannelse brugeren leder efter.

Efter præsentationen af hvad efteruddannelse er, har vi et punkt hvor brugeren kan navigere videre til forskellige efteruddannelser.

Med den nuværende navigation for efteruddannelser skal man igennem mange undersider, for at komme derhen man vil. Vi har gjort dette lettere for brugerne, ved at tage de to store efteruddannelser, akademi og diplom, og puttet dem i bokse på to sliders. Imens de sidste tre muligheder står under sliderne i synlige bokse.

Som tilbud til hjælp til brugeren har vi en stor call to action boks, der opfordre til at brugeren til at klikke videre på den, vi de har brug for hjælp af en studievejleder.

Nederst på siden har vi igen beholdt footeren som den er nu.

Udviklingsprocess: Sketches og wireframes

“

Vi lavede mange forskellige sketches og wireframes. Her har vi to exempler:

Udviklingsprocess: Personas og scenarios

“

Vores målgruppe har to personas. Én til forsiden og én til undersiden der vi har mest fokus på. Her har vi personen til forsiden og hendes scenario.

Anne er meget ambitios og meget intelligent.

Hun er en god menneskekender. Hun har arbejdet som kontorassistent de sidste 7 år og kan virkelige god lide sit arbejdsplads. Hendes chef har motivered hende til at uddanne sig inden for ledelse fordi han ser hendes potentiel. Hun har fået flere HR opgaver de sidste 2 år og har klaret sig fint.

Anne Andersen Frustrations Jeg kan ikke lige hjemmesider der tager langt tid at åbne Hjemmesider med reklamer fungerer ikke for mig Kan ikke lige at behøve at bruge meget tid på at finde det jeg søger efter.

Jeg bliver meget stresset i trafik så jeg foretrækker at cykle eller tage tog

Goals Jeg vil involveres mere ind i virksomhedens HR-arbejde Finde en uddannelse der passer hende i forhold til en travl hverdag og afstand til hendes hjem Senere vil jeg have mulighed for at blive HR leder/chef i en virksomhed

Teknelogi IT & Internet Software Mobile apps Social networks

Motivation Encouragement Fear of failure Career growth Authority Social

Bio

"Jeg kan godt lige at have en travl hverdag"

Nysgerrig

Motivated

Positive

Age: 30 Work: Personale/kontorassistent Family:ugift, 1 barn (3 år) Location: Ringe, Fyn Archtype: The planner

Anne er uddannet kontor assistent og har arbejdet for Kemp & Lauritzen i 7 år. Hun har i de sidste 2 år fået flere opgaver indenfor personal afdelingen og vil gerne få flere denne slags krævende opgaver.

Hun er masse af interesse indenfor HR management og ledelse og kan forestille sig som en personalchef i fremtiden.

Anne har lige købt et hus med sin kæreste, Magnus, i Ringe hvor de bør sammen med sin datter, Isabella og sin hund Snøffle. Anne vil ikke stoppe med sin arbejde så hun søger fleksibel uddannelse.

Anne er rask og løber 3 gang hver uge, ca 5-7 km hver gang. Hun har dog migrene så hun skal passe skærmetid på computeren, spise sundt og motionere sig hver dag i frisk luft.

Anne bruger facebook, instagram og snapchat meget.

Personality Introvert

Extrovert

Thinking

Feeling

Sensing

Intuition

Judging

Perceiving

Hun elsker den travle hverdage og er meget fokuseret og kan holde mange bolde i luftet. Hun skal dog passe på sig selv fordi hun har migræne, hun kan ikke sidde længe foran skærmen. Hun skal motionere sig hver dag i friske luft så hun bruger en del af sin frokostpause til en kort gåtur.

Anne bruger mest tid på sin egen computer om aftenen da hendes datter sover.

Daily activities 35% Work 25% Familiy Anne´s day

10% Outdoor activities 15% Social network 15% Transport

Hun har næsten aldrig tid til at kigge på nettet i arbejdstiden. Hun tager togen hver dag til og fra arbejde men hun kan ikke ser på telefonen i toget fordi så risikerer hun at få migræne episode.

Hun har en Macbook pro og en iPad hjemme og så bruger hun iPhone.

Udviklingsprocess: Personas og scenarios

“

Carsten er vores primær persona og tilhører målgruppen til undersiden Efteruddannelse som vi er mest fokuseret på.

Carsten er ikke særlig god til computer, han er jo god til at browse lidt på internetet, se nyheder, gå på facebook, sende e-mail og denne slags.

Han får ofte hjælp fra sin kone eller ældste datter fx der han skal vedhæfte dokumenter fra sin computer i en email osv.

Han bruger mest sin mobil eller en tablet de har i hjemmet når han browser på nettet eller besvarer emails men nogen gange bruger han computer, især når han skal skrive langt besvarelse.

Han bruger frokostpausen i arbejdstiden til at browse og kigge på facebook og også lige når han kommer hjem, så vil han sidde i sofaen med telefonen. Hans kone synes at han bruger alt for meget tid på telefonen når han kommer hjem og hun siger at han er dårlig rollemodel for deres børn, især den yngste.

Carsten Bjerregård Goals Finde passende efteruddannelse Blive bedre til computer Få et job det er ikke så fysisk krævende Starte at cykle igen uden at anstrenge mit knæ

Teknelogi IT & Internet Software Mobile apps

Frustrations Jeg kan ikke lige pop-ups på hjemmesider Jeg har ikke meget tålmodighed til hjemmesider med animotion og lyd Kan ikke lige at behøve at bruge meget tid på at finde det jeg søger efter.

Jeg kan bedst lige enkelte og stilrene hjemmesider med godt indhold

Social networks

Motivation Encouragement Fear of failure Career growth

"Jeg er god til at bygge, lave ting fra starten og udvikle idéer"

Hands-on Creative

Devoted Calm

Practical Easy-going

Age: 45 Work: Tømrer Family:Gift, 3 børn Location: Odense - Fyn Archtype: The thinker

Daily activities 50% Work 25% Familiy Carsten´s day

10% Outdoor activities 5% Social network 10% Transport

Bio

Authority

Carsten har været tømrer alle sine voksentid. Han elsker at bygge ting og er meget organiseret i sin arbejde. Han er en dygtig tømrer men det er svært for ham at arbejde hele dagen pga knæskade det skete på et cykelulykke for 10 år siden. Nu er han på udkig efter en uddannelse så han kan udvikle sig indenfor bygningsområdet. Carsten overvejer også at starte sin ejen virksomhed men han synes han mangler lidt mere viden om økonomi ,ledelse og computer. Han bruger facebook hverdag, læser emails og kigger på aviser i telefonen. Han bruger ikke mange apps, kun vejrudsigt, mobilbank og mobilpay osv.

Social

Personality Introvert

Extrovert

Thinking

Feeling

Sensing

Intuition

Judging

Perceiving

ERHVERVSAKADEMIET LILLEBÆLT OKTOBER 2017