SlideShare a Scribd company logo
1 of 25
Hold det ekte!
Smidig design for web med HTML&CSS
Kjartan Michalsen - Logica UX




Fortsett samtalen på k@d7.no + twitter.com/liksom
Photo by Mohammed Adow
Pressefoto SINTEF
Photo Alan Chia
Don´t feed the
    designers,
they might bite
Twitter.com/caribouland
— The engineers used to say “Oh no, that can’t be
done”. But when we started prototyping in HTML5,
we could just tell them “Yes, you can and I’ve
already done 70% of the work”

TODD ZAKI WARFEL
header.php




mainmenu.php
header.php




mainmenu.php
HTML           /          CSS          Prototype
En smidigere måte å jobbe med design
UX-fagfolk er en del av kunden eller produkteier-
teamet
Undersøk, lag modeller + konsepter og design på
forhånd

- men bare akkurat nok
Lag designrammeverk.
Skisser helheten, detaljer delene.
Snakk sammen.
Start sprinter med konseptworkshops.
Test på virkelige brukere.
Ha arbeidsgrupper som kan validere designet.
Ha kontinuerlig forskning på brukerkrav og adferd
Dokumenter i prototypen.
Dokumenter endringer.
La prototypen være spesifikasjonen.
Takk for meg.

Kjartan Michalsen
kjartan@ux.no
ux.no / logica.no

Fortsett samtalen
twitter.com/liksom

More Related Content

Similar to Hold det ekte - UX i smidige prosjekt

Webløft 2015: Interaksjonsdesign
Webløft 2015: InteraksjonsdesignWebløft 2015: Interaksjonsdesign
Webløft 2015: InteraksjonsdesignKristin Kokkersvold
 
Bør vi la oss Scrumme? Yggdrasil 2009
Bør vi la oss Scrumme? Yggdrasil 2009Bør vi la oss Scrumme? Yggdrasil 2009
Bør vi la oss Scrumme? Yggdrasil 2009Jostein Magnussen
 
Responsiv design og Bootstrap 3
Responsiv design og Bootstrap 3Responsiv design og Bootstrap 3
Responsiv design og Bootstrap 3Morten Bergset
 
Slik lykkes du med nye portaler, trond wold
Slik lykkes du med nye portaler, trond woldSlik lykkes du med nye portaler, trond wold
Slik lykkes du med nye portaler, trond woldErgoGroup
 
Innhold på nye gjensidige.no
Innhold på nye gjensidige.noInnhold på nye gjensidige.no
Innhold på nye gjensidige.noLisa Kjelstad
 
Universell utforming av digitale løsninger
Universell utforming av digitale løsningerUniversell utforming av digitale løsninger
Universell utforming av digitale løsningerMetronet
 
#Copilpt & Teams or Just Premium?
#Copilpt & Teams or Just Premium?#Copilpt & Teams or Just Premium?
#Copilpt & Teams or Just Premium?Kai Stenberg
 
Kan vi skape mye mere verdi i softwareporosjekter
Kan vi skape mye mere verdi i softwareporosjekterKan vi skape mye mere verdi i softwareporosjekter
Kan vi skape mye mere verdi i softwareporosjekterThor Henning Hetland
 
Fremtidsvennlige nettsider
Fremtidsvennlige nettsiderFremtidsvennlige nettsider
Fremtidsvennlige nettsiderFredrik Jensen
 
Lecture on Interaction Design, Pt 3
Lecture on Interaction Design, Pt 3Lecture on Interaction Design, Pt 3
Lecture on Interaction Design, Pt 3Jon Skivenes
 
Slik kan du prototype enkelt med node red
Slik kan du prototype enkelt med node redSlik kan du prototype enkelt med node red
Slik kan du prototype enkelt med node redSimen Sommerfeldt
 
Gode brukeropplevelser for web redaktør og sluttbruker
Gode brukeropplevelser for web redaktør og sluttbrukerGode brukeropplevelser for web redaktør og sluttbruker
Gode brukeropplevelser for web redaktør og sluttbrukerNina Taraldsen
 
131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM
131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM
131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIMLars Chr Christensen
 
Kjernemodellen og kjerneverksted - Y! 28. oktober 2020
Kjernemodellen og kjerneverksted - Y! 28. oktober 2020Kjernemodellen og kjerneverksted - Y! 28. oktober 2020
Kjernemodellen og kjerneverksted - Y! 28. oktober 2020Are Halland
 
