Application Design: Final Project

11/12/24 - 3/1/25 // W12-W16

Mercy Chong HuiZiun // 0360929

Application Design II // BDCM
Final Project & E-portfolio

This may contain: watercolor painting of pink and yellow flowers


Instructions
 
Fig 1.0 Module Information Booklet  


Final Project (30%)
Students will synthesize the knowledge gained in tasks 1, 2, and 3 for application in task 4. They will create an integrated visual asset and refine the prototype into a
complete working and functional product experience for 1 task flow.

App Prototype recap



Progression
From what I've left off in Task 3 where I get to code out my chosen app's interactivity and animations etc using HTML, CSS and Javascript/GSAP. Now to further refine this app and complete this whole app flow from the previous 6 components that I chose, I decided to focus on improving some parts and then combine them altogether as a completed app layout.

Here's a screenshot recap on each of my components I've made in my previous task. 


What to improve
  • Pages layout to be in phone screen size instead of web size.
  • Better animation effects.
  • Combining all the components into a single app page. 
Progression

I compiled the HTML, CSS, and also the Javascript in one working project and I did it in Visual Studio Code. I imported the icons and images directly from Figma to this file so it won't clash with the previous separated files of these components.







Final Outcome


 

Reflection

Initially I thought that this task I would be able to finish it faster but it was the opposite. In fact, I've spent a little too much time solving the coding errors and struggled a lot in managing the page transitions and clickable buttons. The process can be kinda daunting to me but having that sense of accomplishment not just because I'm done with this task but also that I actually made it work and came so far learning a lot more about Javascript. Though it may not be the exact idea of how I wanted my app page to be but I'm grateful that I get to learn more about coding and the pain of coding :p Sir was pretty helpful in class as well while doing tutorials and gave us a recap on HTML/CSS eventhough I didn't grab the chance to consult him frequently but I did learned much from sir. It made me understand more on how app design actually works not just the UI of it but the functionality as well.   




Popular Posts