Interactive Design - Project 2/ Working Web Page

18.06.2024 - 29.06.2024  / Week 9 - Week 10

Siang Huey Yee / 0369549

Interactive Design / Bachelor of Design (Honours) in Creative Media         

Project 2: Working Web Page - Final Design (Creating a Digital Resume/CV)

---

OUTLINE

• INSTRUCTIONS
• PROJECT 2: WORKING WEB PAGE - FINAL DESIGN (CREATING A DIGITAL RESUME/CV)
• FEEDBACK
• REFLECTION

---

INSTRUCTIONS

BACK TO OUTLINE

Module Information Booklet

<iframe src="https://drive.google.com/file/d/1gkWwumsF60RnirG-2o2PEZOINrMBOIYE/preview" width="640" height="480" allow="autoplay"></iframe>

---

PROJECT 2: WORKING WEB PAGE - FINAL DESIGN (CREATING A DIGITAL RESUME/CV)

BACK TO OUTLINE

Requirements:

• Review the static prototype from Project 1 and analyze the layout, typography, colour scheme, and imagery.
• Use HTML and CSS to translate the design elements into code, ensuring a faithful representation of the original prototype.
• Aim for pixel-perfect precision while maintaining responsive design principles to ensure compatibility across different devices and screen sizes.
• Upload the file in Netlift, then update e-portfolio with all the processes documented in the bog, and submit the link as a submission. 

1) Adobe Dreamweaver

Continuously from Project 1, I have utilise the prototype I have created in Project 1 to create HTML and CSS for this Project 2. 

Figure 2.1 HTML Code - Adobe Dreamweaver

Figure 2.2 CSS Code - Adobe Dreamweaver

2) Digital Resume - First Attempt

Figure 2.3 Digital Resume (First Attempt) - PNG

After my first attempt at creating my digital resume, I noticed some small alignment issues. Therefore, I modified the alignment and changed the linear colour to match more to the prototype I created in Project 1 using the Figma platform.

3) Netlify 

After done modifying the HTML and CSS code for the website, I have uploaded the file on Netlify for submission.

Figure 2.5 Netlify 

4) Final Digital Resume 

Figure 2.6 Final Digital Resume - PNG

Netlify Link: https://hueyyee-project2-finaldigitalresume.netlify.app/

---

FEEDBACK

BACK TO OUTLINE

Week 10: 

Mr. Shamsul reminded us not to forget to submit the final digital resume through Netlify and to attach the link to our e-portfolio. For the submission, we only need to submit the Project 2 e-portfolio link, not the Netlify link.

---

REFLECTION

BACK TO OUTLINE

Throughout Project 2 - Working Web Page, I learned how to better utilize CSS code to enhance the design of my website. Additionally, this project provided me with the opportunity to design my own Digital Resume/CV, allowing me to reflect on and showcase my skills and experiences, which was quite enjoyable. This experience also enabled me to gain a deeper understanding of myself. I discovered more about HTML and CSS code, learning how to adjust my website's content using properties such as margin, height, width, padding, and others. This task significantly helped me explore and master HTML and CSS coding, broadening my web design capabilities and giving me the confidence to create more complex and visually appealing websites in the future.