Time to Look Deeper — See Dungeness

A UI case study for a tourism campaign

The Brief

We were given 3 weeks to create an advertising campaign for a destination of our own choice. The campaign had to achieve the following criteria:

  • An engaging and impactful brand campaign that promotes tourism on the country/area and target audience you selected.
  • A strong visual brand identity and a responsive website creating engaging, impactful, predictable and well-designed experience for the users and optimised to meet business goals.
  • Establish a consistent visual identity that carries through different marketing and promotional materials.
  • Create a logo for the campaign that captures the direction, mood, tone and audience you will be capturing.

Tools

Pencil, paper, Sketch, Invision, Principle, Adobe Creative Suite

Introduction

The first part of the brief was to select the place that I wanted to promote. I wanted to choose somewhere that was slightly different and perhaps not always considered a ‘normal’ tourist destination. I wanted to find somewhere that had a uniqueness to it that is often over looked and so I chose Dungeness on the South East coast of England.

Aerial view of Dungeness

It is a small area of headland that consists of the largest single expanse of shingle in Europe. It has a rich and diverse wildlife that is unique to this part of the country. It is also home to a third of all the plant species found in England and an important refuge for migrating bird species. There is an RSPB nature reserve close by that attracts many bird and nature enthusiasts. Juxtaposing against this rich and diverse environment is an eery, almost otherworldly side to Dungeness. There are not many inhabitants who live there and the ones that do mostly live in old fisherman’s houses and dis-used lighthouses. There is a nuclear reactor situated close to the town that provides a sharp contrast to the natural beauty of the surroundings. It is a place of contradictions and contrast. The harsh edges of the buildings play against the flowing calmness of the surrounding environment which together creates a unique atmosphere that you can only experience by visiting yourself.

User Persona

The next step in my process was to create a user persona that would allow me to target my campaign for a specific audience and identify their unique and individual needs and requirements.

User Persona

Meet Alex Bell. He is a photographer from Bristol who travels a lot for work and spends a lot of time away working away from home. He has visited many places around the world and has spent time in most major cities. Since he spends so much of his time travelling, when he has time off he likes to relax at home and doesn’t like to go too far. Being a photographer, he is interested in local cultures and things that are often off the beaten track that can inspire and influence his work. He looks to visit places that don’t involve too much travelling and that offer something a bit more unique away from the tourist crowds.

The WHY

After creating my user persona I moved onto thinking about my ‘why’. I thought about how this advertising campaign and website might make people feel about Dungeness and what things might be a pull factor for them. My user persona, Alex, is looking for an experience that requires some time to appreciate a places unique qualities. This led me to my why:

To inspire people to look deeper and experience unconventional places.

This helped me to come up with the tag line of my campaign:

Time To Look Deeper, Dungeness

Moods

I began exploring moods around Dungeness by first creating a design inception worksheet. I came up with the following nouns that described the mood:

  • Brutal
  • Isolated
  • Wild
  • Nature
  • Juxtaposition
  • Surreal
  • Beauty

I initially created 2 moodboards that explored different aspects of Dungeness. The moodboard on the left looked at the natural landscape of Dungeness and the diverse wildlife. It evokes feelings of calmness and serenity. The second moodboard explored the more jarring side. It looks more at the architecture and angular edges of the landscape. It was interesting to see the two different moodboards juxtaposing against one another and how this reflected the real experience of Dungeness.

Moodboard 1+2

I also created a third moodboard that combined the previous 2 moodboards and allowed me to see how the 2 directions sat against one another. The third moodboard also took some inspiration from artists like Richard Diebenkorn who often painted seaside landscapes with strong architectural elements. The third moodboard started to give me a better idea of how the visual language might be developed. I wanted to create a language that spoke to the juxtaposed nature of Dungeness that puts the jarring lines of the architecture against the natural, poetic beauty of the landscape.

Moodboard 3

Visual Language Experimentation

Exploration

Final Style

Style Tile

Typography

I chose to use 2 fonts for the final style. The first one was ‘GT Sectra Display’. This is a serif font that is very legible when used in larger sizes. Being a serif font it carries nice details which I thought worked well with the idea of beauty but it also has another side to it’s character. It has some very sharp angles on some of the letterforms that makes it feel like it’s almost been cut out from paper. I felt like this played well with the idea of juxtaposition and the way in which buildings seem cut into the landscape.

