Dexrovia Regal Atelier: Redesign eines Schneiderateliers

Dexrovia Regal Atelier fertigt in Sucat, Muntinlupa, Anzüge, Mäntel, Jacken und Festkleidung nach Mass. Die neue Website sieht aus wie der Ort, an dem die Arbeit entsteht: eine Schneiderbank mit Wolle, Kreide und Massband.

Die alte Startseite lud bei jedem Besuch 73.66 MB, was bei simulierten 10 Mbit/s 59.4 Sekunden dauerte. Auf einem 390 px breiten Handybildschirm war das Layout 780 px breit, die Seite forderte Bilder an, die es nicht gab, und Schriften und Icons kamen von drei externen Hosts. In der Fusszeile standen ausserdem zwei verschiedene Steuernummern, eine davon falsch, und Abzeichen sowie eine «Zufriedenheitsgarantie» versprachen mehr, als das Atelier bestätigt hatte.

Ein Neubau ohne Framework in anthrazitgrüner Wolle, Kreideweiss und Massband-Gelb, mit einer weichen Serifenschrift, einer klaren serifenlosen Schrift und einer schmalen Auszeichnungsschrift. Kreidestriche zeichnen sich beim Scrollen, und ein gelbes Massband am linken Rand zeigt, wie weit man auf der Seite ist. Die Leistungen sind Schnittmusterteile aus Papier mit Knipsen, Fadenlauf und «Piece 01 · Cut 1», und ein Streifen erklärt den Ablauf eines Auftrags: Beratung, Massnehmen, Anproben, Fertigstellung. Besucher legen Kleidungsstücke in «My visit», wählen einen Wunschtermin für die Anprobe, sehen Einstiegspreise und bezahlen im Atelier, sobald der Auftrag bestätigt ist. Die Bilder sind komprimierte WebP-Dateien, die erst beim Scrollen laden, und die Schriften werden mit der Website ausgeliefert, sodass die Startseite ohne Anfragen an Dritte auskommt.

Die neue Website gestaltet und gebaut, die Bilder erstellt und für das Web komprimiert, die Kreide- und Massband-Animationen entwickelt, den Ablauf als Anprobe-Anfrage neu gebaut, Steuernummer und Garantie-Formulierung korrigiert und die alte und neue Version mit demselben Skript gemessen.

• Kreidestriche, die sich beim Scrollen zeichnen
• Gelbes Massband am linken Rand als Scrollanzeige
• Leistungen als Schnittmusterteile mit Knipsen, Fadenlauf und Zuschnittangaben
• Streifen «How a commission works»: Beratung, Massnehmen, Anproben, Fertigstellung
• Anprobe-Anfrage mit Wunschtag und -zeit, Einstiegspreisen und Bezahlung im Atelier nach Bestätigung
• Nur die richtige Steuernummer behalten, die zweite, falsche entfernt
• Abzeichen «Best Seller» und «Promo» entfernt, «Zufriedenheitsgarantie» durch das sachliche «Anproben und Änderungen inbegriffen» ersetzt
• Anfrage als vorausgefüllte E-Mail, die die Kundschaft selbst abschickt
• Die ursprünglichen Kundenzitate wörtlich übernommen

• HTML
• CSS
• JavaScript
• SVG
• WebP
• JSON-LD structured data

Gewicht der Startseite beim Laden

73.66 → 0.47 MB

Beim Laden am Handy

73.65 → 0.34 MB

Nach Scrollen der ganzen Seite

73.66 → 0.78 MB

Vollständig geladen (simuliert, 10 Mbit/s)

59.4 → 0.55 s

Layoutbreite am Handy (390-px-Bildschirm)

780 → 390 px

Leistungen auf der Website

15

• →Live unter dexroviaregal.site.
• →Mit demselben Skript gemessen: Die Startseite lädt am Desktop 0.47 MB statt 73.66 MB, am Handy 0.34 MB.
• →Während des Aufnahmelaufs keine fehlgeschlagenen Anfragen, keine Konsolenfehler und keine Anfragen an Dritte auf der neuen Website.

• Das beste Konzept funktioniert zugleich als Bedienoberfläche.
• Ein Dienstleistungsbetrieb braucht einen Buchungsablauf, keinen Shop-Checkout.
• Jede Nummer prüfen, die eine Website als amtlich ausgibt.

Kunden-Website, mit Namen gezeigt. Screenshots und Messwerte stammen aus einem Aufnahmeskript, das auf der alten und der neuen Website lief, auf einem lokalen Server. Der Wert bei 10 Mbit/s beruht auf einer simulierten Verbindung und nicht auf Daten echter Besucher. Die Bilder sind generierte Illustrationen von Kleidungsstücken auf Schneiderpuppen, ohne Personen und mit einem Etikett aus dem Namen des Ateliers, keine Fotos seiner Arbeiten, worauf die Website hinweist. Leistungsbeschreibungen, Einstiegspreise und die Kundenzitate stammen von der alten Website; Rückgabebedingungen und AGB verwenden nur Angaben der alten Website.