What are Design Guidelines?
Design guidelines are sets of guides and recommendations on how to apply design principles to the product. The purpose of design guidelines is to make a uniform design between all designs of the product. The guides usually divided into several organize a group of an attribute which is style, layout, UI component, text, interaction and behavior, platform, accessibility, design patterns, and resources. Here is the explanation of each group of guides.
Style guidelines define the visual expression of an organization that describes the characteristic to the user. Every designer or organization has its own style guide which they use to build color, logos, icons, and typography.
Layout guidelines define the position and structure of the interface placement. UI can be designed using grid layout or list layout. This section of guidelines also contains the behavior of the responsive design.
- User Interface Component
The user interface component usually organizes the specs and usage of the component that is shown in the interface. Usually, this section is to think about user interaction with the interface to maximize the experience. Examples of UI components such as windows, dialogs, controls, panels, menus, views, scrollbars, buttons, and many other similar items.
Text design guidelines organize the tone and style of text that being used in the user interface. Usually, the purpose of text design guidelines is to be easy to understand for all kinds of users. Examples of text design guidelines such as font size, color, and style. All of the text that is displayed in the interface are being arranged by these guidelines.
- Interaction and Behavior
Interaction and behavior organize all types of interaction that a user performs with a design, and system response. Examples of this interaction that being organized such as click, gesture, and voice.
Platform design guidelines organize all types of supported platforms. Examples of this platform that is organized such as resolutions and platforms.
- Design Patterns
Reusable design patterns are included in UI guidelines. These patterns define behavior for certain controls. Examples of this accessibility that is being organized such as navigation, search, forms, data formats, states, and pagination.
How to implement Design Guidelines?
Implementing design guidelines in your project can be done by design it based on the requirement and the business model of our project in the Product Requirement Document (PRD). The content in the PRD includes persona, feature, objective, user flow, and design. From this content, you can create your project design correspond to the goal that is achieved.
This is my article for my Individual Review for PPL course at the Faculty of Computer Science, University of Indonesia.