Link4

Strona internetowa dla jednego z liderów rynku ubezpieczeń komunikacyjnych

Rodzaj projektu

Nowa strona internetowa

Branża

Ubezpieczenia

Technologie

logo Drupal Drupal
Logo Elasticsearch Elasticsearch
Logo Vue.js Vue.js

Zakres prac

Analiza przedwdrożeniowa, UX/UI, web development, support 24/7, prace rozwojowe

  • Zaawansowany system wyszukiwania z UX-friendly listingiem wyników wyszukiwania
  • Formy kontaktu umożliwiające szybką interakcję – formularze, kalkulatory, czat, Callback
  • Aplikacja obsługująca zgłoszenia Callback
  • Migracja treści z Drupala 7 do 9
  • Elastyczny panel CMS ułatwiający zarządzanie treściami

O kliencie

LINK4 działa w branży ubezpieczeń komunikacyjnych od 2003 roku. Jest częścią Grupy PZU, znanej szczególnie w Europie Środkowo-Wschodniej. Celem LINK4 jest maksymalne uproszczenie procesu ubezpieczenia, dlatego konsekwentnie szuka nowych, innowacyjnych rozwiązań w tym zakresie. Właśnie z tą myślą projektowaliśmy nową stronę - kluczowa była prostota, intuicyjność i skupienie na docelowym użytkowniku. 

Bogumił Perzyna

Dyrektor Pionu Sprzedaży i Wsparcia Klienta Direct

Z firmą Smartbees Sp. z o.o. z siedzibą w Opolu współpracowaliśmy w ramach projektu zaprojektowania i wdrożenia nowej strony internetowej www.link4.pl. Nasza współpraca przez cały okres projektu przebiegała wzorowo. Zespół był proaktywny, wychodził z inicjatywą proponowanych rozwiązań, szybko reagował na nasze potrzeby, a zadania były realizowane terminowo. Równolegle do wprowadzonych prac projektowych, Smartbees dbał o utrzymanie naszego obecnego serwisu.

Naszą dotychczasową współpracę i efekt projektu oceniamy bardzo pozytywnie.

Nasza współpraca z firmą LINK4 trwa od 2021 roku. Dotychczas realizowaliśmy prace supportowe dla starszej wersji strony, opartej na Drupal 7. Firmie zależało jednak na nowej koncepcji wizualnej; stronie z łatwo modyfikowalną treścią, dużymi możliwościami edytorskimi i prawidłową retencją danych z formularzy. Wdrożenie całego serwisu powierzono w ręce naszych specjalistów. 

logo Drupal
Logo Vue.js
Logo Elasticsearch

Naszym celem było stworzenie nowej strony z uwzględnieniem kilku obszarów: SEO, sprzedaży i obsługi Klienta czy analityki. Firmie zależało na serwisie, który pozwoli bez przeszkód realizować strategię pozycjonowania. Kluczowe było więc m.in. wprowadzenie elastycznego CMS-a - szybkiego i prostego do wprowadzania zmian, który da większe możliwości publikacji treści i optymalizacji serwisu. Pod kątem sprzedaży LINK4 chciało usprawnić proces pozyskiwania zapytań od Klientów - stworzyć proste kalkulatory, łatwe do wypełnienia formularze i czat. 

Cel projektu Link4
Element tła

Specyfika projektu, branża i fakt, że Klient zna ten CMS (poprzednia strona była oparta o Drupal 7), zadecydowała o tym, że nową stronę też stworzymy na Drupalu, ale w dużo nowszej wersji - 9. Aktualnie strona jest zaktualizowana i podniesiona do D10. Co wyróżnia Drupala nad innymi CMS-ami? 

  • Otwarty kod, który sprawia, że CMS jest elastyczny nie tylko pod kątem zmian w wyglądzie, ale również modyfikacji funkcji;
  • bezpieczeństwo uzyskane dzięki regularnie wydawanym łatkom;
  • wysoka wydajność, dzięki połączeniu tradycyjnego CMS-a i frameworka;
  • tysiące pluginów do pobrania z oficjalnej strony Drupala, pomagające w personalizowaniu serwisu. 
Zaawansowane wyszukiwanie na stronie Link4

Zaawansowane opcje wyszukiwania

