In my role as Design Team Lead at SimpleSite, I’ve recently been part of a big conceptual and visual redesign of our product. In the process, we’ve created a new Design System and a set of Design Principles, to condense and recap what we’ve learned and guide our design in the future.

In this article, I’ll make a case for why you should create a set of Product Design Principles too, and what to aim for when you do.

Before I get to that though, I’ll go through the 5 different types (or levels) of Design Principles, and present a simple model that has helped me understand, advocate for, and implement Design Principles in my work. Despite being a work-in-progress, I hope it will do the same for you!

principle: a basic belief, theory, or rule that has a major influence on the way in which something is done.

The 5 levels of Design Principles

Level 1: Universal Design Principles

At the most fundamental level, Universal Design Principles summarize and even define the very meaning and purpose of UX and what we do. These principles should serve as the foundation for you and everyone else, regardless of the product or service you’re designing.

Universal Design Principles are a must-have foundation for anyone, but they won’t differentiate your product unless the alternatives suck.

At this level, you’ll find simple commandments like Good design is unobtrusive, Use appropriate defaults, and Be consistent, as well as so-called “laws” like:

• Fitts’s Law: The time to acquire a target is a function of the distance to and size of the target.
• Hick’s Law: The time it takes to make a decision increases with the number and complexity of choices.
• Miller’s Law: The average person can only keep 7 (plus or minus 2) items in their working memory.

Start out with Laws of UX and Universal Principles of Design, and read up on the 20 Guiding Principles for Experience Design by Whitney Hess, Jakob Nielsen’s 10 Heuristics for User Interface Design, and the Gestalt Principles.

Or, if you’re a podcast fan like me, here’s a great episode of the Design Details podcast that’s definitely worth a listen.

Level 2: Universal Design Process Principles

While the first level of Design Principles describes the outcome or experience with a well-designed product, this level is about how to design it. You can see them as best practices in a human-centered Product Design process.

Universal Design Process Principles tell us HOW to design user-friendly products that people actually want.

You’ll see a strong link between these principles and the well-known Design theory and models. Design Thinking, the Double Diamond, Lean UX, and the Design Sprint are all about how to design great products. While they’re all different, they’re built on the same fundamental principles.

Whitney Hess again provides a good example, and also shows how Universal Design Principles and Process Principles are different. She refers to the latter as her 5 Guiding Principles for Experience Designers. These include:

• Understand the underlying problem before attempting to solve it.
• Acknowledge that the user is not like you.
• Have empathy.

Another commonly cited principle is Design with data. Some companies use this as one of their internal Company or Product Design Principles. Good on them for emphasizing the importance of designing with data, but it should be common practice and not a differentiating factor these days.

Level 3: Platform Design Guidelines

This level of Design Principles may or may not be relevant in your situation. However, with more and more apps and services being built as native apps, I think it deserves its own level in the pyramid.

By far the largest and most relevant Platform Design Guidelines are Google’s Material Design and Apple’s Human Interface Guidelines which include a set of Design Principles. They explain the rationale behind decisions made by Google and Apple respectively, and how we should design to ensure a uniform user experience across apps on the given platform.

Platform Design Guidelines ensure a certain level of design quality and consistency across apps on the platform.

You don’t have to conform to a similar set of guidelines or principles when designing for the Web, although Web Design Standards, Conventions, and Design Patterns serve a somewhat similar purpose.

Level 4: Company Design Principles

Company Design Principles are probably the most common form of Design Principles among big tech companies, often managing multiple products and departments and teams spread across the world. They’re less relevant for smaller organizations that may just need a set of Product Design Principles.

Company Design Principles are usually part of a Design System. They’re meant to guide the Design efforts across departments and teams, and they sometimes resemble high-level value statements.

Company Design Principles align and guide Design efforts across departments and teams within an organization.

Airbnb is a great case study to learn from. Not only do their Design Principles serve as inspiration, but they’ve also written a great piece on why and how they developed them in the first place. Their case for a Design System could easily apply to Design Principles as well, and to other companies:

