Prototype Pack

For FestivalMap: www.festivalmap.net

Introduction Evaluation Architecture Design Technical/Build References Appendix

1. Introduction

FestivalMap is a dynamic database-driven web site that aims to facilitate the needs of music festival lovers, who are seeking to find information on music festivals across the globe. The web site encompasses festivals from the UK, Europe and the world. Users can register to the web site, which gives them permission to access a whole host of features, including the ability to add their own reviews, upload their own photographs and message other members. The special feature of the web site is a map, that lets the user plot their own data, such as their preferred destination of travel, the time they have off, and their favourite genres of music and artists. This data is then queried by the database and presented in an attractive manner on a world map, created using Adobe Flash. The user can then click on the locations throughout the world, to find out more information about the individual festivals, as well as giving them the option to purchase tickets, which aims to facilitate the web site, financially.

This prototype pack aims to establish the technical processes that were initially laid out in the Project Specification Report. It is divided into five primary sections. Section 2 contains research and quantitative data that will be useful when designing both the architecture and the aesthetics of the web site. Section 3 is the web site architecture that includes detailed structural charts, process flow diagrams, and the restrictions and permissions that users will have. Section 4 is primarily composed of screenshots that present how the web site will look aesthetically and the web page template layouts, and evaluative text that will explain and rationalise these design decisions. Section 5 contains examples of the relevant coding languages and technical solutions that the web site will utilise.


2. Evaluative

2.1. Introduction


A questionnaire was developed and published online to gather initial quantitative research about the specifications and Internet use habits that the target audience would be using. There were 66 responses; and the data gathered provide some useful analytical information which is covered in more detail (along with charts), in the next three pages. A copy of the questionnaire is attached in Section 7. Appendix.

2.2. Questionnaire


Q1. This question was asked to see what the most popular operating system that the target audience was using. Clearly the two most widely used were Windows and Mac. To ensure that web browsers display content without aesthetic differences or even errors, the web site will be tested for functionality on these two major operating systems. The preferred way to accomplish this is to design with OS neutral code. This means avoiding Internet Explorer-specific and Windows XP-specific code and ActiveX controls, (HHS, 2006) .

Results for Questionnaire Questions 1, 2, and 3

Q2. The size of a viewers monitor is of great importance both from an accessibility and visual standpoint. As monitor technology has progressed, 800x600 resolutions have become much less widely used. Therefore, the web site, should be optimised for 1024x768, which is currently the most widely used screen size. It is also important that the CSS code produces a liquid layout that stretches to the current user’s window size, (Nielsen, 2006) .

Q3. This question was asked to see if a large enough amount of users would benefit from having SFX in the Flash-built FestivalMap feature of the web site. 94% of the people questioned have sound installed on their computer, which means that sound can be implemented into the FestivalMap feature as an added benefit.

Q4. The results were not surprising, with Internet Explorer, Mozilla Firefox and Apple’s Safari being the three most popular. Different web browsers display XHTML and CSS code differently. Having three different browsers so heavily used means it is extremely important that valid code is used so the web site keeps a consistent-feel throughout different browsers.

Results for Questionnaire Questions 4 and 5

Q5. This question was asked to see how many people would be viewing the site without a broadband connection. Only 5% of people had a connection speed less than 512kbps, which is a sufficient enough connection to browse the web site in. 85% of people had a 1Mbps connection or greater which means that the web site can utilise high-quality photography and illustration, and the intention to have videos of festival experiences embedded into the festival web pages is still a workable realisation.

Q6. This was a crucial question as if a large amount of people did not have Flash Player installed on their computer, then they would not be able to view and use the functionality available to them via the FestivalMap Flash application. Thankfully 95% of the target audience has it installed. However it will still be important to integrate a ‘Download Flash player’ link surrounding the application, so users who do no have the software installed can download it for free.

Q7. This was an accessibility-orientated question to see how many viewed web sites with images disabled, or via a screen-reader or browser that had no functionality to display images. Although a very high percentage browse the web with images enabled, it is still important to add ALT tags to images that give text descriptions of the image, which is pivotal for those who cannot view images.

Q8. This was a marketing based question, trying to analyse the most popular social networking/web 2.0 web sites that were visited by the target audience. This is useful data as the most popular web sites (Facebook, Digg, del.icio.us, and StumpleUpon) can all benefit from having bookmarks on the FestivalMap web site. This is a free, yet successful way in driving traffic to the web site, as it raises awareness of the web site on other sites.

2.3. Initial Focus Group


A formal focus group took place in the early stages of development for the Prototype Pack. The group comprised of 8 persons, male and female, between the ages of 15 and 50. This initial focus group concentrated on establishing the web sites initial design, by providing critique on design elements such as site layout, typography, photography, illustration, and logo design. Some initial site mood concept graphics were shown, so the site personality (look and feel) could also be analysed. The observations and comments provided a great aid to establishing the developed web site template designs, shown in Section 4. Design.


3. Architecture

3.1. Introduction


