Your SlideShare is downloading. ×
Designing For Flow
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

Designing For Flow

10,497
views

Published on

Talk by Bruno Figueiredo at the WEb 2.0 Expo 2008 in Berlin.

Talk by Bruno Figueiredo at the WEb 2.0 Expo 2008 in Berlin.

Published in: Technology, Business

7 Comments
43 Likes
Statistics
Notes
  • very good presentation; I also attendeted your conference in Berlin
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • @ilccp2008: I meant applications must stop throwing the user back and forth between input and reference screens.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • what do u mean of 'the Ping Pong' ?
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • I saw the presentation at Web2.0 Expo Europe and liked it a lot. You managed to put forth som persuasive arguments for implementing flow in the design, and put your finger on some key challenges with traditional designs og interactions, that I sensed but couldn't define.

    I was interesting, that you at the same time managed to quite precisely define some of the principles of the iphone's interaction design, that makes it stand out.

    The presentation had a nice blend of theory and concrete examples, that makes us both understand and also go home and implement the principle of flow in our designs.

    Can you recommend any books on this subject - written by you or orthers?
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • BELLLA E INTERESANTE PRESENTAZIONE......COMPLIMENTI
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
10,497
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
110
Comments
7
Likes
43
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
  • Good Afternoon. I’m here to give a talk about Designing for Flow.
  • Transcript

    • 1. Designing for Flow BRUNO FIGUEIREDO hoppiness
    • 2. Who am I?
    • 3. Architect by education as in buildings
    • 4. Interaction Designer by choice
    • 5. Leandro’s World Tour & RC Fotos Between Lisbon and London
    • 6. Fighting Static PanchoWatkins
    • 7. Led by the gaming industry
    • 8. More than enough power b d solis
    • 9. Ajax helped a lot
    • 10. blakespot Early adopters will use anything
    • 11. Matt Stafford Seniors lead growth 15% 2000 2006
    • 12. Most apps are still static
    • 13. Mimic real life tools purpleslog
    • 14. Teleportation is Scary
    • 15. Nesting doll
    • 16. Slideshows are not OK
    • 17. enviziondotnet Stop the Ping Pong
    • 18. celerrimus Landing on the unknown
    • 19. Cheo70 Context of the trip is lost
    • 20. Shadows fool you
    • 21. Natural User Interfaces Microsoft
    • 22. Abstract Real User Interfaces Natural User Interface Command Line Flow Applications Graphical User Interface
    • 23. Time The Problem State 1 State 2 USER SYSTEM Control Selection Action is Performed Data is ready Server fetches data Output
    • 24. Adding flow gocarts
    • 25. Patrick J. Lynch Understanding how we work
    • 26. Mark Erickson 1% of our Retina 100% Visual Acuity The fovea
    • 27. Like a Flashlight in the Dark lrargerich
    • 28. specialkrb How we see
    • 29. specialkrb How we see
    • 30. 50 miliseconds rcoster
    • 31. Apple Rapid Serial Visual Presentation
    • 32. Animating
    • 33. Change
    • 34. Movement
    • 35. Size
    • 36. You can only see so much SolYoung
    • 37. Don’t overdo it too much emphasys = no emphasys at all
    • 38.
      • Enhanced system visibility
      • Easier to pinpoint errors
      • Easier to complete complex tasks
      • Enhanced findability
      • Increased task performance
      • Lower frustration levels
      Benefits
    • 39. Examples of flow mandj98
    • 40. Sung Sook Shopping Cart
    • 41. Traditional
    • 42. Quantity: 3 Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm Price: 25,00 Euros Shopping Basket EMPTY Add to Basket
    • 43. Quantity: 3 Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm Price: 25,00 Euros Shopping Basket 3 Web Design - Estrutura, Concepção e Produção de sites Web Bruno Figueiredo Price: 75,00 Euros Subtotal: 75,00 Euros Add to Basket
    • 44. Change
    • 45. Quantity: 3 Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm Price: 25,00 Euros Shopping Basket EMPTY Add to Basket
    • 46. Quantity: 3 Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm Price: 25,00 Euros Shopping Basket 3 Web Design - Estrutura, Concepção e Produção de sites Web Bruno Figueiredo Price: 75,00 Euros Subtotal: 75,00 Euros Add to Basket
    • 47. Change + Movement
    • 48. Quantity: 3 Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm Price: 25,00 Euros Shopping Basket EMPTY Add to Basket
    • 49. Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm Price: 25,00 Euros Quantity: 3 Shopping Basket 3 Add to Basket 3 Web Design - Estrutura, Concepção e Produção de sites Web Bruno Figueiredo Price: 75,00 Euros Subtotal: 75,00 Euros
    • 50. Bookshelf chotda
    • 51. Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm 3 X
    • 52. Web Design - Estrutura, Concepção e Produção de sites Web 2ª Edição Actualizada e Aumentada   Author: Bruno Figueiredo ISBN: 972-722-433-4 Pages: 300 Size: 17,0 x 24,0 cm 3 X
    • 53. Change + Size
    • 54. Sieve Indigo Goat
    • 55. Flash CS3 Definitive Guide Michael Norris Photoshop CS3 Hands On Jane Wilbur Web Design Bruno Figueiredo PHP Quick Reference Tom Coates Illustrator CS3 Anna Stevenson ASP.net Quick Reference Joanna Geddes Python Hands-on Brian Thomas Show Only Books: Design
    • 56. Flash CS3 Definitive Guide Michael Norris Photoshop CS3 Hands On Jane Wilbur Web Design Bruno Figueiredo Illustrator CS3 Anna Stevenson Show Only Books: Design PHP Quick Reference Tom Coates ASP.net Quick Reference Joanna Geddes Python Hands-on Brian Thomas
    • 57. Flash CS3 Definitive Guide Michael Norris Photoshop CS3 Hands On Jane Wilbur Web Design Bruno Figueiredo Illustrator CS3 Anna Stevenson Show Only Books: Design
    • 58. Change + Movement
    • 59.
      • Map out actions to real examples
      • Smooth transitions between states
      • Use subtle animations
      • Stay within view
      • Animate with change, movement and size
      • One thing at a time
      • Don’t overdo it
      Wrap up
    • 60. Questions?
    • 61. [email_address] Thank you hoppiness All pictures are CC from Flickr and the author’s name is on the lower right