Jak Lynksen ożywiło stronę złożonej platformy B2B dzięki Spline

Elecctro tworzy systemy oprogramowania dla usług bezobsługowych – takich jak automaty vendingowe, ładowarki samochodów elektrycznych czy automatyczne myjnie. Ich oferta obejmuje zarówno sprzęt, jak i oprogramowanie, i funkcjonuje w segmencie rynku, który tradycyjnie komunikował się z kupującymi B2B za pomocą gęstych specyfikacji i schematów technicznych. Ich misją jest unowocześnienie usług bezobsługowych dzięki inteligentnym, połączonym rozwiązaniom.

Elecctro potrzebowało strony. Ale nie byle jakiej. Takiej, która utrzyma uwagę kupującego wystarczająco długo, by naprawdę wyjaśnić, czym się zajmują, wizualnie wyróżni ich spośród dziesiątek podobnych firm i szybko poprowadzi odwiedzających do decyzji.

„Musieli przekazać mnóstwo informacji” – mówi Tania, Project Manager w Lynksen, agencji projektowania cyfrowego, której powierzono przebudowę strony. „Ale chcieli też wyróżnić się w bardzo technicznej niszy”.

Odpowiedzią nie było więcej treści. Był nią zupełnie inny rodzaj interaktywnego interfejsu.

Strona główna, którą się odkrywa, a nie tylko czyta

Główny pomysł Lynksen był pozornie prosty: pozwolić użytkownikom odkrywać system, zamiast objaśniać go samymi słowami.

Strona główna stała się interaktywną sceną 3D. Przestrzennym przeglądem całej rodziny produktów Elecctro, po którym użytkownicy mogą przesuwać kursor, klikać i poruszać się we własnym tempie. Każdy element sceny prowadzi do dedykowanej strony produktu. Droga od „co to za produkt?” do „jestem gotów porozmawiać” skróciła się do kilku kliknięć.

Użytkownicy mogą wejść na stronę główną, zobaczyć wszystko, kliknąć raz i już są na dobrej drodze, by przekazać Elecctro potrzebne informacje.

To była znacząca zmiana. Większość stron B2B traktuje stronę główną jak spis treści. Lynksen zbudowało stronę Elecctro jako przestrzeń, przez którą się przechodzi, a nie czyta od góry do dołu.

Dlaczego Spline?

Wizja była jasna, ale jak ją zrealizować?

Tradycyjne narzędzia 3D nie wchodziły w grę. Sama nauka pochłonęłaby cały projekt. Co ważniejsze, zespół Elecctro musiał być w stanie utrzymywać stronę po premierze. To oznaczało brak nieprzejrzystych potoków, brak zależności od wyspecjalizowanych artystów i brak narzędzi, których opanowanie zajmuje miesiące tylko po to, by podmienić jeden zasób.

Lynksen przyjrzało się Spline i dostrzegło inną drogę:

• Budować i iterować w jednym środowisku.
• Prototypować interakcje bezpośrednio w narzędziu.
• Dostarczać zasoby gotowe na produkcję bez złożonego łańcucha przekazań.

Przeszliśmy od niemal zerowego doświadczenia do dostarczenia pełnego projektu za pierwszym podejściem.

Umożliwiły to nie tylko same narzędzia. Kluczowa była społeczność. Zanim napisali choćby linijkę kodu, członkowie zespołu Lynksen spędzili czas w bibliotece społeczności Spline: przeglądali remiksy, poznawali, jak inni projektanci podchodzą do interakcji, i wyszukiwali techniki, które mogliby zaadaptować w tym projekcie dla klienta.

Miejsce takie jak Spline Community, z różnymi projektami i możliwością remiksowania, by zobaczyć, jak ludzie podeszli do różnych interakcji, bardzo nam pomogło w nauce.

Dla Elecctro liczył się jeszcze jeden czynnik: trwałość.

Chcieli rozwiązania, które ich zespół naprawdę przejmie po premierze.

Nie trzeba być bardzo technicznym, żeby dodać obiekt, zrobić inną interakcję i utrzymywać projekt po tym, jak go przekażemy. To była dla nas naprawdę kluczowa zaleta.

Budowanie doświadczenia

Proces Lynksen zaczął się zupełnie bez ruchu.

