Saturday 23 November 2013

Brief 3 // Iconic Cities // Web

Along with the actual printed travel guide, there will be a website, which acts as an extension to the travel guide. This will include all the information that the guide has to offer, but have more too. It will expand upon the information on the basic information section within the guide and give a more comprehensive guide to each city.

To start the design of the website, I planned out the pages of the website, by simply using block shapes and colours to identify the different sections and how it will be laid out overall. To display the website designs I have created the design as a screenshot of each page, this way you can see the full design as the website will scroll up and down. This communicates the design better and shows the full design of each page.
The design of the website is centered around visualising each city. This uses alot of images to convey the city in the best way possible. The design of the website is set around the use of 4 columns, within these 4 columns different sized tiles will show images which link to different sections of the website.
The website is split into 4 sections; cities, forum, shop and cityspace.


The home page, first presents the user with the top section of the design, here you simply search the city destination you want find. By scrolling down the page, the user will be presented with the latest cities added to the website. 
This also shows the design of the four column design which runs through the website. 


The cities sections gives information about each location, but this is again split down into different categories.

Once the user has searched in a city from the home screen they are presented with the city overview page, this shows images from all categories you can refine the city down to - these are listed on the left. Also reviews of others travellers to the city are shown on the left. 


From the overview of the city the user can refine the search by using the categories on the left hand side. This presents the next page, which for this example I have used the sights category. Again the attractions are set out within the tiled four column design. This shows a small image and information about each attraction within the city - not all attractions are shown, it is the top attractions. 


Once the user clicks on one of the sights they are presented with the full information for that sight. This presents a large image with a full description of the attraction. On the right hand side in the blue column, there is information about the attraction, this includes information such as location, address, opening times, cost. 

These three screens show the main use of the website and how the user will flow through the website and use it to get the best results. 

The others sections are, forum shop and cityspace. The forum is where users can go to ask questions, or post information to other travellers etc. This is designed as followed; the left hand column lists the most popular threads within the forum, which when selected brings up the thread in the main content area of the page. The user can also use the search bar above the main area to find other threads within the forum. 


The shop sells the products of the travel company this includes the travel guide, a travel pack, luggage tags and posters. These would all be made up from the main travel guide which has been designed. The posters are the title pages of each city within the guide. 


The final section of the website is cityspace. This is personal section for each user which registers with the website. If the user registers with the website they can save the different information to their own personal space. When they log into this space they can view all the different information they have saved, this can be viewed in various ways. The user can also use this space to plan a visit to one of the cities, which basically creates an itinerary for them from the things they have saved from the city. This can then be printed or shared with friends through social media sites. 

This page is presented when the user logs into their cityspace. They are presented with an overview page, which shows there recently added information. 


Below is the design of each screen is better detail so you can view the design of the website in more detail.

No comments:

Post a Comment