Your SlideShare is downloading. ×
0
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Design Philosophy
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Design Philosophy

314

Published on

A quick deck I put together to communicate to my team some things that are important to me - and a lens through which I will view their work.

A quick deck I put together to communicate to my team some things that are important to me - and a lens through which I will view their work.

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
314
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
4
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Chuck Mallott 7 JULY 2014 A DESIGN PHILOSOPHY And other humble opinions
  • 2. Color KEY CONCEPTS 2 1 Whitespace2 Simplicity3 Pixel Precision4 Subtlety6 Form v. Function7 MVP8 Always ask “What if?”9 Typography5 Process10
  • 3. 3 COLOR ─ Never use true black - for background color or text color. ─ Use neutral colors that allow the interface to get out of the way. ─ Color should be used for emphasis and calls-to-action.
  • 4. 4 WHITESPACE ─ Don’t be afraid of it - whitespace is your friend. ─ Interfaces don’t have to look like newspapers, with every bit of space filled. ─ There is no fold.
  • 5. 5 SIMPLICITY ─ Plays off the previous point about whitespace. ─ Less is more. Reduce/remove unnecessary elements. ─ Organize elements/information. ─ Make processes more efficient - savings in time feels like simplicity. ─ Look for ways to hide complexity.
  • 6. 6 pixel precision ─ Craftsmanship matters. ─ No fuzzy pixels. ─ No random values. ─ Sensible corner radii.
  • 7. 7 typography ─ No more than 2 typefaces in any one interface (preferably only 1). ─ Use a font with multiple weights - normal, light, semibold, bold, etc. ─ Pay attention to line-height and line-length. ─ Use transparency as a way to control emphasis rather than always relying on weight (when possible). ─ For interfaces, choose a simple typeface. ─ NEVER use small-caps. Ever. For any reason whatsoever.
  • 8. 8 SUBTLETY ─ This crosses over other subjects like simplicity and color. ─ “Just enough” contrast for elements like: • Border width • Border color • Background shading • Gradients • Drop shadows Edward Tufte’s Principle of Least Effectual Difference: “Make all visual distinctions as subtle as possible, but still clear and effective.”
  • 9. 9 FORM V. function ─ Having one without the other is not an option. ─ Functionality informs design. Design informs the experience. ─ Design is not a skin. ─ UX design is not an exercise in decorating interface elements.
  • 10. 10 MVP ─ Minimum viable product. ─ Everyone has their own definition of what that means. ─ Avoid trying to deliver a product that is a mile wide, but only an inch deep.
  • 11. 11 always ask “what if?” ─ Realize that interfaces are fluid. ─ Build for flexibility. ─ Plan for scalability. ─ “What if this changes?”
  • 12. 12 Process ─ Everyone has a process. ─ A repeatable series of actions to achieve consistent results. ─ Sketches and wireframes are essential. ─ Deliver browser-ready code, but don’t skip sketching and wireframing. ─ Under promise. Over deliver. Understand requirements Discovery Information Architecture Sketches Wireframes Design Mockups Code
  • 13. LET’S DISCUSS

×