Statyczne wireframe’y. Płaskie układy UI. Jasna hierarchia informacji ustalona, zanim pojawiła się jakakolwiek animacja. Dopiero gdy struktura była solidna, zespół zaczął dodawać kolejne warstwy.

„Zawsze zaczynamy od statyki, a potem dodajemy animację warstwa po warstwie” – mówi Tania. „Kluczowe stany definiujemy w wireframe’ach i szkicach, a podczas wdrożenia dopracowujemy ruchy kamery, bawimy się animacjami i pilnujemy, by wszystko złożyło się zgodnie z oczekiwaniami”.

Ta dyscyplina sprawiła, że projekt nie załamał się pod ciężarem własnych ambicji. Zespół trzymał się prostej zasady: ruch wspiera narrację.

W praktyce oznaczało to:

• Subtelne stany po najechaniu kursorem i mikrointerakcje na zasobach 3D
• Odsłanianie treści przy przewijaniu, które kieruje uwagę, nie narzucając się
• Przejścia kamery, które pomagają się zorientować, zamiast olśniewać
• Ekspresyjną kreatywność zarezerwowaną dla drugoplanowych miejsc (stopka, strona 404), w których drobne niespodzianki cieszą, a nie rozpraszają

Strona 404 stała się jednym z ulubieńców zespołu. Zbudowana w całości w Spline pozwala użytkownikom klikać i odkrywać ukryte zasoby 3D. To mały easter egg, którego większość odwiedzających nigdy nie znajdzie, ale zespół Lynksen wyraźnie świetnie się bawił, budując go.

„Fajnie jest ukryć mały easter egg” – mówi Ross. „Jeśli ktoś go znajdzie, jako projektanci będziemy przeszczęśliwi”.

Detal ikon 3D używanych w całym menu nawigacyjnym strony.

Wyniki

Przeprojektowana strona wystartowała, a liczby od razu ruszyły w górę.

Liczba aktywnych użytkowników wzrosła o 524%, a projekt otrzymał 5 nagród.

Strona zyskała 20 000 nowych wyświetleń, a społeczność projektantów ją zauważyła.

Te wyniki odzwierciedlały coś, co zespół zbudował świadomie: nie tylko ładną stronę, ale naprawdę skuteczną. Taką, która działała dla kupujących potrzebujących jasności i dla zespołu klienta, który musiał ją utrzymywać bez dewelopera na pełen etat pod telefonem.

Dla zespołów, które rozważają 3D

Zespołom, które po raz pierwszy rozważają 3D w sieci, Tania daje prostą radę: nie zaczynajcie od tradycyjnych narzędzi.

Ze Spline krzywa uczenia się jest do opanowania. W ciągu kilku dni osoba z umiejętnościami projektowymi może się w nim odnaleźć. Nasz zespół stworzył solidne MVP w pierwszym tygodniu korzystania.

Ross widzi w tym szerszą zmianę w podejściu zespołów do 3D: zamiast składać ze sobą wiele złożonych narzędzi i procesów, zespoły mogą projektować, iterować i wdrażać w jednym środowisku – dzięki czemu interaktywne 3D od początku staje się znacznie bardziej dostępne.

Jeśli chcesz pracować w jednym środowisku bez bardzo technicznej wiedzy i móc wdrożyć to, co widzisz, wybierz Spline.

Dla agencji projektowych, które proponują klientom interaktywne doświadczenia w sieci, ten projekt jest przekonującym dowodem: z właściwym narzędziem w jednym projekcie można przejść od zerowego doświadczenia do nagradzanej strony.

Zacznij ze Spline

Podobnie jak Lynksen, agencje mogą wykorzystać Spline, by pomóc klientom komunikować złożone produkty za pomocą interaktywnych doświadczeń, które łatwiej zrozumieć, łatwiej utrzymać i które lepiej zapadają w pamięć.

Dla Elecctro oznaczało to przekształcenie technicznej platformy B2B w interaktywną stronę, która wyjaśniła produkt, przyspieszyła podejmowanie decyzji i pomogła marce wyróżnić się na zatłoczonym rynku.

Niezależnie od tego, czy jesteś agencją pracującą dla klienta, czy zespołem wewnętrznym, Spline pomaga szybciej przejść od pomysłu do produkcji – bez złożonego potoku 3D i specjalistycznych umiejętności technicznych.

Skontaktuj się z działem sprzedaży