Blog 3 Pt. IV

4. Design a metadata matrix that presents the vocabulary terms and relationships.  You need only present accepted and variant terms in an accompanying controlled vocabulary database (there is no need to develop extensive synonym rings or explode the vocabulary to include broader and narrower terms).  (Search the Internet for examples of how to create a metadata matrix.)

Metadata Matrix:

Listed below is the website Metadata Matrix for the site along with the controlled vocabulary terms. This is listed in order to assist in controlling the vocabularies database. These variant terms will be particular useful for users whose first language is not English, as the site and all content/services is available internationally.

Vocabulary

Description

Examples

Maintenance

Members

Site visitors who have created an account

Login

Moderate

Audience

Type of users the website will appeal to most

First time visitors, experience travellers, students, elderly, businessman

Easy

Page Type

Type of page on the website

Booking pages, information pages, member pages, home page

Easy/Moderate

Specials (details and price)

Provides updates on current specials on various pages

New Flight/Group/Cruise/Car Hire limited offers

Challenging

Search

Users able to index the website for keywords

Search: Groups, Flights, Airlines, Locations, Hotel Name, etc

Challenging

Flights

Details related to flights and the bookings

Airline, Departing and Returning Dates, class, number of people

Moderate

Cruises

Details related to cruising and bookings

Cruise line, departing and returning dates, suite type, number of passengers

Moderate

Car hire

Details related to car hire and bookings

Car hire company, model and make of car

Moderate

 

 

Controlled Vocabulary:

Accepted Term

Variant Terms

Hotels

Accommodation, Resorts, Motels

Search

Index, Find, Locate

Subscribe

Sign Up

Reviews

Testimonials, Reports

Specials

Updates, exclusive deals, limited offers

Car

Vehicle, Bus, Vans

Flights

Tickets, Plane

Departing

Leaving, From

Returning

Arriving, To, From

Groups

Packages, Teams

 

Blog 3 Pt. III

3. Create a series of low/medium fidelity wireframes for the main pages of the web site.  This should include at the very least, the web site’s home page, a content page and a navigation (or search page).  (Refer to Morville Chapter 12 for how to create wireframes.)

We will now look at wireframes of each of the different site pages and how they will (preliminary) laid out and arranged. These are the wireframes for the following pages: Flight Booking, Car Hire Booking, Cruise Booking, Hotel Booking, Contact Us, Customer Reviews, Insurance Information and Signing Up. When considering these wireframes, note the consistency throughout and the visual appeal the site provides to its users.

The site will be compatible in all browsers though it must be noted the site is optimized for desktop browsing and is not yet catered directly to mobile users. These are again, prototype pages not reflecting precisely how the pages will be laid out. Simply click on any of these images in order to see a full sized copy of the respective image.

Book Sketch

Flight Page: This page enables users to check available flights and then book and purchase tickets. The page utilities drop dead menus and traditional user input with each component of the site being correctly labelled for indexing and readability purposes.

  Cruise2

Cruise Page: Similar the the flights page, this page enables users to check what cruises are able to be booked in a designated time-frame. Once selected, a description is generated containing all of the details regarding that cruise. The details are entered following that and once submitted via the “Book Now”, the booking is either made or the user directed to the Log-In / Sign Up page. Note the use of available screen real estate and consistency with the Car Hire and Hotel bookings pages.

Contact Sketch

Contact Page: Listed on this page are the details in the event users wish to contact the agency via the described methods. This will be presented in plain text with a large and clear font size as well as being positioned in the center of the screen again, for readability. In addition to this plain text, a submission box is presented allowing the users if they desire, to contact the agency via email directly without the use of third party software (i.e Microsoft Outlook, Gmail Clients)

CarHire

Car Hire Page: The car hire page is structured very closely to the cruise line booking, with the exact same generating content based of user selected though with a different set of details entered.

Customer Review

Customer Reviews Page: The review page is kept intentionally simple as it allows the user to focus on the content they intend to submit. Cluttering the page with unnecessary data and features would only impact the site and associated reviews negatively. Presented on the page are a scrollable area displaying the previous testimonials, a  text-input box with a scrollable bar (if the text exceed the designated length) with a name box and submission box.

Group Sketch

Group Page: The group page is structurally differently to the other website sections as it is exclusively a content-presentation page. The page will only show details (updated regularly) of current group specials, using both text and imagery. Online group booking could be potentially problematic as each passenger of the group may require different schedules and itineraries.

Home Sketch

Home Page: Presented to the users upon opening this sitel, with the exception of the site template, it greatly differs from the other pages. It is divided into four separate sections with current specials (Groups, Flights, Cruises, Hotels, etc), a travel video tailored specifically to the site, imagery tailored specifically to the site and a History and About Us regarding the company and agency.

Hotel Sketch

Hotel Page: Designed in a similar fashion to the Cruise/Car hire pages with only the booking specific details differing (i.e. Suite Type). Again content is generated based off the users selected from the list, the list is generated based off the data inputted on the left hand side of the page (Country, Town, State).

Insurance Sketch

Insurance Page:  Divided into two sections, the first component provides a list of suitable agencies and the estimated pricing per passenger while the second component describes why a user should invest in insurance despite it not actually being needed in order to travel.

Sign Up

