Private portfolio. Enter password to continue

Featured work About me View CV (PDF)

Hi, I'm Marisol.
I design products at scale.

Head of Design • Research-driven • Systems thinker

10+ years across mobile apps, SaaS, e-commerce, and websites. I lead a product design team, run Discovery for new products, and design work that moves business metrics, not just looks good in Figma.

10+
Years in design
25+
Products shipped
M.Sc.
UX/UI Multidevice
Case studies

Featured work

Six projects across faith & family, logistics, travel, fintech, B2B marketplaces, and health tech, from discovery to user testing.

Both calendars · one decision
Align: find the best dates
Align home
TravelMobile AppIn development
Align
Book flights for someone else, with both calendars in sync.
End to endDiscovery → clickable prototype
In devBeing built now
Role · Discovery lead + UX/UI
View case study →
Lead → quote → signed, paid order
Order details with shipment and payment status
Client quote-to-order page
LogisticsB2B SaaSIn internal use
Freight Sales Platform
Lead to signed, paid order in one sales-first TMS.
LiveIn internal use
9User flows mapped
Role · Discovery lead + Product design
View case study →
4.9/5 ease of use · Maze
Remain evening routine
Remain family home
Faith & FamilyMobile AppIn development
Remain
Daily spiritual habits for the whole family. Taken from Discovery to user testing and iteration.
4.9/5Ease of use
80%Would use it with family
14Maze testers
Role · Lead designer · Discovery to iteration
View case study →
AI signal · Buy 80%
Market Machines programs screen
Market Machines dashboard
Mobile AppFinTechAI
Market Machines
AI trading signals that people can read and trust.
End to endDiscovery → hi-fi UI
3Competitors benchmarked
Role · Discovery + UX/UI
View case study →
Customer · Vendor · Admin
Vendor Vault marketplace
Vendor Vault orders in transit
B2B MarketplaceWeb AppDesign System
Vendor Vault
Quotes, orders, and invoices for brands and their suppliers.
3 rolesOne shared design system
12 wksWireframes to hi-fi
Role · Wireframes, design system, UI
View case study →
Patient app + clinic platform
SerenityMate clinic dashboard
SerenityMate splash screen
Health TechMobile AppConcept project
SerenityMate
A recovery companion app, connected to the clinic that treats you.
30Patients surveyed
10Clinicians surveyed
7Interviews
Role · Research, UX/UI, brand
View case study →
The person behind the work

Designer by craft.
Leader by choice.

10+ years turning messy problems into products people use, from field research to design systems to closing the deal. Here's the longer story: experience, skills, and how I lead.

Hi there!
About me

Design that ships.
Decisions that scale.

Head of Design with 10+ years across mobile apps, SaaS, e-commerce, and websites. Here's the longer story: background, experience, and the toolbox.

Marisol Rodríguez Based in Mexico
About

Hybrid background,
research-first mindset.

I've shipped 25+ digital products across mobile apps, SaaS platforms, e-commerce, and consumer websites, covering health tech, fintech, AI, B2B, on-demand, and more.

As Head of Design at Geekbears, I own the design function end-to-end: design quality and delivery across client projects, the design revenue line, and new business from first lead to closed account. My work spans the full cycle: research, IA, prototyping, design systems, and developer handoff.

I bring a hybrid background: 10+ years of design with a strong visual foundation, technical fluency in front-end (HTML/CSS), and active use of AI tools to accelerate research and design workflows. I work in Spanish (native) and English (full professional), day to day with US teams.

Design LeadershipDesign RevenueUser ResearchDesign SystemsBusiness DevelopmentMobile · Web · SaaSAI-Augmented Workflows
Experience
10+ years · 9 roles · from Jr. designer to Head of Design
Jul 2026 to PresentHead of DesignGeekbears · US digital product agency
  • Lead a team of 3 product designers across ~15 concurrent client projects in mobile, web, and SaaS
  • Set design standards, review all major deliverables, and run hiring, mentoring, and sprint planning
  • Own the design P&L: revenue pipeline, milestone progression, invoicing, and AR follow-up
  • Drive new business from first call to signed account, leading consultations and proposals
  • Productized the design offer (Discovery, UX/UI, Validation, MVP Launch Plans) to lift conversion
  • Build working front-ends and prototypes with AI-assisted development (Lovable, Claude, Cursor)
