INTERACTIVE DESIGN EXERCISE 2: WEBSITE REPLICATION

 INTERACTIVE DESIGN EXERCISE 2: WEBSITE REPLICATION

10 October 2024- 17 October 2024

FANG YAOYUE(0372006)

Interactive Design | Bachelor of Design in Creative Media | Taylor's University

Exercises 2/ Website Replication

List

LECTURES

INSTRUCTIONS

FEEDBACK

REFLECTION

LECTURES

Week 3:

Copying websites is the first step to learning interaction design. Just like drawing, start with copying. This is the most important first step to learning how to design a good interface. In this way, various engines can be added to allow the buttons to interact with the user.

Website structure is the foundation of a user-friendly and accessible website. It affects user experience, SEO, and overall website performance. A well-structured website helps users find information easily and keeps them engaged.

It also make the website search engine optimised. When users are familiar with one website, they aretend to stick on it.

Five  Key Elements of Website:

1. Header

2. Body

3. Footer

4. Organizing Content

5. Navigation Menus

INSTRUCTIONS

Exercise 2: Web Replication

We need to replicate 2 existing main pages of the websites given. Follow the dimensions of the existing website from the width and height. We can use softawre like Photoshop, Adobe Illustrator and Figma.

These are the screengrab from my selected websites:

Fig 1.1 This is the site I chose to copy

Fig 1.2  This is my choice of ocean pictures

Fig 1.3 Compare the site to the one I copied

Fig 1.4 layer

Fig 1.5 Exercise 2: Website Replication 1

I feel that the ocean is related to conservation, so I chose this image of manta rays, which is full of freedom and harmony。

Fig 1.6 This is the site I chose to copy

Fig 1.7 This is my choice of ocean pictures

Fig 1.8 Compare the site to the one I copied

Fig 1.9 layer

Fig 1.10 Exercise 2: Website Replication 2

The whole layout down, encountered some problems, there are some small symbols do not know where to find, the font always feels there is a certain difference, but overall it is very good, why I choose this picture into the page. Because this image is very dynamic, which is why I chose it.

FEEDBACK

The two pages I selected were very interesting, and I finished one of them in class. During the process, I encountered some problems, such as different fonts. The teacher also patiently guided me on how to find fonts, and shared a website to find pictures. When you first learn interaction design, you should imitate and then innovate.

In class this week, the teacher asked you to choose two interesting pages to redesign, look for pictures by yourself, and typeset by yourself. I think this kind of semi-open homework is the most interesting.

REFLECTION

Starting from the simplest collocation web design, I think it is the beginning of laying the foundation. The teacher also hopes that we can go further and further on the road of interaction design in the future, so I think this course will definitely provide great help for my study and employment in the future.