Design Chat

7aad555700fb85bf9787067349ac7ba9?s=47 Trent Walton
October 17, 2015

Design Chat

7aad555700fb85bf9787067349ac7ba9?s=128

Trent Walton

October 17, 2015
Tweet

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