Frontend & UX
Adobe Commerce frontend and UX that convert
Luma, the classic Adobe Commerce (formerly Magento) theme, is still supported, but it loads a lot of JavaScript and is hard to bring to good Core Web Vitals. Today there are two modern paths: Hyvä, free and open source since November 2025, and Adobe's storefront on Edge Delivery Services. We help you choose the one that fits your operation and build it with data-driven UX.
Decision
Which frontend should you choose for Adobe Commerce?
These are the five real options today, and what each one implies:
- Luma: the default Adobe Commerce theme. Supported and familiar, but heavy; it makes sense when frontend investment is minimal or as an interim step.
- Hyvä: replaces Luma with Tailwind CSS and Alpine.js without leaving the Adobe Commerce stack. It's the most direct option for most PaaS stores and, since November 2025, the theme is free.
- Adobe's storefront on Edge Delivery Services: ready-made components for cart, checkout and account, with content served from the edge. It's included with Adobe Commerce as a Cloud Service, works with Adobe Commerce Optimizer and on PaaS requires version 2.4.8 or later.
- PWA Studio: Adobe's React + GraphQL framework, which still gets new releases. A fit when you need real PWA features or want to share UI with a React mobile app.
- Custom headless: Next.js, Alokai (formerly Vue Storefront) or another framework on GraphQL, when the project needs an experience no standard option delivers and there's a team to maintain it.
Hyvä
Hyvä: the modern replacement for Luma
Hyvä replaces the Luma frontend with Tailwind CSS and Alpine.js, with no jQuery, Knockout.js or RequireJS. It loads a fraction of the JavaScript Luma uses, which makes good Core Web Vitals easier to reach, and your backend modules keep working the same.
Since November 10, 2025, the Hyvä theme is free and open source under the OSL 3.0 and AFL 3.0 licenses, according to Hyvä's official announcement. Hyvä Checkout, Hyvä Enterprise and Hyvä Commerce remain paid products. We've already shipped several stores on this stack across Mexico and LATAM.
- Tailwind CSS for styling and Alpine.js for interactivity
- Target on product pages: LCP under 1.5 s
- Lighthouse target: 95 or higher
- Compatibility review of your Luma modules before migrating
Edge Delivery Services
Adobe's storefront on Edge Delivery Services
The Adobe Commerce storefront combines Edge Delivery Services, ready-made components (drop-ins) for cart, checkout and account, and editable content blocks. It's Adobe's bet for very fast storefronts, with content served from the edge.
Requirements, per Adobe's documentation: it's included with Adobe Commerce as a Cloud Service, works with Adobe Commerce Optimizer and, on PaaS, requires Adobe Commerce 2.4.8 or later with the Storefront Compatibility Package, Services Connector and Catalog Service. It does not support Magento Open Source. To migrate in stages, Luma Bridge lets Luma pages and the new storefront share cart and sign-in state.
- We check whether your Adobe Commerce version and services meet the requirements
- We design the storefront with drop-ins and content blocks
- We plan coexistence with Luma during the migration
UX/UI
UX/UI that converts
A pretty design without conversion data is art, not design. Our UX process includes research with real users, wireframes, navigable prototypes, moderated usability tests and post-launch heatmaps.
- User research through interviews
- Wireframes and Figma prototypes
- Usability tests with 5 to 8 users
- Post-launch heatmaps
- A/B testing of variants
- Data-driven iterations
Performance
Measurable performance (Core Web Vitals)
Core Web Vitals are part of the page experience signals Google considers, and a slow store loses sales. Our builds target LCP under 2 s, CLS under 0.1 and INP under 200 ms, with continuous real-user monitoring.
- LCP under 2 s (target: 1.5 s)
- CLS under 0.1, no layout shift
- INP under 200 ms
- Lazy-loaded images in WebP or AVIF
- Inlined critical CSS
- Real-user monitoring with web-vitals.js
Headless
Custom headless and PWA Studio
Beyond Hyvä and Edge Delivery Services, we build custom headless frontends when the project justifies it, and we support stores on PWA Studio, which still gets new releases from Adobe.
- Next.js on Adobe Commerce GraphQL
- Alokai (formerly Vue Storefront)
- Adobe PWA Studio
- Nuxt for SEO-first projects
- Custom React with server-side rendering
Accessibility
Accessibility (WCAG 2.1 AA)
Accessibility isn't optional: it's a legal requirement in several countries and it's the right thing to do. All our frontends meet WCAG 2.1 level AA: contrast, keyboard navigation, screen readers and ARIA labels.
- AA contrast on all text
- Full keyboard navigation
- Screen reader compatible (VoiceOver, NVDA)
- ARIA labels on interactive components
- Visible focus and logical order
- axe-core audit in CI
Frequently asked questions
Is Hyvä free?
Does Hyvä work with the Luma modules I already have?
Hyvä or Edge Delivery Services?
Can I migrate the frontend in stages?
Related services
Adobe Commerce PWA Studio
PWA Studio, Adobe's React + GraphQL framework for headless Adobe Commerce storefronts: implementation, support, upgrades and migration to Hyvä or Edge Delivery Services.
Learn more →Online Store Design
Custom online store design and development: conversion UX, mobile-first, performance and branding on Adobe Commerce (formerly Magento), to scale without redesigning.
Learn more →Conversion Rate Optimization (CRO)
eCommerce conversion rate optimization: research, hypothesis-driven testing, personalization, checkout UX, cart abandonment reduction. Proven methodology.
Learn more →Composable Commerce
Composable / MACH architecture on Adobe Commerce: API-first, headless, best-of-breed. Implementation with PWA Studio, decoupled frontend and microservices.
Learn more →Want to discuss your project?
We'll assess your case at no cost and propose a concrete path forward.
Tell us about your project
No field is required. Just leave us a way to reach you.