It is important that a web site must have a strong structure and a hierarchy of links as the architecture governs the navigational interface of the web site, and moulds the user’s mental models of how information is organised (Web Style Guide, 2004) . Search engine spiders, are also more likely to rank a web page higher if it has content that is well structured.

This section is divided into four key areas. In Section 3.2., the permissions available to the different types of user are made apparent. This is important because as well as registered user’s – FestivalMap also has a three-tier login system; administrators who have every ability available; editors who can access the majority of features, and journalists who have some powers, but their main role is to add new content to the web site.

Section 3.3. displays the tables that the FestivalMap database will use. This is an important feature as the fields of data must be given the correct DataTypes and set up properly, to help aid the ColdFusion and SQL queries that will be needed to power the content on the front-end of the web site.

Section 3.4. contains the web site structure charts for both the front-end and back-end. It is also colour coded to help distinguish between important features and abilities.

Lastly, Section 3.5 shows some process flow charts, which are an example of the types of data movement that occurs within the architecture of the web site.


4. Design

3.1. Introduction


It is important that a web site must have a strong structure and a hierarchy of links as the architecture governs the navigational interface of the web site, and moulds the user’s mental models of how information is organised (Web Style Guide, 2004) . Search engine spiders, are also more likely to rank a web page higher if it has content that is well structured.

This section is divided into four key areas. In Section 3.2., the permissions available to the different types of user are made apparent. This is important because as well as registered user’s – FestivalMap also has a three-tier login system; administrators who have every ability available; editors who can access the majority of features, and journalists who have some powers, but their main role is to add new content to the web site.

Section 3.3. displays the tables that the FestivalMap database will use. This is an important feature as the fields of data must be given the correct DataTypes and set up properly, to help aid the ColdFusion and SQL queries that will be needed to power the content on the front-end of the web site.

Section 3.4. contains the web site structure charts for both the front-end and back-end. It is also colour coded to help distinguish between important features and abilities.

Lastly, Section 3.5 shows some process flow charts, which are an example of the types of data movement that occurs within the architecture of the web site.


5. Technical/Build

3.1. Introduction


It is important that a web site must have a strong structure and a hierarchy of links as the architecture governs the navigational interface of the web site, and moulds the user’s mental models of how information is organised (Web Style Guide, 2004) . Search engine spiders, are also more likely to rank a web page higher if it has content that is well structured.

This section is divided into four key areas. In Section 3.2., the permissions available to the different types of user are made apparent. This is important because as well as registered user’s – FestivalMap also has a three-tier login system; administrators who have every ability available; editors who can access the majority of features, and journalists who have some powers, but their main role is to add new content to the web site.

Section 3.3. displays the tables that the FestivalMap database will use. This is an important feature as the fields of data must be given the correct DataTypes and set up properly, to help aid the ColdFusion and SQL queries that will be needed to power the content on the front-end of the web site.

Section 3.4. contains the web site structure charts for both the front-end and back-end. It is also colour coded to help distinguish between important features and abilities.

Lastly, Section 3.5 shows some process flow charts, which are an example of the types of data movement that occurs within the architecture of the web site.


6. References

Online Articles

HHS. (2006) ‘Design Using Most Common Browsers and Operating Systems’
http://www.hhs.gov/web/policies/webstandards/iestats.html [Date accessed: 28/12/08]

Nielsen, Jacob. (2006) ‘Screen Resolution and Page Layout’
http://www.useit.com/alertbox/screen_resolution.html [Date accessed: 28/12/08]

Web Style Guide. (2004) ‘Basic information Structures’
http://webstyleguide.com/site/basic_structures.html [Date accessed: 30/12/08]

7.2 Sources:


Photography & Illustration

http://www.fordesigner.com/maps/1211-0.htm
http://www.sxc.hu/gallery/duchesssa
http://www.sxc.hu/gallery/haloocyn/2
http://www.sxc.hu/photo/937720
http://www.sxc.hu/photo/933791
http://www.sxc.hu/gallery/marxus
http://www.sxc.hu/gallery/nookiez


7. Appendix

3.1. Introduction


It is important that a web site must have a strong structure and a hierarchy of links as the architecture governs the navigational interface of the web site, and moulds the user’s mental models of how information is organised (Web Style Guide, 2004) . Search engine spiders, are also more likely to rank a web page higher if it has content that is well structured.

This section is divided into four key areas. In Section 3.2., the permissions available to the different types of user are made apparent. This is important because as well as registered user’s – FestivalMap also has a three-tier login system; administrators who have every ability available; editors who can access the majority of features, and journalists who have some powers, but their main role is to add new content to the web site.

Section 3.3. displays the tables that the FestivalMap database will use. This is an important feature as the fields of data must be given the correct DataTypes and set up properly, to help aid the ColdFusion and SQL queries that will be needed to power the content on the front-end of the web site.

Section 3.4. contains the web site structure charts for both the front-end and back-end. It is also colour coded to help distinguish between important features and abilities.

Lastly, Section 3.5 shows some process flow charts, which are an example of the types of data movement that occurs within the architecture of the web site.