DORIAN
Adding an agentic AI layer to a web-based creator tool
My Role
UX Strategy
Product Design
Visual Design & Animation
Tools
Figma
After Effects
The Core Team
Director of PM
VP of Content
Lead Engineer
Overview
As a UGC narrative fiction platform, Dorian is really two products - a game app and also a creator tool that let’s anyone create and publish their own games on the platform.
However, Dorian’s creator tool had a steep learning curve for game creators - especially when it came to optimizing for monetization and performance. We felt this was a perfect opportunity to use agentic AI to leverage our vast performance data to help creators boost retention and revenue in order to accelerate creator onboarding and help scale the platform.
As Director of Product Design, I led the design initiative, defining the user experience and providing visual design and animation.
Defining the Problem
I started by having lots of 1:1 conversations with our end users - in this case, Dorian game creators - to identify current friction points and opportunities for AI to improve the game creation experience. I also ran surveys and discussion groups.
KEY ISSUES IDENTIFIED:
Creators need more guidance on how to optimize their games for performance.
The current tool does not explain the core creation features well.
Current UI is overly busy and doesn’t prioritize information clearly.
Solutions
Designing an agentic AI layer for the tool required balancing user control with autonomous action - we needed users to have enough visibility into the AI's decision-making process to maintain trust, while not being overwhelmed by constant status updates or approval requests.
The core challenge was to clearly communicate what the agent is doing, why it's doing it, and when human intervention is needed - all while preserving the efficiency gains that make delegation valuable in the first place.
The design began by defining our primary creator types (novice, intermediate, advanced) and mapping user journeys for each. Figma’s tools are so fast and flexible that I usually move quickly from wireframes to interactive prototypes to help iterate on the flow. In this case, we did several rounds of internal iteration and testing before arriving at a flow that both addressed our key issues and felt intuitive to use.
Updating the UI Visual Design
The existing UI design had predated me at the company. And it had accumulated a number of UX issues as features had been added over the years. Primary, secondary and tertiary features were equally weighted and competed for new users’ attention. I used this opportunity to streamline the UX to reduce distractions to core tasks:
- clearly grouping asset library features
- removing/deprecating little used features
- making node presentation more visual for easier scanning of complex node graphs
Additionally, the existing visual style did not adhere to the company’s current branding, so this was also an opportunity for me to modernize the visual style and create a new, more robust design system.
Defining the Vision
Once we had a design solution we believed in, I wrote and created a video demo in After Effects to build excitement in the community - and as a design artifact to assist engineering in understanding the product vision.
DORIAN
Adding an agentic AI layer to a web-based creator tool
My Role
UX Strategy
Product Design
Visual Design & Animation
Tools
Figma
After Effects
The Core Team
Director of PM
VP of Content
Lead Engineer
Overview
As a UGC narrative fiction platform, Dorian is really two products - a game app and also a creator tool that let’s anyone create and publish their own games on the platform.
However, Dorian’s creator tool had a steep learning curve for game creators - especially when it came to optimizing for monetization and performance. We felt this was a perfect opportunity to use agentic AI to leverage our vast performance data to help creators boost retention and revenue in order to accelerate creator onboarding and help scale the platform.
As Director of Product Design, I led the design initiative, defining the user experience and providing visual design and animation.
Defining the Problem
I started by having lots of 1:1 conversations with our end users - in this case, Dorian game creators - to identify current friction points and opportunities for AI to improve the game creation experience. I also ran surveys and discussion groups.
KEY ISSUES IDENTIFIED:
Creators need more guidance on how to optimize their games for performance.
The current tool does not explain the core creation features well.
Current UI is overly busy and doesn’t prioritize information clearly.
Solutions
Designing an agentic AI layer for the tool required balancing user control with autonomous action - we needed users to have enough visibility into the AI's decision-making process to maintain trust, while not being overwhelmed by constant status updates or approval requests.
The core challenge was to clearly communicate what the agent is doing, why it's doing it, and when human intervention is needed - all while preserving the efficiency gains that make delegation valuable in the first place.
The design began by defining our primary creator types (novice, intermediate, advanced) and mapping user journeys for each. Figma’s tools are so fast and flexible that I usually move quickly from wireframes to interactive prototypes to help iterate on the flow. In this case, we did several rounds of internal iteration and testing before arriving at a flow that both addressed our key issues and felt intuitive to use.
Updating the UI Visual Design
The existing UI design had predated me at the company. And it had accumulated a number of UX issues as features had been added over the years. Primary, secondary and tertiary features were equally weighted and competed for new users’ attention. I used this opportunity to streamline the UX to reduce distractions to core tasks:
- clearly grouping asset library features
- removing/deprecating little used features
- making node presentation more visual for easier scanning of complex node graphs
Additionally, the existing visual style did not adhere to the company’s current branding, so this was also an opportunity for me to modernize the visual style and create a new, more robust design system.
Defining the Vision
Once we had a design solution we believed in, I wrote and created a video demo in After Effects to build excitement in the community - and as a design artifact to assist engineering in understanding the product vision.
DORIAN
Adding an agentic AI layer to a web-based creator tool
My Role
UX Strategy
Product Design
Visual Design & Animation
Tools
Figma
After Effects
The Core Team
Director of PM
VP of Content
Lead Engineer
Overview
As a UGC narrative fiction platform, Dorian is really two products - a game app and also a creator tool that let’s anyone create and publish their own games on the platform.
However, Dorian’s creator tool had a steep learning curve for game creators - especially when it came to optimizing for monetization and performance. We felt this was a perfect opportunity to use agentic AI to leverage our vast performance data to help creators boost retention and revenue in order to accelerate creator onboarding and help scale the platform.
As Director of Product Design, I led the design initiative, defining the user experience and providing visual design and animation.
Defining the Problem
I started by having lots of 1:1 conversations with our end users - in this case, Dorian game creators - to identify current friction points and opportunities for AI to improve the game creation experience. I also ran surveys and discussion groups.
KEY ISSUES IDENTIFIED:
Creators need more guidance on how to optimize their games for performance.
The current tool does not explain the core creation features well.
Current UI is overly busy and doesn’t prioritize information clearly.
Solutions
Designing an agentic AI layer for the tool required balancing user control with autonomous action - we needed users to have enough visibility into the AI's decision-making process to maintain trust, while not being overwhelmed by constant status updates or approval requests.
The core challenge was to clearly communicate what the agent is doing, why it's doing it, and when human intervention is needed - all while preserving the efficiency gains that make delegation valuable in the first place.
The design began by defining our primary creator types (novice, intermediate, advanced) and mapping user journeys for each. Figma’s tools are so fast and flexible that I usually move quickly from wireframes to interactive prototypes to help iterate on the flow. In this case, we did several rounds of internal iteration and testing before arriving at a flow that both addressed our key issues and felt intuitive to use.
Updating the UI Visual Design
The existing UI design had predated me at the company. And it had accumulated a number of UX issues as features had been added over the years. Primary, secondary and tertiary features were equally weighted and competed for new users’ attention. I used this opportunity to streamline the UX to reduce distractions to core tasks:
- clearly grouping asset library features
- removing/deprecating little used features
- making node presentation more visual for easier scanning of complex node graphs
Additionally, the existing visual style did not adhere to the company’s current branding, so this was also an opportunity for me to modernize the visual style and create a new, more robust design system.
Defining the Vision
Once we had a design solution we believed in, I wrote and created a video demo in After Effects to build excitement in the community - and as a design artifact to assist engineering in understanding the product vision.