Breaking instincts: how to fight bad design habits

Transcript

2. 2009 Breaking Instincts Common bad habits and how to fight them Rico Sta. Cruz ricostacruz.com
3. 2009 Web designer, creative director, Internet marketer, web standards advocate, and all around ninja of all things web Creative Director for US Auto Parts Philippines, a local subsidiary of a US company with a diverse network of e-commerce sites. My personal blog is at ambiescent.com, and my online portfolio is available at ricostacruz.com. Rico Sta. Cruz
4. 2009 I got up incredibly early today just for you guys. And you guys are awesome for coming in this early! —
6. 2009 Designers
7. 2009 Like all people
8. 2009 are inclined to do things a certain way.
11. 2009 inclination
12. 2009 We are all inclined to do certain things by instinct
13. 2009 • an innate, typically fixed pattern of behavior in animals in response to certain stimuli : birds have an instinct to build nests • a natural or intuitive way of acting or thinking : they retain their old authoritarian instincts. instinct
14. 2009 Designers
15. 2009 Like all people
16. 2009 Have: • an innate, typically fixed pattern of behavior in animals in response to certain stimuli : birds have an instinct to build nests • a natural or intuitive way of acting or thinking : they retain their old authoritarian instincts.
17. 2009 = natural tendency instinct
18. 2009 is often due to natural tendency convenience
19. 2009 convenience
20. 2009 convenience is not healthy.
21. 2009 convenience is lazy.
22. 2009 is an opportunity to do better. convenience
26. 2009 THEN LO AND BEHOLD FOLKS Guess what unthinkable atrocity happened next
28. 2009 Eh? What could you be so upset about, young lad? Naturally, pasting follows after copying.
30. 2009 Egads!
32. 2009 SCREW LEMONADE.
33. 2009 You are meant for better things than lemonade.
36. 2009 Lets try this.
37. 2009 Challenge: Redesign an online news site to be clearer, easier-to-read, and steered clear of pitfalls that our instincts dictate us to fall through.
38. 2009 Bring it on!
39. 2009 Challenge: Redesign an online news site to be clearer, easier-to-read, and steered clear of pitfalls that our instincts dictate us to fall through.
40. 2009 Challenge: Redesign an online news site to be clearer, easier-to-read, and steered clear of pitfalls that our instincts dictate us to fall through.
41. 2009 Navigation
42. 2009 Three levels of categories?
43. 2009 THINK
44. 2009 Going against our instincts, we don’t need to make our navigation mirror the sitemap structure, do we?
45. 2009 We can try to: show it all (without hiding in hidden popups) lay it out in a way that it’s not overwhelming
47. 2009 1 2 3
48. 2009 Moving forward, let’s add the header. We need: » Search bar » Date today » Login/subscribe
49. 2009 Common “login” links: Common search bars:
50. 2009 Going with the status quo just for the convenience?
52. 2009 THINK
53. 2009 Common “login” links: Common search bars:
54. 2009 THINK
55. 2009 Searching is not an auxiliary function anymore. On content sites, it’s often a primary mode of navigation.
56. 2009 That’s more like it.
57. 2009 Have personalized content? No need to hide your sign in links.
58. 2009 Now we’re talkin’ business.
59. 2009 Why don’t we better simulate a newspaper look? Most papers have news snippets above the heading.
60. 2009 We’re on a roll, yo!
61. 2009 Advertisements
63. 2009 ?
64. 2009 Aha! Why don’t we bundle all the ads together so the readers will easily figure out what to ignore! Iv_nevr_heard_of_clickthru_rates Marketing Manager About 2 hours ago from web
65. 2009 Lets try it this way: Intersperse advertisements with content.
66. 2009 First on the header, the nav bar, and the right sidebar. (Let’s tackle the content later.)
67. 2009 Articles
68. 2009 Yarr, It’s a news site! Of course I’ll make a headline news item first! captain_obvious About 2 hours ago from web
69. 2009 Awesome work, capitan!
70. 2009 Intermission: The pair rule
71. 2009 Ever notice how the text in these slides are always like this?
72. 2009 Something dominant
74. 2009 Something dominant paired with something recessive
77. 2009 Something dominant paired with something recessive = sweet
79. 2009 Okay, back to work.
80. 2009 Again, the headline.
81. 2009 We have a headline. Great! Then what?
84. 2009 Sure, If you’re making a blog theme.
85. 2009 Fact: blobs of monotonous content are boring.
90. 2009 To the rescue!
92. 2009 Primary Secondary Tertiary and so on
96. 2009 AND I JUST Saved the day!
97. 2009 Primary
98. 2009 Secondary Tertiary
99. 2009 Swell. (From this)
100. 2009 More articles
101. 2009 Headline: 4 killed when Vietnam war-era bomb explodes Category: Headlines Time published: 8.07p Headline: Amid bombings, martial law fears, CIA chief arriving Category: Business Time published: 7:27p Headline: Jackson children take center stage in LA Category: Entertainment Time published: 7:05p Headline: RP moves to resume communist rebel talks Category: Headlines Time published: 7:00p . . .
102. 2009 Our instinct may drive us to do the most straightforward approach:
103. 2009 ex·cel·i·tis, NOUN the inane human tendency to lay things out in a table format Excelitis
104. 2009 Exhibit A
105. 2009 Exhibit B
106. 2009 Exhibit C
107. 2009 THE HORROR, MAKE IT STOP
108. 2009 Sacrébleu!
109. 2009 THINK
110. 2009 Some columns aren’t always necessary. (Here, deadlines and tags are only shown when the items have them)
111. 2009 Or there may be more logical ways to group the data.
112. 2009 Where were we?
113. 2009 Our instinct may drive us to do the most straightforward approach:
114. 2009 Okay, perhaps:
115. 2009 Okay, perhaps:
116. 2009 Better.
117. 2009 Lists
118. 2009 Some examples.
120. 2009 Unimaginative
121. 2009 Well thought-of
122. 2009 Unspectacular
123. 2009 Consider instead:
127. 2009 Recap
128. 2009 Intuition consider may tell you to but you should Relayouting
129. 2009 Intuition consider may tell you to but you should Group data more intelligently mimic Excel
130. 2009 Intuition consider may tell you to but you should having hierarchy be blog-like
131. 2009 Intuition consider may tell you to but you should listing things down better list things down
133. 2009 Thank you