Design in a Web 2.0 World

Given at the Higher Education Web Symposium in July of 2008, in Philadelphia.

Transcript

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