Aby ułatwić użytkownikom poruszanie się po serwisie i szybkie wyszukiwanie informacji, stworzyliśmy zaawansowane pole wyszukiwarki wewnętrznej opartej o silnik Elasticsearch i Vue.js. Wyszukiwarka pojawia się od razu na górze strony. Po wpisaniu słowa lub ciągu słów, użytkownikowi wyświetlają się wyniki ujęte w formie listingu wraz z przypisanymi filtrami tematycznymi, jak podróżesamochód czy mieszkanie

Szczegóły rozwiązania Link4 migracja treści

Migracja treści z Drupal 7 do 9

Przenieśliśmy m.in. artykuły z aktualności, ale oprócz samej migracji, stworzyliśmy nowe struktury dla Landing Page’ów i wpisów blogowych.

LP składa się z prostych i przejrzystych bloków przedstawienia treści. Redaktor strony ma możliwość dodania wielu opcji:

  • minimalistycznego przedstawienia cen ubezpieczeń;
  • kolumn z wyróżnikami danego rozwiązania;
  • CTA w treści w formach białych i szarych bloków wyróżniających się na tle całej strony;
  • listy wypunktowanej z dodatkową zawartością;
  • małych boxów z ikonami;
  • klikalnej sekcji Q&A z możliwością oznaczania pytań jako H3;
  • i wiele, wiele więcej.
Sekcja blogowa Link4

Blog wyposażyliśmy m.in. w:

  • licznik czasu pokazujący stopień zagłębienia użytkownika w treść,
  • blok CTA w treści,
  • aside banner po prawej stronie artykułu.
Szczegóły rozwiązania Link4 - formularze

Tworzenie i modyfikacja formularzy

Klientowi zależało na intuicyjnych formularzach, za pośrednictwem których użytkownicy będą mogli zgłaszać szkody. Postawiliśmy na prostotę, spójną kolorystykę i co najważniejsze pod kątem technicznym - na moduł Webform. To elastyczny kreator formularzy, który zbiera zgłoszenia, wysyła powiadomienia i daje możliwość tworzenia kolejnych dokumentów w szablonie. Dodatkowo pozwala na generowanie CSV zgłaszanych formularzy, a więc znacznie ułatwia pracę. 

Szczegóły rozwiązania Link4 - interaktywne mapy

Interaktywne mapy

Stworzenie przestrzeni, dzięki której każdy zainteresowany będzie mógł sprawdzić warsztaty dostępne w całej Polsce, było prawdziwym wyzwaniem. Zdecydowaliśmy się na framework Vue.js - szybki i wyjątkowo „lekki” oraz wykorzystanie Google API. 

Mapa przedstawia miejsca warsztatów z podziałem na województwa i oznaczeniami liczbowymi. Po kliknięciu wybranego miejsca, pojawia się lista wraz z przybliżonymi na mapie miejscami warsztatowymi. Listing uwzględnia dokładny adres ośrodków, szczegóły kontaktu oraz daje możliwość wyznaczenia trasy. 

Integracje

Integracje Link4 z LiveChat

LiveChat

Klasyczna integracja z LiveChat wymaga zazwyczaj wyłącznie umieszczenia odpowiednich skryptów w kodzie strony, dostarczonych przez usługodawcę. Wówczas na stronie pojawia się ikona usługi LiveChat, która umożliwia rozmowy z wirtualnym asystentem. 

LiveChat w swojej domyślnej wersji ma jednak sporo ograniczeń, które nie satysfakcjonowały Klienta. Z poziomu panelu zarządzania usługą nie ma np. możliwości wskazania własnego elementu na stronie, który będzie służył do uruchomienia czatu. Tę funkcję musieliśmy doprojektować. Wprowadzone zmiany pozwalają na uruchomienie czatu poprzez kliknięcie jednego z elementów menu kontaktowego. Dodatkowo stworzyliśmy formularz konfiguracyjny, który pozwala wskazać adresy URL stron, dla których funkcja czatu ma zostać wyłączona.

Integracje Link4 z OneTrust

OneTrust

