App Design II / Final Task

05.04.2023 - 5.07.2023 (Week 1-Week 14)
Esther Vanessa/0350751/Bachelors of Design (Hon.) in Creative Media
Application Design II
Final Task

FINAL TASK

For our final task, we finally will build our previously redesigned app on HTML, CSS and JS. So for starters, I had to build everything on HTML and CSS. 

Here are some of the screenshots when working on the file. This time I used SCSS to allow me to nest classes into each other, that's why if it looks a bit different that's because I am not using regular CSS. Using SCSS is much easier although some classes I have to keep repeating the properties. I was quite surprised in total there was almost 2000 lines of code on both css and html. 




After finishing it, I worked on the GSAP. GSAP was pulling my hair out because even after learning, I still have some problems when working on it alone. Turns out some elements just has to be absolute and move it around. Once you get a hang of it you can actually do the work fairly easy since it's just repetition. Although I got caught with a problem and could not do one of the animation I really wanted to do, therefore I just compromised with myself and removed the animation as a whole. I regretted that but I know I had to compromise. 

When exporting, I followed Sir Razif's tutorial to be able to export to PWA (manifest and adding an icon) and add it to my homescreen in my phone. Looks pretty neat. 





Here's the final app. Open it with your phone or set the screensize to 393px wide. 

Here's the presentation.






FEEDBACK

-


REFLECTION

Ah. I felt like I spent too long working on this one. This was supposed to be the easiest out of the rest of my modules. Lesson learnt is that you should not underestimate. I was so stressed working on it but alas it got done. Another thing is to learn how to let go and compromise. Everything is subjective anyways so even if you feel like your work is less, there's still going to be people who will enjoy your work. 

 

Comments

Popular Posts