Summary of Key Points
This article tests an AI design tool called TRAE Work Design, focusing on the three major shortcomings of previous AI design tools: disregard for brand guidelines, cumbersome image editing, and fragmented tool functionality. It also explains how TRAE addresses these issues by allowing for the import of brand design systems to ensure compliance in the output, providing flexible image editing options, and integrating the entire process from requirement formulation to code generation. The article discusses a new trend in the AI design industry: the shift from competing on the ability to generate visually appealing images to focusing on creating seamless workflows between tools. The tool that can seamlessly integrate these processes will gain a competitive advantage.
I. Previous AI Design Tools: Aesthetically pleasing but Unpractical
Many AI design tools have emerged in the past year (such as v0 and Bolt), and while they produce attractive images, they had three significant drawbacks:
1. Disregard for brand guidelines: When using these tools to create a company’s homepage, they often choose colors, font sizes, and button styles arbitrarily, resulting in designs that do not match the company’s established brand aesthetic. The resulting images are only suitable as preliminary drafts for demonstrations.
2. Time-consuming image editing: Early AI design tools required the redrawing of the entire image, while newer versions allow for partial modifications, but with limited precision, making it difficult for designers to achieve the desired results even after extensive communication with the AI.
3. Fragmented tool functionality: Tasks were divided across different platforms—requirements were documented, designs were created in Figma, and code was written in IDEs—leading to frequent information loss and reduced efficiency.
II. TRAE Work Design: A Practical Solution
TRAE has made improvements to address these issues:
1. Understanding of brand guidelines: It can directly import design systems from tools like Figma (including predefined color schemes and component styles), ensuring that the generated designs align with the company’s brand standards.
2. Flexible image editing: Users can make broad changes through simple interfaces (e.g., changing the background color to light blue or adjusting the layout of featured cards) or fine-tune details using panels, allowing for quick adjustments within minutes.
3. Integrated process: TRAE enables users to complete the entire workflow from defining requirements to generating designs and obtaining code on a single platform, eliminating the need to switch between tools and preventing information loss.
III. A Few Shortcomings of TRAE
During testing, it was noted that TRAE’s approach lacked some creativity for promotional scenarios. For example, when creating an H5 for a 618 sale, the generated design lacked the vibrant and eye-catching atmosphere required for such events; the colors were not bright enough, and the elements did not have sufficient impact.
IV. The New Competitive Focus in AI Design Tools: Seamless Workflows
In the past, AI design tools competed on how quickly and beautifully they could generate images. However, image generation capabilities are no longer the limiting factor; the real bottleneck is the lack of seamless integration between tools. Current industry trends focus on bridging the gap between design and code development (tools like TRAE, Lovable, and v0 are all working on this). The tool that can seamlessly connect these processes will have a significant advantage in the future.
In summary, while previous AI design tools were more for show than practical use, modern tools are aimed at saving designers time and reducing the hassle associated with image creation.