“Airbnb has experienced a lot of growth over the years. Currently our design department consists of nearly a dozen functions and outcome teams. It became clear that we needed more systematic ways to guide and leverage our collective efforts.”

They go on to describe the specific challenges they wanted to solve with a Design System and a set of Design Principles:

• Too few constraints
• Multiple designers and stakeholders
• Multitude of platforms
• Software as a continuum

Each of Airbnb’s Design Principles is phrased as a single word with a short elaboration, making the essence of them easy to recall:

Unified: Each piece is part of a greater whole and should contribute positively to the system at scale. There should be no isolated features or outliers.

Universal: Airbnb is used around the world by a wide global community. Our products and visual language should be welcoming and accessible.

Iconic: We’re focused when it comes to both design and functionality. Our work should speak boldly and clearly to this focus

Conversational: Our use of motion breathes life into our products, and allows us to communicate with users in easily understood ways.

Level 5: Product Design Principles

The top of the pyramid is where you’ll find Product Design Principles. Just like the previous level, you’ll define these internally in your company or on your team, but they’re more concrete and directly applicable to your product than a set of Company Design Principles.

Your Product Design Principles summarize what good design means for your product, and pass it on to all Designers in a scalable manner.

Your Product Design Principles can’t just be applied by any other team in any other company. In fact, one of the main purposes of these principles is to differentiate you from the competition.

The value of Product Design Principles

Product Design Principles will add value to your work in multiple direct and indirect ways. I’ll cover the ones I’ve found to be most important, based on my own experience and research of others’. I’d also recommend this interview with Julie Zhuo, where she shares her perspective 18 minutes in.

Interview with Julie Zhuo, VP of Product Design at Facebook, on the Inside Intercom podcast.

1. Educate and create alignment

Education is probably the most fundamental purpose of Design Principles at any level. Principles sum up what you or Designers before you have learned to be true, and serve as a reminder and a way to pass on the knowledge.

Your Product Design Principles define and document what you’ve learned to be important for your product to be successful. They’ll help you create alignment on your team and establish a shared understanding and vocabulary for what good design means to you and your users.

You can also use your principles to educate stakeholders beyond your Design team on what you’ve learned through UX Research and experimentation.

2. Fuel creativity

It’s common knowledge that constraints fuel creativity. Constraints can be applied, more or less intentionally, in many different ways. Time, budget, number of people, and code legacy are all constraints that often force us to come up with creative solutions to any given design challenge. A Design System and set of Product Design Principles have the same effect because they not only tell you what to do but also what not to do.

3. Make better decisions, faster

When everyone’s aligned on what matters for the design of your product, decision-making becomes much easier. Think of your Product Design Principles as a compass, pointing you in the right direction whenever a design decision has to be made.

Product Design Principles can serve as a framework for evaluating potential solutions to a problem. They will help you prioritize one over another. They can even help you resolve conflicts when necessary, although you’d rarely have to when everyone's already aligned on your principles.

4. Set yourself apart from the competition

With a set of Product Design Principles, you’ll be making deliberate and opinionated decisions about the desired user experience and visual design of your product. They will guide you to design the product that’s just right for your users. They will help you stay relevant in the market, and avoid copying your competitors and becoming a “me-too product”.

5. Improve your onboarding of new team members

Last but certainly not least, the alignment established through your Product Design Principles will extend beyond your current team. Just as a Design System will significantly reduce the time-to-production-ready-mocks for a new team member, so will a good set of Product Design Principles.

They’ll help the newcomer understand who you’re designing for and what’s important to them when interacting with your product. Doing good design becomes a lot easier with this understanding.

Characteristics of good Product Design Principles

While there’s no one-size-fits-all when it comes to the creation and format of Product Design Principles, my own experience and analysis of countless case studies have revealed a set of best practices that most seem to agree on.

✔️ Small in number

First of all, your total number of Product Design Principles should be manageable. While you’ll see this number vary from company to company, a good rule-of-thumb is to aim for 3 to 5.

Go beyond a handful of principles and there’s no way you and everyone else will be able to remember all of them. Furthermore, a small number of principles will make decisions easier — too many will make them harder.

