This case study explores the design of an AI-powered chat editor that enables users to edit images using natural language commands. Instead of navigating complex tools, users describe their intent in plain language and receive completed visual outputs, significantly reducing effort and time to result.
In early 2024, I joined Appy Pie LLP as a UI/UX Designer to support its growing design team. I worked on two key products: a SaaS platform and an iPaaS solution. Soon after, we began developing the AI Playground, which allowed users to generate AI-based images, videos, audio, and 3D models.
Identifying a need for faster, more efficient image editing, I led the creation of the AI Chat Editor, transforming how users interact with AI-generated content.
The AI Chat Editor is a user-friendly platform that combines AI and image editing, allowing users to edit images with simple text commands. No technical skills required—it's fast, intuitive, and designed for both professionals and casual users.
Through competitive analysis, we examined the design approaches, UX strategies, and user solutions of leading brands. While many competitors focused on advanced features, they often neglected intuitive navigation and accessibility.
To design an intuitive AI Chat Editor, we received user feedbacks on A.P. Design Editor, Connected with those users, and at last we conducted usability tests to understand user needs. Users desired a simple tool for precise, real-time image edits.
Note: Due to company policies, we cannot share detailed Related to Users data, but the insights shaped our focus on creating a seamless experience with natural language commands.
The journey of developing the AI Chat Editor involved exploring multiple approaches to refine functionality and user experience. Over time, we iterated through four distinct strategies:
Approach 1: Users could edit images in the A.P. Design Editor, but redirection to another screen made activity tracking difficult.
Approach 2: Added a separate section for AI tools, but redirection issues persisted, complicating user path tracking for the support team.
Approach 3: Inspired by MidJourney's Discord and ChatGPT, we finalized the AI Chat Editor, enabling users to complete their journey seamlessly.
Worked on Figma to create the final design, including all pages with well-defined screens, components, and elements. The design File ensured consistency across the interface and streamlined collaboration with the development team.
We prioritized clear communication with the development team. We provided detailed prototypes, interaction flows, and documentation to ensure the design vision was implemented accurately.
Well-documented Figma file using Figma's Annotate Feature for providing detailed context of every design decision. Simplify collaboration.
