INTERACTIVE DESIGN - PROJECT 2: WORKING WEB PAGE

16th October - 24th October (Week 8 - Week 9)
Azim Azariff Bin Azahar (0353583)
Bachelor of Design (Honours) in Creative Media
Interactive Design - Project 2: Working Web Page


INSTRUCTIONS


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

PROJECT

Project 2: Working Web Page

The objective of this assignment is to transform your static prototype from Project 1 into a fully functional and interactive web page. You will apply your knowledge of web layout class to create a working website that closely aligns with your original prototype.

Project 1 resume:

Fig. 1.1 Resume

I began to work on Project 2 on Dreamweaver.

I began with the HTML section by putting the texts from the resume I created. I added div classes such as 'container', 'aside-right', etc. I didn't remember some of the codes so I had to open up the recipe exercise as reference.

Fig. 1.2 HTML
Fig. 1.3 HTML
Fig. 1.4 HTML
After the HTML section, I started the CSS style. This section I did struggle to be honest, I didn't know how to do a few things such as the shapes and the lines from the resume. At this point I was telling myself I wish I did my resume a bit more simple.

Fig. 1.5 CSS


Fig. 1.6 CSS

Fig. 1.7 CSS

Fig. 1.8 CSS


For the font of the website, I used "Roboto".

Fig. 1.9 Font

Fig. 1.10 Final

REFLECTION

To be honest, I'm really disappointed with myself. I could've done a lot better. It was tough for me to do any work in week 8 due to personal problems so I didn't have much time to do it, however, I'll learn from this and try to manage my time better for the final project. 


Comments

Post a Comment

Popular posts from this blog

TYPOGRAPHY - TASK 1: EXERCISES

Image
4th April 2023 - 2nd May 2023 (Week 1 - Week 5) Azim Azariff Bin Azahar (0353583) Bachelor of Design (Honours) in Creative Media Typography - Task 1: Exercises Image from Pinterest LIST / JUMPLINKS: LECTURES - Week 1 - Week 2 - Week 3 - Week 4 - Week 5 INSTRUCTIONS PROJECTS - Exercise 1: Task 1 - Exercise 1: Task 2 - Exercise 2 FEEDBACK FURTHER READING   LECTURES Week 1 (04/04/23):   Mr. Vinod discussed many things with the whole class as it was our first Typography class of the semester. He began to talk about what we should expect during these upcoming 14 weeks. Mr. Vinod told us about the Facebook group that we all have to join as this is wh...
Read more

INTERCULTURAL DESIGN

Image
Week 1 - Week 7 Azim Azariff Bin Azahar (0353583) Bachelor of Design (Honours) in Creative Media Intercultural Design INSTRUCTIONS <iframe src="https://drive.google.com/file/d/1Mf97fe0yRLDpMisE5Jrk3Uls72wBGzqk/preview" width="640" height="480" allow="autoplay"></iframe> PROJECT 1 - PROPOSAL (Week 1 - Week 3) For the first project, we need to come up with a proposal as a group for the whole module. The proposal is to concretise ideas, supported by research, for a final project design revolving a given theme. The theme for this module is: Cultural Sensitivity in Design. We are tasked to study a cultural phenomenon, or a particular subculture that is perceived as "sensitive". We are then needed to produce preliminary ideas on how to visually express our interpretation using design language. Week 1 During the first week, we were all gathered in the lectur...
Read more

DESIGN RESEARCH METHODOLOGY

Image
23rd April - 26th July (Week 1 - Week 14) Azim Azariff Bin Azahar (0353583) Bachelor of Design in Creative Media Design Research Methodology INSTRUCTIONS <iframe src="https://drive.google.com/file/d/1sKfmtnNAveS-62mHKZInvL1bZtjO2iCN/preview" width="640" height="480" allow="autoplay"></iframe> PROJECT 1 & 2 As I am retaking this module, I had the opportunity to use the work I've already done in the previous semester. However, there were a few things I needed to change. Below are my first two projects: <iframe src="https://drive.google.com/file/d/1qnbdZKo5ejOGbSW2UjTaXLW1B1F3KSDt/preview" width="640" height="480" allow="autoplay"></iframe> PROJECT 3 Similar to ...
Read more