Mobile Design System Guidelines

Project:

Partner with design engineering intern to design and build package Lee (end-user persona) facing mobile design language.

1) Understand/empathize with the user

The users are present and future members of the Duo Design team. It was important to me that no matter where a designer, researcher, or writer is in their career journey, they should be able to use the mobile design documentation to create products for Lee (end-user persona).


2) Define the problem 

Collaborate with my partner- the design engineering intern, product designers, iOS & Android engineers, and writers to initiate simple and empathetic guidelines for Duo’s first mobile design system that is accessible, simple, and inclusive.


3) Research 

What are the industry’s best practices for mobile design systems? Atlassian, Google, Apple, and Shopify design systems were personal favorites and served as reference materials for a variety of users. For instance, incorporating some Android device guidelines from Google ensured that the design system included users from African countries where the Android operating system is more popular. 


4) Ideation 

Based on my research and conversations with diverse members within and outside the team, I started to put together guidelines that were helpful, accessible, and inclusive. I took notes and recorded the sessions with engineers, writers, and designers, which I rewatched as I worked. I also prioritized simple language so designers in every stage of their journey can understand the guidelines and create accessible products. 


5) Refine(feedback)

Because I am a bit of a perfectionist and wanted to give as many people involved enough time to give feedback, I set a personal deadline that was two weeks from the required deadline for a first draft so I could show my partner, the design engineering intern, product designers, iOS & Android engineers, and writers the first draft for their feedback before presenting it to the Lead Content Designer for extra feedback. 


6) Test Comprehension 

We pushed the guidelines to the Tellaro website and shared them with members of the larger design team and asked for any feedback which we also implemented before the end of our internship. 

Content Review

Project:

Worked with the senior content designer and UX designer to review and update the microcopy on Figma to match Duo’s content guidelines for user authentication, self-service portal, and universal prompt.

Process:

Research: Using the Duo content guidelines, we reviewed the copy, checking for grammar and style errors.

Feedback: We communicated edits to designers with links to resources that informed copy decisions.

Next
Next

15 Days UX Writing Challenge