Rbb concept dego-v3

22
RIGA BLACK BALSAM GLOBAL WEBSITE DESIGN CONCEPT December 3, 2013

description

 

Transcript of Rbb concept dego-v3

Page 1: Rbb concept dego-v3

RIGA BLACK BALSAM G L O B A L W E B S I T E D E S I G N C O N C E P T

December 3, 2013

Page 2: Rbb concept dego-v3

INTRODUCTIONRiga Black Balsam new website is aimed at a wide audience and it’s mission is to form a new vision of the brand.

Riga Black Balsam today has become more modern, stylish and exquisite while keeping the unique qualities that had always distinguished it from all the other types of spirits and drinks.

Page 3: Rbb concept dego-v3

VISUAL STYLISTICSVisual characteristics of the website: ascetic, dynamic, modern.

Choosing the stylistics of the visuals we have set ourselves a mission to not only make sure it is visually appealing, modern and beautiful, but to form the visitor’s perception of the brand through the visual scenes.

Visitors get emotionally involved by means of the animated photo scenes. This technique has been chosen intentionally. The perspectives in the photo animations change in a way they don’t do in real life. This makes the viewer intrigued and interest-ed in watching them. For this reason the animations can be considered more effective in comparison to traditional video and photo materials. The length of the animation is not too long so that it does not disturb the overall exploring of the website.

Page 4: Rbb concept dego-v3

STRUCTURE CONCEPTThe basic aim of the website is to impress. Therefore its structure is designed in a way to determine the visitors take a tour through its sections.

Since the very first moment after entering the website the visitor is lead through the whole content in an interactive way. Taking this route the visitor goes through the stages of picking up the mood or the situation, watching the animations, getting acquainted with the options of the ways to consume balsams, interactive cocktail mixing meanwhile forming the desired perception of the brand before getting to the Products themselves.

The traditional approach would be to show the product line straight away but in that case we would lose the opportunity to influence the consumer’s perception of the brand. This also allows to neutralize the existing stereotypes associated with the brand for those consumers who are already familiar with it.

The visitors are not limited in the freedom to navigate directly to the desired section of the site. For these cases the site is provided with a navigation panel at the bottom.

Page 5: Rbb concept dego-v3

PROTOTYPEWe have created the website prototype and animated it to show the dynamics.

This is a demonstration model to illustrate the way we suggest approach the new Riga Black Balsam global website development. The pictures used for the prototype are taken from the internet to serve as examples of the stylistics.

https://vimeo.com/78989002

Page 6: Rbb concept dego-v3

ThE 3 SECOND PRE-LOADER

Performs following functions:

• Introduces the user with the subject of the website

• Within this time the whole content of the site is uploaded so that it works without page reloading.

Page 7: Rbb concept dego-v3

MAIN PAGE

After the pre-loader the diamond shaped picture disappears and a white shape crossfades through it. It con-tains the navigation choice of four Riga Balsam products. Below there is a traditional menu for those users who prefer to go directly to one of the site sections.

Page 8: Rbb concept dego-v3

MAIN PAGE

Pointing the cursor at one of the four product choices animates the background and the area with the prod-uct name. The background fades from black to reveal the images stylistically and semantically connected with the desired brand image. Background images give cer-tain mood while the diamond shaped area with the product name reveals the images with the product, giving the idea what the product is and what it looks like. These images are also animated within the frame of the shape.

Page 9: Rbb concept dego-v3

ThE TEASER (5 SEC)

When one of the choices is made the user sees a 5 sec animation. The teaser intro-duces the atmosphere, brings up associations, and stimu-lates self-recognition of the user. This allows us to form the desired image of the brand.

Page 10: Rbb concept dego-v3

PRODUCT PAGE

After viewing the animation the user gets to the Prod-uct page. The animation is paused, it fades into darkened image and on top of it the information on the product appears. This window contains general information, the taste description etc.

The choice menu is on the left. The user can either pick any section to go directly there or has the opportunity to scroll through all the sec-tions and by doing so view all the content.

From this point all the content is Parallax animated.

Page 11: Rbb concept dego-v3

PRODUCTS

The website also provides a second and more classical choiсe scenario for viewing the product line.

Page 12: Rbb concept dego-v3

COCKTAILS

The COCKTAIL section is based on the animated situation images where the user is sug-gested to choose one of them to proceed to the cocktails appropriate for the chosen situation.

This is necessary to empha-size the universal nature of the balsam consumption and demonstrate the variety of consumption situations.

Behind each of the images of course we find practically the same cocktails, which are se-lected by means of ingredient choice filters.

Page 13: Rbb concept dego-v3

ThE TEASER (5 SEC)

Having chosen one of the emotions the user sees another short teaser anima-tion. The teaser makes the situation more recognizable and sets the mood. Teaser functions: to hold interest, modern image of the brand, get the user intrigued.

Page 14: Rbb concept dego-v3

COCKTAILS

When the teaser is over the cocktail offer for this spe-cific situation slides in from below. The paused animation darkens and an inspiring quote appears.

Page 15: Rbb concept dego-v3

COCKTAILS

Scrolling on reveals a cocktail constructor, where the user is offered to pick his/her favorite ingredients and get cocktail recipes containing those cho-sen ingredients and based on Riga Black Balsams products

Page 16: Rbb concept dego-v3

COCKTAILS

It the user scrolls on he/she is offered to try and pick another mood and situation and see some other cocktail sugges-tions or just scroll on to see the rest of the site sections.

The site is constructed in such a way that the sections are all interlinked and she scrolling will always reveal one of the site sections to prolong the site surfing experience.

Page 17: Rbb concept dego-v3

MAKE YOUR OwN COCKTAIL

Having chosen the mood or the situation and seeing the short animation, the user then picks up the favourite cocktail ingredients and is suggested the recipes of the cocktails based on balsam and the chosen ingredients.

At picking the ingredients the lower part of the screen is filled with the cocktail list with the opportunity to see each cocktail recipe.

Page 18: Rbb concept dego-v3

TASTE

The section TASTE reveals the ingredients involved in the pro-duction of the Riga Balsam. This section is important in order to stress the fact that all of the ingredients are natural.

The execution is the following: the ingredients fly into the bottle by scrolling the browser scroll. There’s also an option of choosing one of the ingredients in order to learn more about it.

Page 19: Rbb concept dego-v3

1752 1950

1900 2000

hISTORY

The history of the brand is presented as a timeline that dates back to the year 1752 and has all the important key events marked on it.

Page 20: Rbb concept dego-v3

NAVIGATION

Page 21: Rbb concept dego-v3

TEChNOLOGY

Page 22: Rbb concept dego-v3

ThANK YOU!