Application Design II - Lectures and Tutorials

Week 01 - Week 14

Ahmad Firas Bin Ahmad Fisal | 0345121

Application Design II | Bachelor of Design (Hons) in Creative Media

Lectures & Exercises

---

INSTRUCTIONS

Week 01:

Task 01

- We are allowed to proceed with the final project with an entirely different application than the one being done in App Design I. However, it's going to take longer. Self-evaluate the previous work give a reflection on it and describe what needs to be changed.

Task 02

- We are required to show the animations and transitions that we would want to implement in the final project.

Task 03

- This is where we finally create our animations and it is advised to group our tasks so that we don't miss out on things that we are supposed to design. Important components are made here and MVP of the application should be decided and produced already.

Week 01 - Reflection is done on the UX laws and Nielson 10 heuristics and how we understand it.

Identify the problems, give the solution, and show!

Final project - We need to complete screens only that complete our MVP.

Week 02: 

The human-centred mobile design approach 

- Asses

- Understand

- Define

- Differentiate

- Sketch

HTML/CSS Recap 

Sir provided us with a sample of wireframes that we are supposed to replicate as the activity for HTML/CSS Recap. He gave us time to figure out on our own how to copy the loading page regardless of where we got the solution from. It can be from the Google, W3Schools, or ChatGPT. 

He started by going through the files and organisation tips when starting a coding project. After, it was then ready to start building the first frame. The media attached below will be my HTML view:

HTML overview

Moving on to attaching the CSS to the HTML code via CSS Designer, I was able to code CSS on a separate file instead of doing it in the same HTML code file to avoid confusion. It is after all a good practice, it is only recommended for coders to do CSS inside the same file with HTML if it's only a minor styling. Images below are the working view of the CSS tab, however, it is separated between two methods where it produces the same result at the end of the day.

CSS overview

This is a separate method where Sir is demonstrating in the classroom after waiting for the rest of the students to try on their own first

Sir's Method for CSS

Week 03: Javascript

This particular week, we are learning about Javascript (JS). JS is necessary for developers to build interaction and complexity into their applications. It could be seen as the one that controls the animation and brings life to your static HTML/CSS.

Week 04 - Week 08: Absent due to the death of a family member, Lecturer was not around, and Independent Learning Week.

Week 09 - Week 14: Classes approach is beginning to change to consultation-heavy to give way for final project buildup or any upon-request tutorials only.