We observed the following two issues when other users were working with the styleguide:
Uncertainty when choosing components
It is not clear enough which components should be used to create meaningful layouts and code structures.
Uncertainty in user flows
There is a lack of comprehensible guidance on designing specific user flows. This issue stems in particular from the fact that mStudio has not yet been adapted to the new flow style, leaving no reliable reference to follow.
Solution
To address the issue quickly, we decided to introduce UI Patterns into the style guide. These offer several advantages:
They are much smaller and easier/faster to implement compared to templates. While templates would also solve the issues, they can only be added at a later stage.
They can be directly included as code examples in the styleguide.
They clarify processes and can be explained in more detail if needed.
For the MVP, the UI Patterns will contain only the necessary explanations to accelerate implementation.
Implementation
Initially, the following UI Patterns will be developed:
Dashboard
Creation Process
Structuring Content
Editing Process
In the future, topics such as forms, help texts, and component distinctions could also be added as UI Patterns.
Until enough UI Patterns are available, they will be placed within the "Foundations" section of the style guide. At a later point, we can evaluate whether UI Patterns should be added as a standalone item in the main navigation.
Problem
We observed the following two issues when other users were working with the styleguide:
Uncertainty when choosing components
It is not clear enough which components should be used to create meaningful layouts and code structures.
Uncertainty in user flows
There is a lack of comprehensible guidance on designing specific user flows. This issue stems in particular from the fact that mStudio has not yet been adapted to the new flow style, leaving no reliable reference to follow.
Solution
To address the issue quickly, we decided to introduce UI Patterns into the style guide. These offer several advantages:
For the MVP, the UI Patterns will contain only the necessary explanations to accelerate implementation.
Implementation
Initially, the following UI Patterns will be developed:
In the future, topics such as forms, help texts, and component distinctions could also be added as UI Patterns.
Until enough UI Patterns are available, they will be placed within the "Foundations" section of the style guide. At a later point, we can evaluate whether UI Patterns should be added as a standalone item in the main navigation.