Mobile Design System

LumApps is organized in feature teams. Each designer is responsible for his feature on the web version and on the native application.

As Lead Mobile Designer, my role is to ensure consistency within the native application.

In order to facilitate the work of all the designers and developers, we decided with the Mobile Product Manager and the Mobile Product Owner to set up a Design System specific to mobile.

The Web Design System was built for the most part before I arrived at LumApps, and served as the basis for this work.

Discover

I conducted interviews with developers and designers to:

       - Ensure we had the same understanding of what a Design System is.
       - Challenge the existing web version of Design System.
       - Know the willingness of everyone to contribute to the design system.

Audit

I went through the iOS and Android application to review all of it’s front-end design elements. I was able to identify the inconsistencies that we needed to focus on.

With the list of all these elements and inconsistencies, we built a roadmap for the Mobile Design System: fondations (spacing, sizing, text styles and colors), then components.

Due to a lack of resources, we decided to design and develop the different components when we would need them in future projects.

Build

When a designer expresses the need for a new component, the Mobile Design System team studies the request and the potential for reusability in other features.

To build a new component, we study its web version and confront it with a mobile vision. Each Figma component is tested with the designers. The challenge is to ease the understanding and the usage of the component to every user of the Figma Library.

Then I documente the component with zeroheight. During the discover phase, designers and developers expressed dissatisfaction with the lack of detail in the web documentation. I also set up new sections in the mobile documentation: component anatomy, gesture, dos and don'ts, examples and link to the Github repository.

The DS mobile project is still in its infancy. We still have a lot of work to do before it is fully operational.

Our next challenge is to integrate all designers and developers into the contribution.