Firefox Design Systems
Approaching the second half of the year! πŸš€
Hello again from the design systems team. We're excited to share some exciting updates with you:
Welcoming Jane as our UX design systems manager!
Jane Wolf is our new UX Design Systems manager. She has been the lead designer on several design systems in the past, and managed a team launching a brand new design system at Rocket Companies.
Jane is incredibly passionate about accessibility, the intersection of design systems and brand design, and helping design and engineering teams create the best products. Her past product design background has been centered around making complex products simple - from financial services products, SaaS applications, healthcare, and other data heavy tools.
Jane just moved to the Chicago suburbs in November of 2021 from Metro Detroit, Michigan with her wife, dog, and snake. In her spare time, she is a big crafter and loves building dollhouse miniatures, doing home DIY’s, and watching anything Disney.
πŸŽ‰ Library updates
Desktop Components v2.2.0
The latest Desktop Components release includes the Firefox browser frame and all of the components tied to its functionality.
Video demo
Access the library
🎁 What’s new
Low-Fidelity Wireframes
We released a new Figma library called "Low-Fidelity Wireframes." This library's purpose is for designers to explore and share ideas by creating quick mock-ups. Wireframing is helpful during early stages of a project, or during a pivot. Wireframing is also helpful for collaborative brainstorming among UX team members. See the library and learn more here.
Instant Figma library access
If you had a hard time figuring out what library to turn on, this update is for you!
We now automatically turn on libraries based on what team a designer creates their file in.
Desktop designers creating files under the Firefox Desktop team now get instant access to all desktop libraries. Mobile designers creating files under the Firefox Mobile team now get instant access to all mobile libraries.
If you want to turn on certain libraries for your personal drafts, you can learn to do that here.
πŸ‘€ What's next
Desktop
Styles
Release a revisited typography scale that better matches the existing scale used in Firefox, and that has an improved structure for better Figma usability and browsing.
Mobile
Components
iOS and Android Toolbars and Cards.
Styles
Standardized mobile shadows across iOS and Android
Figma tutorials
We're happy to introduce some tutorials to get you started with Figma or to learn more of its functionalities. You can access these guides in our Mana.
This effort was 100% led and implemented by our contributor Tati Mirson who is passionate about helping improve our Figma education. Thanks Tati!
Share & Care
Firefox UX launched a new critique format called Share & Care. The systems team encourages all designers to engage in sharing work and giving and receiving feedback. This helps expose ongoing work throughout the Firefox UX org, and cultivate a culture of collaboration. Learn more about Share & Care here.
🌭 Made with ketchup on top.