José Eizaguirre

Claro Música
Automotive

I designed Claro Música's native interface for the vehicle dashboard. No phone, no mirroring. An independent app where every design decision has real safety implications.

Role
Product Designer
Duration
2 months
Scope
Strategy · UX · Handoff
Tools
Figma · Maze

From mirroring to a native operating system

Claro Música already existed in Android Auto, where the app is mirrored from the phone. This project was different: bringing Claro Música to Android Automotive OS, integrated into the vehicle's native system with Google Automotive Services.

Before - Android Auto

The app was mirrored from the phone. No vehicle-specific design. No native system integration.

Project - AAOS
Independent dashboard app

Running on the vehicle OS. The phone may not be present. Session and state live in the car.

AAOS case study interface example

That meant designing 11 screens from scratch for a context where the user has hands on the wheel and eyes on the road.

Login Home Recents Search My music Downloads Offline Player MiniPlayer Settings

Understanding the driver as a user

Before sketching a single screen, I needed to understand what it actually means to interact with a dashboard while driving. This was a fundamentally different user context than anything in the existing Claro Música product.

Cognitive load research
I reviewed existing studies on driver distraction and infotainment interaction patterns. Key finding: visual tasks above 2 seconds significantly increase accident risk — this became the project's hardest constraint.
Existing infotainment benchmark
I analyzed Spotify, YouTube Music, and Amazon Music on AAOS to identify where they made trade-offs. Most sacrificed content density; none had solved the login problem well.
Claro Música mobile usage data
Internal analytics showed that in-car sessions had shorter duration but higher replay behavior — users in vehicles tend to return to familiar content rather than browse. This shaped the home architecture toward recents and personalized carousels.
AAOS technical constraints
Google Automotive Services documentation defined hard limits: keyboard availability tied to vehicle speed, minimum touch target sizes, and system-level restrictions on attention-demanding flows while in motion.

Three non-negotiable principles

Problem statement: Claro Música users in vehicles need to control their music experience with minimal visual attention — but the existing Android Auto app was a phone mirror with no safety-aware design, making distraction-free use impossible.

From the research, three core design principles emerged. These were not aspirational — they were constraints that overruled any stakeholder request that conflicted with them.

The 2-second rule
The maximum visual attention a driver can give the screen before it becomes a dangerous distraction. It shaped typographic hierarchy, information density per view, and the choice of paginated carousels instead of long lists.
88dp touch targets
The mobile standard is 60dp. In a car, the driver extends their arm, the vehicle vibrates, and precision drops. I proposed increasing all interactive elements to 88dp. Maze data later validated this decision.
State-aware interface
When the vehicle is moving, the app reacts: the keyboard disappears and certain interactions are blocked. This was not negotiable, even when it meant leaving features out.

Exploring solutions before committing

Each major design challenge had multiple viable approaches. I explored them through sketches and low-fidelity flows before converging on a direction.

A Login approach3 options explored

Option 1 — Email + password: Direct port from mobile. Rejected because it requires the full keyboard at the dashboard, creating a dangerous interaction at setup.

Option 2 — Auto-login from linked phone: Simpler technically, but breaks the independence premise of AAOS — the phone may not be present.

Option 3 — QR + 6-digit numeric code: Chosen. Zero keyboard on the dashboard. The numeric pad was already validated as a low-distraction pattern in Claro Música's Smart TV experience.

B Home content architecture2 approaches explored

Option 1 — Replicate mobile density: Marketing's initial ask. Multiple content types, high information density per screen. Rejected because it violated the 2-second rule — too many visual decisions per glance.

Option 2 — Paginated carousels with strict limits: Chosen. Four carousel rows, maximum 8 items per row. Each row answers a single intent (recents, personalized, top, new). The cognitive cost per glance drops to one decision.

C Content browsing patternFree scroll vs. fixed pagination

Option 1 — Free scroll: Development's preference for consistency with mobile and lower implementation complexity.

Option 2 — Fixed pagination: Chosen. Vehicle motion creates micro-vibrations that increase accidental swipe activation on free scroll. Pagination makes each navigation gesture intentional and discrete.

Maze, 30 participants — 3 driving scenarios

Remote usability testing simulated driving conditions. Completion time was used as a proxy for cognitive load — shorter means less visual attention required.