Sign Up / Login: Divided into two segments, which the user selects based on whether or not if they have an existing account the user enters requested information (DOB, Name, etc) and then submits the information and checks either the registers database to see if they have an account registered or create an account and add it to the database.

Below is a sample of what the websites home page will look like once correctly coded, uploaded then viewed in a desktop browser.

Sample of the Home page (index.html) when viewed

Sample of the Home page (index.html) when viewed

Blog 3 Pt. II

2. Construct blueprint diagrams illustrating the structure by which a user will interact with your web site’s components.  It is important to include arrows to indicate flow between various sections/pages of the web site.  Provide descriptions of the diagrams showing how the user will interact with your web site.  Describe what form of navigation it is (e.g., contextual, index terms, etc.) and what type of browsing it supports (e.g., hierarchical, polyhierarchical, etc.).  (Refer to Morville Chapter 12 for how to create blueprints.)

As the below diagram illustrates, the user will be presented with the site Home Page and from there they can select which area of the site to navigate to. The top navigation bar provides the most commonly access areas while the bottom navigation bar provides them with the less commonly used such as the Contact Us and Linked In and Facebook external pages. A search bar is consistently present on all site pages to allowing indexing and an effortless way to browse and search through the sites content.

The website follows a hierarchical structure with the home page being the “hub” of the website with the booking components linking to the Sign Up/Log In page. This Sign Up/Log In page, once data has been submitted, accesses the Member database and if approved will accept the user or create them respectively.

The site applies nearly entirely global navigation throughout the site which each page being able to be reached regardless of current location. This global navigation however, does not apply if the user is directed to one of the external sites as a new tab displaying the desired page will appear.

The use of the large and prominent heading links on the navigation bar is what allows the site to be classified as global. The selection of global navigation in comparison to local or contextual was intentional as travelers can use multiple services in succession if desired (i.e. they want to book a flight then hire a car from the airport). An advantage of this is the user has no need to go back throughout previously revisited pages which could prove potentially problematic in a booking system as well as allowing ease of access and site navigation though this isn’t to say that it is not possible to navigate further up the website hierarchy via this method.

Blue Print

Simply click the image to view a full size version

Blog 3 Pt. I

Design a web site about something that you like (preferably business or educational in nature).  The web site must be of a small to medium size (no less than ten pages). 

1. Describe exactly who the anticipated audience is, and how the particular characteristics of this audience will affect the design and implementation of your web site.  You must be very specific.  Outline the target audience’s characteristics such as gender, age, demographics, and socio-economic background.

Introduction:

For this component of Blog 3, I have selected a Travel Agency with online components allowing users to book various parts of their journey requiring only access to a browser of their choice. This site design must reflect both professionalism and ease of access allowing any user from the target market to perform the sites core function as easily as possible.

The site provides the ability to book: flights, hotels, cruises and hire a car as its primary services. In addition to these services, users (satisfied or dis-satisfied) can leave feedback on the site courtesy of the Customer Reviews section and also access related information such as Travel Insurance amongst others.

Target Market:
As an online travel agency, a particular target market is difficult to narrow down. This is due to the fact that people from a wide range of demographics require travel services as opposed to one specific sub-group of people. With online agencies and booking become more and more popular in the modern age, the target market could range from teenagers to the elderly though admittedly older customers may prefer to go to a physical store to receive face-to-face interaction. Therefore it is a fair assumption that while the site can be accessed by all demographics to the same standard, the site focuses primarily on young adults to the middle aged with no specific gender particularly targeted. In terms of location, as website users from any part of the world can access and utilise the site so there is no specific geographic requirements, although Australians are more likely to stumble upon the site compared to users from the opposite side of the world.

The visitors have no educational or even technological requirements to meet with the exception of being able to at some level, use a browser and possess basic computer skills.
The website can be used to book services both domestically and internationally therefore this allows all users regardless of their income and financial status (i.e. simply booking a cheap flight to Sydney or a first class ticket to London) to utilise the services of the agency without their finances dramatically impacting the decision.
Based off this information the target market (note this is the target market, the sites visitors are by no means limited to these few types of users) can be safely said to include:

  • Experienced/Inexperienced Travellers
  • Young to middle aged adults
  • People from all locations
  • Mid-high level of income
  • Students and business orientated users
  • Both individuals/families and groups requiring travel (i.e. Sports teams)

Site Layout:

The website design largely reflects the sites target audience, featuring a simplistic layout that makes great use of available screen space. The site doesn’t overcomplicate with unnecessary features which will benefit both experienced and infrequent travellers equally.
The colour scheme aims to achieve: a visual appeal to all users, remain consistent throughout all site pages and also not distract from the core site services. The background of all pages will feature a Blanched Almond-esque blending with a white gradient. Applying large and easily readable black headings and text on all pages ensures that each element of the site can be easily viewed regardless of who is viewing it.
With this colour scheme and layout in place, this also allows users to view the website on a variety of different devices including laptops, desktops, phones and tablets.

Each page of the website is navigated via the simply clicking on the appropriate section with each being labelled accordingly. This navigation bar will remain on each page allowing the user to travel throughout the site as they please.

The overall site-layout strongly resembles websites that operate a similar service, this therefore allows a visitor to automatically know where to go and how to use the site based off prior experiences with these types of sites.

ANS-0001-TRL free-web-template-exotic-travel-agency