Design Philosophy

  • 193 views
Uploaded 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.

More in: Technology , Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
193
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
1
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