Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Grensesnitt i bevegelse

1,286 views

Published on

Presentation at Bouvet, Oslo, November 11 2008. In Norwegian.

Published in: Design
  • Be the first to comment

  • Be the first to like this

Grensesnitt i bevegelse

  1. 1. Grensesnitt i bevegelse - nye muligheter og utfordringer Jon Olav Eikenes, stipendiat, Arkitektur- og designhøgskolen i Oslo
  2. 2. Multi-touch table, studenprosjekt 2006
  3. 3. ABB sommerprosjekt (2006)
  4. 4. Hovedmål: “å gjøre norske teknologi- og tjenesteleverandører bedre i stand til å utvikle nye produkter og tjenester for sosiale nettverk, der brukere deler og anvender audiovisuelt innhold”
  5. 5. design vs. forsking
  6. 6. objekt aktør kontekst prosess Dorst, Kees (2008) ‘Design research: a revolution-waiting-to-happen’
  7. 7. grensesnitt
  8. 8. Nye muligheter Rich Internet Applications opplevelsesøkonomi widgets mashups verktøy -> underholdning ‘Moore's Law’ digitalisering 'the long tail Teknologisk Kulturell embedding RSS breiband nisjemarked Ajax utvikling streaming utvikling procumers Adobe Flex Adobe Flash mobilitet JavaScript ActionScript 3 information overload Microsoft Silverlight ubiquitous computing Apple Core Animation Adobe Air
  9. 9. Grensesnitt i HCI person datamaskin grensesnitt Laurel, Brenda (1991) ‘Computers as Theatre’
  10. 10. Grensesnitt som medium film magasin radio plakatar aviser TV PCar mobiltelefonar • Fokus på kommunikasjon, meining og opplevelse • Multimodale grensesnitt: blanding av medietypar • Marshall McLuhan: “the medium is the message” • Manovich, L. (2001) ‘The Language of New Media’
  11. 11. navigation animation
  12. 12. analyse
  13. 13. Space: ‘Spatial manipulation’ Time: ‘Temporal navigation’ Motion: ‘Motional transformation’
  14. 14. http://www.leoburnett.ca
  15. 15. http://www.cooliris.com/
  16. 16. http://www.doodlebuzz.com/
  17. 17. brukervennlighet?
  18. 18. “Moving images have an overpowering effect on the human peripheral vision ... Unconstrained use of multimedia results in user interfaces that confuse users and make it harder for them to understand the information.” Jakob Nielsen: “Guidelines for Multimedia on the Web”
  19. 19. Eye Candy and Animations “Although it’s nice to have eye candy, if an effect does not provide a real benefit to the user, it will eventually become irritating. So when you are putting animations into your application, make sure there is a valid user need being met. Eye candy that meets a need will be shown off; eye candy that is simply flash will eventually be ignored or turned off.” (p. 29)
  20. 20. Brukervennlighet vs. grafisk design – på tide å legge debatten død? (Kjell-Morten Bratsberg Thorsen, NetLife Research) http://www.iallenkelhet.no/brukervennlighet-vs-grafisk-design-%E2%80%93-pa-tide-a-legge-debatten-d%C3%B8d
  21. 21. Jesse James Garrett’s ”Elements of User Experience” http://www.iallenkelhet.no/brukervennlighet-vs-grafisk-design-%E2%80%93-pa-tide-a-legge-debatten-d%C3%B8d
  22. 22. ‘research by design’
  23. 23. designprosess
  24. 24. ‘Inject Motion into the Design Process’ • Draw more maps • Draw in-between states • Draw with arrows • Choreograph with your hands • Use sound effects • Watch real world motion • Create motion studies • Animate your comps http://www.cinematicinterface.com/
  25. 25. Apple patent (2002): “ornamental design for a user interface for computer display”
  26. 26. Papirprototyping http://www.flickr.com/photos/gcbb/2246324069/ http://www.iallenkelhet.no/papp-prototyping-korleis-gjer-du-det http://nettskriving.no/-/bulletin/show/85463_straalende-verktoey-for-prototyping
  27. 27. Solidity • Squash and Stretch • Motion blur • Arrivals and departures Exaggeration • Anticipation • Follow through • Secondary action • Clear staging Reinforcement • Slow In and Out • Arcs • Follow through and overlapping action Timing and motion • Straight ahead action or pose-to-pose action • Appeal B. Chang and D. Ungar: “Animation: From Cartoons to the User Interface” G.R.S. Weir and S. Heeps: “Getting the Message Across: Ten Principles for Web Animation”
  28. 28. Animate in Flash / After Effects / animert GIF etc.
  29. 29. PowerPoint / Keynote
  30. 30. Eksisterande løysingar / implementering
  31. 31. Eksisterande løysingar / implementering
  32. 32. Skisse i kode Skisse i Processing, av Christer Carlsson, AHO 2008. http://www.carlssondesign.no/ti08/2008/03/19/flipping-tiles/ http://www.alistapart.com/articles/sketchingincode Verba, David (2007) quot;Sketching in Code: Using Prototypes to Visualize Interactionsquot;. Adaptive Path UXWeek 2007.
  33. 33. Fordelar • Nye potensiale for kommunikasjon og formidling • Nye former for interaksjon og navigering • Bygge og forsterke ‘mentale modellar’ • Vise oversikt og relasjonar • Nye visuelle uttrykk + wow-effekt • Underhalde og skape stemning • Skape flyt Utfordringar • Tidkrevande og teknisk utfordrande • Nye interaksjonsmønster • Ikkje alltid relevant
  34. 34. Vidare arbeid: ‘Social navimation’ Brukarinvolvering
  35. 35. Takk! Jon Olav Eikenes 11.11.08 jonolav.eikenes@gmail.com www.navimationresearch.net

×