When do I redesign my site?
What is a website redesign? Site redesign, a kind of plastic surgery of an existing site: the design of the site is updated, but the content of the site is…

Continue reading →

Cufon-custom font on the site
Cufon-non-standard font on the site. Sooner or later, when developing a layout, there is a need to use non-standard fonts on the site. For example, the customer wants the site…

Continue reading →

5 tips on how to control the user's attention on your site
Some details on your site are more important than others. There is nothing wrong with this – just a fact. The "Buy now" button is almost certainly more important than…

Continue reading →

Case study: how NGN Agency created the website design for the 100th anniversary of Citroën

Citroën celebrated its 100th anniversary this year. Citroën’s main office has prepared several large activities. For example, The citroën Origins digital Museum was opened, where you can view all the models produced by the manufacturer during this time.

NGN Agency covered this event in Ukraine. At first, the Agency planned to simply translate the Museum’s content, but abandoned the idea due to complex administrative processes. The following ideas were dropped due to cost. The brief contains the line “the idea should be implemented by the Agency’s internal resources”.

Stas Stoyatsky is the creative Director of NGN Agency.

In the company’s blog on Medium, Stas Stoyatsky explains how they finally came to the idea of the project:

“I am subscribed to many communities of photographers. One evening, in a Facebook feed, an interesting visual technique caught my attention. It recalled the visual effects from the movie Inception (“Beginning”). Then I found its name-droneception. there is a lot of high-quality content in Google and Pinterest. I thought it would be cool to integrate local views with the Citroën car in the foreground, reinforcing this with a message about the century.”

Then the work went on: we finished the idea, painted the ecosystem, found manuals for creating droneception, found the drone, and checked the functionality of the layout.

Droneception-a method of gluing several images into one, which gives a surreal effect. The drone rises at one point and takes pictures in the desired angle, then all the pictures are collected in one photo.

“There was a moment when we thought about it. Stas continues. – “If everything is so cool, perhaps this technique has already been used in advertising?”We started googling again, but we didn’t find anything. Probably, the Citroën100 project is the first use of the droneception technique in global advertising.”

Shooting
Oleg oleksiuk is the leader of Citroën’s SMM projects.

Oleg oleksiuk tells how the shooting took place:

Read also: a Selection of cool UI content for the past week #21
“We studied the manuals and on paper it was not so difficult. But there were several restrictions that made it difficult for us to work. For shooting, we had to decide on locations, wait for clear weather, preferably without strong winds, and do the shooting itself at dawn, when there are no cars on the roads. There was no way to block traffic.”
Initially, it seemed that the most difficult aspect would be aerial photography. But all the basics were mastered in two test shootings. The real challenge was the weather conditions and the choice of location.

The places chosen from the ground perspective look completely different from a height of 140-150 meters. The team checked and studied data from Google Maps, but not all satellite photos of locations were up-to-date.

“During the preparation phase, we selected a longlist of locations that emphasized the character of the three Citroën models. We reviewed them ourselves and approved the final list with the client. However, when implementing them, everything had to be changed.”

We considered various locations: parks, embankments, squares, and highways. Somewhere it was impossible to drive a car, somewhere there was too busy traffic. As a result, we chose other places: Darnitsky bridge is almost empty at five in the morning, and in Vorzel and nearby we found places where there are few people on weekdays.

“This summer’s weather was particularly disturbing-it was constantly changing. One day we went out for a test shoot and instead of the promised sun, we got caught in a downpour.”
Shooting itself is only a small part of the process. Then the process of editing the photo into the final visual begins. Some locations had to be changed or re-shot due to technical defects or a large number of parts that were bent in the General plan.

It was important to take the picture in a few minutes: while the sun was in one position. The team did several takes to get the same shadows, the pattern of clouds on the earth’s surface, and the intensity of the lighting when stitching.

Read also: Photography: how to learn to see light
Processing
Vitaly Gorenko, art Director of NGN.agency.

Vitalii Gorenko talks about the process of treatment.

“We received several gigabytes of rough photos of locations and separate photos of cars, because it was not physically possible to shoot everything at the same time. A lot of time was spent on gluing locations, we had to find an aesthetic deformation of the landscape and integrate the photo of the car into the foreground.”

The most difficult from the point of view of design work was the Darnitsky bridge-the location for the new Citroen C4 Cactus. This place is overloaded with power poles and railway tracks.

“In parallel with shooting droneception, we developed a landing page. For simple projects, we have been using Tilda for a long time. And here we decided to experiment with Zero Block to get a unique result.”

Nordic UX: how minimalism looks Scandinavian
Scandinavia has never been known for luxurious forms. The same sentence is true when it comes to UX – the basis of everything is minimalism. Minimalism is a "calming" solution…

...

5 tips on how to control the user's attention on your site
Some details on your site are more important than others. There is nothing wrong with this – just a fact. The "Buy now" button is almost certainly more important than…

...

8 anti-trends of web design 2019
There are many web design trends that have recently been popular. But just like trends in fashion design, they tend to become outdated and become anti-trends. In this article, we…

...

Professions of the future: who is a technical designer?
Often there are disputes between developers and designers – which of them plays the main role. Ask this question to the HR Manager, and you will get an answer like,…

...