Jul 2025 to Jun 2026UX/UI Design ManagerGeekbears
  • Cut design turnaround time by 34% by introducing an AI-first design workflow across the team
  • Built the Discovery methodology: problem statements, personas, journeys, sitemaps, benchmarking, MVP prioritization
  • Managed scope, deadlines, and workload delegation across parallel projects
Aug 2024 to Jun 2025UX/UI DesignerGeekbears
  • End-to-end design for B2B platforms, mobile apps, and AI products, including multi-role design systems
  • Promoted to Design Manager within 11 months
2024 to Dec 2025Freelance UX/UI DesignerFragmenta · part-time
  • Designed and shipped responsive websites, e-commerce stores, and educational platforms, from wireframes to hi-fi UI
  • Worked directly with clients to define scope, present concepts, and iterate through launch
  • Ran UX audits and usability testing to find friction and prioritize improvements
  • Prepared developer-ready handoff files and specs, and supported implementation QA
2023 to 2024UX/UI DesignerDivLabs
  • Designed responsive websites, e-commerce, educational, and management platforms
  • Built and maintained web design systems; ran user research, usability testing, and synthesis
2021 to 2023Marketing ManagerGrupo Elga
  • Designed and executed digital marketing strategies for the group's companies
  • Developed websites and campaign landing pages for multiple brands
  • Supervised web development with external vendors; graphic design for digital and print
2020 to 2021Visual DesignerGrupo K12 del Noroeste
  • Created and scheduled social media content; produced videos and animations
  • Designed institutional websites and graphic materials for digital and print
2018 to 2020Visual DesignerErus SA de CV
  • UX/UI design for the company website, employee learning platforms, and a sales mobile app
  • Graphic design for digital and print; social media content, videos, and motion graphics
2016 to 2018Jr. Graphic Designer & Community ManagerFaccinetto Arquimagología
  • Designed and executed social media campaigns and content
  • Graphic design for digital and print media; videos and motion graphics
Skills & tools

Capabilities

Research-driven, system-minded, and execution-focused, with leadership experience across cross-functional product teams.

Product Strategy & Research
Discovery phase leadership
MVP scoping & feature prioritization
Competitive benchmarking & pricing analysis
Personas, user journeys & sitemaps
Validation plans, usability testing & UX audits
Problem framing & launch plans
Design & Build
Figma · design systems & tokens
High-fidelity UI for mobile, web & SaaS
Prototyping (Figma, Figma Make, Framer)
AI-assisted builds (Lovable, Stitch, Claude)
Front-end HTML / CSS
Brand identity (Adobe Illustrator, Photoshop, After Effects)
Delivery & Operations
Agile / Scrum across parallel projects
Sprint planning & workload delegation
Design QA & developer handoff
Process documentation (Notion wikis)
Invoicing, collections & AR follow-up
ClickUp · Notion · Hubstaff
Business & Growth
Design revenue ownership
Upwork & outbound lead generation
Proposals, consultations & closing
Offer packaging & pricing
Sales decks & client presentations
Zoho CRM pipeline management
AI & Productivity Tools
Claude & custom AI skillsFigma MCPFigma MakeGoogle StitchLovableOpenAIMazeMiro · FigJam
Education
Master's in UX/UI Multidevice Web Design
ESDesign
2022 to 2024
Bachelor's in Graphic Design
LaSalle University
2013 to 2017
Certificate Program in Humanities
LaSalle University
2015 to 2017
Licenses & certifications
Claude 101
Anthropic
Jun 2026
Introduction to Software Engineering
IBM
Nov 2024
Getting Started with Front-End and Web Development
IBM
Jul 2024
Responsive Web Design
freeCodeCamp
Jul 2023
Visual Elements of User Interface Design
Coursera
Mar 2020
Ready to see the work?

From messy problems
to products people use.

Six case studies across faith & family, logistics, travel, fintech, and B2B: discovery, design, testing, and the decisions behind them.

Faith & Family · Mobile App · In development

Remain

A faith-based app that helps families build daily spiritual habits together: personal and family routines, scripture, prayer, and reflection. I took it from Discovery through brand, UI, user testing, and iteration. It is now in development.

