For SJS we prepared three pages for three brands from the automotive industry based on one design

Śledź nas w mediach społecznościowych:

SJS logo

Our task was to prepare websites that would be based on the same design and functionalities, but would differ from each other in terms of colour and content of the page.

Check online
Projektowanie stron internetowych - wizualizacja strony głównej w wersji mobilnej

The most important facts and figures

  • We prepared one universal design that could easily be adapted to other brands.
  • We focused on presenting content using photos and videos, as this form best captures the emotions associated with automotive events and driving the fastest cars.
  • High optimisation of the website in desktop and mobile versions.
  • Integration of the site via Google Maps API with racing track locations around Poland
  • 3

    pages based on one theme

  • 1000+

    photos on each of the websites

  • 99

    speed in Pagespeed Test mobile version at the time of website delivery

The Client about the project

Agnieszka Hiller - Marketing ManagerSJS logo

Agnieszka Hiller

Marketing Manager, SJS S.A.

We came to Brave New on a recommendation because the people in our team had previously had the opportunity to work with the team on another project.

From the beginning, BraveNew was focused on dynamic cooperation and achievement of the set goals. Regular contact and quick corrections are worth appreciating.

Brave New delivered a fresh and attractive website, which drove inquiries. The team was a focused and dynamic partner throughout the collaboration, ensuring to achieve the project goals and maintain solid communication. Above all, they were attentive and responsive in providing the best solutions.

Wordpress development - zdjęcie przedstawiające samochód

Main assumptions and start of the project

From the beginning of the project, we focused on communication and cooperation with the client’s team. Due to their broad knowledge in the automotive industry, they were a great support for us. The main objective of the project were the marketing and sales function. The website was supposed to present the offer of each brand in an attractive way and at the same time encourage individual and corporate customers to use the contact form or visit the store. In order to meet these assumptions, we paid a lot of attention to lo-fi mockups and the intuitiveness of the website in terms of UX.

 

In this case, we also decided to prepare pages based on one theme because of the case of managing the site from the admin panel. Thanks to the same sections and functionalities, SJS employees can easily manage the content of each website and are not challenged to compete with a different system for each of them. We used WordPress and ACF Pro Advanced Custom Fields.

What was the most important thing for us?

  • Best cars

    Highlighting the best cars in the customer’s fleet, such as the McLaren 570GT and Lamborghini Huracan, was the most important step in the design of the website.
  • Content search

    The content search within the blog and news subpage gives you the most matched search results for the searched phrase.
  • Division of events and trainings

    Presentation of the offer and trainings divided into individual and corporate clients according to levels of advancement.
  • Racing tracks and cars data

    Parameters related to racing tracks or cars, such as the type of surface or acceleration, had to be distinguished for each object and car.
Tworzenie sklepów internetowych - wizualizacja sekcji z lokalizacją na stronie internetowej
  • Wizualizacja strony głównej
  • Wizualizacja układu elementów na stronie internetowej
  • Wizualizacja układu produktów na stronie internetowej
  • Wizualizacja hero stron internetowych
  • Wizualizacja strony na różnych urządzeniach
  • Wizualizacja strony O nas
  • Wizualizacja sekcji tekstowej ze zdjęciem na stronie internetowej
  • Przykład responsywnego układu strony
  • Wizualizacja przyjaznego dla użytkownika układu strony internetowej

How was the work going?

Tworzenie sklepów internetowych - zespół przeglądający stronę internetową

In order for the website to meet its assumptions for each brand, we paid great attention to planning the structure of the website.

After the kick-off meeting with the client, we prepared a specification and mock-ups of the website. Already at this stage, we considered the next sites and planned a schedule taking into account the creation of the next sites. Then we started to create the design. Although the design was to be adapted to other brands, in order to streamline the work we prepared one colour version and the other pages were adjusted in terms of graphics during the coding and content adding stage.

 

Acceptance of all views was the green light for us to start coding work. First of all we created the Driving Experience website and after thorough testing of the functionalities we launched the Driving Academy and the Subaru Driving School websites.

 

In parallel with the development work, we prepared a “business card” page with links to all client’s pages and the history of SJS.

 

During the work we faced many challenges creating three websites based on one theme. Based on conversations with the client, we know that this solution will work for many companies with several business branches and at the same time those who want to manage the website quickly and easily without losing quality when it comes to user experience or visual page of the website.

Scope of work

  • UX / UI and Webdesign
  • Website coding to HTML/CSS
  • Migration of content
  • API Livespace integration with Wordpress
  • Technical support after the launch of the website

In order to fully refine the website in terms of the convenience of use, we prepared over 30 desktop views.

  • Zrzut ekranu strony błędu 404
  • Zrzut ekranu strony bloga bez wyników wyszukiwania
  • Zrzut ekranu strony bloga
  • Zrzut ekranu pokazujący układ elementów na stronie
  • Zrzut ekranu strony głównej
  • Zrzut ekranu strony ofertowej
  • Zrzut ekranu strony opisu ze zdjęciami
  • Zrzut ekranu strony z fotografiami
  • Zrzut ekranu strony kontaktowej
  • Screenshot strony O nas
  • Zrzut ekranu sekcji ofert na stronie internetowej
  • Zrzut ekranu bloków z przyciskami na stronie
  • Zrzut ekranu bloków z animacją na stronie WWW
  • Zrzut ekranu strony pojedynczego wpisu
  • Zrzut ekranu strony z formularzem kontaktowym
  • Zrzut ekranowy podstrony internetowej
  • Zrzut ekranu strony polityki prywatności
  • Zrzut ekranu strony z mapą i lokalizacjami
  • Zrzut ekranu strony internetowej z wyświetlonymi partnerami firmy

Project team

  • Katarzyna Maj

    Certified Scrum Project Manager

  • Emil Kurzaj

    UX/UI Designer

  • Maciej Warych

    Web Developer

  • Mateusz Dzida

    Web Developer