Design Chat

For http://wpbootcamp.com/austin/

Transcript

1. DESIGN CHAT @trentwalton trentwalton.com paravelinc.com
2. WEB DESIGN
3. “And the [web] is right in front of you, every day, so you as a designer for this medium have the opportunity to use it to prototype what you’re designing.” —Stephen Hay
4. frankchimero.com/writing/the-webs-grain
5. “It is the nature of the web to be flexible, and it should be our role as designers and developers to embrace this flexibility, and produce pages which, by being flexible, are accessible to all.” —John Allsopp A Dao of Web Design, 2000
6. PROGRESSIVE ENHANCEMENT & DEVICE AGNOSTIC DESIGN • Hostile browsers • Tiny screens • Slow connection speeds • Touch inputs
7. CONTENT
8. “Content precedes design. Design in the absence of content is not design, it's decoration.” —Jeffrey Zeldman
9. TYPOGRAPHY
10. • Choose appropriate fonts • Don’t use too many fonts • Mind your CPL (45–75)
11. FURTHER READING… • On Web Typography • webtypography.net • Fluid Type • Smart Quotes for Smart People
12. LAYOUT
13. • Sandwich-Driven Web Design® • Keep mobile/RWD in mind • Content Choreography
14. PERFORMANCE
15. • Performance is part of web design • Perception is important (Fiber) • Optimize images • Be clever (TMFO, Zen Garden)
16. FURTHER READING… • Responsible Responsive Design • webpagetest.org • Tim Kadlec
17. BORING IS OKAY
18. “The boring designer realizes that the glory isn’t in putting their personal stamp on everything they touch. In fact, most of the time, it’s about leaving no trace of themselves. The boring designer loves consistency. The boring designer loves a style guide.” —Cap Watkins
19. TEAMWORK
20. IMPORTANT… • Content • Typography • Layout • Performance
21. ALSO IMPORTANT… • Morale • Communication • Trust • Enthusiasm
22. TOOLS I USE
23. • Paper + Pens • Whatever graphics editor is fastest • Codepen • Github • Atom (Code Editor) • BrowserStack
24. QUESTIONS? @trentwalton trentwalton.com paravelinc.com