Dla kogo powstała strona
iShots Wedding to studio filmowe i fotograficzne od ślubów, z bazą w Rybniku. Pracuje na całym Śląsku, a na prośbę pary jedzie dalej. Dzień zdjęciowy prowadzi reportażowo: dwie kamery na ceremonii, przysięga nagrana z osobnego mikrofonu przypiętego panu młodemu, żeby słowa było słychać nawet przy pełnym kościele, i reszta dnia dokumentowana z boku, bez ustawiania scen.
Pary nie wybierają studia z cennika. Najpierw oglądają jeden film, potem drugi, a dopiero potem dzwonią. Cała strona musiała obsłużyć właśnie tę kolejność.
Co dostarczyliśmy
ishots-wedding.pl, stronę po polsku w Next.js na Vercelu, zbudowaną tak, żeby to materiał niósł stronę.
Hero, które otwiera się showreelem studia, z pełnoekranowym zdjęciem trzymającym widok od pierwszego wyświetlenia.
Sześć filmów ślubnych w siatce portfolio, każdy opisany znacznikiem VideoObject z prawdziwą datą publikacji i czasem trwania.
Pełne galerie weselne serwowane z Cloudflare R2, z lightboxem i siatką, która rezerwuje miejsce na każde zdjęcie, zanim ono dojedzie.
Trzy rodziny pakietów: video, foto i komplet, z cenami na stronie i tabelą porównawczą dla wariantów video.
Sekcja najczęstszych pytań napisana z pytań, które pary faktycznie zadają: o wyprzedzenie rezerwacji, termin oddania materiału i o to, co się dzieje, kiedy sprzęt zawiedzie.
Formularz zapytania walidowany w przeglądarce i jeszcze raz na serwerze, wysyłający wiadomość prosto do studia, obok numeru telefonu dostępnego jednym dotknięciem z dowolnego miejsca strony.
Siedemnaście stron lokalnych: kamerzysta i fotograf dla każdego z ośmiu śląskich miast oraz jedna na resztę Polski.
Dane strukturalne, mapa strony i tekstowe streszczenie oferty dla asystentów AI odpowiadających na pytania o filmowanie ślubne na Śląsku.
Zgody obsłużone, zanim cokolwiek zacznie mierzyć: analityka rusza dopiero po zgodzie odwiedzającego, po polsku, z rozdzielonymi kategoriami.
Pierwszy ekran
Showreel w hero łatwo zamówić i łatwo zepsuć, bo w typowej wersji każdy odwiedzający czeka na wideo, zanim w ogóle cokolwiek zobaczy.
Dlatego ta strona nie każe czekać. Pełnoekranowe zdjęcie ładuje się z wysokim priorytetem i odpowiada za pierwsze wyświetlenie, a odtwarzacz montuje się dopiero wtedy, gdy przeglądarka skończy ważniejszą pracę, o co kod prosi wprost, zamiast zgadywać stoperem. Dobór jakości należy do platformy wideo, więc telefon na słabym LTE dostaje wersję, którą jego łącze udźwignie, a nie jedno kodowanie wybrane pod monitor na biurku.
Odwiedzający, którzy poprosili swój system o ograniczenie animacji, nie dostają odtwarzacza w ogóle. Zostaje im zdjęcie, a strona nadal wygląda jak to, co sprzedaje.
Galerie, które trzymają układ
Galeria weselna to kilkadziesiąt zdjęć, w pionie i w poziomie, a typowy efekt to siatka skacząca w trakcie ładowania. Każda galeria jest publikowana razem z indeksem, który zapisuje prawdziwe wymiary każdego zdjęcia i rozmyty podgląd o szerokości szesnastu pikseli. Dzięki temu siatka od razu układa się we właściwych proporcjach i pokazuje coś w każdym kafelku, zanim zdjęcie dojedzie. Siatkę niosą miniatury, pełna rozdzielczość pobiera się dopiero po otwarciu zdjęcia, a dane o lokalizacji są usuwane z każdego pliku przy wysyłce.
Dodanie galerii to wysłanie plików, nie wdrożenie. Katalog w magazynie staje się stroną.
Znaleźć się w odpowiednim mieście
Ktoś, kto szuka kamerzysty, wpisuje nazwę swojego miasta. Każda z siedemnastu stron lokalnych odpowiada na takie zapytanie konkretem: ile jest z Rybnika i ile zajmuje dojazd, które okoliczne miejscowości wchodzą w ten sam zakres, które publiczne miejsca w pobliżu sprawdzają się na plener i co realnie zmienia się w pracy na weselu w tym mieście.
Stan na dziś
Strona działa pod adresem ishots-wedding.pl: showreel na pierwszym ekranie, sześć filmów, pełne galerie, trzy rodziny pakietów z cenami na stronie, siedemnaście stron lokalnych i kontakt oddalony o jedno dotknięcie z dowolnego miejsca serwisu.
Szczegóły techniczne
Pytanie, jak postawić ruch na pierwszym ekranie i nie kazać na niego czekać, ma więcej niż jedną odpowiedź. Tutaj drabina jakości należy do platformy wideo. Zbudowanie i serwowanie takiej drabiny samodzielnie, razem z pilnowaniem, żeby obraz startowy nie rywalizował ze strumieniem o Largest Contentful Paint, to dłuższa historia. Opisaliśmy ją w tekście Jak umieścić wideo na górze strony i nie kazać nikomu czekać.