Gui Prototyper Er Gode Eli Toftøy Andersen
Gui Prototyper Er Gode   Eli Toftøy AndersenGui Prototyper Er Gode   Eli Toftøy Andersen
Gui Prototyper Er Gode Eli Toftøy AndersenEli Toftøy-Andersen
 
Bootstrap — Eksperimentell forretningsutvikling i Posten
Bootstrap — Eksperimentell forretningsutvikling i PostenBootstrap — Eksperimentell forretningsutvikling i Posten
Bootstrap — Eksperimentell forretningsutvikling i PostenMartin Koksrud Bekkelund
 
"Bootstrap" - Martin Koksrud Bekkelund
"Bootstrap" - Martin Koksrud Bekkelund"Bootstrap" - Martin Koksrud Bekkelund
"Bootstrap" - Martin Koksrud BekkelundSmidigkonferansen
 
Responsive omegadrupalcamposlo19.11.2011
Responsive omegadrupalcamposlo19.11.2011Responsive omegadrupalcamposlo19.11.2011
Responsive omegadrupalcamposlo19.11.2011Vegard Johansen
 
Kan du lage logoen større? Eller Hvordan prate med en designer
Kan du lage logoen større? Eller Hvordan prate med en designerKan du lage logoen større? Eller Hvordan prate med en designer
Kan du lage logoen større? Eller Hvordan prate med en designerAndreas Beining
 

Similar to Hold det ekte - UX i smidige prosjekt (20)

Webløft 2015: Interaksjonsdesign
Webløft 2015: InteraksjonsdesignWebløft 2015: Interaksjonsdesign
Webløft 2015: Interaksjonsdesign
 
Bør vi la oss Scrumme? Yggdrasil 2009
Bør vi la oss Scrumme? Yggdrasil 2009Bør vi la oss Scrumme? Yggdrasil 2009
Bør vi la oss Scrumme? Yggdrasil 2009
 
Responsiv design og Bootstrap 3
Responsiv design og Bootstrap 3Responsiv design og Bootstrap 3
Responsiv design og Bootstrap 3
 
Slik lykkes du med nye portaler, trond wold
Slik lykkes du med nye portaler, trond woldSlik lykkes du med nye portaler, trond wold
Slik lykkes du med nye portaler, trond wold
 
Innhold på nye gjensidige.no
Innhold på nye gjensidige.noInnhold på nye gjensidige.no
Innhold på nye gjensidige.no
 
Innholdsstrategi
InnholdsstrategiInnholdsstrategi
Innholdsstrategi
 
Universell utforming av digitale løsninger
Universell utforming av digitale løsningerUniversell utforming av digitale løsninger
Universell utforming av digitale løsninger
 
#Copilpt & Teams or Just Premium?
#Copilpt & Teams or Just Premium?#Copilpt & Teams or Just Premium?
#Copilpt & Teams or Just Premium?
 
Kan vi skape mye mere verdi i softwareporosjekter
Kan vi skape mye mere verdi i softwareporosjekterKan vi skape mye mere verdi i softwareporosjekter
Kan vi skape mye mere verdi i softwareporosjekter
 
Fremtidsvennlige nettsider
Fremtidsvennlige nettsiderFremtidsvennlige nettsider
Fremtidsvennlige nettsider
 
Lecture on Interaction Design, Pt 3
Lecture on Interaction Design, Pt 3Lecture on Interaction Design, Pt 3
Lecture on Interaction Design, Pt 3
 
Slik kan du prototype enkelt med node red
Slik kan du prototype enkelt med node redSlik kan du prototype enkelt med node red
Slik kan du prototype enkelt med node red
 
Gode brukeropplevelser for web redaktør og sluttbruker
Gode brukeropplevelser for web redaktør og sluttbrukerGode brukeropplevelser for web redaktør og sluttbruker
Gode brukeropplevelser for web redaktør og sluttbruker
 
131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM
131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM
131106 NBEF seminar FDVU-dataverktøy - BIM/åpenBIM
 
Kjernemodellen og kjerneverksted - Y! 28. oktober 2020
Kjernemodellen og kjerneverksted - Y! 28. oktober 2020Kjernemodellen og kjerneverksted - Y! 28. oktober 2020
Kjernemodellen og kjerneverksted - Y! 28. oktober 2020
 
