The Mozilla Foundation Design team encompasses a group of highly multidisciplinary makers. We love everything design — from research and UX to UI, colours to typography, branding to marketing and social media. We strive for our work to reflect an open source and inclusive ethos that promotes an open and honest relationship with the world around us.
The design team consists of visual designers, UX/UI designers, and contractors. We are part of the Digital Engagement Team which means we help create compelling, accessible, and relevant content and digital products/experiences that help grow our audience, build the strength and power of our movement, and advance our organizational objectives.
As stewards of the Foundation's digital presence, we also partner with and support staff across the Foundation in leveraging our digital products and channels to advance their team objectives and goals.
We spend a lot of our energy building upon and maintaining the Mozilla Foundation website. The site is built in Wagtail, a Django powered and open source Content Management System which empowers staff across the foundation to create and publish their own content. We’ve been hard at work the past years unifying all of the foundation's work onto a single website, designing new CMS page types and stream blocks, and creating a robust design system.
Some of our other key properties include: *Privacy Not Included, Mozilla Festival, and our Instagram. See an overview of our past work in our yearly recap decks.
Design at the Mozilla Foundation is process oriented. We create living documents and tools that respond to the needs of our users at the present moment in time. We follow agile processes and use Airtable, Github and Zenhub to organize our work. Key elements of the process are outlined below. While this is not a fixed, linear process, all projects should touch on the elements below. Iteration allows us to circle through them.
Each stage of our process supports the following goals:
- Understand what people need
- Address the whole experience, from start to finish
- Make it simple and intuitive
- Design using iterative practices
- Add a dash of levity or whimsy to provoke interest
Take a look at our full Process.
Design guidelines: Our jumping off point for brand basics like our logo, fonts, and brand colors. To Google slide and doc templates. To info about our sub brands like Mozilla Festival and *Privacy Not Included. All the way to documentation about our process and how we collaborate.
Graphics library: Quickly view all the graphics we have made for reuse or remixing on other Mozilla projects.
How to Wagtail: Documentation on creating and editing pages on our CMS.