Hearth AI is redefining how people connect and manage relationships by building a smart, agentic tool that acts as an extension of its users. At its core, Hearth helps individuals maintain meaningful connections, keep track of key details, and ensure nothing important falls through the cracks—empowering users to focus on building relationships, not managing logistics. Hearth is a seed stage company.
My Role
When I joined Hearth AI, the product was in its early stages, with an innovative vision but significant challenges in translating that vision into a cohesive and impactful user experience. My role was multi-faceted, leading design and product strategy while partnering closely with the CEO to:
Define and refine core product roles
Create intuitive designs that aligned with the company’s ambitious vision
Lead user research efforts to ground decisions in user needs and behaviors
This case study will focus on three critical initiatives:
Iterating the onboarding experience to deliver immediate value
Defining core AI Agent competencies that maximized user impact
Building a scalable design language to ensure consistency and efficiency across the product
Through these efforts, I helped lay the foundation for Hearth AI’s continued evolution as a powerful, user-focused tool.
Onboarding Experience
The Problem
When I joined Hearth AI, the product had no onboarding experience in place. New users were dropped into the interface with little guidance, which left them unsure of how to get started or realize the product’s potential. This lack of structure resulted in a slow time-to-value and low engagement from first-time users.
Solution
I designed the product’s initial onboarding flow from the ground up, focusing on educating users about Hearth AI’s capabilities and walking them through key features. While the first iteration was effective in introducing the product, feedback from user sessions revealed that it wasn’t delivering the "magic moment" quickly enough. Users often felt overwhelmed by information and disconnected from the value the tool could provide.
To address this, I led multiple iterations of the onboarding experience, shifting our focus to:
Quick Wins: Giving users an immediate taste of Hearth AI’s power by allowing users to interact directly with the agent from the start
Personalization: Customizing the experience so users could see their goals and data reflected in the tool early on
Iterative Testing: Continuously refining the flow based on real user feedback to strike a balance between education and immediate impact
Workflow mapping in FigJam
Low fidelity mocks of the opening login page
User Research Insights
Confusion in Early Onboarding: User testing revealed that new users were unsure how the tool could fit into their workflows, which informed clearer microcopy and a more focused setup flow
The Need for Tangible Outputs: Users were most engaged when onboarding included tangible outputs they could act on immediately, such as their first AI-generated task or reminder
High fidelity mocks of the first version - originally one of many steps, we eventually boiled this down to just this screen for initial inputs
First version of user education - we replaced this with chat interactions with the agent in order to focus the core value proposition
Key Changes
Designed the Initial Onboarding Flow: I created the first-ever onboarding process, introducing users to Hearth AI’s core capabilities step-by-step and ensuring they felt supported in their first interaction
Streamlined Subsequent Iterations: I replaced static, educational screens with interactive elements that showcased the product’s value through action. For example, based on the user’s LinkedIn profile, the agent suggested a relevant contact group which became the basis for their first experiences in the product
Incorporated Personalization: Introduced a dynamic setup process to tailor the tool to individual users’ needs, allowing them to interact with their own contacts rather than trying to educate with dummy data
Reduced Time to Value: Moved the most impactful feature demonstrations to the beginning of onboarding, ensuring users reached their "aha" moment within the first step
The video above depicts the final version of the agent interaction - we continuously got verbal “woah”s during onboarding, and users immediately “got it” when they started using the product
Results
Faster Onboarding Completion: Reduced onboarding time significantly, without sacrificing personalization or depth
Increased Engagement: More users began leveraging core features immediately after onboarding, such as setting reminders or creating notes, driving a measurable increase in retention
Starting from a blank slate allowed me to create a structured, user-focused flow that evolved with the product. By embedding user feedback into every iteration, we built an onboarding experience that felt intuitive, personalized, and impactful from the very first interaction.
Core AI Agent Competencies
The Problem
When I joined Hearth AI, the product's AI agent was ambitious but loosely defined. It aimed to assist users in managing relationships and staying organized, but the lack of clarity around its primary functions created challenges for development, usability, and user adoption. Without a clear focus, the agent risked trying to do too much while delivering limited tangible value to users.
The Goal
We needed to identify and refine the agent’s core competencies to deliver maximum impact to users. This meant determining which actions would provide the most immediate and meaningful value, ensuring the agent could function as a dependable, high-impact tool for its users.
The Solution
Through extensive user research, competitive analysis, and internal workshops, we narrowed the focus to four core pillars:
Contact Creation – Helping users effortlessly organize and enrich their network
Note Taking – Enabling seamless capture of important details during interactions
Search – Providing fast, intuitive access to user-generated and AI-synthesized information
Setting Reminders – Keeping users on track with timely follow-ups and actionable insights
I took the lead in building out the workflows for each of these competencies, ensuring they were intuitive, impactful, and aligned with user needs.
“Command center” showing top priority reminders - AI agent interactions created these reminders manually, in addition to automatically generating reminders based on your relationships
Contact view with prominent notes created. Users could chat with the agent to create notes via web app, iOS app, or SMS texting the agent
Search results view show key information about each contact for scannability. Users would chat directly to create a new search
Key Changes
Prioritized Through Research: Conducted interviews and usability studies with early adopters to identify the features users found most valuable. This insight directly informed our decision to focus on these four competencies
Streamlined Workflows: Designed and iterated on user flows for each competency to ensure the AI agent could execute tasks seamlessly. For example:
Contact Creation: Users could add contacts manually or by sharing a social media profile link, with the agent conducting enrichment to complete the rest of the profile
Setting Reminders: A natural language interface allowed users to create reminders effortlessly, turning vague intentions like “follow up next week” into actionable tasks
Ensured Consistency: Aligned the design and interaction patterns across all four competencies to provide a cohesive and intuitive user experience
Supported Technical Implementation: Partnered with engineers to translate workflows into scalable designs that could be implemented efficiently
User Research Insights
Users valued low-friction interactions, preferring automation or lightweight inputs over complex configurations. For example, contact creation workflows included pre-filled suggestions based on past interactions
Many users struggled with tools that lacked context-awareness, which led us to prioritize features like reminders and search that dynamically responded to user data
Simplified actions were key—users wanted the agent to handle repetitive tasks, but the workflows still needed to allow for manual adjustments when needed
Results
Higher Engagement: Users were more likely to interact with the agent regularly, one of our key activation metrics
Focused Development Roadmap: By defining and refining these competencies, the engineering team could focus on delivering depth and quality within these areas, improving the overall product experience
Defining the core competencies for Hearth AI’s agent was a pivotal step in transforming it from a generalist tool into a purpose-driven assistant. This project highlighted the value of focus: by honing in on what users needed most, we created workflows that were not only useful but also delightful. Balancing automation with user control was another key lesson, ensuring the agent felt both powerful and adaptable. These competencies laid a strong foundation for Hearth AI to grow and deliver on its vision of helping users build and maintain meaningful connections.
Scalable Design Language
The Problem
When I joined Hearth AI, the product’s design system was inconsistent and fragmented. Each feature was built in isolation, with custom components and ad-hoc styling that lacked cohesion. This approach created several challenges:
Inconsistencies in User Experience: Visual and interaction patterns varied across the product, making it harder for users to learn and navigate the tool
Inefficient Design Process: Developers frequently recreated components, leading to wasted time and resources
Scalability Issues: As new features were added, the lack of a unified system made it increasingly difficult to maintain quality and consistency
The Goal
To create a cohesive design language that:
Unified the product’s visual and interaction patterns
Streamlined the design-to-development handoff process
Provided a scalable foundation for future features and iterations
The Solution
I led the effort to develop Hearth AI’s first scalable design language and UI system, building on the existing design foundation while introducing consistency and structure. This involved:
Auditing the Existing Product: Conducted a thorough review of all screens and components to identify redundancies, inconsistencies, and pain points
Defining Core Principles: Established a set of guiding principles for the design language—such as simplicity, clarity, and approachability—to ensure every element felt cohesive and aligned with the brand
Building a Component Library: Created a library of reusable components (e.g., buttons, modals, input fields) that adhered to consistent styling and interaction patterns
Documenting the System: Compiled detailed documentation for the design language, including usage guidelines and component specs
Collaborating with Developers: Partnered closely with engineers to ensure components were implemented consistently and efficiently across the front end
Sample of the color palette developed
Key Contributions
Simplified Visual Hierarchy: Redesigned screens to reduce visual clutter, making key actions more prominent and improving overall usability
Reusable Components: Built flexible, scalable components that could adapt to various use cases while maintaining a consistent look and feel. For example, the button system supported multiple styles (e.g., primary, secondary, tertiary) and was used across all workflows.
Color and Typography Standards: Established a color palette and typography scale that ensured readability, accessibility, and brand alignment.
Interaction Consistency: Defined interaction patterns (e.g., hover states, animations) to create a seamless experience across all features.
Example button component including three styles and four states
Example modal component, providing the building blocks for many product features
Example specialized component - the chat input, with color and icon indicators of active state
Impact on the Team
Accelerated Feature Development: The reusable component library reduced the time needed to design and develop new features, enabling faster iteration cycles
Improved Collaboration: The documented design system provided clarity for developers, reducing miscommunication and ensuring smoother handoffs
Onboarding New Team Members: When the team brought on a full-time designer, the design system served as a critical onboarding tool, helping them quickly get up to speed and contribute effectively
Results
Cohesive Experience: Users reported feeling more confident navigating the product, as the consistent patterns reduced cognitive load
Faster Development: Reduced the design and development timeline for new features
Scalable Foundation: The system has supported multiple product iterations without sacrificing quality or cohesion
Building Hearth AI’s scalable design language and UI system was a critical step in enabling the product to grow effectively. This project reinforced the importance of investing in foundational design work early, as it not only improved the user experience but also empowered the team to work more efficiently.
Conclusion
Working with Hearth AI was a rewarding experience that showcased the transformative impact of thoughtful design and strategy. From building the first onboarding experience to defining the core competencies of the AI agent and creating a scalable design language, my contributions helped shape a product that is intuitive, impactful, and aligned with user needs. These efforts drove improvements in user satisfaction, engagement, and retention while enabling the team to iterate quickly and efficiently. Together with the CEO and the broader team, we laid a strong foundation for Hearth AI to achieve its vision of helping users build and nurture meaningful connections. This project not only delivered immediate wins for the product but also set the stage for sustainable growth and continued innovation.