The second font I chose for the body text was ‘Akkurat’. This font was chosen because it is easy to read at smaller sizes being a sans-serif. It also has a slightly ‘obsure’ side to it that makes it seem slightly industrial. I felt like this worked well with the character of Dungeness and worked with the nouns that I explored in my inception phase.

Layout

I wanted to find a way to combine the natural beauty of Dungeness with the angular architecture and somehow meld the two into one. By using a layout grid and then overlaying different elements of the page within this grid, I have managed to create an organised but dynamic layout that can support information and text yet also appears visually interesting and engaging. Different elements of the page slightly overlap one another to create depth and intrigue.

Colour

The main two tones that I chose for the colours were yellow, black and white. I chose yellow because it evokes feelings of life and nature and plays to the natural side of Dungeness. To contrast with the yellow I chose black because it stands very strongly against yellow and creates a really bold, intense contrast that makes the yellow stand out even more than against any other colour. I also chose white for most of the display text since it would be very legible and easy to read.

Branding+Logo

For the logo design I started of by making some initial sketches. I began by exploring the juxtaposition of nature and the jarring architecture. I wanted to bring out the harsh 3d edges against flowing lines. I explored using the capital ‘D’ as a 3d structure and various graphical ideas of the natural landscape like flowers and waves. It didn’t seem to be capturing the essence of Dungeness so I tried to look at it from a different perspective and thought about the landscape as an abstract idea. I thought about how Dungeness feels from afar and how it is very flat and desolate, yet from that comes these sparse, geometric monoliths that jut out from the horizon. This lead me to exploring the idea of a line as the horizon with a building emerging from it. I felt like this captured the essence of Dungeness quite nicely.

Interactivity

I wanted the site to bring together all of the different elements of Dungeness into one and give a feeling of the otherworldliness of the place. On the homepage I used a collage of different places you can visit around Dungeness that created a nice tiled effect. Added to this, I put in a very small parallax effect that moved with the mouse so that it creates a blending of the different elements.

All Screens

All Screens

Prototype

Principle Prototype

Responsive Design

For the responsive versions of the site most of the elements remained the same for the tablet size, except they were scaled down slightly to maintain the correct spacing of elements on the page. For the mobile versions of the site, I created 2 different layouts, one in portrait and one in landscape. In portrait mode, the sub-nav bar that is usually visible would disappear and this information would be moved into the burger menu. This because of the limited width available. When the site is viewed in landscape on a mobile device, the sub-nav menu would be returned.

Responsive Design

Advertising Campaign

For the advertising campaign, I chose to advertise the brand through Instagram and Banners on travel agency websites. Through Instagram, the campaign would be targeted to the correct user audience and based on the user personas. Banner ads would be targeted at travel, art gallery and cultural website. The image that I used is to captivate the user and make them engage with the advert. From here, the strap line would spark their curiosity and hopefully lead them to clicking through to the campaign website.

Instagram ad
Banner Ad

I also created advertising for a bus stop and a train station. These ads would work well placed here since people will be travelling to and from work and they will pass by these quite frequently and will have travel on their mind.

Bus Stop Ad
Train station Ad

Merchandise

I chose to create a sketchbook with the ‘See Dungeness’ caption and logo embossed onto the front cover. I chose this as my marketing merchandise since the whole idea of the marketing campaign was to take time to look and experience something that would require you to engage and be involved in yourself. I imagined it might be nice for a visitor to make some sketches of the things they have seen on their trip or perhaps create a diary entry of their day. It would give them a life long memory of their trip that held a part of Dungeness as well as their own interpretation of the area.

Sketchbook Merchandise

Conclusion

  • It would have been nice to be able to create the content for all of the other pages in the site and see how I could play with the layouts on each page.
  • I didn’t put too much consideration into the ‘Book Your Trip’ section of the website and it would have been good to think about how this part of the site would work.
  • After showing the prototype to a few different friends I got some valuable feedback on things that they would find interesting to have. One of these was a distance indicator on the map page. It would have been good to have some kind of route planning that you could use on the map to plan out your day so you could get an idea of how many things you could see in the amount of time you had to spend there.
  • Overall I was really happy with the outcome of my travel campaign and I felt like I captured the essence of Dungeness in my visual language. I really enjoyed creating a whole campaign to go with my initial idea and it was a good challenge to see how my art direction could be changed to suite different formats and variations.