Gui Prototyper Er Gode Eli Toftøy Andersen
Gui Prototyper Er Gode   Eli Toftøy AndersenGui Prototyper Er Gode   Eli Toftøy Andersen
Gui Prototyper Er Gode Eli Toftøy Andersen
 
Bootstrap — Eksperimentell forretningsutvikling i Posten
Bootstrap — Eksperimentell forretningsutvikling i PostenBootstrap — Eksperimentell forretningsutvikling i Posten
Bootstrap — Eksperimentell forretningsutvikling i Posten
 
"Bootstrap" - Martin Koksrud Bekkelund
"Bootstrap" - Martin Koksrud Bekkelund"Bootstrap" - Martin Koksrud Bekkelund
"Bootstrap" - Martin Koksrud Bekkelund
 
Responsive omegadrupalcamposlo19.11.2011
Responsive omegadrupalcamposlo19.11.2011Responsive omegadrupalcamposlo19.11.2011
Responsive omegadrupalcamposlo19.11.2011
 
Kan du lage logoen større? Eller Hvordan prate med en designer
Kan du lage logoen større? Eller Hvordan prate med en designerKan du lage logoen større? Eller Hvordan prate med en designer
Kan du lage logoen større? Eller Hvordan prate med en designer
 

More from Kjartan Michalsen

Khib interaksjonsdesign 6 html og css
Khib interaksjonsdesign 6  html og cssKhib interaksjonsdesign 6  html og css
Khib interaksjonsdesign 6 html og cssKjartan Michalsen
 
Bordet fanger software 2013 - kjartan michalsen
Bordet fanger   software 2013 - kjartan michalsenBordet fanger   software 2013 - kjartan michalsen
Bordet fanger software 2013 - kjartan michalsenKjartan Michalsen
 
Gjesteforelesning - digital interaktiv design - KHIB
Gjesteforelesning - digital interaktiv design - KHIBGjesteforelesning - digital interaktiv design - KHIB
Gjesteforelesning - digital interaktiv design - KHIBKjartan Michalsen
 

More from Kjartan Michalsen (13)

Khib interaksjon-1
Khib interaksjon-1Khib interaksjon-1
Khib interaksjon-1
 
Khib interaksjon-2
Khib interaksjon-2Khib interaksjon-2
Khib interaksjon-2
 
Introduksjon til phonegap
Introduksjon til phonegapIntroduksjon til phonegap
Introduksjon til phonegap
 
Khib interaksjonsdesign 6 html og css
Khib interaksjonsdesign 6  html og cssKhib interaksjonsdesign 6  html og css
Khib interaksjonsdesign 6 html og css
 
Khib interaksjonsdesign 5
Khib interaksjonsdesign 5Khib interaksjonsdesign 5
Khib interaksjonsdesign 5
 
Khib interaksjonsdesign 4
Khib interaksjonsdesign 4Khib interaksjonsdesign 4
Khib interaksjonsdesign 4
 
Khib interaksjonsdesign 3
Khib interaksjonsdesign 3Khib interaksjonsdesign 3
Khib interaksjonsdesign 3
 
Khib interaksjonsdesign 2
Khib interaksjonsdesign 2Khib interaksjonsdesign 2
Khib interaksjonsdesign 2
 
Khib interaksjonsdesign 1
Khib interaksjonsdesign 1Khib interaksjonsdesign 1
Khib interaksjonsdesign 1
 
Bordet fanger software 2013 - kjartan michalsen
Bordet fanger   software 2013 - kjartan michalsenBordet fanger   software 2013 - kjartan michalsen
Bordet fanger software 2013 - kjartan michalsen
 
Gjesteforelesning - digital interaktiv design - KHIB
Gjesteforelesning - digital interaktiv design - KHIBGjesteforelesning - digital interaktiv design - KHIB
Gjesteforelesning - digital interaktiv design - KHIB
 
Valgkamp i gamle Oslo AP
Valgkamp i gamle Oslo APValgkamp i gamle Oslo AP
Valgkamp i gamle Oslo AP
 
Hybrid-applikasjoner
Hybrid-applikasjonerHybrid-applikasjoner
Hybrid-applikasjoner
 

Hold det ekte - UX i smidige prosjekt

Editor's Notes

  1. Myeåsetteseg inn i. Et heltnyttspråkålæreseg, nytt syntax osv.