Task Scenario Average time Result
T1 Play content from history ~3.1s Below the 5s threshold ✓
T2 Find and play by genre ~5.4s Only case above threshold — led to prioritizing carousels over search
T3 Play downloaded content offline ~4.1s Below the threshold ✓

T2's result directly influenced the final home architecture: search was deprioritized visually in favor of personalized carousels, which served genre-based browsing faster through pre-curated rows.

Free scroll
25% misclick
Fixed pagination
7% misclick

11 screens, one cohesive system

The user enters through QR login, lands on a home screen with paginated carousels, and navigates without losing playback control thanks to the persistent miniplayer.

30
Maze participants
7%
Misclick · fixed pagination
2/3
Tasks below 5s threshold
11
Screens shipped
Core flow
Login, Home, Recents, Search, My music, Downloads, Offline, Player, MiniPlayer, Settings.
Player
Full-screen view with cover art, blurred background, and controls adapted to subscription plan.
MiniPlayer
Persistent across the entire app to keep continuous playback control without interrupting navigation.

Every decision had a stakeholder on the other side

In automotive, design decisions carry safety implications that most digital products don't. That created real friction — and required evidence, not opinions, to resolve.

A Keyboard-free loginvs. Backend team — complexity trade-off

Stakeholder position: Backend team preferred a direct email + password adaptation. Lower development effort, consistent with existing auth infrastructure.

Design position: Any login that requires a full keyboard at the dashboard is a safety hazard. The interaction is too complex for a stationary vehicle setup moment, let alone motion.

Resolution: QR + 6-digit code. I referenced the Smart TV implementation already live — same team had already built the backend for it. Cost: additional QR generation endpoint. Benefit: zero keyboard interaction on the dashboard.

B Fixed pagination vs. free scrollvs. Development — implementation complexity

Stakeholder position: Development pushed for free scroll — consistent with mobile, lower implementation effort, easier maintenance.

Design position: Vehicle vibration creates accidental scroll activations. Free scroll in motion is unpredictable and increases misclick rate.

Resolution: Maze test with both patterns. 25% misclick on free scroll vs. 7% on fixed pagination. Data closed the debate without needing organizational authority.

C Home content densityvs. Marketing — visibility pressure

Stakeholder position: Marketing wanted to replicate mobile density — more content visible, more discovery, more engagement signals.

Design position: High density on a dashboard violates the 2-second rule. More content per view means more decisions per glance, which means more time with eyes off the road.

Resolution: 4 carousel rows, max 8 items per row. Each row serves one intent. The constraint was framed as a feature — curated content performs better than dense content in low-attention contexts.

D Offline mode designvs. Product — scope pressure

Stakeholder position: Product proposed showing empty states without explicit redirection — simpler to build, acceptable UX by mobile standards.

Design position: In a car, a dead end is worse than on mobile — the user cannot easily recover without significant attention. Every empty state needs a clear path forward.

Resolution: Three visual states designed (available, downloading, offline ready) with consistent redirection to Downloads from any empty section. Cost: 3 additional state variants per section. Benefit: no dead ends in any network condition.

What this project taught

Designing for automotive is not adapting mobile with larger buttons: it is a paradigm where safety and context are primary constraints. Every screen decision carries a weight that doesn't exist in other digital products.

The strongest decisions were closed with data. Intuition identified the problem, but test evidence resolved debates with stakeholders — removing the need for organizational authority to settle design disagreements.

For the next iteration, the clearest opportunity is to deepen Google Assistant voice commands to reduce visual interaction to near zero for the most frequent actions.

Final principle
An incomplete product that works reliably is better than a complete product that fails in critical moments.

Claro Música - Premium conversion without friction

How I transformed a confusing, desktop-oriented sales page into a mobile-first subscription flow that increased conversion across 18 LATAM markets.

Role
UX/UI Designer
Duration
4 months (Feb-May 2024)
Team
Product Manager, 2 devs, QA
Tools
Figma · Analytics · Hotjar · Maze

Understanding where and why users were dropping

Before proposing any solution, I needed to understand the real friction — not assume it. The data painted a clear picture of a product misaligned with how its users actually arrived.