Take Pinterest as an example. While each of them is clarified with a few headlines and sentences, they stick to just three principles:

1. LucidIt’s intuitive, not learned. It makes the user feel powerful. It makes the content taste better.
2. AnimatedIt’s colorful. It’s visually responsive. It’s unexpected.
3. UnbreakableIt’s built for exploration. It’s impossible to mis-tap. It’s reversible.

️✔️ Differentiating

One of the main purposes of Product Design Principles is to set your product apart from the competition. Why should someone pick you and not your competitor?

Universal Design Principles are for everyone. Your Product Design Principles are not. Copying a Universal Design Principle and slapping your name on it is redundant. Avoid truisms like “We’re user-friendly” and “Keep things simple”.

Ask yourself: Could the opposite be a Design Principle for another product? If not, it’s probably too universal to be a good differentiator for your product.

A good Product Design Principle will help you say no by clarifying what your product is and what it is not. The early Product Design Principles crafted by Medium emphasizes this with the “[Option A] over [Option B]” format:

• Direction over Choice.
• Appropriate over Consistent.
• Evolving over Finalized.

You can see how choice, consistent, or finalized could be prioritized in another product, which makes these principles work as differentiators for Medium.

✔️ Unambiguous and actionable

Product Design Principles are meant to help you make decisions in your daily work by eliminating certain potential solutions and guide you to a decision. A vaguely phrased statement with ambiguous terms isn’t actionable.

A great example is Codecademy’s first Design Principle. It’s extremely concrete and eliminates doubt by explaining the underlying reasoning and providing an example:

• One ColumnWhenever possible, we have constrained our entire content to a single-column layout. This helped us focus on the core purpose of the page, while also giving us more control over our narrative. A one-column layout was also easier to implement within our first responsive design system, by minimizing variation between different screens and form factors, such as mobile and tablet.

✔️ Concise and memorable

In addition to making your Product Design Principles as unambiguous and actionable as possible, you should strive to make them concise and memorable as well. An abstract, long-winded statement won’t stick in people’s minds and encourage a certain way of thinking.

Asana shows a good example of well-phrases Product Design Principles. Here are a couple of them for inspiration:

• Increase confidence through clarity.Within the application, and more broadly within teams, it is unambiguous what is happening and why.
• Be consistent and standard, and innovate when it’s worth it.Users should feel like Asana is familiar yet modern.

Asana uses both icons and text labels to increase the clarity of their features, and even tooltips when a user hovers anything they can interact with (see screenshot below). They stick to familiar patterns, yet keep the design modern and joyful to use. I’m personally a big fan of Asana.

Examples to learn from

You’ll find plenty of examples of Product Design Principles from great companies. Not all of them live up to the recommendations described earlier though. Below I’ve gathered some of the ones who do.

Asana

This nice article explains why and how Asana created their Design Principles.

• Allow users to focus on their work without interference.A user’s focus should be in their control, only distract users with changes that are personally relevant.
• Increase confidence through clarity.Within the application, and more broadly within teams, it is unambiguous what is happening and why.
• Foster productive and emotionally satisfying interpersonal dynamics.Users feel like they are part of a team, where they can count on each other to do their part, and feel like they’re moving forward towards a common goal.
• Design for fast, effortless, and intentional interactions.Simple and common tasks should be frictionless and obvious; complex tasks should feel efficient and delightful. But, speed should not lead to inaccuracies.
• Empower everyone through progressive discoverability. Everyone at all levels of experience with Asana should feel like they know how to use the product, regardless of how many features they use.
• Be consistent and standard, and innovate when it’s worth it.Users should feel like Asana is familiar yet modern.

Codecademy

For a full description of each principle, check out this article.

• #1 One Column
• #2 Social Proof
• #3 More Contrast
• #4 Few Form Fields
• #5 Keeping Focus
• #6 Direct Manipulation
• #7 Visual Hierarchy
• #8 Visual Recognition
• #9 Larger Targets
• #10 Design for Edge Cases

Firefox

