Info.

Ion, part of YC W24, builds AI-native tool that supports teams from ideation to ship production-ready features.

Info.

Ion, part of YC W24, builds AI-native tool that supports teams from ideation to ship production-ready features.

Role.

Launched 3 WebUI assets that refreshed outdated content and drove a 5% increase in site traffic

Role.

Launched 3 WebUI assets that refreshed outdated content and drove a 5% increase in site traffic

Team.

Florence Chou Sebastian Moreano Mesa Asher Wu Amenze Sholanke Esther Pelaez

Team.

Florence Chou Sebastian Moreano Mesa Asher Wu Amenze Sholanke Esther Pelaez

Info.

Ion, part of YC W24, builds AI-native tool that supports teams from ideation to ship production-ready features.

Info.

Ion, part of YC W24, builds AI-native tool that supports teams from ideation to ship production-ready features.

Role.

Designed features that simplified AI workflows and improved design-to-engineering handoffs

Role.

Designed features that simplified AI workflows and improved design-to-engineering handoffs

Vibe coding tools fall short on scaling.

Project overview

Designing AI-native workflows at a fast-moving startup

Ion is an an AI design tool built for makers and lean product teams, streamlining the design-to-dev workflow to produce components that could be directly used in the product. I joined during a pivotal shift toward AI agents, thereby wearing multiple hats throughout including

  • Spoke with 12+ designers, PMs, and founders to map mental models on AI-driven workflows

  • Designed agent-first user workflow over many iterations

  • Published 15+ new components to the team's design system

Breaking down key challenges

1) Defining our user: the tradeoff between powering creativity vs. speeding automation

1) Defining our user:
the tradeoff between powering creativity vs. speeding automation

The product was in MVP stage with an intention to sharpen its direction beyond just a vibe code tool. Our goal was to identify a clear market niche and improve long-term sales. Through interviews with teams ranging from 3 to 50 people, I concluded 2 user archetypes and 2 opposite-looking product directions.

Instead of prioritizing workflow-focused users who want to automate certain design tasks, we chose to focus on the hybrid users, teams who value creative exploration but welcome AI-assisted support. This pivot allowed us to build on existing features while aligning with business goals: reframing the product from a vibe code tool into an active collaborative assistant.

2) Challenging the current product workflow

2) Challenging the current product workflow

The current product follows a one-sided interaction: users enter prompt and receives a visual feedback. The “prompt-to-response” flow failed to support more complex needs such as iteration variation. Designers struggled with switching between tools and found it hard to express ideas clearly when working on 1) novel concepts and 2) daily tasks that following the design system.

Product Designer

Series C Startup

"I need to learn how to communicate my needs with the machine than of the other way."

Product Designer

Series C Startup

"I need to learn how to communicate my needs with the machine than of the other way."

Product Designer

Series C Startup

"I need to learn how to communicate my needs with the machine than of the other way."

Product Designer

Series C Startup

"I need to learn how to communicate my needs with the machine than of the other way."

Co-founder

Early-stage startup

The problem client is facing is 1) prototyping to speed and 2) have the design ready.

Co-founder

Early-stage startup

The problem client is facing is 1) prototyping to speed and 2) have the design ready.

Co-founder

Early-stage startup

The problem client is facing is 1) prototyping to speed and 2) have the design ready.

Co-founder

Early-stage startup

The problem client is facing is 1) prototyping to speed and 2) have the design ready.

Existing product workflow follows a one-way path.

Leading UXR insights

How might we dynamically involve ion and its AI capabilities to elevate the design process?

Thought Partner

Thought Partner

Thought Partner

Thought Partner

Users are interested to use AI as a second brain.

65% of users already use AI for prototyping and copywriting. But many shared frustrations about the need for multiple attempts, the limitations of text prompts, and results not ready for production.

What starts as a quick prompt often turns into a fight for accuracy.

Manual vs. Generative

Manual vs. Generative

Manual vs. Generative

Manual vs. Generative

Users want and need creative control to remain authentic.

While 90% of users are familiar with design and AI tools, they prefer the option to edit. Because most AI usage drop-offs are caused by execution limitations between users’ vision and actual outcomes, it becomes crucial to actively involve users' inputs in the process.

Because most AI usage drop-offs are caused by execution limitations between users’ vision and actual outcomes, it becomes crucial to actively involve users' inputs in the process.

