Case Study: Fluxymat Atomic Design System

Context  

As part of a digital transformation project, Fluxys, which is a large company, wanted to create a specialized department (Digital Lounge) to open up to a new ways of working and mindset. The main idea id to create each application like a new start-up. methodologies such as design thinking and scrum have been implemented and practiced.

What is Fluxymat

This is the atomic design system for Fluxys Digital Lounge. Fluxys companies that develop various platforms for their companies that are going digital really need what is called a design system. because with the design system we can make various kinds of products with references and styles that still represent the company.My Role as UX-UI lead was to create, structured, develop, update and design FluxMat.

What is a atomic design system

Design systems can help bring together the various perspectives of people working on a project. This design system will unite the thoughts of everyone who works when creating a digital product, starting from building tools, guidelines, and principles.
Finally we thought to create a design system to unify it all. by adopting the concept created by Brad Frost, namely atomic design,
this is the order in atomic design. scientifically, this is the meaning of each type of atomic:
atom, is the smallest substance that can not be divided further.
A molecule, is something composed of two or more atoms bonded together by chemical bonds.An organism is an assemblage of molecules that influence each other in such a way that they function stably and have the characteristics of life.The template is a composite of several organisms. As the name suggests, it is the blueprint of a web pagePages are the final product of atomic design. It is a template filled with real data.With this method, you have to start designing from the smallest components. These components include labels, paragraphs, headings, and buttons.
atomic design system
color guide
Font Style
Icon Library

My Design Process

 1. User Research
–  Identify the problem
–  Identify the solution
–  Define the objectives
–  Sector Competitor Analysis (moodboarding)
2. Define
–  User Personas

The User Research Phase

We manage to create 2 personas that will represent the goals and the needs of the larger group in the organization

Let’s talk.

95 rue hotel des monnaies
1060 Saint-gilles
Belgium