We are normally familiar with UI Documentation referring to Atomic design methods. But the more project gets bigger at enterprise scale, the components and rules are getting harder to organize among existing and new designers.

My challenge statement is: How to design effective documentation to support UI cases, UX rules, and business requirements in any scalable iteration stage.

DOCUMENTATION PLAN

Let’s start by separating the library into two stages referring to the Atomic design concept.

Library Stage 1: Build the atom and molecules which is the basic UI elements such as text, colors, input fields, dropdowns, etc.

Library Stage 2: Gather the combinations of the atom and molecules; including the UI patterns and rules by their usage.

Working files: These files will use the published library 1 and 2 to craft the Interface design following the requirements and allow to have their own customized components inside the file without affecting the main components from Library 1 & 2

Identify Users

To make Design system can be easily used by users (which could be designers, owners, referrers etc.) We need to understand way of work

Define the structure

It depends on how “user” see and manage the file. The easiest way is to research the designers which we can try with multiple ways ex: Interview, observe or test.

To define the structure we can design by

• – Object-based: This structure will describe based on how the components are used or the requirement based ex: Business requirements. This method will need an example of data to mockup the components
• – Function-based: This structure will describe based on their fundamental functions and their usage. This is no need a real data to mockup the components.

Which are similar to the programming methodology, we need to consider project fundamentals, concept and iteration process.

Establish guidelines for contributing

When the workflow is clear within the team, you need to create a space or area for designers to contribute. Please ensure that we consistently reflect on our process and continue to develop along the way.

Sync-up, CRITIQUE and refine:

Continuously ensure that the documentation stays up-to-date and relevant, and that it continues to meet the needs of the team by having critique sessions.

The key of the effective process is consistent communication and fearless iteration.