Design.AI - Ensuring brand consistency

Demonstration and Discussion

Ensuring consistency in brand image and levels of accessibility can become an inefficient task with a lot of iteration over designs and wasted designer time in pixel pushing. Design.AI was created as a tool to combat these issues, allowing designers to spend their time on making creative decisions rather than tedious labour like making pixel perfect designs or reading extensive guidelines about their employer's brand image.

The different features offered by Design.AI are as follows:

• Design Review: Comparing the current design with the selected design system (digitized brand guidelines). Reporting violations, suggesting fixes, calculating compliance score, and measuring other key metrics.
• Design Evaluation: Calculating heatmaps and gazeplots from architectures developed in conjunction with the Computational Research Lab at Aalto University in order to optimize the UI to better grab the end user's attention.
• Accessibility: Reporting all accessibility conflicts such as contrast issues between any two layers in extremely complex designs in real-time. Suggests fixes according to the Web Content Accessibility Guidelines (WCAG) 2.0.
• Reports and Dashboard: Reflecting all the data as concise reports in a dashboard website for design leads, and managers. Provides a useful synopsis of open and closed issues and reflects month on month KPIs such as compliance and operational costs saved.

We have developed this tool mainly in conjunction with the Figma API as Figma is the first application the plugin is deployed on. In creating several of the above listed features, a lot of new technologies were researched and developed, such as the deep learning models created for Design Evaluation. Deep learning models such as Large Language Models (LLMs), gaze estimation models, and Convolutional Neural Network (CNN) classifiers are a few of the key technologies used. Furthermore, data structures like graphs and trees were primarily used with modified algorithms for evaluating the design during Design Review and evaluating Accessibility. All the important company data including digitized guidelines, designers, team leads, and important KPIs were stored in multiple relational databases.

Professional UI/UX designers and their feedback has been integral in creating this tool. It has been an iterative process to ensure that we are actually able to deliver the value we believe this tool will provide. Multinational brands like H&M and Kone have taken interest in this tool. The company website can be found below.

Company Website: Link
GitHub Code Repository: Private Repository