advisor

Advisor is a retail expert that combines commerce knowledge with advanced reasoning, and creative problem solving.

Service: Product Design

Overview:

Advisor is a superintelligent business partner with access to all commerce data so users can instantly receive insights, deep research, and expert growth plans.

Problem:

Retail brands have access to more data than ever but turning that data into clear direction remains slow and manual. Stackline was looking to provide a new AI-driven platform that consolidated this information for users so that they could gain back time and make more informed decisions with the help of our data.

Goal:

Stackline's vast data was overpopulated with data knowledge. Users found that generating meaningful insights required far too much time and manual effort causing most valuable data to be inaccessible.

Tools Used:

Figma

Claude

Cursor

Timeline:

Initial launch: 2 months

Feature sprints: 1 month each

Team:

Isabelle Iwatsubo

Subhadeep Chakraborty

Chris Zhou

Michael Lagoni

Raj Ramasamy

Patrick Leake

Joungwoo Baik

Toby Tran

Mood Board

Clean visualizations that highlight insights
Prioritize data content
Actionable content
Intuitive user flows

Color

The color palette centers itself around the rebranded Stackline blue color. The Stackline blue appears to be nearly black, but emphasizes the modernness of the company while not detracting from the data that is meant to be highlighted. The product remains mainly black and white monochromatic to mirror the aesthetic language of trusted AI products like ChatGPT and Perplexity, creating an immediate sense of familiarity and confidence for users.

Typography

Advisor's type system is built on Roboto in order to remain in harmony with the rest of Stackline’s products. This font, chosen for its clean, geometric structure and strong legibility across data-heavy interfaces, shows versatility across weights and makes it well-suited for an AI chat experience where hierarchy and clarity are critical.

UI Elements

Advisor's UI elements were designed to feel native to both Stackline's existing platform and the familiar patterns of modern AI chat interfaces. Every component was built with clarity and function in mind, ensuring that the interface stayed out of the way and let the data speak while supporting wayfinding for users.

Challenge ✹ Solution

overpopulated

Reduced noise that detracted from the data
Introduced scannable sections with insights
Created visual hierarchy to direct user’s attention

too much time & manual effort

Leveraged AI to elimate need to manually research
Guided users with prompt chat suggestions
Streamlined chat flow to allow for iteration

inaccessible

Built familiar interface to lower learning curve
Brought data directly to users to increase efficiency
Responses use Stackline data to generate trust

Design System

setting the stage

Stackline’s CTO and CEO brought forward the core problems and vision, establishing the strategic direction that would set Stackline apart. Engineering leveraged Cursor to rapidly formulate a baseline flow, drawing on existing AI platforms as reference points for interaction patterns users would already recognize. From that foundation, design, engineering, and product management aligned closely to define the problem space, establish the user persona, and chart a path forward.

Chat - Sidebar Open [Recent Chats Scroll].png

Chat - Response - Generating [Checklist Expanded].png

Bridging the Gap

With a baseline in place, design stepped in to refine the experience. I translated the functional skeleton into something that felt native to Stackline's design system and reflected the elegance and sophistication the brand is known for. A major north star throughout this phase was accessibility. The team worked hard to ensure that Advisor could serve both power users and those entirely new to AI tooling, making sure groundbreaking features never came at the cost of usability. I utilized Claude’s Figma integration to keep with the short timeline.

Chat - Response [Standard Bar Chart].png

Shipping and Evolving

Once flows were refined, the PM validated the experience through user testing, feeding findings back into the design cycle. Front-end engineering built against finalized specs, followed by rigorous QA from design and QC from the PM before each launch. Phase 1 shipped in approximately two months, and the product continues to grow through one-month sprints with each cycle pushing Advisor further as the team deepens its understanding of how users engage with the tool.

Templates - Schedule Builder [Multiple Emails].png

continuity across devices

Saved conversations carry over seamlessly, allowing users to pick up exactly where they left off regardless of device. The mobile experience isn't a stripped-down version of Advisor. It's the same intelligent, insight-first tool, refined for a new context. Whether on desktop or mobile, Advisor delivers the same intelligent, insight-first experience.

Chat - Response - Generating [Thought Process].png

Chat - Response - Generating [Checklist].png

Chat - Response - Generating [Contacted].png

Chat - Response [Citations Redirect].png

motion

Alive with Intelligence

Every transition and micro-interaction was designed intentionally. Loading states, response reveals, and data visualization entries are choreographed to guide the user's eye and reduce perceived wait time. Motion is never decorative for its own sake but rather it earns its place by making the experience feel faster, smarter, and more alive.

The animations draw inspiration from the visual language of cutting-edge technology including fluid, organic movements that hint at the complexity of the system working behind the scenes. Rather than static responses, insights feel like they are being thoughtfully generated in real time, creating a sense of anticipation and trust in the product.