Interactive Design - Exercise

Week 1-Week 3
Tabita Febrilia Dinata (0340357)
Interactive Design
Exercises

---

LECTURE

LECTURE 1: INTRODUCTION
15/04/2020 (Week 1)

We started our class with brief about this module.

Fig 1.1: Lecture 1 slide

LECTURE 2: THE WEB
22/04/2020 (Week 2)

Fig 1.2: Lecture 2 slide

LECTURE 3: ADDING IMAGE TO HTML
29/04/2020 (Week 3)

Fig 1.3: Lecture 3 slide

LECTURE 4: INTRODUCTION TO CSS
06/05/2020 (Week 4)

Fig 1.4: Lecture 4 slide

WEEK 5: MORE ABOUT CSS
13/05/2020 (Week 5)

---

INSTRUCTION

---

EXERCISE

Week 1 (15/04/2020)

Our very first task is to search for the example of website types.

Fig 1.1: Website types

Week 2 (22/04/2020)

For this week, we started with a very basic html, and we need to tell story about how's our stay at home going.

Fig 2.1: Result

EXERCISE 1
Week 3 (29/04/2020)

For the very first exercise, we need to create a simple website from a content that our lecturer has provided for us.

Fig 3.1: The content

Fig 3.2: Exercise 1.1 

Fig 3.3: Exercise 1.2

Fig 3.4: Exercise 1.3

Week 4 (06/05/2020)

This week, we learn about CSS, and we need to apply it to our 1st exercise.

Fig 4.1: The code

Fig 4.2: Result #1

Fig 4.3: Result #2

Fig 4.4: Result #3

Fig 4.5: Result #4

Fig 4.6: Result #5

Fig 4.7: Result #6

EXERCISE 2
Week 5 (13/05/2020)

For the next thing that we learn, we need to create a layout using html&css.

Fig 5.1: Layout reference

So I try it out.

Fig 5.2: The code

Fig 5.3: Result.

After we can create our layout, we need to do the real website with the content given about photoshop. And I work on it.

Fig 5.4: Code

Fig 5.5: Code

I got a lot of trouble while doing this, and don't know how to fix it. Even thought my lecturer has help me but it still can't.

Fig 5.6: The layout

Fig 5.7: Result

And here's the result of my layout exercise.

Layout Exercise by Tabita Febrilia