Lead designer · Discovery to iteration
Discovery → Logo → UI → User testing → Iteration
Mobile app · Parents & kids
In development · 2026
4.9/5 ease of use · Maze
Remain evening routine
Remain family home
Overview

Faith habits that the whole family can keep

Families who want a faith-centered home struggle to keep shared spiritual habits alive between busy schedules and competing responsibilities. Most tools are built for one person, not for a household with parents, kids, and different life stages.

Remain brings personal and family routines into one calm app: a daily verse and chapter, guided prayer for each family member, morning and evening routines, acts of kindness, and family notes.

How might we help a whole family build daily spiritual habits together, without adding one more thing to manage?

My role

Led the DiscoveryLogo & identityUI & prototypeUser testing in MazeIteration
1 Discovery

Designing for a household, not a user

Client kickoff & discovery questionsPersonasBenchmarkingUser journeysFeature prioritizationSitemap: ~27 screens, 3 user types
LM
Laura Miller
38 · Mom, primary organizer
Parent
MT
Michael Thompson
41 · Operations manager
Parent
LM
Lucas Miller
12 · Student
Child

Parents want structure without planning everything; kids want short, clear tasks they can feel proud of.

Parent user journey
Parent journey: where motivation drops, and the opportunities to keep the family going.
2 Brand

Rooted, growing, at home

I designed the logo around one idea: the letter R grown into a tree, for identity and growth. Green, olive, and earth brown keep it organic and calm, and DM Serif Display gives it warmth. The tagline: "It Starts At Home".

Logo concept
Concept: letter R plus a tree.
Logo identity
Mark, app icon, typeface, and lockup.
3 Product Design

Personal time and family time, side by side

A simple switch between Personal and Family on the home screen keeps both experiences in one place, and each routine is broken into small steps with examples.

Family homeFamily prayerPersonal homeVerse of the day
Family home and guided prayer for each family member, then the personal home with the daily verse and three routines.
SplashOnboardingFamily setupChapter of the day
Onboarding and family setup with roles, and the chapter of the day.
4 User Testing

Easy to love, harder to navigate than it looked

I ran an unmoderated prototype test in Maze with 14 participants: a free exploration, 5 tasks (morning, evening, and family routines, adding a family member, and finding past family notes), and a short survey on value, usability, and pricing.

4.9/5
Ease of use
4.5/5
Value for daily spiritual life
80%
Would use it with their family
90%
Success on the family routine

What the behavior data showed

High perceived ease, hidden friction
People rated it very easy, but only 54–57% completed the morning and evening routines, often by alternative routes. The evening routine screen reached 43–86% misclicks.
Family Notes was the biggest friction point
The notes container hit an 88% misclick rate, the highest across all five tasks.
The family use case is real
Family Routines was the most valued feature (80%), and half of participants preferred an annual plan; nobody chose monthly or per-member pricing.
User experience findings
Findings presented to the client: patterns, insights, suggestions, and action items.
5 Iteration

Turning friction into the next version

I recommended three improvements to the client: explain in onboarding how daily actions make the plants on the home screen grow, rework the evening routine and Acts of Kindness with step-by-step guidance and a confirmation on completion, and add instructions to find a different Bible chapter.

Evening reflection stepsActs of Kindness stepsFamily notes calendar
Iterated flows: each routine step has a short example and a progress count, and past family notes open from a calendar.
Evening routine complete
A clear confirmation when the evening routine is done.
Reflection

What this project taught me

Remain is the project where I owned the full loop, from Discovery to testing and back into design. The biggest lesson: what people say and what they do are two different datasets. A 4.9/5 ease score sat on top of 88% misclicks, and only the behavior data showed where to fix.

Testing isn't the end of design. It's the brief for the next version.

More case studies

AI signal · Buy 80%
Market Machines programs screen
Market Machines dashboard
FinTech · AI

Market Machines

AI trading signals people can read and trust.

View case study →
Customer · Vendor · Admin
Vendor Vault marketplace
Vendor Vault orders in transit
B2B Marketplace

Vendor Vault

Quotes, orders, and invoices for brands and suppliers.

View case study →
Logistics · B2B SaaS · In internal use

Freight Sales Platform

A sales-first TMS for a US freight brokerage: one place to take any load from lead to quote to signed, paid order, replacing a patchwork of tools the sales team worked around every day.

