Assignment 1 – Global Homework Experts

CSC10214 – Assignment 1 1
Assignment 1
Due Dates:
Part A: (design documentation) 11pm Friday of Week 5.
Part B: (final products) 11pm Friday of Week 7.
Produce design documentation and develop web-based interactive content in accordance
with UX design principles.
Part A – Design Documentation:
You are required complete design documentation to meet the client brief options provided
below. The documentation is to be submitted as one Word document and should include
the following:
• A clear indication of which of the theme options you have chosen and a description
of how you have interpreted the theme.
• at least one storyboard for each web content
• a link to your wireframe prototypes in Moqups, Balsamiq, Mockingbird or other
wireframe product
• any additional design details appropriate to demonstrate your final product
Part B – Final Product:
Develop the web-based interactive content as per your design documentation.
You should include at least 3 pages with appropriate navigation to allow the user to move
between the pages. Your web content should be placed on the html pages in accordance
with UX design principles and should demonstrate your design skills and include appropriate
use of text, graphics, animation and interactivity.
Client Brief:
You are required to create an interactive online storybook. The book should contain six
interactive content elements (with animations), include at least one of each of the following
standard sizes:
1) Horizontal banner: 600 pixels wide x 90 pixels high;
3) Vertical banner: 160 pixels wide x 600 pixels high;
2) Button 1: 125 pixels x 125 pixels;
4) Button 2: 180 pixels wide x 150 pixels high;
5) Custom 1: suggested 320 pixels x 50 pixels;
CSC10214 – Assignment 1 2
6) Custom 2: suggested 300 pixels x 250 pixels.
The first (home) page should include a table of contents and navigation should be provided
between the pages. Your content should be included on at least 3 other html pages. You
may have more than one content element on each page if you wish, or a page for each
content element.
You should include:
• sounds which enhance your design appropriate for your chosen theme, including at least
one voice-over which you have recorded yourself.
• graphics such as boxes, lines and other background as appropriate for your chosen
• additional headings and text if they are appropriate for your chosen theme.
You must demonstrate your ability to create the following feedback, interactions and animations:
• Buttons and/or links added should provide feedback in the form of visual change (e.g.
on rollover) and sound (e.g. subtle click)
• Objects growing larger or smaller
• Objects moving around the page/canvas, e.g. from left to right, up and down, etc.
• Objects changing colour
• Allow users to interact with the content with the mouse, either by clicking or rolling
over content to trigger further animations
Theme Options:
You may choose from any of the below themes. Note that your book does not have to tell an
actual story and you will not be marked on any story. You will however be marked on
consistency of your pages in line with your chosen theme.
1) Stick figures
2) Letters and/or words – animated letters of the alphabet
3) Maths – numbers and/or geometric shapes
4) Cartoon – characters from graphics provided, or of your choice (make sure you have
permission to use them and reference them!)
5) Animals – zoo or pet shop characters
6) A journey (can be a holiday, or travelling to a new country)
Development Milestones:
• Designing appropriate screen layouts using storyboard techniques to show animation,
media, user interaction, and content placement (Week 5);
• Interactive web content interface design showing suitable graphic design (Week 5);
• Animation using a variety of animation techniques (Week 7);
• Variety of text and graphic elements providing information (Week 7);
• A variety of techniques to display information using custom interaction. (Week 7).
• Final content displayed appropriately within an html page (Week 7).
CSC10214 – Assignment 1 3
Marking Criteria:
Part A: Design Documentation (10%)
✓ appropriate documentation to deliver to a client
✓ appropriate details for each content storyboard;
✓ listing of all media to be used;
✓ description of purpose/objective;
✓ details of all user interactions required;
✓ purpose/use of animations;
✓ purpose/use of visual/aural feedback;
✓ appropriate details of navigation or links used.
✓ appropriate creation of wireframes for demonstration to a client
Part B: Interface, Text, Graphics, Animation, Final Product (20%)
✓ balance of individual elements on the screen (text, graphics, animations);
✓ consistency of look/feel between content elements;
✓ appropriate use of fonts and text media
✓ appropriate use of aural/visual feedback;
✓ appropriate naming conventions of resources;
✓ appropriate use of animation techniques;
✓ animations suit the purpose of the screen;
✓ suitability for web deployment;
✓ use of specified content dimensions;
✓ incorporation into html page;
✓ demonstrated understanding of UX concepts.
You may use other people’s code in your assessment, but it is imperative that you
acknowledge that it is not yours. The inclusion of a comment indicating the source is all that
is required.
For example:
/* *****************************************************
Original source code by or from
Modified by on
****************************************************** */
Include any modified code in between lines like this – which helps to identify your work:
/* ******************** Modified ***************************/
your code goes here
/* ******************** end modifications ***************** */
CSC10214 – Assignment 1 4
Choose a theme to tie your web content together (or at least some of them). This has the dual
benefit of presenting a “unified” set of content, and potentially reduces the work load in
development because some of the resources are being used several times across the web
Screen Space (Screen Real-Estate)
Animation moving across your content will only be effective if there is sufficient space to do
so. For content that has a “small” real-estate area, animation will likely be reduced to “image
swaps”. Design your layouts and animations according to the content sizes.
You are allowed to have fun. Although there are many practical and technical aspects of the
design and development process that must be adhered to, there is ample scope to be creative,
artistic and imaginative with respect to the selection of content, and how you choose to
present this to s

order now


Comments are closed.