If you're a designer or someone who's come close to any type of design process, chances are you've used some of the open design tools and methods that are publicly available on the web.

Open design tools and resources are crucial to help self-taught designers get started, but also in building the shared knowledge base, creativity, and skills of the design community at large.

Creativity is just connecting things - Steve Jobs

At Prototypr we want to support open design, so we think it’s helpful to give the definition of open design a bit more thought. That way, we have a clearer idea of what we’re aiming for and how we can commit ourselves to furthering open design. It will also give us the chance to share some of the awesome open design resources out there.

This definition is a work in progress for us and we would love input to develop our understanding or to share resources that we haven’t found yet.

What We Don’t Mean When We Talk About Open Design.

Before we go deeper into what we do mean when we talk about open design in this context, let’s just get out of the way what we don’t mean -that way you can get out of here sooner if this isn’t relevant to you. While we love a nicely designed piece of furniture or hardware as much as the next person, what we’re talking about here is exclusively digital design. Open design very much applies to areas outside of digital design, it’s just not our area of expertise.

We also don’t include things like accessibility and inclusivity when we talk about open design. While accessibility and inclusivity are near to our hearts, we think they’re separate issues which are important to all types of design, not just open design. We do see some overlap though, in that both accessibility and inclusivity are an important part of keeping content open to all.

What We Do Mean When We Talk About Open Design

We see at least three different areas of open design:

1. Open UI design resources, like the design and prototyping system Penpot and design languages like Google’s Material Design, which are free to use and share.

2. Open design methods and tools, like IDEOs design thinking toolbox or Google’s Design Sprint.

3. Open design processes where products and services are co-created, ranging from design inputs to outsourcing strategic decision making, or where the design process is documented publicly.

For all areas there are also different degrees or variations of how open a design resource or process is. That should be clearer after some examples, so we’ll get back to that in a bit. First, let’s look at the three areas in a bit more detail, and we’ll also share examples of some widely used open design resources.

Open UI Design Resources

In our terminology UI design resources is a bit of a mix because we’re basically talking about any tool or resource a UI designer can use to create user interfaces -we include wireframing and prototyping tools, design languages and UI artifacts like icons and animations. You can find many of the UI design resources in our tools section, but here are some examples of widely used resources which are open in different ways:

Material Design

Google's Material Design is a design (eco)system which has UI resources like icons, fonts, motion patterns and colors along with extensive guidelines for how to apply the Material Design principles. Material Design is pretty much everywhere, and while you can always debate the UX and aesthetics, what’s great about it is that it’s created with an Apache 2.0 license, meaning you can use, share, and adapt the resources for free.

Font Awesome

Font Awesome is a widely used set of vector icons, which you’ll find on sites and apps across the web. They use a freemium license, which means that Font Awesome Free icons are open source and pretty much free to use however you want, while you need to pay to use the huge library of Font Awesome Pro Icons.

Figma

We’ve written extensively about the interface design tool Figma in the past, both because it’s an awesome, free tool, but also because it’s only somewhat open, especially now that it’s been purchased by Adobe. What’s great about Figma is that it’s free to use the basic version and it hosts a community of designers who share designs, plugins, and tools -very much in the spirit of open design. What’s less than great, is that Figma uses its own .fig format which can’t be used in any other applications and the Adobe purchase could mean that Figma’s days as a free software are numbered.

Penpot

Penpot isn’t as widely used as the other open UI design resources we’ve mentioned, but we include it as an alternative to Figma. Penpot was created by the Spanish tech company Kaleidos, who saw the need for a free open-source design tool. It’s licensed under the open-source Mozilla Public License 2.0, and you can export your work in multiple file formats, meaning you’re not restricted to their tool.

Open Design Methods

The web abounds with open methods for running design processes at various stages of product development. Some have been created by teams at well-known companies, who share their internal design methods as a branding strategy and as way of giving back to the community. Others originate in universities and other research facilities with a commitment to knowledge dissemination. Some of the most well-known are:

IDEO

Design consultancy IDEO have more or less become synonymous with design thinking and human-centered design. They have a bunch of free methods and tools on their various websites, the most comprehensive and famous one is probably their design kit. They list paid courses and books along with open methods licensed under creative commons BY-NC-ND 3.0, which allow you to use and share for non-commercial purposes.

Stanford d.school

d.school is Stanford’s design school and while a Stanford education definitely isn’t open or free, they have some excellent free resources on their website, from a crash course in design methods to more specific tools for different contexts and stages of the design process. Their resources are licensed under a creative commons BY-NC-SA 4.0 license, meaning you’re free to use, adapt, and share their material, as long as you attribute d.school and don’t use them for commercial purposes.

Google Design Sprint

Design Sprint is one of the most established open-source design methods. The method was developed at Google, and they have made most of their design sprint guidelines, resources, and tools publicly available at designsprintkit. It’s also open design in the sense that you can submit your own design sprint tools and Google will publish them on the website if they pass their review.

Nielsen Norman Group

