logo
Resources
Table of content
Motiff AI
Interface
Layers and tools
Layer properties
Design systems
Prototypes
Dev Mode
Collaboration
Import and export
File settings
Account
File management
Team management
Sharing and permissions
Billing
Organization
Apps
Work with support
Help Center/Motiff AI/AI Design Systems/AI Consistency Checker

AI Consistency Checker

Using design systems can improve team design consistency. Non-conforming components and styles often appear for various reasons, leading to consistency issues.

AI Consistency Checker scans design files and compares them to the current design system, flagging color, text, and components that aren't in the system. It also supports one-click bulk replacement with standardized styles in the design system.

Use AI Consistency Checker

  1. 1.Open the design file, click '24_Toolbar_AIseacted.svg' and select AI Consistency Checker. 'AI Consistency Checker.png'
  2. 2.Select one or more design system files for inspection. AI will extract new styles and components that are not included in the current design system files.
  3. 3.AI consistency checker will suggest and store design systems used in the last maintenance of the current file. You can also click Manage to make changes. 'Manage.png'
  4. 4.After selecting the design system, click Start to start the AI consistency check.

Configure preference

Configure Preference in the AI Consistency Checker popup.

If the current design system doesn't have guidelines for text line height, you can enable Skip text layers that differ only in line height from styles within the design system. Thus, text layers with only line height differences will not be marked in the checking results. 'preference.png'

Checking results

After the checking process is completed, you can view the checking results for Text, Color, and Component in the popup.

  • The Text panel shows the text styles that are not used in the design system in two categories: Unused same-property style and No same-property style.
  • The Component panel shows the design elements that haven’t applied components of the design system and have different properties. Motiff supports checking common components such as buttons, labels, checkboxes, dialog, toast, tab, navigation bar, tab bars, etc.

You can choose and locate elements that are not using the design system in the list.

Click on the card to view the specific location of the current style and component on the page. Clicking '16_Common_ArrowDown (2).svg' or '16_Common_ArrowUp.svg' allows you to locate layers in sequence. 'Checking results.png'

Note: In the Text and Color panels, you can click Replace all to replace unused design elements with text or color styles in the design system in one click.

Tip: When using AI Consistency Checker, AI will skip layers that are hidden or locked in the design files. Moreover, design elements such as illustrations and marketing graphics will also be skipped.