Funnel analysis
Analytics review by screen, time-on-page, and device split confirmed the gap: 78% of visits came from mobile, but the page was structured for desktop browsing. The biggest drop happened mid-page, before any CTA interaction.
Heatmaps and session recordings
Hotjar showed a repeated pattern — users scrolled halfway, paused near the pricing block, and left without tapping. The free-trial CTA had attention but was visually buried under competing elements.
5 remote user interviews
Participants consistently described confusion around plan differences and skepticism about the trial offer. Seeing "1 month free" and "1 week free" on the same screen made them assume hidden conditions — not that there were two different plans.
Competitive benchmark
Analysis of Spotify, Deezer, and Apple Music subscription flows identified two patterns that outperformed: one plan per screen, and explicit post-trial pricing shown upfront. Both reduced perceived risk at the decision moment.

The problem was architectural, not visual

Problem statement: Mobile users arriving at the Claro Música subscription page cannot understand the plan difference or trust the trial offer — because the page forces parallel decisions in a single view designed for desktop, causing drop-off before any commitment.

Two root causes emerged from the research:

Root cause 1
Parallel plan structure

Showing multiple plans side-by-side requires active comparison. On mobile, this creates hesitation — users stall rather than decide.

Root cause 2
Trust gap at pricing

Inconsistent trial messaging ("1 month" vs "1 week") created the perception of hidden conditions, triggering abandonment before phone validation.

Three structural approaches explored

I ran a short ideation phase with PM and one developer to explore architecturally different solutions before prototyping. The goal was to find a structure that reduced cognitive load at the decision moment.

A Option 1 — Visual redesign of current pageDiscarded

Improve hierarchy, typography, and CTA weight on the existing single-page structure. Faster to build, no structural changes needed.

Why discarded: The problem was the parallel decision model itself, not the visual execution. Polishing the layout would not solve the hesitation pattern confirmed in recordings.

B Option 2 — Tab-based plan architectureChosen

Each plan gets its own full screen. The user selects a tab and sees one plan in full context — pricing, benefits, trial terms — without visual competition from other options.

Why chosen: Eliminates the comparison paralysis. Each screen does one thing. Sequential commitment replaces parallel selection.

C Option 3 — Step-by-step wizard flowDiscarded

A guided flow that asks one question at a time: number of users → duration preference → plan. Reduces cognitive load per step.

Why discarded: Adds steps for users who already know what they want. High re-entry friction for users comparing plans. Also requires more backend logic to reconstruct intent across steps.

Three Maze rounds — time-to-CTA dropped from 48s to 19s

I worked in short divergence-convergence loops with PM and engineering. Each round had a specific hypothesis to test, not just general usability validation.

Round 1 — Architecture validation
Tested tab structure vs. original layout. Validated that tabs reduced plan confusion. Identified new friction: hesitation at the pricing card — users weren't sure what happened after the trial.
Round 2 — Trust copy
Rewrote post-trial microcopy to state the charge explicitly and early. "Then $X/month, cancel anytime" in the same block as the trial badge. Hesitation at pricing dropped significantly.
Round 3 — Full flow confirmation
Confirmed shorter paths to action, better end-to-end completion, and fewer decision stalls. Average time-to-CTA: 19s vs. 48s baseline.
Subscription flow redesign comparison for Claro Música landing

Launched in phased rollout, starting in Mexico

+34%
Mobile conversion
-61%
Drop-off before validation
19s
Average time to CTA
+22%
End-to-end completion

The Family plan had the highest relative increase (+51%), likely because the tab architecture made it a visible, first-class option instead of a secondary choice buried below the fold.

Not every friction point was removed — some were kept intentionally

The goal was qualified conversion, not maximum conversion. Some constraints improved billing reliability and fraud control in ways that mattered more than marginal drop-off reduction.

A Keeping SMS validationvs. PM — UX simplicity pressure

Stakeholder position: PM and some stakeholders pushed to remove SMS verification to reduce abandonment at that step. Email-only or one-click sign-up would be simpler.

Design + Business position: Activation depended on validating Claro/Telcel line ownership for carrier billing. Removing SMS would break the billing model, not just simplify the flow.

Cost accepted: ~3% more abandonment vs. an email-only path.

Mitigation: Clear copy, countdown timer, and phone number prefill for returning users reduced anxiety without removing the verification step.

B Mexico-first rolloutvs. regional stakeholders — coverage pressure

Stakeholder position: Regional teams in other LATAM countries wanted simultaneous rollout to capture results across markets at once.

Design position: Trust patterns and onboarding expectations differ by country. Launching everywhere at once meant no ability to react to market-specific friction before it affected large volumes.

Resolution: Mexico-first with phased expansion. Country-level monitoring and local copy adjustments before each market went live.

