January 22, 2010 at 22:01Otrivin More
At the end of 2009, on request,
we developed a project advertising the otrivin More cold remedy. Saatchi & Saatchi provided us with creativity and all the materials. The created project consists of two parts: an enticing banner and a target mini-site ( landing page ), to which the interested user should go by clicking on the banner.
An interactive banner offers to erase the stuffy city and breathe in the healing sea air. The user can do this himself, using the spray "Otrivin More".
If the runny nose has taken away all the forces so much that he can’t move his hand or mouse, then the treatment spray activates the banner itself after 10 secondsand give you a picture of the sea.
The technology of video streaming without caching was not chosen by chance. The original version of the banner fully downloaded the video clip of the sea, and then played it when you hover over the banner. The loading indicator was the outline of the Otrivin bottle, which was filled with color.
But it was necessary to realize interactivity so that the user himself could erase the stuffy city and see the sea. We considered the option of showing the user a picture of the sea while the video did not load. But this option was rejected, because at some sites the weight of the banner container should not exceed 25 Kb. So the banner was overloaded with graphics that were shrinking, an additional picture of the sea did not fit into this restriction.
Moreover, the user could move the cursor immediately after loading the banner on the site, or after any period of time. That is, it was impossible to determine the video cache time, it was necessary to show the first portion of the downloaded video clip.
The optimal solution was the following: streaming video download without a cache. Users with any Internet speed will almost instantly be able to erase the city (use the interactive). For users with a low Internet speed, at the same time, the video of the sea will slow down. If the Internet speed is normal, the user will not notice the download process.
4 seconds, we considered the optimal duration of the video clip to be looped (so that the transition at the gluing point was not so sharp) and fast loading.
Click on the bannerleads to landing page - landing page. The option with a full-flash page did not fit, because search engines needed indexing. As a way out, it was decided to make a videophone on a flash using sound.
The end result was as follows: first, the user sees a picture of the sea in the background, and after a while, the picture is smoothly replaced with a video of the sea. Sound - the sound of the surf - can be turned off using a special button (moreover, the sound does not disappear sharply, but gradually subsides).
The animation for switching sections on a page is done in javascript. The page itself is made using html + css + js + flash + video.
Using interactive, we clearly demonstrated the effect of the medicine: gave the advertising message an emotional coloring and helped the user feel the life-giving power of the sea. Breathe in the sea, Habrachelovek! :)
we developed a project advertising the otrivin More cold remedy. Saatchi & Saatchi provided us with creativity and all the materials. The created project consists of two parts: an enticing banner and a target mini-site ( landing page ), to which the interested user should go by clicking on the banner.
An interactive banner offers to erase the stuffy city and breathe in the healing sea air. The user can do this himself, using the spray "Otrivin More".
If the runny nose has taken away all the forces so much that he can’t move his hand or mouse, then the treatment spray activates the banner itself after 10 secondsand give you a picture of the sea.
The technology of video streaming without caching was not chosen by chance. The original version of the banner fully downloaded the video clip of the sea, and then played it when you hover over the banner. The loading indicator was the outline of the Otrivin bottle, which was filled with color.
But it was necessary to realize interactivity so that the user himself could erase the stuffy city and see the sea. We considered the option of showing the user a picture of the sea while the video did not load. But this option was rejected, because at some sites the weight of the banner container should not exceed 25 Kb. So the banner was overloaded with graphics that were shrinking, an additional picture of the sea did not fit into this restriction.
Moreover, the user could move the cursor immediately after loading the banner on the site, or after any period of time. That is, it was impossible to determine the video cache time, it was necessary to show the first portion of the downloaded video clip.
The optimal solution was the following: streaming video download without a cache. Users with any Internet speed will almost instantly be able to erase the city (use the interactive). For users with a low Internet speed, at the same time, the video of the sea will slow down. If the Internet speed is normal, the user will not notice the download process.
4 seconds, we considered the optimal duration of the video clip to be looped (so that the transition at the gluing point was not so sharp) and fast loading.
Click on the bannerleads to landing page - landing page. The option with a full-flash page did not fit, because search engines needed indexing. As a way out, it was decided to make a videophone on a flash using sound.
The end result was as follows: first, the user sees a picture of the sea in the background, and after a while, the picture is smoothly replaced with a video of the sea. Sound - the sound of the surf - can be turned off using a special button (moreover, the sound does not disappear sharply, but gradually subsides).
The animation for switching sections on a page is done in javascript. The page itself is made using html + css + js + flash + video.
Using interactive, we clearly demonstrated the effect of the medicine: gave the advertising message an emotional coloring and helped the user feel the life-giving power of the sea. Breathe in the sea, Habrachelovek! :)