OneNote
How can we make our design process more efficient and improve consistency across our product?


As a visual designer on the OneNote product design team, my primary responsibility was to evolve the Sketch toolkits for our designers and maintain our shared component libraries. 
As I worked on documenting our components, I also helped to align our product with brand guidelines across the complex Microsoft, Windows, and Office ecosystem. 
I conducted UI audits to see how we could improve visual coherency across the product and met with designers and developers to gain insight into how a design system could be more effectively utilized.
Key lessons learned:

Set up collaboration/syncing.
Being able to know when files are updated, to sync seamlessly, and to communicate and work easily with collaborators is essential to scaling design work efficiently.
Definition, documentation, direction.
Clear definitions and guidelines are what set design systems apart from a component library. It’s also beneficial to understand the overall design direction and priorities, so that we can make better decisions when it comes to introducing elements that are not yet defined (i.e. when do we prioritize our needs over aligning with the larger product group?). The goal isn’t to restrict design, but to make design reasoning clear enough to enable designers to make well-informed decisions, faster.
Collaborate with devs.
Designers don’t work in a vacuum, and it’s important to understand how we can improve our design system to make lives easier across the board (for example, aligning on nomenclature or getting insight into the handoff process).
Make accessibility a priority.
Accessibility should be a consideration from the beginning and built into the system.
Minimize unique elements.
As part of a larger product group, we should be leveraging existing language whenever possible.
Look forward, not backwards.
We should align to what we believe is correct going forward instead of trying to match outdated designs for consistency’s sake.

View more projects:

Back to Top