Michelin Ad Builder
Michelin Ad Builder: Brand-safe creative in minutes
Net-new dealer portal enabling non-designers to create compliant ads fast. I led research → IA → flows → UI system → validation to cut time-to-publish and lift adoption.
Designed for clarity and efficiency, the interface streamlines creative production across multiple brands while maintaining compliance and brand integrity.
Research & Discovery
Methods
- Conducted contextual interviews to observe real dealer workflows and decision patterns.
- Performed task analyses to identify friction points and inefficiencies in the ad creation process.
- Completed a heuristic audit and analytics review to quantify usability gaps and validate insights.
Insights
- Identified a consistent user workflow: “Select → Compose → Validate → Export.”
- Validated the need for live guardrails and real-time feedback to prevent compliance errors early.
Risks
- Compliance edge cases required flexible guardrails to handle co-op and brand variations.
- Multi-role approvals introduced delays across dealer, marketing, and compliance teams.
- Localization for seasonal campaigns added complexity in managing content and assets.
Problem
- Dealers often selected the wrong ad template or spec, causing misaligned creative assets.
- Errors surfaced late in the approval process, leading to avoidable rework and longer turnaround times.
- No centralized source of truth for brand and co-op rules resulted in inconsistent, non-compliant campaigns.
Goals
- Shorten time-to-publish through guided workflows and built-in guardrails that simplify each step.
- Increase adoption by improving clarity, leveraging smart defaults, and maintaining preview parity across formats.
- Enhance compliance with inline validation, tokenized design standards, and automated brand checks.
UI/UX User Journey Map — Steps & Emotions
Observed emotions during moderated studies across key steps.
Dealers log in to explore campaign templates tailored to their region, brand, and channel. Goal: make it easy to find the right starting point through smart filters and spec badges.
- Smart filters surface region-specific and co-op-eligible templates instantly.
- Spec badges highlight approved sizes, DPI, and channel fit before selection.
Users preview templates with real-time examples and usage notes. Outcome: reduces false starts and ensures the correct asset is chosen before customization.
- Live previews display ad layouts with real dealer data for realistic context.
- Usage notes clarify co-op rules, safe zones, and platform-specific specs before customization.
Guided input fields prompt users to add localized content (dealer name, offer, contact). Design focus: inline validation, autosave, and branded tokens maintain visual consistency.
- Guided fields with helper text ensure accurate dealer info and promotional details.
- Autosave and brand token rules keep typography, spacing, and colors consistent across ads.
Automated checks review logo placement, contrast ratios, and co-op compliance. UX value: fewer back-and-forth reviews and faster approval cycles.
- Automated guardrails flag logo placement, color contrast, and co-op compliance in real time.
- Instant feedback reduces manual reviews and accelerates campaign approval cycles.
Marketing managers or co-op reviewers confirm ad readiness in a shared dashboard. Collaboration: comments, status tags, and role-based notifications improve transparency.
- Shared dashboards give reviewers real-time visibility into ad status, versions, and feedback.
- Role-based comments and notifications streamline collaboration and speed up final approval.
Dealers download print-ready or digital assets with one click. Efficiency: built-in DPI, bleed, and aspect ratio settings ensure ads are publication-ready.
- One-click export delivers ready-to-use print and digital assets in the correct format every time.
- Preset DPI, bleed, and aspect ratios eliminate resizing errors and ensure publication compliance.
End-to-End UI/UX Journey & Outcomes
Ad Builder Editor & Template Library
The Michelin Ad Builder streamlines every step of the creative process—from campaign setup to export—through guided workflows and smart defaults. Dealers can quickly input details, select templates, customize content, validate compliance, and download ready-to-use assets in minutes. Each step reduces friction, enforces brand consistency, and accelerates time-to-publish across all ad channels.
Dealers enter campaign name, dates, and objectives — setting the foundation for localized creative setup.
Centralized hub enabling dealers to find, customize, and publish approved ads in minutes.
Dashboard & Campaigns
A centralized catalog of pre-approved, brand-compliant ad templates empowers dealers and partners—including tire retailers, auto service centers, and distributors—to easily access, customize, and publish on-brand creative without relying on a designer or agency. The system ensures brand consistency across hundreds of local markets and ad channels—print, digital, and social—while reducing marketing friction by removing back-and-forth approvals and rework.
Unified dashboard connecting Michelin, BFGoodrich, and Uniroyal dealer networks—allowing users to manage campaigns, access approved templates, and monitor ad approvals in one central hub.
Simplifies campaign management with clear statuses, version tracking, and quick access to live or pending ads.
Design System Highlights
Color Tokens
Accent (Michelin blue), action brand, neutrals; WCAG AA across states.
Typography & Spacing
Clamp scaling for H1/H2; 4/8 rhythm; 16px base for readable forms.
Components
Chips, status tags, input groups, alerts, sticky CTAs, device frames.
Accessibility Compliance Checklist
| Area | Standard | Status | Notes |
|---|---|---|---|
| Color & Contrast | WCAG 2.2 AA | Met | Text, icons, controls pass AA; focus visible. |
| Keyboard | 2.1.1 | Met | All flows tab-navigable; dialogs trap focus. |
| Semantics | ARIA / HTML | Met | Landmarks, labels, and roles on interactive UI. |
| Validation | Error Prevention | Met | Inline errors describe issue + fix; SR-only text. |
| Timing | 2.2.1 | Review | Expiry warnings; extend pattern under test. |
| Motion/Flashing | 2.3.1/2 | Met | No flashing > 3Hz; prefers-reduced-motion respected. |
| Docs/Exports | Alt / Reading Order | To Do | Exported PDFs need tagged reading order. |
Need an application UI/UX designer?
I design systems that shorten time-to-publish and scale with your roadmap.