Your SlideShare is downloading. ×
ITP / SED Day 6
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

ITP / SED Day 6

1,085
views

Published on

Second day of the week two of lectures at Aalto University School of Economics’ ITP summer programme’s Strategy and Experience. https://itp.hse.fi/ …

Second day of the week two of lectures at Aalto University School of Economics’ ITP summer programme’s Strategy and Experience. https://itp.hse.fi/

Contents: Interaction design, designing for flow, prototyping

Published in: Design, Technology, Business

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,085
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
21
Comments
0
Likes
3
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. 06Strategy & Experience DesignITP 2011Aalto University School of EconomicsSami NiemeläCreative Director, Nordkappsami.niemela@gmail.com@samin— www.nordkapp.fi— @Nordkapp
  • 2. InteractionDesign
  • 3. “Interaction Design is thecreation of a dialogue betweena person and a product, serviceor system.”—Jon Kolko in Thoughts on Interaction Design
  • 4. TheLargerContext(s) graph Ville Tikka / wevolve.us
  • 5. Empathy http://www.openideo.com/open/maternal-health/inspiration/empathy-belly-/
  • 6. businessdesigner “user” technology
  • 7. “Complexity isgood. Simplicitycan be misleading.” user experience wheel http://userexperienceproject.blogspot.com/ visualisation Facebook usage
  • 8. “…but complexityis good only if it isunderstandable,sensible,and meaningful.” boxee remote http://boxee.tv
  • 9. “As we learn to “intuitively”use a product, we are in factillustrating the scope of ourpast experiences with it.“—Jon Kolko in Thoughts on Interaction Design
  • 10. http://swipe.nokia.com
  • 11. Usable,Useful andDesirable
  • 12. Usable
  • 13. Useful
  • 14. Desirable
  • 15. Designingfor Flowhttp://www.boxesandarrows.com/view/design-for-emotion
  • 16. DESIGNING FOR FLOWAttention and Flow
  • 17. CAUSES OF FLOW1— A clear goal2—Immediate feedback3—A challenge you’re confidentwith
  • 18. CHARACTERISTICS OF FLOW—Total concentration and focus—A sense of control over interactions—Openness to new things—Increased exploratory behavior—Increased learning—Positive feelings
  • 19. CONSEQUENCES OF FLOW—Loss of consciousness of self—Distortions in the perception of time—Activity is perceived as intrinsicallyrewarding
  • 20. “As we learn to “intuitively”use a product, we are in factillustrating the scope of ourpast experiences with it.“—Jon Kolko in Thoughts on Interaction Design
  • 21. 0 challenges high Anxiety skills Flow Channel Boredomhigh Anxiety, Boredom and Flow (Csikszentmihalyi, 1990) (captions added van Gorp, 2006)
  • 22. Causes of Flow
  • 23. 1 2 Immediate 3 Challenge balancedA clear goal feedback with one’s skills
  • 24. Different users
  • 25. Less Challenges More Challenges Novice users Experienced users LessExploration Exploration Entertainment Connected with tasks
  • 26. Tasks and subtasks
  • 27. EXAMPLE“Produce a podcast”— Collect Information— Interview Someone— Record My Parts— Edit Audio— Mix audio— Write Show Notes— Produce the files— Upload Files to Host— Build Corresponding Show Notes Post
  • 28. EXAMPLE— Input- audio mix from GarageBand 3 and Show Notes in Text Editor.— Work- Play through audio once, listening for big mistakes.— Send the file to iTunes.— Inside iTunes, select the file, choose Get Info.— Edit info, inserting show notes and links into Lyrics tab. Doublecheck.—Choose “Convert File to MP3.”—Play the new MP3 file once it’s converted.—Move MP3 file to upload area.—Output- Upload Files to Host flow
  • 29. HIGH LEVEL FLOW HOME VIEW SUBCATEGORY 1 SUBCATEGORY 2 PRODUCT DETAILS PURCHASE PATHS X N
  • 30. IN DETAIL
  • 31. EXERCISEFlesh out your scenario from weekone into a task flow. Design theinteractions within it.60 MINUTES
  • 32. Making thingstangible
  • 33. http://www.slideshare.net/tbisaacs/keynote-kungfu-how-to-wireframe-like-a-ninja?from=ss_embed
  • 34. http://www.slideshare.net/tbisaacs/keynote-kungfu-how-to-wireframe-like-a-ninja?from=ss_embed
  • 35. http://www.boxesandarrows.com/view/prototyping-with
  • 36. http://www.flickr.com/photos/rosenfeldmedia/3977544675/in/set-72157622384497663/
  • 37. http://www.flickr.com/photos/rosenfeldmedia/3977544675/sizes/o/in/set-72157622384497663/
  • 38. UI SCENARIOS
  • 39. EXERCISEPrototyping: Build a prototype ofan interaction relating your project.Draw it out on paper, step by step.90 MINUTES
  • 40. Document your work: the taskflows and prototype, send by email.FRI HOMEWORK WHERE? Deliver to sami.niemela@gmail.com w/ title “GROUPNAME Flows and prototype”
  • 41. Design Review of team project:show & tell of design process +progress so far, design critique.THU WHERE? Present at class on Thursday Deliver to sami.niemela@gmail.com w/ title “GROUPNAME Design Review 1 ”
  • 42. Q&A time!

×