INTERACTIVE DESIGN PROJECT 2

  INTERACTIVE DESIGN PROJECT 1 

Bachelor of Design (Honours) in Creative Media

WEEK6 - WEEK8

LECTURE

Please refer to exercise and Project 1

RECAP

In the fifth week, the instructor introduced us to the use of CSS and how to make it into HTML.

In CSS, content usually refers to the text, images, links, and so on inside the HTML elements to be styled. CSS is used to control the appearance, layout, and behavior of this content.

Text style: CSS can be used to define the style of text, including font, size, text color, text decoration (such as underline or strikeout), letter spacing, line height. You can use CSS rules to select text to style.

Text alignment: With CSS, you can control the alignment of text, including left alignment, right alignment, center alignment, and both ends alignment.

Text decoration: CSS allows you to add text decoration, such as underlining, strikeout, text shadows, etc., to change the appearance of text.

Text spacing: You can use CSS to control the spacing between characters (letter spacing) and between lines (line height) to change the layout of text.

Background image: CSS allows you to add an image to the background of an element, which can be used to create a visually appealing background.

Link style: Links are common content elements in web pages, and CSS can be used to define the style of links, including the appearance of unvisited links, visited links, and hovering links.

INSTRUCTION

PROJECT 2

PLEASE REFER TO PROJECT 1.

At the outset of the project, my primary task was to write all the content for Project 1's resume. This included carefully designing the HTML structure for each component, ensuring that detailed information is expressed clearly and concisely. Simultaneously, I diligently assigned appropriate classes to each element to ensure they were systematically labeled and organized.

Figure 1.1

Figure 1.2

Figure 1.3

Figure 1.4 

Every element in the HTML structure has its complete representation, and the absence of any one of them would prevent the final product from being realized. In this project, CSS, margins, and layouts will be completed in the CSS. By labeling each element with meaningful and descriptive class names, I will connect the complete CSS to the HTML.

FINAL OUTCOME

LINK ：https://project2exerciseeexercise.netlify.app

REFLECTION

Project 2 presented a significant challenge for me. It required the application of various knowledge related to UI prototype design. I spent over a week researching how to create and produce it, using the knowledge I had acquired. I was able to complete it before submitting my assignment, and I believe it was a valuable exercise for me. Seeking assistance from Mr. Shamsul and learning how to format and layout my ideas to match my vision were important aspects of this exercise. It not only tested my creative thinking but also required patience and multiple iterations.