20 March 2013

Overview

Excursiopedia is for a social market place of various activities and tours all around the world. Travelers and locals can get connected with private guides and tour companies in the world, to find and personalize their own individual tours.

Background

I've been roped in to re-design a couple of components on their website, the homepage being one of them. The current homepage is as follows, design was probably created over 2 years ago :

Excursiopedia Landing Page Re-Design - image 1 - student project

The 7 important elements of the page:

1. Headline

Start your own adventure NOW! - The biggest activities & tours collection.

Sub headline: Find and book over 6500+ tours and activities in Paris, Lisbon, Prague, Berlin, Munich, New York, Barcelona, Rome, Florence and more than 900 further cities.

2. Call to Action

The user of the website would be typically looking for some tours or adventures in his locality or a place one's going to travel soon. The section above the fold should consist of a search form that allows user to look for tours or activities. The criteria for the search should include - Location, date, no of persons.

A case maybe a person is not interested in searching, so it might be a good idea to display some random activities from the location of the person or around from some famous places in the world.

3. Features & benefits:

Personalized, tailor-made

Book in advance - helps to save the end minute hassle

Explore & discover

4. Credibility

Featured in: The Moscow Times, TechCrunch, Tnooz

5. Social Proof

I'm thinking of including some reviews done by the previous cutomers. Yet to look out for them!

6. Risk Reversal

I'm not sure if this would count as a risk reversal but - "Our prices are final consumer prices and include all costs and fees for your activities, you get what you book."

7. FAQ's

How does it work? Start, Search, Connect & Book, Share & Review - Probably, a briefing of each of the points.

------------------------------------------------------------------------------------------------------------

22 March 2013

Wireframe

Version 1 - a very quick rough draft

Honestly, I'm not really that comfortable with the wireframes. So probably the next part, I'd go around with is the UI Design in Photoshop. Let's see how I figure out the next part!

------------------------------------------------------------------------------------------------------------

25 March 2013

Inspiration

I always begin by looking at some competitor’s websites which help me learn a lot (I believe it's a good idea to 'pick' pros & cons of something that's already deployed). As the saying goes - "Learn all you can from the mistakes of others. You won't have time to make them all yourself."

The following are might be great examples of landing page, but there are elements that I like and intend to 'inspire' my design from:

I like this! The main heading - Book and experience when you travel, stands out. Eyes follow to the search box next to the "Book things to do in..." with a small pause at the offer in the right lower corner.

Excursiopedia Landing Page Re-Design - image 3 - student project

They have done it fairly good! They heading with the risk reversal message is great. The subscription message - “subscription $0, it’s free" makes it pretty convenient for the user to know that there are no hidden fees.

Excursiopedia Landing Page Re-Design - image 4 - student project

The images section beneath "Our most popular rentals" also attracts me. I like its UI design in general.

The images in this one have the name along with the person who added and the time frame. Probably I can use the same scheme for the activities and tours section in the Wireframe.

Excursiopedia Landing Page Re-Design - image 5 - student project

I love the text on this one, so clear and crisp! It's probably the most popular project on Dribbble.

Excursiopedia Landing Page Re-Design - image 6 - student project

Most frequent source for the inspiration images: http://www.dribbble.com/

------------------------------------------------------------------------------------------------------------

27 March 2013

I'm working on the UI design, currently. Here's a sneak peak of the progress so far. I've been making a few additions to the copy side by side, as well.

Excursiopedia Landing Page Re-Design - image 7 - student project

Skinning of the search bar functionality ...

Excursiopedia Landing Page Re-Design - image 8 - student project

------------------------------------------------------------------------------------------------------------

28 March 2013

MOCK-UP

Here's the final mock-up. The images in the features section look out of the whole color scheme (I've reused them from the older version). I will probably be creating some new ones very soon.

See full large version here.

------------------------------------------------------------------------------------------------------------

Any kind of feedback is welcome. Please feel free to share your thoughts! :)

Surpreet Kaur Sains

Graphic Designer, Artist, Enthusiast at Heart

10

7