INTERACTIVE DESIGN / EXERCISE 2 - SIMPLE PERSONAL PROFILE PAGE

-

October 09, 2025

INTERACTIVE DESIGN / EXERCISE 2 -simple personal profile page 

-

9.10.2025 -16.10.2025 (week 3 - week 4) 
Low Xin Er / 0374596 / Bachelor of creative media
Interactive Design / Exercise 2 - Simple Personal Page
LECTURE NOTES

week 3 (9/10/2025)
  • ip = identity
  • World Wide Web Consortium (W3C)
  • HTML= made up language
  • opening tag <p> 
  • closing tag </p>
  • bold tag <b></b>, don't bold heading (h1,h2,h3)
  • inline <i></i>
  • ordered list <ol><li> =number list 1.2.3.
  • unordered list<ul><li> =dot list
  • shift enter=force line break
  • </hr>=line

Fig. Writing links (9/10/2025,week3)

Exercise in class
text edit > format > make plain text>save>index.html


Fig.exercise during class,my first webpage (9/10/2025,week3)

Exercise 2 intruction:

Create a single HTML file that serves as a basic "About Me" or personal profile page. This exercise is designed to test our understanding of core HTML document structure and fundamental elements.

Create one file named index.html. When opened in a web browser, this file must display a simple page about you correctly.

Your index.html file must include the following elements:
  • Basic Document Structure:Correctly use the <!DOCTYPE html>, <html>, <head>, and <body> tags.
  • Page Title:Add a descriptive title inside the <head> using the <title> tag
  • Main Heading:Use an <h1> tag for your name or the page's main topic.
  • Sub-Heading:Use an <h2> tag to create a section heading
  • Paragraph Text:Write at least two descriptive paragraphs using the <p> tag.
  • Ordered List:Create a numbered list (using <ol> and <li>) with at least three items 
  • Unordered List:Create a bulleted list (using <ul> and <li>) with at least three items

Final Webpage: Hidden Note

Fig.Hidden Mystery Notes about me (9/10/2025,week3)


REFLECTION

I used to think coding wasn't for me. I took a coding course in middle school, but I'd never actually built a website myself. Instead, I was just memorizing code. What I found fascinating was the professor letting us create our own website content. The boring website creation process became a competition of creativity, which was incredibly fun for me and my friends.



Comments

Post a Comment

Popular posts from this blog

Typography - Task 1:Exercise

-
Image
April21,2025 TYPOGRAPHY｜Task 1:Exercises ||    17 /04/25 – 30/05/25 (Week 1-Week 6)  ||    Low Xin Er , 0374596 ||   Typography ||    Exercises / Type Expression & Type Formatting .  TABLE OF CONTENTS 1.0 Instruction 2.0  Lecturers 2.1  Introduction and Typo_1_Development 2.2 Typo_3 Text part 1 2.3 Typo_4 Text part 2 2.4 Typo_2 Basic 2.5  Typo_5 Understanding    2.6  Typo_6 Screen & Print 3.0  Progress of Work 3.1  Research and ideation (Exe 01-Typography) 3.2  Exploration and sketch 3.3 Adjustments 3.4  Final Sketch Design   3.5  Digitalize    3.6  Final Digital Design 3.7 Animation 3.8  Kerning,Tracking,Leading  3.9 Text Formatting 3.10  Reference (Exe 02-Text Formatting) 3.11 Exploration & Draft 3.12 Top 5 Selections   3.13  Final Design 4.0  Feedback 5.0 Reflection 6.0 Futher Reading 1.Instruction <iframe src="https...
Read more

Typography - Task 2: Typographic Exploration & Communication

-
Image
 May  25,2025 TYPOGRAPHY｜Task 2:Typographic Exploration & Communications  ||    19 /05/25 – 08/06/25 (Week 5-Week 7)  ||    Low Xin Er , 0374596 ||   Typography ||    Typographic Exploration & Communication/ Type Expression & Type Formatting .  TABLE OF CONTENTS 1.0  Instruction 2.0  Lecturers 3.0 Progress of Work 3.1 Research and ideation   3.2 Exploration & Sketch 3.3 Digitalize  & Final 3.4 Layout explore  3.5 Adjustment 3.6 Final Design 4.0 Feedback 5.0 Reflection 6.0 Futher Reading 1.Instruction 2.Lectures The complete notes can be viewed at Task1 Blog 3.Progress of Work Task-2_Editorial 3.1 Research and ideation     FIG.1,2,3 Research on Pinterest (19/05/25 week5) 3.2 Exploration & Sketch   FIG.1,2,3 Sketches of Title PUNK   (19/05/25 week5)   FIG.Sketches of Layout Design   (19/05/25 week5) 3.3 Digitalize  & Final ...
Read more

Typography - Task 3: Type Design and Communication

-
Image
  Jun, 9 ,2025 TYPOGRAPHY｜Task 3:Type Design and Communication ||    0 9 /06/25 – 28/06/25 (Week 8-Week 10)  ||    Low Xin Er , 0374596 ||   Typography ||   Type Design & Communication TABLE OF CONTENTS 1.0 Instruction 2.0 Lecturers 3.0  Progress of Work 3.1 Research and ideation 3.2 Exploration & Sketch 3.3 Digitalize  & Final 3.4 Layout explore  3.5 Adjustment 3.6 Final Design 4.0 Feedback 5.0 Reflection 6.0 Futher Reading 1.0 Instruction 2.0 Lecturers The complete notes can be viewed at  Task1 Blog 3.0 Progress of Work Progress Sketches Fig3.1.sketches of a,b,g,t ( 09/06/2025 week 8) Fig.3.2.  4 types designs （11/6/2025 week 8） Fig.3.3. sketches of final design series (16/6/2025 week 9) Fig.3.4.detail dissection of the letters (16/6/2025 week 9) Observation: Since font designs have a certain balance and symmetry, the circles or lines used in the ins...
Read more