Websites:  Main German
1.0 2.0 3.0

The making of the Gazprom website 3.0

Overview• Process

Looking at the visitor analytics for the current website and talking to the client. Coming up with primary user role and interests.

Defining priority tasks that the third version of the website will solve. Deciding to make the presentation of official information more graphic and devote more attention to Gazprom operations.

Starting the makeover with the press center. Finding out the priority of sections, comparing with the existing structure and reworking it with new data in mind.

Designing the section based on the updated structure and styles of the existing main page. Thinking of ways to make searching for information in the huge array of events and press releases easier.

We get the idea to present the materials in a chronological feed, connecting them with tags for convenience.

Adding tags to the search. Considering a filter of events by years.

Creating the layout grid.

Working on the photo albums in the media library.

The art director and the client approve the mock-ups. Starting to typeset.

Beginning with the main page. Making the existing structure similar to the press center grid.

Deciding to introduce Gazprom operations with large banners that go with the event feed. Coming up with ideas for banners.

Everyone likes the design where the banner goes fully under the event feed.

Trying various approaches to presentation of projects on the main page.

Deciding to go with a simple solution and continuing the search for metaphors for banners.

As we discover new ideas, we keep showering the main page with metaphors and visualizations.

Assembling a prototype to work out the fine mechanics.

Moving on to the feed. Apart from news, it also has to feature a fixed set of predefined dynamic blocks.

Working on adaptability.

Selecting four primary banners for the main page of the newly opened website.

Simultaneously working on the variety of internal pages carefully moving the contents of the existing website into the new wrapper.

Typesetting. Fixing bugs.

Thinking of a way to make the news feed on the main page more exciting and attractive. Coming up with various styles for news blocks.

Getting the client’s final approval. Launching the website.