Langsame Ladezeiten
Das alte Luma-basierte Theme lud auf Mobile in über 4 Sekunden — ein fataler Wert für B2B-Entscheider, die unter Zeitdruck bestellen. Core Web Vitals im roten Bereich, LCP bei 4.2 Sekunden.
Hyvä Frontend & UX-Redesign
für Youlap.ch
Wie wir den bestehenden Magento-Shop von Youlap (Computacenter-Gruppe) mit Hyvä Frontend komplett modernisiert haben — schnellere Ladezeiten, klarere Navigation, mobile-first Checkout.
Projekt-Zusammenfassung: DevQon migrierte den
bestehenden Magento-Shop von Youlap (Computacenter-Gruppe) auf das Hyvä Frontend-Framework. Das
Ergebnis: deutlich schnellere Ladezeiten, eine klarere Navigation und ein mobile-optimierter
Checkout — bei vollem Erhalt der bestehenden Business-Logik und Systemintegrationen.
Mobile Score
Hyvä
Frontend
+UX
Score
Mobile Score
Hyvä
Frontend
+UX
Score
Ausgangslage
Die Herausforderungen
von Youlap.ch
Youlap.ch ist der Online-Shop der Computacenter-Gruppe für Laptops und Mobile Devices im B2B-Bereich. Der bestehende Magento-Shop lief auf einem Legacy-Theme — mit spürbaren Auswirkungen auf Performance, User Experience und letztlich auf die Conversion Rate.
01
Langsame Ladezeiten
Das alte Luma-basierte Theme lud auf Mobile in über 4 Sekunden — ein fataler Wert für B2B-Entscheider, die unter Zeitdruck bestellen. Core Web Vitals im roten Bereich, LCP bei 4.2 Sekunden.
02
Schlechte Mobile-UX
Mobile machte über 60% des Traffics aus — doch das Theme war primär für Desktop designed. Kleine Buttons, unübersichtliche Produktfilter, ein Checkout der auf dem Smartphone frustrierte.
03
Unübersichtliche Navigation
Das Produktsortiment umfasst hunderte Konfigurationen, Hersteller und Kategorien. Die Navigation war historisch gewachsen — ohne klare Struktur, mit zu vielen Ebenen und kaum intuitiver Filterung.
04
Hohe Absprungrate im Checkout
Der mehrstufige Checkout überforderte mobile Nutzer. Zu viele Pflichtfelder, kein klarer Fortschrittsindikator, verwirrende Zahlungsoptionen — Kunden brachen regelmässig kurz vor der Bestellung ab.
Lösung
Hyvä
Frontend:
Performance als
Designprinzip
DevQon hat den Youlap-Shop vollständig auf das Hyvä-Theme migriert — ohne Unterbruch des laufenden Betriebs. Hyvä ist die modernste Frontend-Lösung für Magento 2: leichter, schneller, zugänglicher.
01 — Performance
Hyvä Frontend Migration
Hyvä ersetzt das schwergewichtige Luma-Theme durch eine schlanke Alpine.js + Tailwind CSS Architektur. Das Resultat: LCP von 4.2s auf 1.1s, Mobile Score von 42 auf 91 — ohne Backend-Änderungen.
02 — Design
UX/UI-Redesign komplett
Vollständige visuelle Neugestaltung: neue Navigationsstruktur, überarbeitete Produktseiten mit klarer Hierarchie, optimierte Filterlogik und ein Designsystem, das Computacenters Corporate Identity aufgreift.
03 — Checkout
Mobile-First Checkout
Der neue Checkout ist auf Mobile gebaut: einzeiliger Fortschrittsbalken, intelligente Feldvalidierung, optimierte Tastatur-Inputs und ein klar strukturierter Flow, der Abbrüche drastisch reduziert.
Core Web Vitals · Vergleich
youlap.ch
Performance — Vorher vs. Nachher
LCP (Largest Contentful Paint) 4.2s → 1.1s
CLS (Cumulative Layout Shift) 0.28 → 0.02
FID / INP 210ms → 38ms
Mobile Lighthouse Score 42 → 91
Total Blocking Time 980ms → 120ms
Gesamtergebnis
Alle Core Web Vitals: Grün
Nach Hyvä-Migration — Mobile & Desktop
Ergebnisse Performance
ist
Performance
ist
kein Zufall.
91
Google Lighthouse Mobile Score — von 42 auf 91 nach der Hyvä-Migration
-74%
LCP-Verbesserung: von 4.2 Sekunden auf 1.1 Sekunden Ladezeit
-55%
Reduktion der Checkout-Abbruchrate — gemessen 90 Tage nach Go-live
Hyvä
Modernste Frontend-Technologie für Magento 2 — zertifiziert von DevQon
★★★★★
"Mit dem Hyvä-Redesign hat sich nicht nur die Performance unseres Shops verbessert, sondern auch die Art, wie unsere Kunden mit uns interagieren. DevQon hat unsere Anforderungen verstanden und in ein UI übersetzt, das einfach Spass macht zu bedienen."
Anna-Nina
Computacenter-Gruppe · Youlap.ch
Technologie
Tech Stack
Frontend
Backend & Integration
Vorgehen
Unser Prozess
01
01
Audit & UX-Analyse
Vollständiger Performance-Audit des bestehenden Shops: Lighthouse-Reports, Heatmap-Auswertung, Nutzerfluss-Analyse, Checkout-Funnel-Analyse. Ableitung der konkreten UX-Schwachstellen und Priorisierung der Massnahmen.
02
02
Hyvä-Entwicklung
Theme-Migration auf Hyvä, Implementierung des neuen Designsystems, Entwicklung aller Custom-Komponenten in Alpine.js, Tailwind-Konfiguration nach Corporate Identity, Checkout-Redesign und mobile Optimierung.
03
03
Testing & Go-live
Umfangreiches Cross-Browser- und Device-Testing, Performance-Validierung mit Lighthouse CI, A/B-Test der neuen Checkout-Strecke, kontrollierter Launch mit sofortigem Monitoring der Core Web Vitals.
Häufige Fragen zu Hyvä Frontend & Performance
Warum Hyvä statt einer anderen Frontend-Lösung?
Hyvä ist die einzige Frontend-Lösung für Magento 2, die ohne JavaScript-Framework-Overhead auskommt. Alpine.js und Tailwind CSS sind leichtgewichtig, schnell und einfach zu warten. Im Vergleich zu PWA-Ansätzen ist Hyvä battle-tested, SEO-freundlich und lässt sich in der Regel ohne komplette Neuentwicklung auf bestehende Shops applizieren. DevQon ist zertifizierter Hyvä Developer — wir kennen alle Fallstricke.
Wie gross ist der Performance-Gewinn durch Hyvä konkret?
In der Regel verbessert sich der Google Lighthouse Mobile Score von einem typischen Luma-Shop (30–50) auf 85–95 nach Hyvä-Migration. Der LCP (Largest Contentful Paint) reduziert sich je nach Ausgangslage um 60–80%. Das wirkt sich direkt auf Google-Rankings, Conversion Rate und Nutzervertrauen aus — denn ein langsamer Shop verliert Kunden, bevor sie auch nur ein Produkt gesehen haben.
Was ist Hyvä und warum ist es schneller als klassische Magento-Themes?
Hyvä ist ein modernes Frontend-Framework für Magento 2, das auf Alpine.js und Tailwind CSS basiert — beides bewusst schlanke Technologien. Klassische Magento-Themes wie Luma verwenden RequireJS und jQuery, was zu grossen JavaScript-Bundles und hohen Ladezeiten führt. Hyvä verzichtet auf RequireJS vollständig und liefert drastisch kleinere Bundle-Grössen, was sich direkt in besseren Core Web Vitals, höheren Lighthouse-Scores und schnelleren Ladezeiten niederschlägt.
Wie lange dauert eine Hyvä-Migration?
Die Dauer einer Hyvä-Migration hängt stark vom Ausgangszustand des bestehenden Shops ab. Ein standardisierter Magento 2 Luma-Shop kann in 6–12 Wochen migriert werden. Bei starken Customizations oder vielen Custom-Modulen verlängert sich der Zeitrahmen. DevQon entwickelt Hyvä-Themes parallel zum laufenden Betrieb auf einer Staging-Umgebung, sodass der produktive Shop bis zum Go-live uneingeschränkt weiterläuft. Der Rollout erfolgt kontrolliert mit sofortigem Performance-Monitoring.
Welche Magento-Extensions sind mit Hyvä kompatibel und was muss man beachten?
Nicht alle Magento-Extensions sind direkt Hyvä-kompatibel, da viele ältere Extensions auf dem klassischen RequireJS/Knockout-Frontend aufbauen. DevQon prüft im Discovery die eingesetzten Extensions auf Hyvä-Kompatibilität. Für Extensions ohne nativen Hyvä-Support gibt es oft Community-Module als Kompatibilitäts-Layer — oder DevQon entwickelt eine schlanke Custom-Integration direkt in Alpine.js und Tailwind, was häufig performanter ist als der Weg über ein Legacy-Extension-Framework.
Bereit?
Ihr Shop ist zu langsam?
Sprechen
wir.
Hyvä ist die schnellste und modernste Frontend-Lösung für Magento 2. Wir migrieren Ihren Shop — ohne Betriebsunterbruch, mit messbaren Resultaten.