Jakob Nielsen and Don Norman have been in the UX design world (or whatever they called it back in the 90’s) longer than pretty much anyone else. Their consulting firm Nielsen Norman Group has a huge library of guidelines and research, which anyone can access. Their resources are copyrighted, so you can’t adapt and distribute them, only read/watch and learn.

Open Design Projects and Processes

By open design processes and projects, we mean design processes and projects which give the public influence or insight into the design. This can range from publicly documenting your design process so others can learn from it, to cocreation of smaller parts of the product, to completely open-source design where any qualified person can contribute, influence, and learn from the design and the process. Here’s some examples:

Co-Creation – Lego Ideas

Ok, this isn’t strictly digital, or at least not just digital, but it’s such a lovely example of co-creation that we’ve included it anyway. On the Lego Ideas site anyone can submit designs for a Lego concept and if they get enough support from the community, Lego reviews the idea and decides if it should go into production. Lego Ideas designers get 1% of the total sales of any product made, but Lego owns the rights to the product. Lots of major brands use co-creation as part of their branding strategy and while it slightly opens up the design process to influence from the public, it only does so to a limited degree.

Open-Source Design – Wordpress

Both software and UX design for open-source projects is, quite obviously, open source. It’s surprisingly difficult to find good descriptions of the design process for open-source projects, maybe because design often takes a backseat to development, but wordpress.org has a nice open community and guidelines for how to participate in designing their interface and plugins. It’s licensed under a General Public License V.2.0, which is mostly used for software. It means that you can use, share, and modify the software, as long as any derivatives are published with the same license. We're not legal experts, but we believe the same terms apply to their designs.

Sharing insights about the design process -Spotify, AirBnB, Meta

We haven’t found one great source for design case studies and insights from real life design processes, but a lot of big name organizations actually share loads of insights and learnings from their design processes on their own websites, e.g. Spotify, AirBnB and Meta. They sometimes share open-source design tools as well, but mostly it’s they’re own copyrighted content to which they own all the rights.

Degrees of Openness

In most of our examples, we’ve mentioned how the open material is licensed or shared. It might seem a bit technical, but it’s an important piece for understanding how to contribute to open design. Roughly speaking, design resources are open on a spectrum from read-only to “do anything you like with this material.” Let’s outline what that looks like, from least to most open:

• On the most closed end of spectrum, we have content like Nielsen-Norman’s, which you’re allowed to read or watch, but to which they retain all copyright. This also goes for most blog posts and articles about design, because it’s published without a creative commons license. It’s the most controlled way of sharing content. You share your knowledge, but don’t allow others to adapt or distribute your material.

• Second, we place co-creation, like Lego Ideas, where anyone can contribute with design ideas, but where the corporate brands retain full control and license to any content. Co-creation projects are a fun branding exercise, but they give limited power to those who contribute.

• Third are the more restrictive creative commons licenses, which allow users to copy and share, but not to make any changes to the source material. This is the type of license which IDEO uses, and it’s often seen in open resources where it’s important for the creator to retain the branding value of the material.

• Fourth are all the open-source and creative commons licenses, which allow people to use, share and adapt the resources, if they credit the creator and/or license the new material in a no more restrictive way. The demand to license derivatives under the same or less restrictive terms, is a way for creators to ensure that their open material doesn’t end up in a closed-source product.

• Fifth, and placed on the most open part of our open design spectrum, we place the most permissive open-source licenses and public domain licenses, which let you do pretty much anything you want to a resource without giving credit to the creator or licensing the resource in a certain way. For the permissive open-source licenses you do have to include a copy of the license with your material though.

But What Does It All Mean?

The world wide web is literally built on open-source software, and we think it’s important to support open web and open design whenever possible. We said in the beginning of this article, that our definition of open design is a work in progress, and that’s still the case. We would still like to propose some guidelines for how to contribute to open design and how we want to approach it at Prototypr. Like the definition, they’re a work in progress, so they might change in the future, but here’s what we propose for now:

1. When you create something design related or have an interesting insight, remember to consider if it’s possible for you to share it with the public. Often, we’re so busy with everyday life and getting work done, that we don’t even think about whether we can share.

2. Keep the rights you need, but be as permissive as possible. Being protective of our work is second nature to many creatives, but we’ve found that if we give it a second thought, there are also benefits to sharing. Creative commons and the various open-source licenses make it easy to define and describe which rights we can afford to give away.

3. Consider contributing to open-source projects. When we think of open source, we traditionally think of software development, but any software with a wide user base needs design. As we said earlier, we haven’t found many great descriptions of design for open-source projects, but it’s something we’re currently exploring, so we might have more to add on that soon.
   

   ---

   
   Want to Learn More?

• You can find guidelines for how to use the different creative commons licenses here: https://creativecommons.org/

• Opensource.com has written about the open-source way -what it means to be open source beyond software: https://opensource.com/open-source-way

• https://opensourcedesign.net/ is a great source for links to open design resources and hosts a forum on open design.

• Gina Bhawalkar writes about open-source design here: https://www.forrester.com/blogs/open-source-design-what-it-is-and-why-it-matters/

• Anushka Jain has written about her experiences with contributing to open source right here at Prototypr: https://prototypr.io/post/designing-in-the-open

  -