Stikkord om designtrender, historiefortelling og emosjonelt design, fra Whitefox' fagdag 7.november 2013, presentert av Silje Sætre.

1. Designtrender
Silje Sætre - Senior Designer

2. Designtrender
Historiefortelling
Emosjonelt design

3. HVA SKAPER TRENDENE VI SER?
• Design speiler kulturen
• Kravene endrer seg ut fra teknologien,
- MED teknologien.
• Grafiske designere har
blitt interaksjonsdesignere
• Det dukker alltid opp et behov for det mot
satte av det som er den rådende trenden.
• Men man går aldri HELT tilbake.
• Design er ikke lengre noe du gjør én gang,
slår ned hvert tredje år og lager nytt.
Man utvikler underveis.
• Man kan ikke kontrollere havet, men man
kan lære å surfe på bølgene
“
Utviklingen
skjer med lysets
hastighet

4. SMART DESIGN
• Nå har så og si alle smarte mobile enheter
• Websider burde være tilgjengelig på disse
smarte enhetene, uten at man mister
estetikken og brukervennligheten.
• Trender fra trykkverdenen
• Mindre fluff, mer verdi
• Fokus på innhold
• Dette har ført til det vi kaller flatt design
“
Det handler om
å ha fokus på
innhold

5. FLATT DESIGN
• Flatt design har tatt over designverdenen.
• 2013 var året for flatt design og 2014
kommer ikke til å være anderledes.
• Designverdenen har blitt MODEN innen
webdesign og interaksjonsdesign.

6. FLATT DESIGN FORDI
• Det oppstod et behov for å rydde opp
• Ingen ekstra effekterer lagt til
• Det benyttes ofte enkle ikoner,
knapper og former
• Fokus på god typografi
• Fargene fra palettene er rene og fargerike,
• Hensikten er å skape en minimalistisk,
ren og brukervennlig fremtoning.
• Knapper trenger ikke lenger nødvendigvis
å skrike “trykk på meg”
• Folk flest forstår interaksjonen,
og opplæringen er gjennomført.
• Lettere for folk å finne frem
• Mer flytende og med utvikling av
CSS3 og HTML5
• Gode responsive sider med flatt design

8. ADAPTIVE & RESPONSIVE DESIGN
• Responsive betyr at én og samme nettside
leser hva slags skjermstørrelse du sitter på og
tilpasser seg innenfor disse rammene.
• De er kosteffektive løsninger til
et økende behov.
• Det har gått tre år siden Ethan Marcotte
definerte termen “Responsive Web Design”.
• Revlosjunerende idé da, men nå
en selvfølgelighet.
• Ingen andre valg enn å akseptere at våre
websider trenger å være brukervennlige på
forskjellige skjermstørrelser.

