Design in a Web 2.0 World: Beyond Glossy And Gradients

1,847
-1

Published on

What does "Web 2.0" really mean and how do we as designers avoid falling into the trap of using gradients and glossy buttons when they don't fit?

Published in: Design, Business
0 Comments
5 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,847
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
0
Comments
0
Likes
5
Embeds 0
No embeds

No notes for slide

Design in a Web 2.0 World: Beyond Glossy And Gradients

  1. 1. Design in a Web 2.0 World Beyond Glossy & Gradients by Patrick Haney
  2. 2. Who is This Guy? Patrick Haney is not a sausage UI Designer at Harvard University
  3. 3. What is “Web 2.0?” What it is and what it isn’t
  4. 4. “Can you give me that Web 2.0 look?”
  5. 5. http://flickr.com/photos/sharynmorrow/2105989313/
  6. 6. http://flickr.com/photos/evagoestomarket/30232470/
  7. 7. http://pomwonderful.com
  8. 8. http://pomwonderful.com
  9. 9. Web 2. Do they really “blend well” with your needs? Don’t add unnecessary ingredients just because it’s the trend
  10. 10. Web 2.0? BIG text? Glossy graphics? Fancy gradients? HUGE buttons? Reflections?
  11. 11. “…the philosophy of mutually maximizing collective intelligence and added value for each participant by formalized and dynamic information sharing and creation”
  12. 12. “Ah, it doesn't mean anything. It's like, ‘rama-lama-ding-dong,’ or, ‘Give peace a chance.’”
  13. 13. Web 1.0 vs. Web 2.0
  14. 14. http://catbird.tumblr.com/post/35429148
  15. 15. Web 1.0 vs.
  16. 16. Web 2.0 is not a Design Style
  17. 17. http://makemylogobiggercream.com
  18. 18. http://www.yiyinglu.com/sc/illustration
  19. 19. Patrick Haney is not Web 2.0
  20. 20. “creativity, information sharing, and, most notably, collaboration” http://en.wikipedia.org/wiki/Web_2.0
  21. 21. http://dennajones.com
  22. 22. http://dennajones.com/colophon/
  23. 23. http://dennajones.com/colophon/
  24. 24. “Web 2.0 is the reuse of information in new and interesting ways, often using what are called web services” http://dennajones.com/colophon
  25. 25. Reuse, not Reinvent Use existing data for new and interesting applications
  26. 26. http://everyblock.com
  27. 27. Moral of the Story: Content is King
  28. 28. Typography is not just choosing a font
  29. 29. There’s More to it... font-family: Arial, Helvetica, sans-serif; font-size: 12px;
  30. 30. http://seedconference.com
  31. 31. Sizing Text Pixels, ems, exs, points? http://www.alistapart.com/articles/ howtosizetextincss
  32. 32. The <p> Tag is Your Friend
  33. 33. http://jontangerine.com/silo/typography/p/
  34. 34. http://jontangerine.com/silo/typography/p/
  35. 35. sIFR Scalable Inman Flash Replacement http://www.mikeindustries.com/blog/sifr/
  36. 36. http://jasonsantamaria.com
  37. 37. Image Replacement Replace text with images using the typeface you really wanted
  38. 38. http://flickr.com/photos/runforcover/1464079765/
  39. 39. http://webtypography.net
  40. 40. http://webtypography.net
  41. 41. Tagsonomy Do you really need tagging? Are tag clouds appropriate? Would a few preselected categories be enough for your site? Or are you just doing it to be “cool?”
  42. 42. The Future with CSS3 More typography options Rounded corners
  43. 43. Are Gradients & Gloss Right for you? Does it fit with the content? Is it appropriate for the project/ department?
  44. 44. Say NO to “Web 2.0!”
  45. 45. Choosing the Appropriate Design Style
  46. 46. I Like Big Butt s And I cannot lie.
  47. 47. Working Within a Brand
  48. 48. http://www.bu.edu/brand
  49. 49. http://www.bu.edu/brand
  50. 50. http://www.harvard.edu
  51. 51. http://www.harvard.edu
  52. 52. http://www.jaredigital.com
  53. 53. http://www.jaredigital.com
  54. 54. http://flickr.com/photos/smenzel/484343213/
  55. 55. http://www.cameronmoll.com
  56. 56. http://www.authenticjobs.com
  57. 57. http://www.careerbuilder.com
  58. 58. http://www.unstoppablerobotninja.com
  59. 59. http://www.31three.com
  60. 60. http://www.31three.com
  61. 61. http://www.31three.com
  62. 62. http://www.31three.com
  63. 63. The “Style” Done Right
  64. 64. http://www.apple.com
  65. 65. http://www.mixx.com
  66. 66. What Will “Web 3.0” Be?
  67. 67. Thank you. http://patrickhaney.com pat@patrickhaney.com

×