Web Programming COSC2413/3052 Assignment 1
Overview (you must read this first)
You are to attempt this assignment individually OR in a group of TWO (recommended). No more than two.
You will use HTML5, CSS & JavaScript to author the client-side part of a website. The server-side implementation of the website will be completed in assignment 2.
The tasks are divided into four parts: PA (Pass), CR (Credit), DI (Distinction) & HD (High Distinction).
The DI & HD section tasks will require self-research, you will not get straight answers in the course material. While we are happy to assist you on those tasks, most of the work and research must be done by you. This is done on purpose to prepare you for future work and the rigours of the IT industry. Also, in order to achieve DI and HD, you must show your weekly progress to the instructors of the course. More details on this will be released later.
If you find a specification open to interpretation, post a query identifying the specification in the corresponding discussion board for assignment 1. Software development in real life does not come with a definitive roadmap and flowcharts complete with instructions. More often than so, it is the job of the developer to clarify requirements from the client. For the purpose of this assignment and course, the lecturer is considered as the client.
All of us have been affected by the unfortunate COVID-19 scenario and its aftermath. It is often hard to concentrate and study; but as a student enrolled in this course, it is your responsibility to regularly attend lectorial, lab and consultation session(s).
Bring your questions to online discussion board, consultation sessions
Watch the online recordings on a regular basis if you cannot attend the live sessions.
Do NOT start the work on assignment at the last minute.
Do NOT ask for last minute extensions, these are often rejected. Extensions can only be granted for personal and medical reasons, provided you can supply some evidence.
Learning Outcomes
This assessment relates to all of the learning outcomes of the course which are:
understand modern languages, constructs used on the Web (such as HTML5, Advanced CSS, JavaScript)
explain the functions of clients and servers on the Web, and describe the strengths and weaknesses of the client-server internet approaches to web design and implementation
program, access, and manipulate data through the adoption of accepted standards, mark-up languages,client-side programming, and server-side programming
design and implement an interactive website(s) with regard to issues of usability, accessibility and internationalisation
Assessment details
Health and well-being are two very crucial aspects for happy living, and now more than perhaps ever it has been challenging to find a healthy upkeep and balance of it in our lives. In recent times there have been increasing levels of self-reported stress and anxiety by communities in Melbourne, with many of the reports identifying the likely main cause as the recent pandemic or social media over-consumption and idealisation.
According to research done by a local council in Melbourne, the wellness industry itself has grown rapidly over the past few years. People are looking for ways to decompress, relax, and focus on mental wellbeing. In view of that the local council would like to commence a digital wellness website known as LIFE (Living It Fully Everyday). The program on the website will manage stress, and lead the user down the path of becoming a more mindful and productive individual.
LIFE will include ONLINE services as:
Yoga
Meditation
Stretching
Healthy Habits
Note: Weight training and gymming are not a part of this program!
Having decided to discuss the needs around this website, the committee at the council has realised that they totally lack the necessary skills and in-house experience. However, after a series of acrimonious meetings they have decided to engage a local contractor to design and build the LIFE website. You are that contractor!
Consequently, prudently and sensibly they have decided to start off slowly and gradually build the whole site in two stages. The first stage will involve: HCI (Human Computer Interaction) analysis and construction of the client-side components of the website. In order to avoid the cost blow-outs, care has to be taken from the start to meet user demands and expectations. This includes the user interface design and how a user feels about interacting with your site (hence HCI).
Tasks
Note: in order to proceed to higher parts, you must complete all of the specifications in the lower part, you must not cherry pick specifications from various parts. As an example, complete all of the specifications in the PA part before proceeding to the CR part and so on.
PA part [16 marks]
Create a single PDF document, call its HCI_Analysis.pdf. No other name and format (.txt,.doc, etc.) will be accepted. You will get a ZERO for this part for changing the name and format. Answer the following (tasks a-c) :
a.(2 marks) Which links must be placed in the navigation bar? Justify your answer by providing examples. Be realistic in your answer as you will have to program these features as a part of website creation. Your answer should not exceed 1-2 page(s).
b.(2 marks) What kind of content should be placed in the main content area of the website to facilitate the wellness of clients? Justify your answer by providing examples. Be realistic in your answer as you will have to code these features as a part of website creation. Your answer should not exceed 2-3 pages.
c.(2 marks) Suggest an alternative (to the one shown on page 2) layout for the website. We expect at least one or two reasonably significant modifications to the provided design. You will need to draw a well-labelled diagram of the new layout. Consider the features of HTML5 and CSS3 that might help in creation of this layout. Analyse the layout considering the points such as: ease of use of the website, how user-friendly the layout is? & is the layout easily editable or extended in future (this is important as clients change their needs, requirements and thought process and website layout needs to be altered for future versions)? Your answer should not exceed 1-2 page(s).
d.(2 marks) Suggest and explain four ways to make the LIFE website accessible. Be realistic in your answer as you will have to code these features as a part of website creation. Your answer should not exceed 1-2 page(s).