Imagine is a generative AI art studio that empowers creators to produce stunning visuals, videos, music, and more through intuitive, AI-driven creation tools.
Brief
Imagine One unifies all of ImagineArt’s fragmented AI studios into one seamless, intuitive platform, designed to give creators a clean, spacious, and empowering environment to generate anything they imagine with ease.
Project Overview
Before Imagine One, ImagineArt was a powerful but fragmented AI content generation platform. It featured multiple studios: Image, Video, Music, and Audio, and solutions that enabled end-to-end content creation like short videos with captions or avatar based clips.
Despite its capabilities, users rarely ventured beyond their primary studio. Each studio had a distinct design language and workflow, fragmenting the user journey and diluting the creative experience.
Task at hand
Create a single, seamless interface that allows users to generate anything, from images to videos to music, in one place, without friction or confusion.
I worked on Imagine One alongside our CTO: Abdullah Rafique, our Product Manager: Saad Ahmed, and as part of the Product Design Team with Khadija Umer and myself.
Together, we set out to unify ImagineArt into one coherent creative ecosystem.
Problem
Creators were losing momentum switching between different studios and interfaces.
Even though the workflow naturally flowed from image to video creation, the disjointed design made this process cumbersome.
Key challenges:
Fragmented user experience
Inconsistent UI and UX
High cognitive load
Intimidating prompt systems
We needed to craft a connected, intuitive, and inspiring creation environment that preserved creative flow while simplifying control.
Process & Design Thinking
1. Wireframing & Early Experiments
I began with exploratory wireframes, testing layouts that gave users control through a dedicated left panel, much like competitors in the market.
However, user tests quickly revealed its weaknesses:
Occupied too much editor space
Distracted from the creative canvas
Felt cognitively heavy for creators
“Creators want to see their creations, not their settings.”
Even after multiple refinements, the approach failed to feel natural. It was time to rethink the structure entirely. We wanted Imagine One to feel natural in user’s creative flow.
2. The Breakthrough: Editor-First Simplicity
The key realization was that creators spend 95% of their time in the editor.
So, I reimagined the interface around that principle: the editor must feel light, spacious, and immersive.
We removed the left panel and relocated all controls within the prompt box, keeping the focus on the creative canvas.
I also introduced grid customization within the editor:
List Grid: organizes generations by prompts.
Masonry Grid: displays only the generated assets for inspiration and review.
This redesign made the workspace feel calm and creative again.
3. Unified Experience Across Studios
All studios were moved under a single top navigation bar, allowing seamless switching between modalities without changing environments.
The editor remained visually and functionally consistent across image, video, and music generation, a key step in reducing friction and helping users explore more naturally.
4. Image Full View Experience
The asset full view was designed to be both informative and inspiring.
Users could instantly see:
Who created the asset
Its technical properties
How it can be reused or edited
The result was a minimalist, elegant view that users could appreciate visually, not just functionally.
5. Refined Prompt Experience
The prompt box, the heart of creation, went through numerous iterations to strike the perfect balance between power and simplicity.
We refined:
Contextual guidance (tooltips, microcopy)
Responsive resizing for focus
Integrated style controls within the box itself
We weren’t just solving a problem, we were shaping a new creative standard.
6. Drag-and-Drop Magic
While collaborating closely with our team, we brainstormed a feature that became a user favorite: drag-and-drop actions.
Users could drag images (from local files or within the editor) into the prompt box.
A smart action sheet appeared dynamically, allowing them to:
Use the image as a reference
Upscale it
Style from it instantly
It transformed the workflow into something playful, intuitive, and delightfully fast.
A feature so natural that even our own team uses it daily.
7. Responsive by Design
From the start, Imagine One was crafted to work fluidly across all devices.
Desktop, tablet, and mobile experiences were designed to feel equally complete, ensuring creators could stay productive anywhere.
