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

1. 06
Strategy & Experience Design
ITP 2011
Aalto University School of Economics
Sami Niemelä
Creative Director, Nordkapp
sami.niemela@gmail.com
@samin
— www.nordkapp.fi
— @Nordkapp

2. Interaction
Design

3. “Interaction Design is the
creation of a dialogue between
a person and a product, service
or system.”
—Jon Kolko in Thoughts on Interaction Design

4. The
Larger
Context(s)
graph Ville Tikka / wevolve.us

6. Empathy
http://www.openideo.com/open/maternal-health/inspiration/empathy-belly-/

7. business
designer “user”
technology

10. “Complexity is
good. Simplicity
can be misleading.”
user experience wheel http://userexperienceproject.blogspot.com/
visualisation Facebook usage

11. “…but complexity
is good only if it is
understandable,
sensible,
and meaningful.”
boxee remote http://boxee.tv

12. “As we learn to “intuitively”
use a product, we are in fact
illustrating the scope of our
past experiences with it.“
—Jon Kolko in Thoughts on Interaction Design

13. http://swipe.nokia.com

14. Usable,
Useful and
Desirable

15. Usable

17. Useful

19. Desirable

22. Designing
for Flow
http://www.boxesandarrows.com/view/design-for-emotion

23. DESIGNING FOR FLOW
Attention and Flow

24. CAUSES OF FLOW
1— A clear goal
2—Immediate feedback
3—A challenge you’re confident
with

25. CHARACTERISTICS OF FLOW
—Total concentration and focus
—A sense of control over interactions
—Openness to new things
—Increased exploratory behavior
—Increased learning
—Positive feelings

26. CONSEQUENCES OF FLOW
—Loss of consciousness of self
—Distortions in the perception of time
—Activity is perceived as intrinsically
rewarding

27. “As we learn to “intuitively”
use a product, we are in fact
illustrating the scope of our
past experiences with it.“
—Jon Kolko in Thoughts on Interaction Design

28. 0
challenges high
Anxiety
skills
Flow Channel
Boredom
high
Anxiety, Boredom and Flow (Csikszentmihalyi, 1990)
(captions added van Gorp, 2006)

29. Causes of Flow

30. 1 2
Immediate
3
Challenge balanced
A clear goal
feedback with one’s skills

31. Different users

32. Less Challenges More Challenges
Novice users Experienced users Less
Exploration Exploration
Entertainment Connected with tasks

33. Tasks and subtasks

34. 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

35. 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

36. HIGH LEVEL FLOW
HOME VIEW SUBCATEGORY 1 SUBCATEGORY 2 PRODUCT DETAILS PURCHASE PATHS X N

37. IN DETAIL

39. EXERCISE
Flesh out your scenario from week
one into a task flow. Design the
interactions within it.
60 MINUTES

40. Making things
tangible

41. http://www.slideshare.net/tbisaacs/keynote-kungfu-how-to-wireframe-like-a-ninja?from=ss_embed

42. http://www.slideshare.net/tbisaacs/keynote-kungfu-how-to-wireframe-like-a-ninja?from=ss_embed

43. http://www.boxesandarrows.com/view/prototyping-with

45. http://www.flickr.com/photos/rosenfeldmedia/3977544675/in/set-72157622384497663/

46. http://www.flickr.com/photos/rosenfeldmedia/3977544675/sizes/o/in/set-72157622384497663/

52. UI SCENARIOS

53. EXERCISE
Prototyping: Build a prototype of
an interaction relating your project.
Draw it out on paper, step by step.
90 MINUTES

54. Document your work: the task
flows and prototype, send by email.
FRI HOMEWORK
WHERE?
Deliver to sami.niemela@gmail.com
w/ title “GROUPNAME Flows and prototype”

55. 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 ”

56. Q&A time!