C Limited 2G testing in early roundsvs. deadline pressure

Constraint: Tight delivery timeline made comprehensive connectivity testing impractical in early rounds.

Cost accepted: Potential degraded experience in lower-bandwidth regions during initial rollout.

Mitigation: Progressive enhancement plan defined before launch — lighter assets, lazy-loading, and critical CSS prioritization — to be applied before broader LATAM expansion.

This project reinforced that conversion problems are often architectural, not visual. On mobile, parallel choices create hesitation; sequential choices create momentum. The fix wasn't better design — it was a different structure.

If I repeated the project, I would involve the customer support team earlier. Billing-related tickets turned out to be the fastest signal for trust-copy decisions — information that was available but not in the design process.

Felpuditos - Integrated management system for a sticker business

I designed a tool from scratch for Felpuditos MX, centralizing quoting, order follow-up, customer management, and financial setup into one cohesive system.

Role
Product Designer (UX/UI)
Duration
3 months
Industry
E-commerce / Tools
Year
2025–2026

Shadowing the real workflow before designing anything

The founders of Felpuditos were also the end users. That gave me direct access to their actual work — not a description of it. I conducted shadowing sessions observing their full daily operation from order intake to delivery.

"Felpuditos started with a spreadsheet full of broken formulas, unanswered WhatsApp orders, and two partners who did not know their real profit."
Pricing is a chained calculation, not a lookup
Watching a real quote happen revealed that pricing depended on 8 interdependent variables: sticker type, finish, lamination, size, quantity, fixed costs, shipping, and margin. One cost change took 30-40 minutes to propagate through 6 Excel sheets and 40+ formulas.
Order intake was scattered across three channels
Instagram DMs, WhatsApp messages, and email — each with different detail levels. Orders were lost in threads, duplicated across channels, and had no single source of truth for status.
Visual production prep was the hidden bottleneck
Each order required manually preparing a production guide from Figma files with no naming standard. This took 20-40 minutes per order — more time than the quoting itself.
Financial visibility gap
The founders tracked revenue but not profit. The impact of materials, shipping fees, payment commissions, and VAT on each order was unclear — making the 52/48 profit split between partners unauditable month to month.

Six pain points, one root cause

Problem statement: Felpuditos cannot scale beyond 3-4 orders per day because every administrative task — quoting, order tracking, financial calculation — is manual, fragile, and scattered across disconnected tools.

Problem Business impact
Manual price calculation 40+ fragile formulas. Cost updates took 30-40 min. Frequent errors.
Orders across 3 channels Lost details, duplicates, no status visibility.
No real margin visibility Revenue tracked, profit unknown. VAT and fees unaccounted per order.
Unstructured design files 20-40 min per order to prepare production guide.
No customer history No recurrence tracking, no preference data.
Opaque profit split 52/48 partner agreement manually calculated, unauditable.

Exploring the right solution type before building

Before committing to a custom tool, I explored three approaches with the founders to understand what level of solution actually fit their context and technical capacity.

A Option 1 — Adapt an existing tool (Notion / Airtable)Discarded

Use Notion databases or Airtable to centralize orders and calculate prices with formulas.

Why discarded: Pricing logic was too complex for formula-based tools without breaking under cost updates. The founders also needed a quote output they could share with customers immediately — neither tool handled that without heavy customization that would break with any update.

B Option 2 — Redesigned ExcelDiscarded

Rebuild the spreadsheet with cleaner structure, protected cells, and a single input sheet.

Why discarded: Excel had already proven its fragility — the problem wasn't the formulas, it was the interface model. A redesigned spreadsheet would still require training, still break on unexpected inputs, and still offer no order tracking or customer history.

C Option 3 — Custom web app with 5 modulesChosen

A purpose-built internal tool with a persistent sidebar navigation and five modules: Calculator, Orders, Inventory, Customers, and Settings.

Why chosen: The only solution that could handle real-time chained pricing, order history, customer data, and configurable financial parameters in a single place — without requiring technical knowledge to maintain.

Within the custom app, the calculator module architecture also had two directions: a single-screen dense layout vs. a three-column layout that made inputs, variables, and cost breakdown visible simultaneously. The three-column approach was chosen because transparency in the calculation was itself a feature — the founders needed to verify results, not just trust them.

Built with the users, not for them

