Tlf. 31 69 05 50 hello@beneath.dk
Case study

Sosu Randers

Randers Social- og Sundhedsskole er en erhvervsskole, der uddanner social- og sundhedshjælpere, social- og sundhedsassistenter og pædagogiske assistenter. De tilbyder også kurser, efteruddannelser, før-uddannelsesforløb og EUD10.

www.sosuranders.dk

Opgaven & processen

Et redesign med solidt forarbejde og løbende samarbejde

  • Designet i 2015
  • Bygget i Umbraco
  • 120+ timers design

Det gamle website trængte til en kraftig overhaling, da det blandt andet ikke fungerede hensigtsmæssigt på kryds af nutidens og fremtidens mange forskellige enhedstyper. Overhalingen var også en oplagt mulighed for at tynde ud i indholdet og ikke mindst arbejde på en forbedret informationsarkitektur. I forløbet helligede vi i høj grad et løbende samarbejde omkring et kommende website, hvilket betyder, at vi gerne viser halvfærdige løsninger frem.

Workshop

På workshoppen dannede vi de 10 vigtigste brugerscenarier i prioriteret rækkefølge, og fik ligeledes lavet grundlaget til et videre arbejde med ny informationsarkitektur.

Wireframes

Baseret på scenarierne, byggede vi wireframes til mobil og desktop. Da de var i prioriteret rækkefølge, kunne vi langt nemmere danne et intuitivt hierarki i indholdet.

Webdesign

Sidst, men ikke mindst, lavede vi en række visuelle skærmbilleder af det endelig design, der dannede rammerne for, hvordan det færdige website ville se ud.

Workshop

Fra ønsker og behov til struktur

For at finde frem til lige præcis dér, hvor virksomhedens mål og brugernes behov mødes, blev der afholdt en workshop efterfulgt af en række interviews. Formålet var i sidste ende at skabe fundamentet, som websitet skulle bygges op omkring - et fundament der kunne skabe mest mulig værdi for både bruger og virksomhed.

Workshoppen havde 10 deltagere, som deltog i en række målrettede øvelser. Efter en gennemgang af det daværende website, med fokus på positive og problematiske områder, blev blikket rettet mod målgrupper, KPI’er og PI’er. 2 målgrupper blev udvalgt som de primære (elever og kursister), og på baggrund heraf, blev brugerscenarier og kunderejser udarbejdet. Dette gør alle de mange oplysninger håndgribelige og får teamet et stort skidt tættere på at kunne omsætte de forskellige informationer til en konkret løsning.

Næste skridt var at skabe første spadestik til informationsstrukturen. Først blev overskrifter til alle tænkelige sider skrevet på post-its. De mange post-its blev dernæst grupperet, grupperne fik tildelt overskrifter og overskrifterne blev prioriteret. Dermed var det første udkast til en overordnede struktur fundet.

Den efterfølgende interviewrunde, blev afholdt med fokus på at få indblik i de to primære målgruppers vaner, behov og erfaring med Sosu Randers. Disse indsigter er en vigtig faktor i at designe en målrettede og effektiv løsning, som favner alle behov.

Uddrag af designet

Wireframes

Fokus på hierarki med udgangspunkt i den lille skærm

Med udgangspunkt i outputtet fra workshoppen, kunne vi bygge og visualisere den grundlæggende struktur for websitet vha. en række wireframes, hvor indholdet var prioriteret efter de forskellige brugerscenarier.

Første device der blev udarbejdet wireframes til, var mobiltelefonen. “Mobile-first” tilgangen blev brugt, da man her er tvunget til at holde fokus på det absolut vigtigste indhold, netop fordi pladsen er trang på den lille skærm. Derefter kunne vi øge detaljegraden og udvide oplevelsen for brugerne, som skærmstørrelserne blev større.

Visuel identitet

Fælles grundlag for stil og tone

SOSU Randers havde i forvejen et udmærket fundament i form af diverse brochurer, som er baseret på deres visuelle identitet (bl.a. farver, billeder mm.). Vi har taget udgangspunkt i det materiale, men tilført manglende elementer og tilpasset identiteten til online brug. Dertil arbejdede vi med de bløde former, som normalt ikke er kendetegnet ved et responsivt website.

Overskrifter: Merriweather Sans Regular

abcdefghijklmnopqrstuvwxyzøæå
abcdefghijklmnopqrstuvwxyzøæå
0123456789 !”#€%&/()=?

Brødtekst: Merriweather Sans Regular

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed imperdiet est non metus fermentum, eu finibus dui consequat. Nam est ante, sagittis eu erat eget, lobortis facilisis purus. Duis sed pretium felis, vitae mollis augue. Duis scelerisque purus ac neque laoreet mollis. Nam bibendum purus in metus dignissim, volutpat consectetur ex convallis. Nunc consectetur tellus metus, vel interdum tortor iaculis a. Duis est mi, sollicitudin quis sapien ut, placerat dignissim risus.


Udtalelse

Det siger SOSU Randers

Trine Puggaard

Trine Puggaard

Kommunikationsmedarbejder Det var utrolig givende at starte projektet med en workshop, som var professionelt styret og velforberedt. Med hjælp fra Beneath/Novicell fik vi lavet en målrettet informationsstruktur og et gennemtænkt hierarki af indholdet, som var fordelagtig for både os og vores målgrupper.
Hovedrollen

Kontakt os

Jakob Kjeldtoft Workshop, Wireframes Mød Jakob
Michael Østergaard Digitalt Design Mød Michael
Relateret cases

Få mere indsigt i vores arbejde

Legekæden

Responsivt redesign af webshop

Se case

Fårup Sommerland

Responsivt redesign

Se case

Danmarks Jægerforbund

Responsivt redesign

Se case