DIGM707 - Assignment 2: Website Development

Website Development

Task Overview

You are to produce a 5-6 page website using Webflow. The website must cater to a fictional product or service.

Course Learning Outcomes Assessed

This assignment relates to the following course learning outcomes:

● Plan and produce a website that follows sophisticated web communication standards.

●    Evaluate requirements for audience targeting, content organisation, technical production, user experience, and site evolution.

● Choose and apply appropriate techniques for site design in accordance with usability and UX principles.

● Plan, produce and embed rich media assets for deployment on the web.

Time Commitment

Approximately 5-6 hours per week outside of class time

Suggested Procedures

Note: the following must be completed as per the Specifications listed below

1.  Analyse TWO websites that demonstrate good practice in web design and use the information found to influence the

planning ofyour website. (One may be close in purpose to your intended site).

a.  Use concepts and theories discussed and explored in class to back up findings.

b.  Analyse key components of the website.

c.  Include any critiques you may have.

d.  Discuss what is working, how it demonstrates good practice in web design, and how this may influence your own planning and strategy.

2.  Submit your research by the Friday, 03 May (Week 8) due date

3.  Create a proposal and plan for your website

a.  Your proposal and plan must include the requirements listed under the specifications below.

b.  Focus on documenting your development process.

c.  Make use of iterations and feedback as you go along to show the progression, exploration, and development of initial ideas.

4.  Submit your proposal plan by the Friday, 17 May (Week 9) due date

5.  Produce the 5-6 page website using Webflow.

a.  Create a Webflow account

b.  Select the appropriate SITE plan that caters to your needs, note that this is a paid for service so that may be a consideration you need to take into account.

i.  Basic or CMS recommended based on your websites needs. The Free version is limited but can be used if your website needs allow.

c.  Begin creating your site using the universal 'Base desktop' settings on the top bar of your workspace - this

ensures your site is responsive - i.e. responsive settings are mostly automatically applied, it's always best to check this as you go as some elements/sections may not automatically inherit appropriate responsive properties and require some manual adjustments to be made.

6.  Employ your knowledge of HTML & CSS from assignment one to appropriately and effectively build your website.

7.  Demonstrate practice of learned concepts and theories you have researched.

8.  Implement the strategies you have outlined in your plan.

9.  When the site build is complete, publish your site.

10.  Include a link on the front/first page of your planning document.

11.  Include the link above the Browser test screenshots as well.

12.  Carry out a Browser Test (see this Browser Test example) (https://canvas.aut.ac.nz/courses/17521/files/5191724/preview)

(https://canvas.aut.ac.nz/courses/17521/files/5191724/download)to make sure all the components of your site build are working and responsiveness is appropriate.

13.  Create a screen recording ofyour full site - the recording must showcase all site features and demonstrate any interactions, animations, and movements.

14.  Compile a Reference list (https://canvas.aut.ac.nz/courses/17521/files/5191763/preview)-

(https://canvas.aut.ac.nz/courses/17521/files/5191763/download).

a.  Include all media used - e.g. images, fonts, etc.

b.  All media MUST be self-made or CC licensed - see Canvas resources for where assets can be obtained.

15.  Download the files checklist [link] to check you have all the files you need to submit.

16.  Place all files in one folder named “SurnameFirstname-DIGM707-A2”.

17.  Submit to Canvas.

Specifications

1. Research

●   Analyse TWO websites that show best practices in web design and use the information found to influence the planning of your website.

-    Introduce the website - take stock: who, what when, where, why, how...

-    Identify key components of the website and analyse them in relation to learned concepts and theories.

-    Consider business objectives and user goals.

-    Compare and contrast findings.

-    Due Week 8

-    Refine and develop if needed, indicate any changes made to formative submission - based on Week 9 checkpoint submission feedback

2. Plan

● Create a plan for your own website.

● The plan document must include:

-    A proposal outlining the business, purpose of the website, target audience, objectives, and goals

-    A concise plan of the site's purpose, site structure, styling choices/branding, user research, content outline, and other key developments and/or components.

-    Wire-framing (include key iterations, annotate where necessary)

-    A style guide

-    A prototype

-    Usability testing (at a key and purposeful stage of development)

-    Include your Site URL in your planning document

-    Due Week 10

-    Refine and develop if needed, indicate any changes made to formative submission - based on Week 11 checkpoint submission feedback

3. Create

●    Produce the site using Webflow. Your Webflow site must use appropriate box model layouts, be grouped consistently, and use code customization.

● Choose the CMS or Basic site plan to create your Webflow site.

● Your site must include:

-    5-6 pages including a homepage (utility pages do not count towards the 5-6 pages).

-    a Functional form.

-    The use of CMS features if and where appropriate

-    Consideration and/or use of a site search function and customized search utility page (if applicable)

-    a Customized Error 404 page or redirect (utility page)

-    Use of custom classes & animations/interactions

-    a Custom site name (e.g. yoursite.webflow.io)

4.  Browser Test

● A single pdf document that contains screenshots of every page ofyour website on two different browsers.

●    Note the browser version and operating system version. For example: Tested in Chrome 68.0.3440.106 (Official Build) (64-bit) on Windows 10 enterprise.

●   Screen Recording of the site - recording must showcase all site features and demonstrate any interactions, animations, and movements.

5.  Reference List

●    Please complete the reference list word document (https://canvas.aut.ac.nz/courses/17521/files/5191763/preview)

(https://canvas.aut.ac.nz/courses/17521/files/5191763/download)listing all the resources you have used in the creation ofyour assignment.

6.  Submission

● Submit through Canvas

● Ensure all files are named correctly.

● Check that all the specifications above are completed.

● Final Submission Due End of Week 13