Discovery lead · Product designer
Discovery → MVP re-scope → Hi-fi UI
Web app · Sales team + client portal
In internal use · 2026
Lead → quote → signed, paid order
Order details with shipment and payment status
Client quote-to-order page
Overview

Quoting a load shouldn't take five tools

To quote a single load, the sales team jumped between an outdated TMS, Outlook, spreadsheets, and load boards. Past rates were hard to reuse, a unit mix-up (8'6" vs 8.6) could turn into a costly wide-load error, and turning a quote into a signed, paid order took days of back-and-forth.

The brokerage needed a sales-first platform: quote fast, send from the platform, and let the client convert, sign, and pay online, with the order moving to Operations automatically.

How might we take a freight load from first lead to signed, paid order in one place, without errors and without chasing other teams?

My role

Led the DiscoveryHeuristic evaluation of the current TMSMVP re-scopeHigh-fidelity UI
1 Discovery

Starting from how sales actually works

Client kickoff & discovery questionsHeuristic evaluationPersonaBenchmarking: Tai TMS, Turvo, Rose RocketFeature prioritization9 user flowsSitemap

What the heuristic evaluation found

Consistency and error prevention were failing
Both rated as usability catastrophes: inconsistent fields and formats, and no checks before costly mistakes.
No visibility of status
Users got no feedback on their actions and couldn't see where an order stood without asking another team.
No help when stuck
No error messages, warnings, or help documentation, for novice and expert users alike.
Persona: sales manager
The sales manager: moves leads to quotes to orders, and wants live status without pinging Operations.
2 Feature Prioritization

A sales-first MVP

Must have

Quote managementAuto unit converterHistorical rates tabAuto lead capture from the web formCRM integrationSend quotes from the platformE-signaturePayment at signing, charged at dispatchMaster & sub-ordersNotifications

Later

Native tasksBlast emails to carriersModular dashboardCargo insurance API
Must-have features
Must-have features for the first release.
Flow: web lead to signed order
One of nine flows: a web lead becomes a signed order, across the client and the sales agent.
3 MVP Re-scope

Cutting to what sales needs on day one

After the kickoff, we re-scoped the MVP around the sales team: a sales-first dashboard, quotes, and orders, with Operations and Admin views moved to later phases. Every screen was annotated with its data source, so the build team knew exactly where each field came from.

New quote questionnaire
New quote: shipper, route, cargo, method, and cost in one form, with historical rates one click away.
Quotes list
Quotes by status, with bulk follow-ups and a path to closed-lost.
Quote details
Quote summary with the lane on a map and tabs for similar loads, suggested carriers, and historical rates.
Order details
Order with a shipment stepper from plan to delivered, and payment status alongside.
Client conversion
Client micro-portal: approve the quote, complete details, and pay, with no account required.
4 Design Decisions

Removing the expensive mistakes

Convert units automatically
Feet, inches, and metric are converted automatically, so an 8'6" load is never quoted as 8.6.
Research rates without leaving the quote
Historical rates, filtered by trailer, lane, and type, sit next to market rates inside the quote.
Let the client close the loop
The client approves, e-signs, and adds a payment method from a secure link. No charge until dispatch, and the order moves to Operations on its own.
Status everyone can read
A shipment and payment stepper on every order answers "where is it?" without a Slack message.
Reflection

What this project taught me

Leading this Discovery as Head of Design reminded me that the fastest way to a useful MVP is a hard re-scope: one team, one job, done well, with everything else on a clear roadmap.

In operations software, good design is mostly error prevention you never notice.

More case studies

4.9/5 ease of use · Maze
Remain evening routine
Remain family home
Faith & Family · Mobile App

Remain

Daily spiritual habits for the whole family, tested with real users.

View case study →
AI signal · Buy 80%
Market Machines programs screen
Market Machines dashboard
FinTech · AI

Market Machines

AI trading signals people can read and trust.

View case study →
Travel · Mobile App · In development

Align

A mobile app for booking flights for someone else. It compares both calendars, suggests the best travel window and flights within budget, and nothing is booked until the traveler approves.

Discovery lead · UX/UI Designer
Discovery → Wireframes → UI → Prototype
Mobile app · Booker + Traveler
In development · 2026
Both calendars · one decision
Align: find the best dates
Align home
Overview

Booking for someone else shouldn't take a group chat

When you book a flight for a partner, a family member, or an executive, the decision depends on two calendars, preferences, and real-world constraints. A simple purchase turns into back-and-forth texts, screenshots, and guesswork, with delays and avoidable mistakes.

Align connects the booker and the traveler: it checks shared availability, recommends flights with clear tradeoffs, keeps the budget in view, and moves from planning to booking in one flow.

How might we turn scattered schedules and preferences into one confident, ready-to-book decision that both people agree on?

My role

Led the DiscoveryWireframesHigh-fidelity UIClickable prototype
1 Discovery

Three people who book, and one who has to show up

Client kickoff & discovery questions3 personasBenchmarking: Navan, Direct Travel, KayakUser journeysFeature prioritizationSitemap
DR
Daniel Reed
34 · Startup founder
Booker
EC
Emily Carter
21 · College student
Traveler
OM
Olivia Martinez
38 · Executive assistant
Professional booker

Daniel wants to know which flight works for both people and book it. Emily wants the flight to fit her classes and exams, and to understand why it was chosen. Olivia books for a CEO across calendars and time zones, and needs speed without mistakes.

What the journeys showed

Trust starts at the calendar step
People will connect a calendar only if it's clear that the app reads free/busy blocks, not event details.
Recommendations need a reason
"Matches both calendars, best arrival window, within budget" is what turns an option into a decision.
The traveler needs a voice
A simple approve or "not possible" with quick reasons keeps the traveler included without long conversations.
Booker user journey
Booker journey: doing, thinking, emotions, and the design opportunities at each step.
2 Feature Prioritization

An MVP built around one decision

Must have

Calendar integrations (booker + traveler)Availability reviewAI flight search & recommendationsBudget guardrailsTraveler approvalBooking integrationNotificationsTrips dashboard

Planned for V2

Hotel suggestionsGround transportationAI pre-trip checklistBusiness plans for assistants & teamsAdmin dashboard

The outcome: a mobile app of about 23 screens focused on trip setup, calendar availability, AI flight suggestions, approvals, bookings, and payment.

3 Wireframes to UI

Structure first, then personality

I designed the wireframes in grayscale to settle structure and flow with the client, then carried the same layouts into a calm slate-blue UI.

Wireframe: homeUI: home
Home: wireframe and final UI.
Wireframe: find the best datesUI: find the best dates
Find the best dates: wireframe and final UI.
4 Product Design

From an invite to a confirmed booking

Invite and match schedules

OnboardingTrip invitationComparing schedulesSchedule details
The traveler accepts and shares availability; Align compares both calendars and shows each day’s busy blocks and open windows.

Choose, review, book

Select flightFlight detailsReview and confirmBooking confirmed
Flights with clear tradeoffs, a schedule match and budget check per flight, then review, confirm, and booking.
5 Design Decisions

Designing for trust between two people

Privacy by default
Only free/busy status is shared, and the invitation says so before asking for calendar access.
Show the reasoning
The suggested window explains itself ("your calendar is fully clear, prices below average"), and each flight lists what it matches: departure block, arrival time, no conflicts.
Budget always in view
Budget cap, flight cost, and remaining budget sit on the flight details, so out-of-range choices are obvious.
Nothing is booked without the traveler
An "Action needed" card asks the traveler to approve, and bookings stay pending until they do.
Reflection

What this project taught me

Align is a scheduling problem disguised as a travel app. Taking it from Discovery to prototype showed me that the hardest part of shared decisions is trust: privacy you can see, reasons you can read, and a clear moment where the other person says yes.

When two people decide together, the interface has to speak to both of them.

More case studies

Lead → quote → signed, paid order
Order details with shipment and payment status
Client quote-to-order page
Logistics · B2B SaaS

Freight Sales Platform

Lead to signed, paid order in one sales-first TMS.

View case study →
4.9/5 ease of use · Maze
Remain evening routine
Remain family home
Faith & Family · Mobile App

Remain

Daily spiritual habits for the whole family, tested with real users.

View case study →
Health Tech · Concept Project

SerenityMate

A dual-platform product designed to reduce post-treatment relapse rates in addiction recovery, combining a patient-facing mobile app with a clinical management dashboard for rehabilitation professionals.

UX Researcher · UX/UI Designer · Brand Designer
Health · Mental Health
iOS App + Web Dashboard
End-to-end · Research to Prototype
Patient app + clinic platform
SerenityMate clinic dashboard
SerenityMate splash screen
Overview

The problem worth solving

Relapse rates among addiction recovery patients remain critically high, not because treatment fails, but because support drops off the moment patients leave the clinic.

SerenityMate addresses both sides of this gap: a mobile app that keeps patients supported between sessions, and a web-based management platform for healthcare professionals.

How might we provide continuous support to individuals in addiction recovery while giving clinics tools to proactively manage patient outcomes?

1 User Research

Starting with the people, not the product

30
Patients surveyed
10
Clinicians surveyed
7
In-depth interviews
4
User personas

Methods

On-site surveys at a rehab clinicInterviews: 5 patients, 2 cliniciansCompetitive benchmarking

Key findings

Post-discharge support is nearly absent
Patients reported feeling isolated once they left the clinical environment.
Clinics rely on manual, fragmented processes
Healthcare professionals managed patient progress across spreadsheets and paper notes.
Trust and privacy are non-negotiable
Both patients and clinicians flagged confidentiality as critical.
Emotional tone matters as much as functionality
Patients rejected clinical, sterile interfaces.
2 Personas

Four people, two products

SerenityMate persona 1
App, heavy user
SerenityMate persona 2
App, light user
SerenityMate persona 3
Clinic platform, heavy user
SerenityMate persona 4
Clinic platform, light user

Research and personas were produced in Spanish with patients and clinicians in Mexico.

3 Design Execution

From structure to high-fidelity

Over 70 wireframes covering both the mobile app and management dashboard, prioritizing intuitive navigation and frictionless access.

Brand

Symbol: sunrise and lotus
The symbol joins S and M with a sunrise (a new beginning) and a lotus (growth through adversity).
Color palette
Deep teal for trust, mint for renewal, coral reserved for alerts and SOS.
Logo lockups
Vertical and horizontal lockups with defined safe margins.

Mobile app

SplashHomeProgress calendarDaily reflection
Onboarding, home, progress calendar, and the daily reflection.
Choose your pathAssessment resultsAction planVideo session
Assessment to action plan: choose a path, see results, follow guided steps, and meet a counselor by video.

Clinic platform

Clinic dashboard
Dashboard: active users, scheduled sessions, and key clinic activity at a glance.
Patient record
Patient record with clinical details and payment status.
Weekly calendar
Clinic calendar synced with staff schedules.
Design system
One design system shared by the app and the clinic platform.
4 Design Decisions

Turning research into product decisions

Key decisions

A one-tap daily check-in
Hard days leave little energy for long forms, so the mood check-in became a single emotion selector at login, with optional follow-ups.
SOS always one tap away
Emergency help can't live inside a menu. The SOS button stays accessible from any screen, and clinics assign a counselor to cover it each week.
One platform for the whole clinic
Clinicians juggled scattered tools, so the platform brings patients, appointments, payments, app content, and emergency coverage into one dashboard.
SOS call
The SOS line, one tap away from any screen.
SOS coverage on the platform
On the platform, clinics assign a counselor to cover the SOS line each week.
Reflection

What this project taught me

SerenityMate was one of the most complex end-to-end projects I've taken on, spanning field research at a rehab clinic, brand creation, two distinct product surfaces, and a business model. It reinforced that the most impactful UX work happens at the intersection of deep user empathy and strategic thinking.

The most important design decision wasn't a screen. It was the decision to treat the app as a companion, not a tool.

More case studies

Both calendars · one decision
Align: find the best dates
Align home
Travel · Mobile App

Align

Book flights for someone else, with both calendars in sync.

View case study →
Lead → quote → signed, paid order
Order details with shipment and payment status
Client quote-to-order page
Logistics · B2B SaaS

Freight Sales Platform

Lead to signed, paid order in one sales-first TMS.

View case study →
FinTech · AI · Mobile App

Market Machines

A mobile app that turns Market Machines' AI models into clear buy and sell signals: build programs around the stocks you follow, test them against historical data, and get alerted when the algorithms change their minds.

UX/UI Designer
Discovery → Sitemap → Hi-fi UI
Mobile app
FinTech · AI
AI signal · Buy 80%
Market Machines programs screen
Market Machines dashboard
Overview

Making AI trading signals readable

Market Machines tracks algorithmic sentiment in the stock market with its own AI models. The client needed a mobile app that let traders follow those models for the companies they care about and act on buy and sell signals with more confidence.

Trades happen outside the app. Market Machines is the decision-support layer, so every screen had to make a model's signal, and how sure it is, easy to read at a glance.

How might we help traders trust AI-generated signals without hiding the uncertainty behind them?

1 Discovery

Defining the product before designing it

Client discovery sessionsBenchmarking: Magnifi, Composer, StreetbeatPersonasFeature prioritizationSitemap & user flows

What the benchmark told us

Explain the AI, don't just show it
The strongest references use simple, educational language to show why a stock is flagged and what the risk is.
Signals first on the dashboard
Buy/sell signals, market data, and risk belong in one easy-to-scan view, not spread across tabs.
Structure prevents overload
Keeping AI signals, market insights, and tracking clearly separated stops dense financial data from overwhelming people.
2 Personas

An active trader first, a new investor next

DT
Daniel Thompson
32 · Financial analyst & part-time trader
MVP focus
LM
Laura Mitchell
38 · Marketing manager moving into stocks
Planned for V2

Daniel trades daily and wants data-backed signals to cut emotional, impulsive trades. Laura wants to start trading without feeling overwhelmed, which pointed to the educational features we parked for V2.

3 Feature Prioritization

A focused MVP, with a clear V2

Must have

Sign up / Log inDashboard with AI buy/sell signalsWatchlist & trackingSignal notificationsSettings

Could have

FavoritesIn-app purchases to track more companies

Planned for V2

Educational modulesAdvanced AI customizationPortfolio simulationAI chat explanations
Market Machines sitemap
Sitemap: every screen with its purpose, tasks, and complexity, so scope and effort were visible before design.
4 Product Design

From a watchlist to programs

In the UI phase the watchlist grew into Programs: the user picks a Market Machines model, chooses the equities to follow, and gets that model's signals for each one. A dark, high-contrast interface keeps charts and signal colors legible.

DashboardMy programsSelect a modelCreate a program
Dashboard with the confidence meter and live chart, then creating a program: pick a model, name it, select equities.

Test before launching

Program test modeLaunch confirmationBacktestingBacktesting comparison
Programs start in test mode and need a confirmed launch. Backtesting compares programs on historical data before any money is at risk.

Onboarding and alerts

Onboarding: market signalsOnboarding: smart notificationsNotificationsNotification detail
Onboarding explains what the signals are and how to read an alert; notifications open into the full context of the signal.
5 Design Decisions

Designing for trust in an AI product

A confidence meter, not just a signal
Every buy or sell comes with how confident the model is, on a sell-to-buy scale. Users see the strength of a signal, not only its direction.
Explain the jargon where it appears
Tooltips explain the confidence meter, programs, and backtesting in plain language, right on the screen where they show up.
Test, then commit
Programs run in test mode first, and launching asks for confirmation because editing locks afterwards. No accidental commitments.
Alerts you can read in one line
Ticker, action, confidence, and price fit in a single line, and onboarding teaches the format before the first alert arrives.
Dashboard tooltipsNotification list
In-context tooltips on the dashboard, and one-line alerts in the notification list.
Reflection

What this project taught me

Designing for AI in finance taught me that trust isn't a tone, it's a structural property of the interface: showing confidence, explaining terms in place, and letting people test before they commit.

In AI products, users don't trust the algorithm. They trust the interface that surrounds it.

More case studies

Customer · Vendor · Admin
Vendor Vault marketplace
Vendor Vault orders in transit
B2B Marketplace

Vendor Vault

Quotes, orders, and invoices for brands and suppliers.

View case study →
Patient app + clinic platform
SerenityMate clinic dashboard
SerenityMate splash screen
Health Tech · Concept

SerenityMate

Recovery companion app and clinic platform.

View case study →
B2B Marketplace · Web App · MVP

Vendor Vault

A B2B marketplace where food and beverage brands find suppliers, request quotes, and track every order, with an admin platform that keeps both sides running.

UX/UI Designer · Wireframes, design system, UI prototype
User flows → Wireframes → Style guide → Hi-fi UI
Web app · Customer, Vendor, Admin
B2B Marketplace · CPG
Customer · Vendor · Admin
Vendor Vault marketplace
Vendor Vault orders in transit
Overview

One place to source, negotiate, and track

Food and beverage CPG brands work with many suppliers at once: packaging, ingredients, services. Communication, orders, and payments were spread across email, calls, and spreadsheets.

Vendor Vault centralizes that relationship for three user types: brands buying (customers), suppliers selling (vendors), and the Vendor Vault admin team. The UX/UI phase covered about 41 screens over 12 weeks, as part of a three-designer team at Geekbears.

My role

WireframesDesign systemUI & clickable prototype

How might we make B2B sourcing feel as clear as online shopping, without hiding the quotes, paperwork, and negotiation that B2B buying needs?

1 Discovery

Three people, two sides of a deal

E
Emily
35 · Brand operations manager
Customer
OB
Oliver Brown
42 · Supplier manager
Vendor
AJ
Alex Johnson
30 · Platform administrator
Admin

Emily needs one channel for all her vendors and on-time deliveries. Oliver wants new clients and faster, simpler payments. Alex keeps the platform secure and supports both sides.

MVP by role

Customer: vendor browser, quotes, purchase orders, order trackingVendor: store & catalog, orders managementAdmin: customer & vendor management, reviews

Planned for V2

DashboardsOnboarding questionnaireHelp & support centerAdmin team members
2 User Flows & IA

Mapping the system before the screens

Customer: purchase process
Browse vendors, request a quote or place a purchase order, pay, and follow the order to delivery.
Vendor: create and upload a product
Set up the store, upload items to the catalog, and preview the public profile.
Vendor: progress tracking
Acknowledge orders, update their status, and attach files and invoices along the way.
Vendor progress tracking user flow
Vendor progress tracking, the most complex flow in the product.
Screen inventory and flows for Visitor, Customer, Vendor and Admin
My wireframes: the full screen inventory for the four user types, before any visual design.
3 Design System

One system for three roles

After the client chose a style guide direction, I built the design system that all three platforms share: a primary blue scale with an orange secondary, neutrals, text and background tokens, icon states, and feedback colors for information, warning, success, and error.

Color tokensButtons & inputsProduct cardsRole-based navigationTables & status chips

Deep navy navigation with bright blue actions lets product photography carry the color, so dense tables and forms stay easy to scan.

4 Product Design

Three roles, one shared language

I designed the high-fidelity UI and the clickable prototype on top of the system, so customer, vendor, and admin screens reuse the same components and statuses.

Customer

Marketplace
Marketplace: top vendors, categories, and filters to find the right supplier fast.
Quote request
Quote request with line items, notes, and files.
Orders in transit
Orders by status, with a calendar of recent updates.

Vendor

Store preview
Store profile preview before publishing.
Change order status
Updating an order status, with an optional file.

Admin

Vendors management
Vendors with account status and last activity.
Customer detail
Customer detail with order history and account actions.
5 Design Decisions

Designing for how B2B buying works

Quote first, then order
B2B prices are negotiated. Customers send a quote request with line items and files, the vendor sets it, and it becomes a purchase order. Drafts keep unfinished requests safe.
One status language for both sides
Placed, acknowledged, in progress, in transit, delivered, cancelled. The vendor updates it, the customer sees the same label, so nobody has to ask "where is my order?"
Paperwork lives with the order
Invoices, files, and messages are attached to each order instead of scattered across email.
Admin as a safety net
The admin platform can review, pause, or delete customer and vendor accounts, which keeps trust high on both sides.
Reflection

What this project taught me

Owning the wireframes and the design system for three roles taught me that consistency isn't sameness. It's a shared language: the same statuses, components, and patterns let a buyer and a supplier read the same order the same way.

In a marketplace, the interface is the contract between both sides. Clarity is what makes it trustworthy.

More case studies

Patient app + clinic platform
SerenityMate clinic dashboard
SerenityMate splash screen
Health Tech · Concept

SerenityMate

Recovery companion app and clinic platform.

View case study →
Both calendars · one decision
Align: find the best dates
Align home
Travel · Mobile App

Align

Book flights for someone else, with both calendars in sync.

View case study →