ProdMedia
33
01
02
03
04 
95+
01
02
03
04
Case study
PRZEBIEG PRACY
SYSTEM WIZUALNY
ARCHITEKTURA
INŻYNIERIA
OPTYMALIZACJA
Potrzeby kupujących
Punkty bólu
Zachowania wyszukiwania
Wnioski o klientach
Kto kupuje pianino Mielczewski
Trzy profile kupujących ukształtowały architekturę informacji, narzędzia porównawcze i ton redakcyjny. Każdy z nich trafia do katalogu z innym pytaniem, a platforma musi odpowiedzieć na wszystkie bez tarcia.
Kluczowe wnioski z briefu i badania odbiorców
Instrument premium prezentowany na wolnej, toporne stronie wygląda tanio. Ładowanie poniżej sekundy i płynność 60fps stały się sygnałem marki, nie tylko szczegółem technicznym.
Narzędzie porównawcze to moment decyzji. Musiało być pierwszej klasy: uczciwa specyfikacja, duże zdjęcia i czysty układ obok siebie.
Duże, uczciwe zdjęcia każdego instrumentu ważą więcej niż tekst marketingowy. Siatka redakcyjna została zbudowana wokół zdjęć.
Historia rzemiosła daje cenie kontekst. Treści o dziedzictwie wplecione są w całą podróż, a nie odizolowane na osobnej stronie.
SYSTEM MARKI
System wizualny nawiązuje do prawdziwego fortepianu: głęboka koncertowa czerń, klawisze z kości słoniowej oraz ciepłe akcenty drewna i mosiądzu. Jest spokojny i ciemny, by to fotografia instrumentów przemawiała najgłośniej.
Przepływ użytkownika
i architektura informacji
Po ustaleniu badań, person i systemu marki, prace przeszły do realizacji: przebudowy całej platformy na Rust i WebAssembly, zaprojektowania katalogu i narzędzia porównawczego oraz produkcji fotografii redakcyjnej i produktowej niosącej markę.
Katalog
Trzydzieści trzy modele, jedna przeglądalna scena
Katalog prezentuje każdy model Mielczewski w jednym, szybkim, przewijalnym doświadczeniu. Zakładkowa karuzela grupuje instrumenty według serii, a każda karta prowadzi do pełnej strony produktu z galerią, specyfikacją i dźwiękiem.
modeli w jednym spójnym systemie
Każdy instrument dzieli ten sam model danych, tę samą obróbkę fotografii i tę samą logikę porównania, dzięki czemu katalog skaluje się bez utraty spójności.
KATALOG
Jeden szybki punkt wejścia do wszystkich 33 modeli, pogrupowanych według serii, z dużymi zdjęciami i jasnymi metadanymi.
PORÓWNANIE
Porównanie obok siebie specyfikacji, wymiarów i progu cenowego, by kupujący mogli decydować pewnie.
REDAKCJA
Treści o dziedzictwie i rzemiośle wplecione w całą podróż, a nie odizolowane na osobnej stronie.
E-COMMERCE
Czyste przekazanie do zaufanego partnera e-commerce przy zakupie, bez budowania własnej kasy.
Produkt
Strona produktu, która odpowiada, zanim sprzeda
Każda strona produktu łączy galerię, pełną specyfikację, dźwięk i bezpośrednią ścieżkę do porównania i zakupu. Fotografia prowadzi; szczegóły techniczne wspierają.
Porównanie
Obok siebie, bez arkusza kalkulacyjnego
Widok porównania zestawia wybrane modele obok siebie z uczciwą specyfikacją i dopasowanymi zdjęciami, zamieniając decydujący moment podróży w czysty, wiarygodny ekran.
Redakcja
Treść, która zarabia na swoją cenę
Dziedzictwo, rzemiosło i ludzie stojący za instrumentami dają cenie kontekst. Sekcje redakcyjne stoją obok katalogu, więc historia marki wspiera decyzję zakupową, zamiast z nią konkurować.
w Lighthouse, na stronie bogatej w media
Duża fotografia i bogate multimedia, dostarczone z ładowaniem poniżej sekundy i wynikiem wydajności 95+, ponieważ platforma nie niesie narzutu frameworka JavaScript.
Doświadczenie
Wideo hero z żywym canvasem
Strona główna otwiera się wideo w hero i polem cząstek na canvasie działającym w 60fps bez wpływu na płynność przewijania, ustawiając premium, dopracowany ton od pierwszej klatki.
DOSTARCZONE
PLATFORMA
Kompletna aplikacja SPA Rust/Yew/WebAssembly bez narzutu frameworka JS.
KATALOG I PORÓWNANIE
33 modele z galeriami, specyfikacją i porównaniem obok siebie.
REDAKCJA
Opowieść o dziedzictwie i redakcyjna siatka zdjęć wpleciona w podróż.
PRZEKAZANIE DO E-COMMERCE
Bezpośrednie kierowanie do zaufanego partnera e-commerce przy zakupie.
Galeria
Instrumenty, klatka po klatce
Mobile
Przeglądanie zaczynające się od telefonu
Zamieniamy precyzyjne instrumenty w premium doświadczenia cyfrowe.
Ładowanie poniżej sekundy, 95+ w Lighthouse i katalog skalujący się do dziesiątek modeli bez utraty rzemiosła.
Rozpocznij projekt