superauto.pl

Moja część serwisu – trzy różne karuzele zastąpione jednym komponentem na Swiperze: galeria auta, podgląd na cały ekran i karuzele ofert.

  • JavaScript
  • Swiper
  • Twig
  • SCSS

Projekt w Arris Agency – pokazuję tylko swoją część serwisu.

superauto.pl – strona auta z galerią i miniaturami
  • 1komponent karuzeli zamiast trzech różnych – jeden wzorzec dla całego serwisu
  • 4rozszerzenia wzorca – galeria z miniaturami, podgląd na cały ekran, pojazdy i małe oferty
  • 2kroki ładowania zdjęcia – najpierw rozmyty podgląd, potem pełna jakość
  • Swiperbiblioteka, którą zaproponowałem – zdjęcia ładowane z wyprzedzeniem i prosta edycja

Co zbudowałem

superauto.pl to serwis z ofertami samochodów, także w leasingu. W Arris Agency wprowadziłem w nim sporo zmian, a największą zleconą przebudową było zastąpienie kilku różnych karuzel jedną. Zaproponowałem Swipera – ładuje zdjęcia z wyprzedzeniem i łatwo go edytować – i zbudowałem jeden większy komponent, który zastąpił trzy różne karuzele.

Co się zmieniło

  • Jeden wzorzec karuzeli zamiast trzech różnych – łatwiejszy w utrzymaniu i edycji
  • Galeria auta z miniaturami jako rozszerzenie wzorca
  • Podgląd zdjęć na cały ekran (lightbox) – ta sama karuzela, większe zdjęcia
  • Karuzele kafelków z pojazdami i małych ofert – nowe oferty po pobraniu danych doładowują się płynniej
  • Zdjęcia ładują się w dwóch krokach: najpierw rozmyty podgląd niskiej jakości w tle, po chwili pełna wersja
  • Kafelki z wideo, które przenoszą do sekcji oferty z tym nagraniem

Jak to wygląda

Zrzuty z serwisu – kliknij zrzut, żeby go powiększyć.

  • Strona auta – galeria z miniaturami, strzałki i licznik zdjęć
  • Podgląd na cały ekran – ten sam wzorzec karuzeli, miniatury pod zdjęciem
  • Karuzele ofert – wersje modelu i „Inni też oglądali”, każda karta ma własną małą galerię

1 / 3

Strona auta z galerią

Strona auta – galeria z miniaturami, strzałki i licznik zdjęć

← Wszystkie projekty

Masz projekt do zrobienia?

Albo szukasz kogoś do zespołu? Napisz kilka zdań – odpowiem w ciągu 72 godzin.

Imię, e-mail i treść wiadomości wykorzystam tylko po to, żeby odpowiedzieć. Szczegóły w polityce prywatności.