Case Studies

Profesjonalna strona internetowa dla przemysłu, czyli o tym dlaczego obróbka stali może być sexy

Klient
Protech
Cel
Stworzenie nowej strony internetowej
Okres współpracy
sierpień- październik
Liczba sprintów
8
Liczba osób w projekcie
4

Kontekst projektu

Protech to ekspert z branży obróbki stali. Przez wiele lat dostarczał kotły grzewcze jako swój główny produkt. Kilka lat temu firma podjęła świadomą decyzję o skupieniu się na outsourcingu, tj. dostarczaniu kompleksowych produktów stalowych zgodnie z zamówieniem klientów. 

Dotychczasowa strona internetowa nie odzwierciedlała jednak ich aktualnej oferty. Była też przestarzała i zupełnie nie oddawała charakteru firmy PROTECH. Podstawowym założeniem było również dostosowanie jej pod kraje DACH [kraje niemieckojęzyczne, Niemcy – D (Deutschland), Austria – A (Österreich), Szwajcaria – CH (Schweiz].

 

Problemy Protech:

  • zmiana oferowanych usług z produkcji kotłów na produkty dedykowane rozwiązaniom B2B, a więc przejście na outsourcing,
  • zwiększenie sprzedaży B2B poprzez dotarcie do klientów z sektora, któremu mogą świadczyć usługi outsourcingowe,,
  • zaprezentowanie marki Protech w nowoczesny sposób, pokazując innowacyjne podejście w procesie produkcji,
  • stworzenie serwisów językowych dla państw DACH.

Sprint 1: Analiza & Wizja lokalna

Każdy projekt należy dogłębnie zrozumieć. Stąd też cały projekt strony zaczęliśmy od wizji lokalnej w parku maszynowym w Zatorze. 

PROTECH posiada jeden z najnowocześniejszych parków maszynowych w Europie. Na powierzchni blisko 15 tysięcy metrów kwadratowych firma wykazuje 560 robotów na 10 000 pracowników. To kilkadziesiąt razy więcej niż w przeciętnym tego typu zakładzie. 

Dlaczego wizyta w siedzibie klienta była taka ważna? Chcieliśmy poznać oraz zrozumieć procesy oraz sposób pracy PROTECHa. Naszą wizję lokalną zaczęliśmy od pierwszego etapu – obróbki stali, czyli miejsca, gdzie z huty dostarczane są płaty stalowe.

 

Następnie przeszliśmy przez wszystkie stanowiska, na których obrabiana jest stal. Na realnym przykładzie dowiedzieliśmy się:

  • jak wygląda proces cięcia i czym różni się wykrawanie młoteczkowe od cięcia laserowego,
  • jak przygotowywane są elementy do gięcia, 
  • czym różnią się między sobą spawania hybrydowe, TIG, MAG oraz laserowe,
  • o co chodzi z obróbką skrawania metalu po procesie spawania,
  • po co jest śrutowanie, 
  • kiedy stosujemy lakierowanie natryskowe, a kiedy proszkowe,
  • aż w końcu jak wygląda montaż elementów obrobionych wraz z elektroniką.


Brzmi jak z kosmosu? Dla nas na początku też tak było.
I właśnie dlatego w pierwszej fazie projektu strony skupiamy się na pełnym zrozumieniu biznesu i jego działania. Tylko przy pełnym zrozumieniu tego, jak firma działa, możemy zaprojektować stronę dopasowaną do potrzeb klienta. 


Sama wizyta dała wymierne korzyści:

  • na własne oczy doświadczyliśmy procesu, dlatego tworząc serwis wiedzieliśmy, w jaki sposób konkretne elementy biznesu ze sobą współgrają,
  • wizja pozwoliła w szybki sposób uzupełnić wiedzę domenową, 
  • wzajemne poznanie siebie (na żywo, pomimo pandemii), swoich wizji, założeń, celów,
  • nabranie przekonania o faktycznie wysokiej specjalizacji PROTECHu – autonomiczny park maszynowy robi ogromne wrażenie. 

Po wizji lokalnej, wspólnie z zespołem PROTECH, przeprowadziliśmy warsztaty startowe składające się z pracy w oparciu o Team Canvas oraz Business Model Canvas. Poznaliśmy relacje firmy z jednostką oraz strategię na najbliższe kilka miesięcy. 


Problemy klientów PROTECHa, czyli to co warto zaadresować na stronie w projekcie strony. 

 

Dla klientów B2C, dla których do tej pory produkowano kotły:

  • szukają informacji o konserwacji kotłów,
  • nie wiedzą jak je czyścić,
  • problematyczne jest pierwsze odpalenie kotła.

 

Dla klientów B2B outsourcing usług. Klienci pochodzą głównie z krajów DACH, gdzie zidentyfikowano następujące problemy:

  • produkcja przestaje być opłacalna,
  • dostępność pracowników jest ograniczona dostępność pracowników,
  • brakuje kompetencji specjalistycznych, np. spawacza,
  • chętnie zatrudnią wykonawcę własnych produktów, który kompleksowo obsłuży wszystkie zdarzenia.

 

W przypadku produktów np. Walcarka, tj. specjalistycznych narzędzi używanych w parkach maszynowych:

  • firmy produkcyjne preferują polski produkt,
  • brak maszyn w tej kategorii na rynku,
  • marka PROTECH oznacza pewność produktów, 
  • firma ma otwartą politykę wizyt.

Sprint 2: UX Research i Architektura Informacji 


Po powrocie do biura dokonaliśmy Desk Research, czyli analizy danych zastanych. Znaczną część poświęciliśmy analizie konkurencji w kategoriach – B2B, walcarki oraz strony dedykowane serwisowi kotłów.

Analiza konkurencji pozwoliła nam wyciągnąć kilka podstawowych wniosków:

  • konkurencja posiada mało atrakcyjne strony internetowe, dlatego można bardzo łatwo zbudować przewagę konkurencyjną,
  • dla partnerów B2B, ważnym elementem jest pokazanie realnych zdjęć parku maszynowego,
  • konkurenci w kategorii partnerów mocno kładą również nacisk na opis profilu działalności samej firmy,
  • w przypadku alternatywnych produktów np. walcarków, kluczowe jest specyfikacja techniczna
  • materiały dodatkowe dla produktów dostępne są z poziomu pobrania pdf,
  • wszystkie te strony mają bardzo spójny styl graficzny.

 

W tej fazie projektu pogłębiliśmy również informacje na temat całego profilu działalności firmy. Rozwinęliśmy również wiedzę specjalistyczną na podstawie tego, co dowiedzieliśmy się podczas wizji lokalnej.

Na tym etapie skontaktowaliśmy się też z agencją SEO i opracowaliśmy strategię pozycjonowania strony. Na potrzeby SEO zdecydowaliśmy o utworzeniu dedykowanych podstron dla usług. W ten sposób przykładowo dostaniemy kompleksowa informacje o spawaniu równie w typie  MAG oraz TIG.

Jako wynik tej fazy stworzyliśmy architekturę informacji:

Sprint 3-4: Projektowanie UX & copywriting

 

W momencie, kiedy mieliśmy dostępną architekturę informacji, a więc wiedzieliśmy, jakie podstrony mają powstać, przeszliśmy do etapu tworzenia treści i układania ich na docelowej stronie internetowej. 

Przed ułożeniem treści na stronie mieliśmy kilka założeń:

  • w procesie sprzedażowym dużą rolę odgrywają relacje, dlatego warto pokazywać na stronie internetowej osobę odpowiedzialną za sprzedaż,
  • warto pokazać “nowoczesność zakładu”, dlatego cały serwis powinien opierać się w większości na atrakcyjnych zdjęciach,
  • usługi mogą być niezależne, jednak PROTECH pozwala obsłużyć produkcję od A do Z, dlatego ważne jest by stworzyć system przekierowań na kolejne podstrony,
  • główne Call To Action będzie zachęcało do kontaktu na każdej podstronie,
  • serwis i podstrona z dotacjami umieszczony został w “submenu”, jest ona wymagana z przepisami dotacyjnymi, natomiast dla użytkownika nie jest kluczowa.

 

 

Jak widzimy powyższa makieta strony zaprojektowana przez nas pozwala przedyskutowywać jej strukturę. Podczas tego etapu mieliśmy kilka iteracji z klientem, gdzie przechodziliśmy ekran po ekranie i omawialiśmy poszczególne sekcje.

 

Pozwoliło nam to uzupełnić braki i wprowadzić konieczne zmiany. Na podstawie makiet strony jesteśmy w stanie:

  • opracować materiały, które potrzebujemy, aby uzupełnić treść,
  • zwalidować brakujące zdjęcia i elementy,
  • rozpocząć prace copywriterskie, które również zostały wykonane przez nas na bazie badań oraz materiałów dostarczonych przez PROTECH,
  • zwalidować jak kosztowne i skomplikowane będzie wdrożenie projektu graficznego strony.

W tym momencie równocześnie zostały przygotowane teksty dla całej strony internetowej. Jako język podstawowy wybrany został język polski. Na potrzeby projektu teksty były uzupełniane od razu w narzędziu Figma, w którym zaprojektowaliśmy również widoki, a więc konkretne ekrany. Co więcej, aby zlecić tłumaczenie na pozostałe języki(Niemiecki, Austriacki) , przygotowaliśmy również plik tekstowy, który zawierał wszystkie treści.

Sprint 5-6: UI Design profesjonalnej strony internetowej

 

Finalnie mogliśmy rozpocząć tworzenie graficznej części strony internetowej. Pracowaliśmy na stworzonym brandingu, który prezentuje dobry poziom. Wykorzystaliśmy więc motyw przejawiający się w logo oraz na aktualnej witrynie internetowej.

 

Finalnie zdecydowaliśmy się na motyw kwadratów, które zostały wykorzystane na profesjonalnej, nowej stronie internetowej. W związku z intensywną czerwienią oraz chęcią nawiązania do kolorystyki stali, wprowadziliśmy również kolor szary.

 

 

 

Aby pokazać eksperckość i doświadczenie wykorzystane zostały realne schematy z programów CAD, czyli podstawowego narzędzia, na którym pracuje zespół PROTECHa.

 

 

Cała strona została zaprojektowana również w widokach mobilnych.

 

 

Pod koniec sprintu przygotowaliśmy prosty styleguide:

Wdrożenie strony internetowej

Wdrożenie zostało wykonane przy ścisłej współpracy z naszym zaprzyjaźnionym developerem @Jerzy Kozieł. Wybrana została platforma WordPress, aby swobodnie edytować treści i sekcje.

Jerzy przygotował zestaw wszystkich komponentów, które stworzył na potrzeby tej profesjonalnej strony internetowej. Dzięki budowie modułowej kolejne strony mogą powstać niezwykle szybko w zależności od potrzeb marketingowych PROTECH. 

Całość powstała na środowisku roboczym, bez indeksowania, dzięki czemu można było testować różne elementy, a zmiany te nie były widoczne przez odbiorców. Oznacza to również, że strona robocza była widoczna pod zabezpieczonym hasłem, gdzie interesariusze mogli na bieżąco komentować zmiany. W międzyczasie zostały wprowadzone treści i przygotowane responsywne wersje strony. Całość wdrożenia trwała około 3 tygodnie.

Podsumowanie

Strona internetowa zakładu produkcyjnego powinna oddawać charakter danego parku maszynowego. Na skutek dogłębnego researchu udało nam się odzwierciedlić naturę pracy, która jest widoczna na każdym kroku w zakładach PROTECH.  Dogłębne zrozumienie procesów pozwoliło stworzyć nowoczesną i profesjonalną stronę, prezentującą niezbędne informacje dla potencjalnego partnera B2B.

8

sprintów

28

podstron

4

osoby w projekcie

Zespół projektowy, czyli kto za co odpowiadał

Autor Case Study

Tomasz Osowski Lean UX & Service Designer w Project: People
Pomaga firmom stworzyć doskonałe doświadczenie użytkownika zapewniając jednocześnie odpowiednią rentowność biznesu. Jego zdanie to stworzyć produkt i usługi, które są potrzebne i przynoszą satysfakcję zarówno odbiorcom jak i właścicielom biznesu. Certyfikowany Trener Biznesu i rozwoju osobistego, Certyfikowany moderator Design Thinking. Przedsiębiorca od 6 lat szczerze zakochany w metodologii Lean. Zawsze stara się dostarczyć produkt jak najszybciej na rynek przy najmniejszym udziale kapitałowym. Współpracował z firmami: T-mobile, Ecard, inPost, ING, Nationale Nederlanden, Brainly, Publicis, Netguru. Organizator DesignWays Conf.

Case study to za mało?

Chcesz poznać cały proces i dowiedzieć się, jak mógłby wyglądać w Twojej organizacji?

Umów się na bezpłatną konsultację