Interactive Design - Final Project
12/06/2023 - 17/07/2023 / Week 11 - Week 16
Glen Owen / 0354952
Interactive Design / Bachelor of Design (Hons) in Creative Media
Taylor's University
INSTRUCTION
Fig 1.1 Interactive Design MIB
PROJECT 3 - 5 Page Website
So, our final project for this module is to make a 5 working page website that follows the theme "Mental Illness". I decided to go with the topic "Depression" because I am experience in it and I can relate with the topic. My level in this topic is also beyond expectation since I have experience the mental illness before.
Proposal and Idea Concepts
Below is the proposal and concept that I'll be proposing to Mr. Shamsul regarding the topic and how the design will look like.
Fig 2.1 Proposal (Week 11, 12/06/2023 - Week 12, 19/06/2023)
Mr. Shamsul that the first 4 wireframes for the website is not good enough so I make another wireframes in a paper. In the end, I chose the final wireframe design for my homepage and start designing it.
Fig 2.2 Final Wireframe Design for the Homepage (Week 11, 15/06/2023)
Now that I have done making the wireframe, it's time for me to design the website in Adobe XD since I am familiar with it. It took me awhile but I did the job done.
Fig 2.3 - 2.7 First design of the website (Week 12, 20/06/2023)
I showed the design to Mr. Shamsul and he said that the layout can be change except for the homepage. The color choice is too "depressing" so he suggested to use light colors instead. Overall, it's a fine design but there is still room for adjustment. So I changed the design a bit and here is the result.
Fig 2.8 Final Website Design (Week 13, 26/06/2023)
Mr. Shamsul said that the website now looks more better and "cheerful" and the layout itself looks consistent. He approved the design and told me that I can now proceed to do the coding.
Coding
Now comes to the depressing part of this final project, which is to code them. When I finished designing my final website I supposed I had a burn out in a week. I started coding it at Week 14 and done coding it until Week 15. I used Bootstraps and ChatGPT to help me on doing this coding.
Fig 3.1 Coding process (Week 14, 03/07/2023)
To be honest, when I code, I found a lot of problem sometimes. Like there is this one moment when I am done adjusting the cards and it looks good. Then when I leave my laptop alone for 30 minutes, I open the website again and the cards are all fked up. When that happened, I went insane in X-Space as I laughs uncontrollable while other students look at me like a mad person.
In total, I made 5 HTML files, 5 CSS files, 1 Javascript (which I don't used it), and bunch of images.
Fig 3.2 Compilation of files (Week 15, 16/06/2023)
As for the HTML file of about, info, inffo, and infffo, they all used the same base of HTML files the same goes for style2-style5.
Fig 3.3 Some structures for the HTML file of about, info, inffo, and infffo (Week 15, 16/06/2023)
After I am done with my torture session with coding. I then upload all the files in Github. The first attempt is... quite dissapointing as I encountered an error.
Fig 3.4 Error found on the uploaded web (Week 15, 16/06/2023)
After figuring out why the errors is there, I immediately fix it and upload it again and the problem has been fixed.
Fig 3.5 - 3.7 Some overviews of the website (Week 15, 16/06/2023)
Final Submission
Click here to go to the websiteFEEDBACKS
Fig 4.1 - 4.2 Feedbacks
REFLECTION
In this final project, what I learnt is that time management is key to make a good website. In this website I basically rushed as I have no time and everytime I wanted to do this project I always get dragged outside by my friends. Healing is nice but it must not be excessive because I still need to focus on my project. The designing part is the most enjoyable part of this project while coding itself is like torturing myself. I supposed I did enjoy some coding parts as it just need some copy paste but overall, it's a nice experience. I would like to thank the university to provide this fortunate chance for me to try coding and basically I have learnt the basics. So, Thank you Mr. Shamsul and Ms. Dini! You guys are the best!
Comments
Post a Comment