Because the founders were the users, testing was embedded in the design process — not a formal validation round at the end. I ran two iteration cycles with working prototypes before the final build.

Iteration 1 — Calculator focus
The first prototype centered on the Calculator module. Key feedback: the founders wanted to see the cost breakdown live as they changed inputs — not just the final price. This led to the three-column layout with real-time variable visibility.
Iteration 2 — Full flow + Settings
Added Orders, Customers, and Settings modules. The founders flagged that cost parameters changed often (material prices, shipping rates). Settings needed to be editable without designer involvement — so it became a fully self-managed configuration panel.
Launch day = adoption day
No gradual adoption phase. The tool was used in production from the first day because every decision had been made with the founders present. There was no gap between what they expected and what was built.
Felpuditos calculator module interface Felpuditos orders module interface

From 3 quotes/day to 10+

3.3x
Quotes/day increase
71+
Orders processed
0
Calculation errors after launch
20-30h
Monthly admin time saved
Area Before After
Quote speed ~5 min ~30 sec
Daily quote capacity 3–4 10+
Calculation errors 2–3 per week 0 in 71 orders
Production guide prep 20–40 min/order Seconds
Customer records 0 structured 14 with full history

The bottleneck moved from quoting to actual production capacity — which is the right problem to have.

Decisions that created friction with the founders

Working directly with end users who are also stakeholders creates a specific tension: their immediate preferences don't always align with what the product needs to scale.

A Keeping WhatsApp as intake channelvs. design — centralization pressure

Founders' position: They wanted to keep receiving orders through WhatsApp — it was their relationship channel with customers, and asking customers to use a new tool was a risk they weren't willing to take at launch.

Design position: A system where orders arrive outside the tool means the tool never has complete data, and order history is always partial.

Resolution: The V1 tool was designed for internal use only — the founders manually enter orders received through any channel. WhatsApp was not replaced, only decoupled from the operational record. The public-facing quote tool was scoped to V2, when customer behavior data would support the change.

B Showing the full cost breakdown vs. just the pricevs. founders — simplicity preference

Founders' position: Initially preferred a simpler interface — just show the final price. The breakdown felt like unnecessary complexity.

Design position: The breakdown was the only way to build trust in the system. If a number looked wrong and they couldn't audit it, they'd default back to Excel.

Resolution: Full breakdown kept, presented in a collapsible section so it doesn't dominate the interface but is always accessible. After iteration 1, the founders actively used the breakdown to catch a misconfigured material cost in Settings — which validated the decision.

C Inventory module deferred to V2vs. scope — feature pressure

Founders' position: Wanted inventory tracking included in V1 — material stock was a real pain point.

Design position: Building inventory before the core quoting and order modules were validated would split attention and delay the highest-leverage features.

Resolution: Inventory was scoped to V2 with a placeholder in the sidebar navigation so the founders could see where it would live. Shipping the rest first meant the tool was in production 3 weeks earlier than if inventory had been included.

Product design means multiplying capacity with the same resources

Felpuditos wasn't a nice app for a small business. It was a system that moved the operational bottleneck from administration to actual production capacity.

The most important design decision wasn't a UI pattern — it was choosing a custom tool over adapting existing software. That choice made everything else possible.

Continuous field research surfaced opportunities that an initial interview would have missed entirely — especially the visual production guide bottleneck, which turned out to be as costly as the pricing problem.

Material inventory
Stock tracking for vinyl, lamination, and packaging with replenishment alerts.
Analytics dashboard
Revenue, net profit, recurring customers, and demand trends.
Customer-facing quote tool
Public no-login quoting to reduce WhatsApp intake friction.
Instagram DM integration
Convert incoming messages into structured orders without copy/paste.
02

About me

Photo of Jose Eizaguirre

Hi, I'm Jose

Hi. I'm a UX/UI designer based in Mexico City, and I've spent the last 3.5 years at Claro Música designing for one of the largest streaming platforms in the region. I like building digital products where business goals and user goals don't have to compete.

I work pragmatically: I'd rather have an ugly prototype tested with 5 people than a flawless Figma file nobody validated. I'm especially interested in subscription and conversion flows, where a strong UX pattern can change the quarter's results.

Outside of work, I spend time with my girlfriend, play Valorant with friends, and usually keep my Steam Deck nearby for an indie game or a backlog run.

Figma User Research Wireframing Prototyping Design Systems Usability Testing Information Architecture HTML/CSS