Learning outcomes covered by this assignment:

1. Discuss the suitable types and format of interactive media.

2. Understand industry standards and current approaches to implementing interactive applications for the web.

3. Interface an interactive application with a database using server side scripting.

Scenario

You work for a multimedia development agency and you have been awarded a contract to design, implement and evaluate an interactive application for an online music store. The interactive application must allow users to interact with a database. A full specification of requirements for the application is provided below.

The client has approved your initial designs and now wishes you to implement your design

The client wishes you to develop the application, according to the requirements provided below, using HTML5 and CSS3 so that it is compatible with two different mobile phones.

• You must interface with the database that has been provided using PHP.

Use these programs XAMPP and Adobe Dreamweaver.

Requirements:

Must have:

• HTML should be HTML5 and structured accordingly

• Styling must be CSS3, written in a separate file and linked to the HTML5 document

• All pages must be converted to PHP and run on a local web server

• All links must use a relative linking structure

• App must contain an offers page displaying the current special offers only available to logged in members

• App must contain a products page listing the products on sale

• App must contain a login page

• Layout is suitable for viewing on a mobile touch screen device (such as an iPhone)

• Site connects to and retrieves data from a database using PHP (database provided)

Should have:

•The user should be able to browse for music by genre

• All content (e.g. images) should be in an appropriate format suitable for use on the web

• App has a consistent and reasonable colour scheme

• App has a consistent and intuitive navigation structure

• App uses client side scripting to provide informative user feedback

• Shopping cart functionality

• Layout should be fluid and work with different sizes of screen

• App makes use of the HTML5 canvas tag

•app contains a more detailed individual product description page

Could have:

•The products page displays album artwork

• App incorporates search function or page

• Mobile specific additions such as iPhone splash screen, home screen icon, full screen display

• Website achieves WCAG Level A compliance

• App makes use ofHTML5 events

• Uses the HTML5 Canvas tag for animation

• Logged in users are able to submit reviews for albums

• User can preview tracks using html5s media features

• Interface is tailored to a specific device dynamically through the use of media queries.