Notice how they do things a little differently at Firefox, showcasing that there isn’t a right and wrong when it comes to the format of your Product Design Principles. Each bullet is what Firefox calls a Design Value, with related principles below.

• Takes care of you. Principles:- user-sovereignty- default to privacy- no surprises- actionable advice
• You help make it. Principles:- research gives a voice to our non-core community- start people with smart defaults- implicit as well as explicit customization- invite people to be more than users
• Plays well with others. Principles:- user control and choice- simple to use the services you choose- suggest ways to get the most out of the web
• Exuberant. Principles:- feels like there is a person at the other end- fun tools are easier to use- humor and whimsy- have a point of view
• Finely crafted. Principles:- see also our visual design guidelines- continuity of look and feel across platforms- perceivable quality is vital
• Global. Principles:- global means local and local and local
• Balances power and simplicity. Principles:- 80/20/2: default to surface minimalism and easy access to the rest- user-agency and understanding, not just less
• Makes sense of the web. Principles:- focus on real human tasks and contexts- many real tasks involve a browser and other tools- quick access to your stuff and web- no jargon
• High user-performance. Principles:- performance is objective, but responsiveness is subjective- a happy user performs better

Medium

Note that these are mentioned in a reply as “… a few of the early design principles we crafted at Medium”. They’re not necessarily the official and final ones, but still a great source of inspiration.

• Direction over Choice. This principle was often referred to while we were designing the Medium editor. We purposely traded layout, type, and color choices for guidance and direction. Direction was more appropriate for the product because we wanted people to focus on writing, and not get distracted by choice.
• Appropriate over Consistent. This might seem controversial, but when applied across devices, its purpose is clear. We were willing to break consistency if it was more appropriate for the OS, device, or context.
• Evolving over Finalized. This is exemplified in the ability to share Medium drafts, write responses, and leave notes. The content on Medium should be antifragile, improving with use, and evolving over time. We did not want to design printed books for the internet.

Pinterest

For a full description of each principle, and how they’re made even more actionable with what Pinterest refers to as “The basics”, check out this article.

1. LucidIt’s intuitive, not learned. It makes the user feel powerful. It makes the content taste better.
2. AnimatedIt’s colorful. It’s visually responsive. It’s unexpected.
3. UnbreakableIt’s built for exploration. It’s impossible to mis-tap. It’s reversible.

What’s next?

Do you feel inspired to create your own set of Product Design Principles? Are you looking for more guidance on exactly how to go about it? I’ve got a case study coming up about how we, at SimpleSite, crafted our own Product Design Principles. I hope you’ll find it useful!

In the meantime, check out the many resources I’ve linked to in this article, and a few more below. After that, what’s holding you back from setting out to create your own Product Design Principles?! 🚀

Summary

You can think of Design Principles at 5 different levels, each of which serves its own purpose.

1. Universal Design PrinciplesUniversally applicable principles that define good design for any product.
2. Universal Design Process PrinciplesBest practices for everyone following a human-centered design approach.
3. Platform Design GuidelinesGuidelines to follow when designing for a platform like iOS or Android.
4. Company Design PrinciplesGuides for Design activities across disciplines and teams in a company.
5. Product Design PrinciplesPrinciples defining good design for your unique product and users.

The Design Principle Pyramid (author’s own creation).

The value of Product Design Principles

Product Design Principles educate and create alignment among Designers and other stakeholders, and fuel creativity by functioning as constraints in your problem-solving. They also help you make better decisions, faster when it’s time to evaluate potential solutions.

Since good principles define both what you are and what you’re not, they help differentiate your product from the competition. Lastly, they improve your onboarding of new team members by providing the guidance they need to create good design.

Characteristics of good Product Design Principles

Your set of Product Design Principles should be small in number. If you have more than 5, you risk missing out on the benefits and cause confusion instead. Make sure they’re differentiating and can’t be applied to all other products.

They need to be unambiguous and actionable to help your team with daily decision-making, and concise and memorable enough to become a natural and habitual part of everyone’s work.

With the above, you’re well on your way to improving your own work and the user experience of your product 💪

Originally published at techmoneyculture.com on July 16, 2020.