9. TOUCH ME. I`m mobile first
• Før: Fra store skjermer og tilpasse
dem mobile enheter
• Idag tenker vi mobil først.
• Underbygge andre trender som
flatt design og content first m.m
• Mobile-first-design
= tøffe designarkitekturavgjørelser
i starten av et prosjekt.
• Gjøre rede for ulike touch-skjermer,
stasjonære enheter og den aller minste
felles bestanddelen; mobilen.
• Mouse over-funksjonen er død
• Navigasjonen må være
stressreduserende, rask,
rett frem og enkel.

10. “
Content is king
Bill Gates - 1996.
• Webdesign blitt innholdsfokusert
• Design skaper mer konteksten
for innhold
• Brukere av en webside er
interessert i å finne det de skal raskt
• Designet skal tiltrekke og være
brukervennlig, tiltalende og
emosjonsskapende
• Relevant, brukervennlig
og lettfattelig innhold.

11. PARALLAX SCROLLING
VIDEO
LÅST NAVIGASJON
METRO GRID
MIX-AND-MATCH TYPOGRAPHY
FULL WIDTH BACKGROUND IMAGES
CSS TRANSPARANCY
SINGLE PAGE
RETINA SUPPORT
DETAILED ILLUSTRATIONS
INFINITE
SCROLLING

12. HISTORIER
• Kraftfullt virkemiddel.
• En bra fortelling - skaper langvarige inntrykk.
• Skape og vise en autentisk mening
og grunn som andre kan tro på, delta
i og dele.
• Ønsket slutning uten å si til dem direkte
hva de skal tenke.
• Non-profits for å skape en emosjonell
respons til viktige problemer
• Alle kulturer
• Et visst mønster
• Plottet, karakterene og fortellerstemmen.
• Forankret i oss, fra Håvamål, eventyr,
barnehage og skole for å lære
• Det er lettere å huske og ta et valg basert
på en historie - enn et sett med data.
• En fortelling gjør det lettere å forstå
og lære, huske, dele og motivere.
• Slutninger folk har kommet frem til selv
sitter gjerne bedre enn slutninger noen
har bedt dem ta.

13. “
We make up (short) stories in our heads
for every action and conversation. Leo Widrich
• Our brains become more active when
we tell stories.
• Kort og saklig vs. historiefortellingsgrep
for å huske, dele og relatere
• Når vi hører en historie - realterer vi til
tidligere erfaringer i hjernen, derfor
fungerer metaforer
• Brukeren kan bli hovedpersonen
• Vi aktiverer en del av hjernen kalt INSULA
• Hvem dere er, her kommer
merkevaren deres inn.
• Personliggjøring bedriften din. Vi og oss.
• Enkelt språk - sitter bedre - relaterer bedre
• Gode grensesnitt - Brukeren lager en
historien om flyten igjennom nettstedet.
= Gode opplevelser
• Gjensidige - vennlig bedrift,
en mykere bedrift - anderledes.
• Å hjelpe andre - sosiale bidrag er en
måte å fortelle en historie om deres verdier.

14. OPERASJONSSENTRALEN
“
Nå kom det en politipatrulje til Gaustad.
De hadde glemt lassoen så de får ikke
fanget hestene. Står nå og ser på dem.
POLISEN I VÄXJÖ/ALVESTA
“
Självklart vill polisen uppmana alla att
visa mer kärlek for varandra!

15. EMOSJONELT DESIGN

16. EMOSJONELT DESIGN
• Personlige bånd mellom merkevarer
og deres kunder.
• Hvis ting ikke føles bra for kunden vil de helt
enkelt ikke bruke produktet eller tjenesten.
• Emotional design er det som gjr at man
velger et produkt over et annet
• Menneskets behov for å lage connections
• Emosjonelt design er sentralt i dagligliv
og beslutningsprosesser for kunden.
• Tone og voice brukes for å vise personligheten
til en merkevare. også humor
• Jo mer effektivt emosjonelt design - jo bedre
vil salg og tilknytning bli.
• Attraktive ting virker bedre
• Interaksjonsdesign + emosjonelt design
+ grafisk design = sant
“
Godt design snakker
til oss med et eget
språk som vekker
sansene våre.

17. “
Emotional design is your insurance to maintain
audience trust when things aren’t going your way
• Emosjonelt design kan gi tilhørighet
• Man må tørre å skille seg ut
• Du må kjenne ditt publikum
• Du må ha fokus på detaljer
• Menneske til menneske- interaksjon
• Genuint
• LIKE DEG -> Ha mer tålmodighet med
deg hvis ting går litt treigt.
• Skape mer engasjerende og
spisset design og innhold
• Random acts of kindness/påskeegg

18. “
• Vi skal kjenne kunden best
og bry oss mest.
• Vi kan ikke leve evig på en
kjent merkevare, men må
investere i den
• Bryte med språket i kategorien.
• Varmere, folkelig og tilgjengelig.
• Vi ønsker å være bransjens
mest kundeorienterte aktør
• Tradisjonelt har forsikringsbransjen fokusert på hva som skjer hvis
man blir utsatt for skade
• Nye lokaler i Bjørvika, vil de ikke
kalle det hovedkontoret,
men «huset vårt».
• Rådgiver for å redusere risiko før
• Kantinen heter «spisestua»
• Nå vil vi fortelle historier og være
mer relevante for folk.
• Tilgjengelighet overføres også til
den skriftlige kommunikasjonen i
tilbud, skadeoppgjør og avtaler.
• Vekteren - trygghet, lys og
sikkerhet. Men nå skal han også
komme i andre farger enn blå.
• Gjensidige bruker til sammen
60 millioner kroner
• Her er det jus og regler som
må tas hensyn til, men der vi
kan gjøre språket enklere
og vennligere

19. TIPS & TRIKS
Trender innen design + og den teknologiske verden
må snakke sammen for å gi et helhetlig uttrykk.
Men med det kalde må vi ha det varme!
LÆR DEG Å SURFE!

20. LYKKE TIL!