Responsywna strona internetowa typu one-page dla firmy z branży mechaniki samochodowej
Moim zadaniem było odświeżenie i unowocześnienie strony internetowej warsztatu samochodowego z długoletnim doświadczeniem. Identyfikacja wizualna miała pozostać bez zmian, więc miałam do wykorzystania firmowe logo oraz solidną podstawę kolorystyczną, na której ramach zbudowałam identyfikację wizualną. Dodatkowo miałam zaakcentować możliwość wypożyczenia auta zastępczego. Zdecydowałam się na zbudowanie drugiej, spójnej wizualnie strony tylko dla wypożyczalni.
Wróćmy jednak do strony warsztatu. Poprzednia wersja była bardzo prosta, pełniła głównie funkcję informacyjną – krótka opis historii firmy, zakres usług i kontakt. Postanowiłam, że nowa wersja powinna mieć jasno nakreślone sekcje, które dodatkowo zaangażują potencjalnego klienta, zdecydowałam się więc na taki układ:
- sekcja Hero – ciekawy wizualnie obrazek kojarzący się z motoryzacją, krótki tekst jasno informującym gdzie się znaleźliśmy, chwytliwe hasło oraz dwa przyciski CTA: „Poznaj ofertę” oraz „Umów się do nas” angażują użytkownika od pierwszego wejścia;
- Oferta – opis oferty warsztatu w wydzielonych blokach, do każdego elementu oddzielna ikonka spójna z koncepcją wizualną, tytuł i krótki opis usługi zawierający same konkrety;
- O nas – krótki opis firmy, jakie posiada certyfikaty oraz informacja o możliwości wypożyczenia auta na czas naprawy;
- Blok CTA – angażujący wizualnie blok z chwytliwym hasłem zachęcający do umówienia się do warsztatu;
- FAQ – lista najczęstszych pytań klientów wraz z odpowiedziami;
- Kontakt – informacje kontaktowe (adres, telefon) oraz mapa dojazdu, informacja o wypożyczalni aut.
Strona została zaprojektowana w programie Figma z uwzględnieniem zasad responsywności, czyli dostosowania strony do czytelnego wyświetlania na różnych urządzeniach: zarówno na komputerach, tabletach czy smartfonach.
Zakres wykonanych prac:
- zaprojektowanie designu strony internetowej w programie Figma,
- nowy układ strony, propozycje CTA angażujące użytkownika, FAQ,
- instalacja i konfiguracja systemu WordPress ,
- stworzenie layoutu przy pomocy Gutenberg,
- konfiguracja WordPressa
- opieka nad statystykami strony.