User often need to add some final touches before moving on.

Streamlined Flow

Streamlined Flow

Streamlined Flow

Streamlined Flow

Users seek a cohesive workflow that connect the dots.

Users shared that they frequently switched between many tools to finalize and deliver their work. The information is scattered so as the thinking process. Introducing yet another tool to their current ecosystem only added friction than improving efficiency.

Users shared that they frequently switched between many tools to finalize and deliver their work. Introducing yet another tool to their current ecosystem only added friction than improving efficiency.

The tools should be easy to integrate with users' current workflow.

Glance at my contributions

Enhancing AI workflows while providing more ways to create

Workflow Enhancement

Workflow Enhancement

Workflow Enhancement

Workflow Enhancement

Connects with users' existing workflow and brings AI agent into context through subtle nudges

Slack Integration

Slack Integration

Slack Integration

Slack Integration

Highlight #1

Starting from where the user initializes their idea, ion actively engages the user from where the discussion starts.

Highlight #1

Starting from where the user initializes their idea, ion actively engages the user from where the discussion starts.

Highlight #1

Starting from where the user initializes their idea, ion actively engages the user from where the discussion starts.

Highlight #1

Starting from where the user initializes their idea, ion actively engages the user from where the discussion starts.

Easy context switching

Easy context switching

Easy context switching

Easy context switching

Highlight #2

I created this toggle between brainstorm canvas and design workspace to ease the transition between AI generations and design fine-tune.

Highlight #2

I created this toggle between brainstorm canvas and design workspace to ease the transition between AI generations and design fine-tune.

Highlight #2

I created this toggle between brainstorm canvas and design workspace to ease the transition between AI generations and design fine-tune.

Highlight #2

I created this toggle between brainstorm canvas and design workspace to ease the transition between AI generations and design fine-tune.

Quick Actions

Quick Actions

Quick Actions

Quick Actions

Highlight #3

Users prefer shortcuts to their most-used functionalities. I designed shortcuts via the quick actions menu to reduce friction by surfacing common tasks.

Highlight #3

Users prefer shortcuts to their most-used functionalities. The quick actions menu reduces friction by surfacing common tasks without navigating multiple layers.

Highlight #3

Users prefer shortcuts to their most-used functionalities. I designed shortcuts via the quick actions menu to reduce friction by surfacing common tasks.

Highlight #3

Users prefer shortcuts to their most-used functionalities. I designed shortcuts via the quick actions menu to reduce friction by surfacing common tasks.

Upload UI kits

Pin favourite design

Creative Control

Creative Control

Creative Control

Creative Control

Integrating AI functionalities and manual design controls to provide user creative freedom and workflow efficiency

Live cursor

Live cursor

Live cursor

Live cursor

Highlight #1

To better embed the AI agent into the workflow, we introduced multiple modalities of chat interactions to support different fidelities of design changes.

Highlight #1

To better embed the AI agent into the workflow, we introduced multiple modalities of chat interactions to support different fidelities of design changes.

Highlight #1

To better embed the AI agent into the workflow, we introduced multiple modalities of chat interactions to support different fidelities of design changes.

Highlight #1

To better embed the AI agent into the workflow, we introduced multiple modalities of chat interactions to support different fidelities of design changes.

Mode: AI Cursor Chat

Mode: AI Cursor Chat

Mode: AI Cursor Chat

Mode: AI Cursor Chat

Ion AI lives as an agent next to user's cursor. I designed the chat to resemble communication apps to create the experience of having a creative partner.

A Newsletter Viewer

Feature 1 (Shipped)

An all-in-one-place archive that enable the user to read through the most current newsletter and the organization to keep active documentation of all current and past works works with ease

Info.

Ion, part of YC W24, builds AI-native tool that supports teams from ideation to ship production-ready features.

Info.

Ion, part of YC W24, builds AI-native tool that supports teams from ideation to ship production-ready features.

Role.

Designed features that simplified AI workflows and improved design-to-engineering handoffs

Role.

Designed features that simplified AI workflows and improved design-to-engineering handoffs

Team.

Florence Chou Sebastian Moreano Mesa Asher Wu Amenze Sholanke Esther Pelaez

Team.

Florence Chou Sebastian Moreano Mesa Asher Wu Amenze Sholanke Esther Pelaez