Last year we launched the “Whalefootage” website – a site which offers beautiful insights into the underwater world. From many points of view, this was a special project for us as web agency.
Dieter Paulmann and his Foundation
Firstly, the sponsor of the project is without doubt a special person: Dieter Paulmann, Chairman of Okeanos – Foundation for the Sea, who has committed himself towards protecting the ocean and marine life.
Paulmann is not only a German businessman, but also an enthusiastic cameraman, making exceptionally high quality films in his spare time. Moreover, he has a very charismatic personality and the stories he tells of the numerous excursions he has made in recent years are captivating.
Meetings with him were often an experience in themselves. For example, he talked about one of his diving trips when he was filming, drifting on the surface of the ocean and feeling completely calm and alone. Suddenly a big herd of sperm whales approached him at lightning speed and for a short moment he feared for his life – until the herd had swum past, without harming him.
Also the story behind why he started filming the underwater world – and concentrating in particular on whales - is fascinating. Long before Paulmann had started to focus on filming underwater, he went diving in his spare time and enjoyed filming tremendously.
While he was diving one day, he bumped into a white sperm whale – just like Melville’s Moby Dick – by pure chance. It seems he is the only person who has experienced and filmed an encounter of this kind to this day. And it was this fascinating moment that made Paulmann decide to go a step further than just filming, and commit himself towards preserving the sea and sea-dwelling creatures.
As our agency had been in personal contact with Paulmann for a long period of time, at some point in time we came up with the idea of making a video archive of the extensive film material that he had produced over the last two decades.
From the very beginning it was clear to us that the internet presence had to communicate the same fascination as Paulmann does with his captivating stories. Moreover, the footage available for the web presence undoubtedly fulfilled this purpose.
The large quantity of films included not only the “Moby Dick” film described above, but also some spectacular shots of a frogfish. This fish is in reality only approximately 2.5 cm long and, in addition, very well camouflaged. As a result it is very difficult to find a frogfish. But with the use of endoscopic footage, Paulmann successfully located and filmed the fish. If you take a look at the film at the Whalefootage website, you will see that the fish looks enormous - when in fact it is tiny.
The majority of Paulmann’s films are of whales. Therefore, we settled very quickly on the website title: Whalefootage. The 0bjective was to create a video platform that made the extensive film material available free-of-charge to benefit science, i.e. universities and research institutes, other non-profit organisations that are committed to environmentalism and schools.
A video platform that is a little bit different
The rough idea of creating a “video platform” had been formed. However, as our mission was to captivate our users, we immediately decided against the standard visual appearance of photo and video platforms. These are all designed very similarly: they usually have small thumbnails and – depending on the platform – the classical “shopping basket”.
We wanted Whalefootage to remain optically as close to the image of the sea as possible. The central design idea thus arose with its integrated characteristic elements: on the one hand, full screen mode in which all the films are shown, and on the other hand, a flip-book-like navigation.
We decided to use snapshots from the actual videos to navigate within the web presence – thus the flip-book similarity. The concept works as follows: every couple of seconds a snapshot is taken out of a film scene. These individual images of scenes are then presented together like a filmstrip. This also constitutes a bar of images which can be used to navigate within the films and compresses the entire film into a type of timeline.
As the films in full screen mode are the core element of the page, we decided to make the bar disappear when the user hadn’t moved the mouse for a while. Here the ocean influences the design once again: if the user hasn’t moved the mouse for a couple of seconds, the navigation bar starts to melt away, moving like waves until it is no longer visible.
Our 0bjective was for the marine animals to take centre stage on the website. It was therefore important to present the whales, sea horses and other sea-dwelling creatures as they are and to convey marine life authentically. For this reason, we simplified the design more and more as time progressed. The focus was deliberately on the animals. With a design that had been reduced as much as possible, the aim was to maximise their impact on the viewer.
Normally, when working on websites, you work with a number of filling elements - such as various backgrounds, certain graphic elements, buttons - and focus less on one single subject. With Whalefootage we completely abandoned most of these basic elements and decided that the fascination of the seas could only be communicated using videos in full screen mode. Quite from the start, we were pretty sure that the user would understand how the page worked and how to navigate around the site, in spite of the fact that the number of design elements had been limited to only the most necessary.
Certain details were nevertheless important for the design of the website: from the very beginning the user should feel as if he is just under the surface of the water and swimming with whales and other marine animals. On the one hand, we created a design with dark, intense, blue tones and, on the other hand, the films are accompanied by the original sounds made by the animals and music composed specifically to convey the feeling of vastness and depth of the ocean.
Complex technical challenges arose from the design planned for the Whalefootage site, firstly as regards implementation, and secondly concerning the PC of the user watching the videos. A high-speed internet connection is the first requirement.
It was important to us that the films could really be enjoyed in full screen mode, and therefore touch the viewer emotionally. This meant that the film had to play with the quality of a DVD at home, without interruptions due to studdering and loading.
Typically, at existing video platforms the video takes a while to load before the actual films starts and the viewer has to wait. In addition, the user can only view the section of the film that has already been loaded and is therefore not entirely free to select the scene that most interests him at that time and that he really would like to see.
For this reason we selected another method – true streaming. This means that we have a server in the background, enabling us to substantially economise on loading times. This is especially important as the use of the “flip-book” element as navigation tool is only effective if the viewer can jump arbitrarily to any point in the film at any time, without reloading for long and, above all, without interrupting the film playing at that time.
The work on the Whalefootage site is not yet complete. The sound design, in particular, is still to be differentiated further. At the moment we have one single sound theme for all the videos. We have tried to select music which – like the images – conveys the vast expanse of the ocean. However, we are currently working on creating individual sound themes adapted to the various species that feature at the site.
In the future, the music will vary according to the tempos and characters of the animals. A huge, heavy whale will have a more dignified and solemn sound due to his sheer size. In comparison, small, scurrying shrimps and sea horses will be assigned a more rapid sound theme.
But, of course, it’s worth taking a look at the website even now. If you are interested in diving with the whales, just go directly to www.whalefootage.org.
About the author, Peter Reichard
Peter Reichard has been working at Scholz & Volkmer since 1998. In his position as Executive Technical Director, he is responsible for the conception and implementation of web and multimedia applications for clients such as Mercedes-Benz, Coca-Cola, Leica Camera or Swarovski. He is in charge of the quality management, the cooperation between technology and design and supervising the frontend and backend solutions for the agency’s clients. Having studied Industry Design at the Technical College in Darmstadt, Peter started his career in 1998 as a designer at Scholz & Volkmer. Peter’s particular interests lie in the visualisation of real-time data and multi user applications.