Online Platform for
West Bengal Tourism

User EXperience · INTERFACE DESIGN
The proposal
As part of an interaction design module in NID, we had to identify a commonly used website, understand its key users and their pain-points, and propose an alternate experience.
A web-based tool to make the discovery of travel opportunities in Bengal inspiring, engaging and interactive. The proposal also aimed at a simpler and more logical segregation of information on the site.
2016 · 2 weeks · National institute of design
The project brief
The challenges of the existing platform
The existing website for West Bengal tourism, as observed at the time, housed an overwhelming amount of information presented in a stressfully disorganised manner.
While the content captured was thorough, it was difficult to parse and consume.
Planning for travel, actively or passively, should be inspiring, informative and an overall positive experience. This sentiment was getting lost in the way content was segregated and arranged in the current platform.
Deep-diving and identifying pain-points in the current website
The very first stage of the project was to actually thoroughly understand the existing platform by attempting to perform a wide range of tasks and workflows that a user who's either 'deciding' or 'decided' to travel is likely to go through. The highs and lows of the experience were recorded in form of an excel sheet.
Scoping down to a primary area of focus
Restructuring information and a new site map
For this project, I took a call to focus on the early stages of 'discover' and 'plan' during travelling.
Other than scoping the project to an area of focus, the information presented on the site was
re-evaluated and reorganised to arrive at the new site map for the same.
Wire-framing
Based on the new site map wireframes were created to chalk out the user journey and its key milestones.
While created concepts, the intent was to:
· Craft an interactive map tool that knows where you are, allows free exploration.
· Provide concise information in quick, easy steps.
· Let hardworking micro-elements provide rich information.
Visual & brand language
The imagery combined with the system of category colours and micro-elements scales across not just the website, but communication media and marketing as well.
Crafting a visual & brand language that is functional yet bespoke of Bengal.
INFORMATIVE · ENGAGING · ENTICING
The visual language combines functionality with enticing, engaging photographic imagery featuring West Bengal to inspire and excite.
‍
Microelements
DESTINATION ELEMENTS
visitor origin pin
All the destinations were divided into 6 collections based on destination type as well intent type. Each of these 6 categories has a colour code that manifests in cards treatments, pin treatments and more.
While a bunch of elements were used across the destinations, the visitor pin located the user's place of origin and gave information accordingly. If the user is in Delhi, and looking to travel to Darjeeling in West Bengal, the visitor pin gives travel times from Delhi to Darjeeling.
Destination cards
Destination cards across different categories - mountains, forests, beaches, history, culture and religion.
The concept
The final concept uses an interactive map based tool supported by rich visuals to discover and get info on travel destinations in Bengal.
To make the whole experience of discovering destinations engaging, inspiring and informative - an interactive map of West Bengal was used, coupled with rich curated imagery of West Bengal. The user can click on different on different points on the map to discover places of travel.
Key workflows
Examples of the new information architecture, important user journeys and how things work in the proposed website.
⟵ Redefined IA
The proposal relooks at the entire information architecture and segregation in the site.
The new sections were:
· Discover (Interactive database)
· Destinations (Flat database)
· Bookings
Discover ⟶
The focal call-to-action button 'Discover Bengal' takes the user to the interactive map tool.
This interactive map can be used to discover places, get quick relevant information and plan.
⟵ Origin of travel
The map tool auto-locates the user's location to give contextual information related to travel origin.
In case the detected location, is not where the user plans to travel from, it can be changed by clicking on the origin pin.
Interacting with the map ⟶
The user may explore different places by hovering over the different map points.
The colours of these points are inherited from the category they belong to.
⟵ Contextual information
On clicking a point on the map, the user is presented with quick information and relevant visuals.
The following changes occur:
· Destination place card appears.
· The background image changes.
· The origin pin changes to display relevant information.
Categories ⟶
On the left, the list of categories are available for easy access and quick filtering.
If the user clicks on a category, the map shows destinations only from that category.
⟵ Detail pages
Each destination or place card leads to the detail page of that place.
Detail pages are one-stop information hubs for everything a visitor to the place would need to know ranging from popular sights, getting there, stay, food culture and other places around.
Learnings & reflections
USER JOURNIES
Contrast and readability
A nifty method we learnt as part of this project was mapping user journies of a diverse set of users as a quick way to empathise with users' needs, understand pain-points and identify opportunities for delight.
Readability of text and typography need extra careful consideration when combined with images. Images have a spectrum of colours, and it's imperative to make sure text is always legible and accessible.
CLEAR affordances
BALANCING SIMPLIFICATION
Affordances are properties of an element that indicate how a user may take action with it. The affordance of the points on the map in hindsight could have been clearer and more comfortable to interact with.
While the original site had a dense and complex information architecture, the proposal had an IA that was perhaps over-simplified. It's important to understand the context and display the right amount of information the users may be seeking at any stage.