Mastering the Details in Interface Design - Web Design World 2009 - Seattle

50 %
50 %
Information about Mastering the Details in Interface Design - Web Design World 2009 - Seattle
Design

Published on August 6, 2009

Author: danrubin

Source: slideshare.net

Description

Slides from my session at Web Design World Seattle, July 2009.

Mastering the Details in Interface Design Seattle, July 2009 Dan Rubin Sidebar Creative

Mastering the Details in Interface Design Seattle, July 2009 Hi!SIDEBAR C R E AT I V E Dan Rubin TRAINING WORKSHOPS CONSULTING twitter: @danrubin THE SIDEBAR TEAM WE LOOK MUCH NICER IN PERSON Me, according to nGen works @ http://happywebbies.com/ ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Hi! Dan Rubin twitter: @danrubin Me, according to nGen works @ http://happywebbies.com/ ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Pro CSS Techniques by Jeff Croft Ian Lloyd Dan Rubin ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Web Standards Creativity by Dan Rubin (and 9 other guys) ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Buy my books ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 I hate speaking at 9am ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Someone bring me a coffee ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 How your design feels. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 It’s about balance. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Proportion ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Create patterns for margins and padding. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://cnn.com ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 CNN.com margins, padding, borders: 6, 12, 18px ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 12px ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 12px 12px ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 6px 6px ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 18px ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 p.s. their body copy defaults to 12px ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Patterns ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Patterns make it easier to do the right thing. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://foxnews.com ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Typography ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Use relative text sizes to create balance. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 9 12 Relative text sizes create balance 15 Relative text sizes create balance Relative text sizes create balance Relative text sizes create balance 18 Relative text sizes create balance Relative text sizes create balance 21 Relative text sizes create balance 24 36 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Range kerning ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 aka “tracking” or “letter-spacing” ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Grids ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Using grids removes the guesswork. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Grids are just another simple pattern. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://www.guardian.co.uk ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://monocle.com ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Grids are only guides. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://therissingtonpodcast.co.uk ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://sushiandrobots.com ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Texture ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Reality is rarely smooth. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Add subtle texture to your designs. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://viget.com/inspire ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Lines & Gradients ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Layer Styles ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Invite people to touch your interface. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 URL: http://haveamint.com ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Depth ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Light Effects ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Any image can create an effect. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Photo: sxc.hu #1005399 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Darken ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Multiply ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Luminosity ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Putting it to use. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Fixing Fox. ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 Questions? ©2009 Dan Rubin » http://sidebarcreative.com

Mastering the Details in Interface Design Seattle, July 2009 fin. slideshare.net/danrubin twitter: @danrubin ©2009 Dan Rubin » http://sidebarcreative.com

Add a comment

Related presentations

My Music Magazine Pitch

My Music Magazine Pitch

October 30, 2014

music mag pitch

Questionaire charts

Questionaire charts

November 4, 2014

bk

Final research

Final research

November 5, 2014

final research

Cersaie 2014

Cersaie 2014

October 30, 2014

allestimento in cartone per il Cersaie 2014 alberi in cartone scultura in cartone

Quarta turma do workshop de Infografia, ministrado por Beatriz Blanco e Marcos Sin...

Related pages

Web Design World Seattle 2009 :: Conference Agenda

Web Design World Agenda. ... Mastering the Details in Interface Design Dan Rubin: 10:15 a.m. ... Web Design for ROI:
Read more

Web Design World Seattle 2009 :: Sessions

Mastering the Details in Interface Design ... Compatibility 2009: ... Founder, User Interface Engineering. It's a Web Design World tradition, ...
Read more

Pushing the Limits of CSS - Web Design World 2009 - Seattle

Pushing the Limits of CSS - Web Design World 2009 - Seattle May 07, ... Mastering the Details in Interface Design ... [Web Design World - Seattle 2009]
Read more

Mastering AutoCAD 2009 and AutoCAD LT 2009: George Omura ...

Buy Mastering AutoCAD 2009 and AutoCAD LT 2009 on ... Understand the basics of interface and ... He has worked on design projects ranging from resort ...
Read more

Web Design References: Books

Web Design References. Books ... Web Designer's Guide to Typography, ... Designing Web Interfaces, O'Reilly, 2009. Reiss, Eric.
Read more

Mastering the Nikon D5000 - O'Reilly Media

Mastering the Nikon D5000 by Darrell Young ... Web Design; Engineering, Math ... Darrell understands that many owners of the D5000 may be just entering the ...
Read more

User Interface 14 Conference - User Interface Engineering

... 2009 Renaissance Boston ... The User Interface 14 Conference was a smashing success. ... Leah has been taking the design world by storm with her ...
Read more

20 Websites to Help You Master User Interface Design

These websites deal with interface design, ... to Help You Master User Interface Design. ... scratching your head and thinking hard about web design.
Read more

Troy Yung | LinkedIn

View Troy Yung’s professional profile on LinkedIn. ... Worked as a web designer for one of Seattle’s first ... User Interface Design;
Read more