Search

Designing For Flow

Loading...

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

7 comments

Comments 1 - 7 of 7 previous next Post a comment

  • + leonardobellini Leonardo Bellini 2 years ago
    very good presentation; I also attendeted your conference in Berlin
  • + bruno.figueiredo Bruno Figueiredo 2 years ago
    @ilccp2008: I meant applications must stop throwing the user back and forth between input and reference screens.
  • + ilccp2008 viuy,home 2 years ago
    what do u mean of 'the Ping Pong' ?
  • + woeldiche Jesper Wøldiche 2 years ago
    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?
  • + magdalena1948 PAVELESCU MAGDALENA 2 years ago
    BELLLA E INTERESANTE PRESENTAZIONE......COMPLIMENTI
  • + bruno.figueiredo Bruno Figueiredo 2 years ago
    Thanks, Pedro!
  • + pecus Pedro Custódio 2 years ago
    Congratulations, I think the presentation is simply great ;)
    keep the flow going Bruno.
Post a comment
Embed Video
Edit your comment Cancel

Notes on slide 1

Good Afternoon. I’m here to give a talk about Designing for Flow.

38 Favorites, 1 Group & 1 Event

Designing For Flow - Presentation 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
    • 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
    • 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

+ Bruno FigueiredoBruno Figueiredo, 2 years ago

custom

7219 views, 38 favs, 17 embeds more stats

Talk by Bruno Figueiredo at the WEb 2.0 Expo 2008 i more

More info about this document

CC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike LicenseCC Attribution-NonCommercial-ShareAlike License

Go to text version

  • Total Views 7219
    • 6816 on SlideShare
    • 403 from embeds
  • Comments 7
  • Favorites 38
  • Downloads 24
Most viewed embeds
  • 254 views on http://en.oreilly.com
  • 69 views on http://blog.slideshare.net
  • 34 views on http://www.web2expo.com
  • 15 views on http://www.sternenstaubinsel.net
  • 11 views on http://www.stardustisland.net

more

All embeds
  • 254 views on http://en.oreilly.com
  • 69 views on http://blog.slideshare.net
  • 34 views on http://www.web2expo.com
  • 15 views on http://www.sternenstaubinsel.net
  • 11 views on http://www.stardustisland.net
  • 4 views on http://antonioambrosio.blogspot.com
  • 3 views on http://www.centrestage.de
  • 2 views on http://feeds.feedburner.com
  • 2 views on http://blog.contentmanagementconnection.com
  • 2 views on http://www.elsua.net
  • 1 views on http://jisi.dreamblog.jp
  • 1 views on http://192.168.10.100
  • 1 views on http://www.slideshare.net
  • 1 views on http://berlinblase.de
  • 1 views on http://www.selbstverstaendlich.de
  • 1 views on http://mayank.name
  • 1 views on http://www.aseantic.com

less

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate. If needed, use the feedback form to let us know more details.

Cancel
File a copyright complaint
Having problems? Go to our helpdesk?

Categories

Tags

more

Groups / Events

-->
Search
RSS Feed
What's new?

© 2009 SlideShare Inc. All Rights Reserved