OneTrust to usługa, która umożliwia zachowywanie prywatności w witrynie. Integracja z platformą polega na umieszczeniu odpowiednich skryptów w kodzie strony klienta, dostarczonych przez OneTrust. W przypadku LINK4 usługa jest wykorzystywana do zarządzania plikami cookie, umożliwiając skuteczne zarządzanie zgodnością z przepisami dotyczącymi prywatności oraz preferencjami dotyczącymi plików cookie.

Co więcej, w formularzu w Drupalu dodaliśmy pola pozwalające na zmianę nazwy domeny oraz klucza, które wykorzystywane są do integracji z usługą OneTrust. Dzięki temu klient może samodzielnie zarządzać integracją z usługą z poziomu panelu administracyjnego.

Integracje Link4 Google Tag Menager

Google Tag Manager (GTM)

W witrynie umieściliśmy skrypt integrujący ją z usługą GTM. Podobnie jak w przypadku konfiguracji z OneTrust, tutaj także uzupełniliśmy formularz Podstawowe ustawienia witryny o możliwość samodzielnego wprowadzania zmian przez Klienta. 

Przy pomocy dataLayer (narzędzia do przekazywania danych z witryny do kontenera GTM), stworzyliśmy opcję odkładania informacji z formularza kalkulatora polisy OC/AC oraz z formularza zamawiania kontaktu. Umożliwia to zbieranie danych o działaniach użytkowników na stronie i ich interakcjach z formularzami. Dzięki temu można lepiej zrozumieć zachowania userów, personalizować ich doświadczenia oraz lepiej monitorować i analizować konwersje.

Integracje Link4 i uzupełnianie map

Mechanizm importowania i eksportowania

Klient szukał sposobu na proste i szybkie dodawanie kolejnych warsztatów i agentów do mapy na stronie. Dodaliśmy więc opcję importu plików CSV do Drupala przez administratora witryny, a także stworzyliśmy strukturę, która zachowuje dane i umożliwia ich późniejszy eksport. Efekt? Zaoszczędzenie czasu, usprawnienie procesu oraz zminimalizowanie ryzyka pomyłki przy wprowadzaniu kilkunastu, a czasami nawet kilkudziesięciu nowych punktów.

Stworzyliśmy nową stronę zgodnie z przewodnią myślą LINK4: „Wierzymy, że ubezpieczenia powinny być proste”

Plany zakładały kilka miesięcy intensywnych prac. Tak faktycznie było! Nasz zaangażowany zespół działał nad migracją danych, tworzeniem paragrafów i dodatkowych funkcji.

Zobacz w pigułce, co udało nam się osiągnąć:

Efekty pracy Link4
  1. Integracje z LiveChat i OneTrust.

  2. W pełni edytowalne, zaawansowane formularze zarządzane z poziomu panelu administracyjnego.

  3. Możliwość przechowywania danych z formularzy tylko na czas przeprocesowania ich przez system wewnętrzny.

  4. Nowa szata graficzna skupiona na mobile-first.

  5. Mechanizm umożliwiający import i eksport warsztatów oraz import i eksport agentów w specjalnie stworzonej strefie agenta.

  6. Rozbudowane i w pełni modyfikowalne menu główne strony wraz z menu bocznymi.

  7. Nowa aplikacja obsługująca zgłoszenia z formularzy Callback, zmodernizowana w oparciu o najnowsze technologie.

  8. Bezpieczna witryna, która przeszła mnóstwo testów bezpieczeństwa i wydajności oraz audytów: przedwdrożeniowych SEO, performance.

2600

godzin zajęła nam realizacja podstawowego zakresu projektu

4

miesiące trwał development podstawowej wersji strony. Po tym czasie realizujemy prace rozwojowe

40

customowych modułów przygotowali nasi programiści

7

osób pracowało nad serwisem - 1 Project Manager, 1 Team Leader i 5 Full-stack developerów Drupala

4

agencje partnerskie współpracowały z nami - agencja SEO, agencja działająca w obszarze cookies, kolejna w analityce i LINK4 odpowiedzialny za infrastrukturę

98

wdrożonych nowych widoków desktop w zakresie podstawowym

48

wdrożonych nowych widoków mobile w zakresie podstawowym

6

wdrożonych aplikacji Vue.js w ramach serwisu

Projekt Twoich marzeń

Stwórzmy go wspólnie