Case: development of the Car of the year award website | Creonit
Car of year
autogoda.ru

Car of year

Car of the year in Russia — Annual national award

Project launch date — December 2015

Situation

"Car of the year" project is a project with its own magazine, an annual prestigious award, and a website. In 2015, it became obvious that it was time to adapt the site to mobile devices. There was also a problem with the design — it didn't match the magazine's corporate style.

Aim

Our task was to make the site adaptive, create a design that would match the corporate style of the project, work on the main page and add new sections: "Test drives" and "brand Days".

Planing and designing 

The main page was designed as a "breeding" page — the editorial staff has a lot of interesting ideas, new formats are constantly appearing. And two big activities: the award itself and car ratings. Therefore, it was decided to make it fully customizable from the admin panel: so that the content editor can select blocks for the main page, change their places, and create new ones.

At the same time, the main page displays a dozen blocks: projects, news, brand days, contests, videos, test drives, interviews, blogs. We designed the grid in such a way that the reader will not get bored when scrolling through the page-the blocks are made in the same style, but they look contrasting with the neighboring ones.

UI/UX design

We took into account the main style requirement and brought the site design closer to the current brand book of the company. We gave up the dark background, dark tones in principle — everything is easy, light, and clean, almost like in the cabin of a brand new Land Rover.

Corporate colors, blue and red, are used to highlight links and buttons, so navigation is also in the General style.

Some of the pages were redesigned, and some were designed and created from scratch. In addition to the main one, these are the "Test drives" and "Brand days" sections.

So that users can go to the desired section at any time, we added a hamburger menu — it appears and sticks to the top of the screen if the user scrolls down the site.

Technical implementation

So that the site editor can easily configure blocks on the main page and in sections, we used 1C-Bitrix info blocks — and added a bunch of unique functions on top. For example, when adding a new section, the editor not only selects its location on the page and changes the content, but can also choose any of the grid options.

It turns out a flexible and functional "constructor" of the page inside the Bitrix administrative panel. Simple, familiar, and convenient.

800
hours
24
layouts
6
people in a team

We also completed another important task-we made an adaptive version for mobile devices. Blocks are rearranged, the top menu changes from horizontal to vertical, and reading content are just as comfortable as on the desktop.

Eugene Amirova
Editor-in-chief of the siteа autogoda.ru
Eugene Amirova

We worked with Creonit on several projects and were generally satisfied with the work. Together, we implemented a redesign of the main site, as well as work on creating promo sites for special projects. During the work, both the customer's wishes were taken into account, and alternative solutions were proposed by Creonit specialists. Distinctive features: loyalty, desire to help and solve the problem, professionalism, and timely reporting on projects.

Thanks for your attention

Let's discuss your project
Alexandra Shevchenko
Account manager
Alexandra Shevchenko

We will receive your request and send you an offer within 24 hours with an approximate estimate of the development cost and clarifying questions. After that, we will call you and discuss the project’s goals and requirements. And let’s get started.

Let's discuss your project
Alexandra Shevchenko
Account manager
Alexandra Shevchenko

We will receive your request and send you an offer within 24 hours with an approximate estimate of the development cost and clarifying questions. After that, we will call you and discuss the project’s goals and requirements. And let’s get started.

Microblog