AI Director
AI Director is an all-in-one AI video generation tool that enables users to create complete videos from simple text descriptions. Unlike current technology, which only allows the creation of 4-second video clips, AI Director provides users with the ability to generate longer, more comprehensive narrative videos, aligning with their expectations for richer content creation.
What I did?
Competitive analysis, market analysis, Conducted interviews, and contextual inquiry. Designed wireframes and low and high-fidelity prototypes.
Role
UX Designer
Duration
6 months
Tools
Figma, Photoshop, Whimsical
Team
1 PM
3 UX Designers
2 Developers
Background
Decohere is a Y combinator-backed startup revolutionizing AI video generation by transforming text description into videos. Their current product Turboo creates 4-second clips from the text which has attracted many new users but experienced low retention rates. Users find the short clips limiting and the process lacks the advanced features necessary to comprehensive video production experience.
Process
For our capstone project, we had two academic quarters to complete and hand it off for development. The project followed three main phases: research, design, and evaluation, with regular check-ins with Decohere’s management and engineering team. Our design process was not linear but here is a simplified overview of our timeline:
How can we design an AI video production tool that enables users to effortlessly and quickly create complete videos, considering the current limitations and constraints of the video and visual LLMs ?
Final Design
AI Script Assistant
The AI Script Assistant quickly generates video scene descriptions that capture users' vision and adapt AI language to produce high-quality scene video outputs. It can one-click assign text prompts to the scene card, making the process faster and easier.
Effortless Video Creation
Users can effortlessly add scenes, input text, choose a starting image from a wide range of options, and let the AI technology do the magic. The text becomes a video in seconds, allowing users to create as many scenes as they want.
Create Multiple scenes at once
Users can select multiple scenes and let the product handle the rest. With one click, videos for selected scenes are generated automatically.
Add Transitions
Users can add a professional touch with transitions. With just a few clicks, the video flows smoothly from one scene to the next.
How did we get there?
Understanding the problem space
We conducted in-depth research to understand the current user experience and flow, identify challenges and areas for improvement in the video generation process, and gather insights on user expectations, needs, preferences, and behaviors.
​
Our research methodology encompasses competitive analysis, in-depth interviews, contextual inquiry, and netnography to thoroughly understand user experience and market dynamics.
Competitive Analysis
We conducted competitive analysis with competitors such as ChatGPT, Runway, Pika, and Genmo to identify strengths, shortcomings, and trends in AI video generation and editing.
In-Depth Interviews
We interviewed 4 current Decohere users to gain insights into their perspectives and expectations regarding AI video editing tools and Decohere’s future direction.
Contextual Inquiries
We recruited 3 users familiar with AI technologies but new to Decohere to interact with the platform in their natural environments.
Netnography
We analyzed over 25 AI-generated content videos on TikTok and YouTube, created by AI enthusiasts and content creators.
What did we learn from research?
Expectation vs Output
​
Users expect AI video generators to produce longer videos (2-3 mins) instead of short GIFs. They struggle to maintain a consistent style across clips and need better transition features for cohesive videos.
Prompting Challenges
​
Experienced users can craft effective prompts, but struggle, especially with longer prompts that confuse the AI.
Unclear generation process
​
Users are unaware that creating an image is the first step of the video generation process in decohere. They prefer starting with an image and want more control over specific video elements.
More control over the iterative process
​
Creating satisfactory output requires multiple iterations and users often lack the knowledge or tools to effectively revise their results. They want more flexible process.
Concept Testing
To maximize the current AI technology and address user pain points, we focused on ideating concepts to solve the question:
How can we design a seamless layout for switching between scene clips as the product's foundational structure?
After thorough analysis, we chose Concept 2 as it best addresses user pain points and aligns with business needs, despite requiring more development effort. This decision was based on a holistic evaluation of user experience, business goals, and engineering feasibility.
​
Concept 2 enables seamless scene switching, real-time image generation, and a storyboard overview with scene descriptions and previews, reducing clicks and enhancing satisfaction. By aligning with Decohere's strategy and providing a dynamic, flexible process, it ensures a superior product that supports ongoing refinement and long-term user engagement.
The stakeholders' primary concerns centered around the business implications and engineering resources for the product. To address this, we spent an additional week on market research and presented detailed positioning maps showing the competitive landscape, market advantages, and Concept 2's alignment with user needs and business goals.
This approach successfully persuaded stakeholders of Concept 2's value and feasibility.
Feature and content organizations
We divided features into project, overview, scene edit, and prompting levels, with the video creation process occurring within the overview and scene edit levels.
Wireframes
Based on the grouping, the team created a mid-fi design to determine the placement of the feature groups.
Features to effective design
Project Level
​Edit project name and export and are the two main feature placing on the project navigation bar
Overview Level
There are four main features on the overview timeline: scene navigation, batch generate, add transition, and play video.
​
Scene navigation helps users quickly find and edit scenes while providing an overview of the scene content. Batch generate allows users to create multiple scenes with a single click. Add transition enables smooth transitions between scenes. Play video lets users view the video result while editing.
Scene Level
The scene edit card includes four main features: the ability to move and delete scenes, input text prompts, select images, and generate clips.
​
In our design, we prioritized the information hierarchy by making the clip view the largest element, as it is the primary focus for users. The text input and image selection areas follow in importance.
Script Level
The script assistant uses an pop up AI chatbot to let users freely express their story ideas and requirements.
​After designing the mi-fi prototype, we created a story book (link to the story book) and shared it with DHH users in two feedback sessions: one with our participant and another as a public showcase at the University of Washington.
Usability Testing
We conducted guided usability tests with 6 individuals, focusing on three primary user flows: video creation, one-click generation, and the AI script assistant. Our aim was to assess the clarity, comprehension, and completion of these tasks.
Usability Testing Key Finding​
The one-click generate feature is difficult to understand. Users often misunderstand its purpose and are confused about how to interact with it.
Problem 1: Naming​
​
The label “Batch Generate" does not accurately reflect the feature's functionality. Users interpret it as combining clips into
one video.
Problem 2: Entry Point​
​
The placement of the button is too close to the export option, leading users to perceive it as the final step rather than a middle step.
Problem 3: User Flow​
Users are unclear about the batch generate function before accessing it and find the pop-up text confusing, as it suggests task completion rather than an editing step.
Iterations
1. Revised naming to "Generate [X] Scene Videos"
Before​
The label “Batch Generate" is difficult to understand as users struggle to grasp the meaning of without prior experience with batch in other products to indicate what it does.
After​
To help users understand its function the button now indicates that it will generate the videos for the selected scenes. Additionally, we used the same icon as the single scene generate button to provide users with a familiar reference.
2. Repositioned and reorganised the entry point closer to the editing area.
Before​
​
After​
Before​
The hierarchy of the button is confusing as it is placed near the overview bar.
After​
Moved the button down a level below the overview bar. Additionally, we minimized several steps by incorporating check action in the forefront.
3. Revised the user flow to require selecting scenes before pressing the generate button.
Before​
Users select the scenes in the pop-up screen, then select generate to generate multiple scences.
After​
Merged select action within the overview bar thus minimizing a few more steps in the one-click generation process.
Design system
We converted the existing color and typography system from code into a design system in Figma to streamline the design process and minimize confusion during development. To expedite future engineering efforts, we also developed a design system for commonly used icons and components, ensuring engineer team can easily reuse them in future projects.
Launch Video
We also created this short promotional video to attract more users which also serve as a guide/onboarding when the product first launches.
Reflections
Thriving in Ambiguity
This project taught us to navigate ambiguities like unfamiliar technology, unclear user personas, and complex user journeys. By relying on proven design methodologies, clear communication, and quick adaptation, we were able to overcome challenges and discover the right design direction and solutions.
Embracing Responsible AI
Designing for AI products presents new and evolving challenges, but it's essential to uphold principles like Responsible AI. A key learning is the importance of understanding potential risks and harms these products may pose to users. By integrating ethical considerations into the design process, we ensure that safety and responsibility remain at the forefront, leading to the creation of a more ethical AI product.