Designing Interactions
Building the Experience




jQuery Conf, San Francisco   Steve Smith
April 25, 2010                ...
Hello!
steve@orderedlist.com
@orderedlist
A Word of Warning
I have only two slides of code
“
To design is to
communicate clearly by
whatever means you can
control or master.

              Milton Glaser
Things to Cover
1. Why You Care
2. Why We Interact
3. Too Much Interaction
4. Not Enough Interaction
5. Wrapping Up
Why You Care
About Designing Interactions
Because

Designers Are Lazy?
Because you are NOT

Just an Implementer
Because you care about

The User Experience
“
Design is not just what it
looks like and feels like.
Design is how it works.

                   Steve Jobs
Things to Cover
1. Why You Care
2. Why We Interact
3. Too Much Interaction
4. Not Enough Interaction
5. Wrapping Up
“
Design is so critical it
should be on the agenda
of every meeting in every
single department.

                 Tom Pete...
Why Interact?
Reasons for our Effort
Interact to

Engage
Interact to

Explain
Things to Cover
1. Why You Care
2. Why We Interact
3. Too Much Interaction
4. Not Enough Interaction
5. Wrapping Up
“
A designer knows he has
achieved perfection not
when there is nothing left
to add, but when there is
nothing left to tak...
Too Much Interaction
More Harm than Good
Stay Clear of

Slow Animations
jQuery.fx.speeds._default = 200;
jQuery.fx.speeds._default = (jQuery.browser.ie &&
                            jQuery.browser.version < 8) ?
              ...
Stay Clear of

Useless Animations
To show the next slide

Click the ‘Slide’
Menu, then ‘Go to’,
then ‘Next Slide’
Stay Clear of

Heavy Interactions
Things to Cover
1. Why You Care
2. Why We Interact
3. Too Much Interaction
4. Not Enough Interaction
5. Wrapping Up
“
The challenge is about
taking things that are
infinitely complex and
making them simpler and
more understandable.
       ...
Not Enough Interaction
Less Good than Harm
No indication of what’s

Going to Happen
http://www.flickr.com/photos/hicksdesign/3246888025
No indication of what’s

Happening Now
Things to Cover
1. Why You Care
2. Why We Interact
3. Too Much Interaction
4. Not Enough Interaction
5. Wrapping Up
Wrapping Up
Five Good Points, A Bad Joke, and a Quote
Design the

User Experience First
Interaction is meant to

Impress the User
Interaction is meant to

Impress the User
Impress the Client
Interaction is meant to

Impress the User
Impress the Client
Show our Skillz
Interaction is meant to

Impress the User
Impress the Client
Show our Skillz
Interaction is meant to

Engage and
Enhance the User
Experience
Speed is important,

Distractions are Bad
It’s Our Job to

Build User Confidence
Don’t Solve

Problems with Code
Solve the Problem

Then Write Code
“
Questions about whether design
is necessary or affordable are
quite beside the point: design is
inevitable. The alternati...
Thank you!
steve@orderedlist.com
@orderedlist



jQuery Conf, San Francisco   Steve Smith
April 25, 2010                 O...
Designing interactions
Designing interactions
Designing interactions
Designing interactions
Designing interactions
Upcoming SlideShare
Loading in...5
×

Designing interactions

2,074

Published on

Published in: Design
0 Comments
10 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,074
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
47
Comments
0
Likes
10
Embeds 0
No embeds

No notes for slide

Transcript of "Designing interactions"

  1. 1. Designing Interactions Building the Experience jQuery Conf, San Francisco Steve Smith April 25, 2010 Ordered List
  2. 2. Hello! steve@orderedlist.com @orderedlist
  3. 3. A Word of Warning I have only two slides of code
  4. 4. “ To design is to communicate clearly by whatever means you can control or master. Milton Glaser
  5. 5. Things to Cover 1. Why You Care 2. Why We Interact 3. Too Much Interaction 4. Not Enough Interaction 5. Wrapping Up
  6. 6. Why You Care About Designing Interactions
  7. 7. Because Designers Are Lazy?
  8. 8. Because you are NOT Just an Implementer
  9. 9. Because you care about The User Experience
  10. 10. “ Design is not just what it looks like and feels like. Design is how it works. Steve Jobs
  11. 11. Things to Cover 1. Why You Care 2. Why We Interact 3. Too Much Interaction 4. Not Enough Interaction 5. Wrapping Up
  12. 12. “ Design is so critical it should be on the agenda of every meeting in every single department. Tom Peters
  13. 13. Why Interact? Reasons for our Effort
  14. 14. Interact to Engage
  15. 15. Interact to Explain
  16. 16. Things to Cover 1. Why You Care 2. Why We Interact 3. Too Much Interaction 4. Not Enough Interaction 5. Wrapping Up
  17. 17. “ A designer knows he has achieved perfection not when there is nothing left to add, but when there is nothing left to take away. Antoine De Saint-Exupery
  18. 18. Too Much Interaction More Harm than Good
  19. 19. Stay Clear of Slow Animations
  20. 20. jQuery.fx.speeds._default = 200;
  21. 21. jQuery.fx.speeds._default = (jQuery.browser.ie && jQuery.browser.version < 8) ? 0 : 200;
  22. 22. Stay Clear of Useless Animations
  23. 23. To show the next slide Click the ‘Slide’ Menu, then ‘Go to’, then ‘Next Slide’
  24. 24. Stay Clear of Heavy Interactions
  25. 25. Things to Cover 1. Why You Care 2. Why We Interact 3. Too Much Interaction 4. Not Enough Interaction 5. Wrapping Up
  26. 26. “ The challenge is about taking things that are infinitely complex and making them simpler and more understandable. Robert Greenberg
  27. 27. Not Enough Interaction Less Good than Harm
  28. 28. No indication of what’s Going to Happen
  29. 29. http://www.flickr.com/photos/hicksdesign/3246888025
  30. 30. No indication of what’s Happening Now
  31. 31. Things to Cover 1. Why You Care 2. Why We Interact 3. Too Much Interaction 4. Not Enough Interaction 5. Wrapping Up
  32. 32. Wrapping Up Five Good Points, A Bad Joke, and a Quote
  33. 33. Design the User Experience First
  34. 34. Interaction is meant to Impress the User
  35. 35. Interaction is meant to Impress the User Impress the Client
  36. 36. Interaction is meant to Impress the User Impress the Client Show our Skillz
  37. 37. Interaction is meant to Impress the User Impress the Client Show our Skillz
  38. 38. Interaction is meant to Engage and Enhance the User Experience
  39. 39. Speed is important, Distractions are Bad
  40. 40. It’s Our Job to Build User Confidence
  41. 41. Don’t Solve Problems with Code
  42. 42. Solve the Problem Then Write Code
  43. 43. “ Questions about whether design is necessary or affordable are quite beside the point: design is inevitable. The alternative to good design is bad design, not no design at all. Douglas Martin
  44. 44. Thank you! steve@orderedlist.com @orderedlist jQuery Conf, San Francisco Steve Smith April 25, 2010 Ordered List
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×