INTERACTIVE DESIGN/ EXERSICES
24.04.2024 - 13.06.2024 Week 1 - Week 8
Tyra Franchesca Valerie Anthony / 0368223 / Bachelor of Design (Hon) in Creative Media
Interactive Design / Taylor's University
EXERCISES 1,2,3
LECTURE
Week 1
Introduction to the module Mr. Shamsul introduce us with the topic that we will be doing and also what types of activities we will doing and also projects, the different platform the will be working on this semester.
In also our class exercises will be showing our understandings wed designs and more by learning with prototypes and developing our progress.
Week 2
We were introduced with the Anatomy of web pages that sir explain to in class on Wednesday how to use and the elements that comes with it.
https://blog.tubikstudio.com/anatomy-of-web-page/?authuser=1&hl=en
And we were also assigning with task 2 by replicating an existing website as same as possible as we can to see our aspect. We need to choose two website and replicate it using illustrator and screen grab to get like a screenshot or photo of the website.
Week 3
In today's class we are being brief about the website structures to get well understanding about it.
Learn about the three elements on the website
Header: is the tope section of the web.
Body: Is the main content of the website.
Footer: Is the bottom of the website.
Organizing content: Content organization is key to well-structured website
Using heading with ( H1,H2,H3,etc.) to create a hierarchical.
Navigation menu: Helps users moving around the websites, and concise labels for menu items, also using dropdown menu for complex sites.
LECTURE 4 (WEEK 4 Web Standards)
LECTURES 5 (WEEK 5 ID, Class Attribute & CSS)
WEEK 5 There was public holiday, so we didn't have any class, so sir recorded video for us to follow.
https://taylorsedu-my
Lecture 5 Week 5-6 ID class Attributes & CSS
INSTRUCTION
EXERCISE 1 TASK 1
Web analysis
For this exercise we are to analysis two websites that was given from the lecture for us to analyzed form their design, purpose goals of the website, visual design and layout, functionality and usability of the website and last thing website's performance.
Deliverables:
We are supposed to be writing report summaries in not less than 500 words. Also, we can include captions of each section of the page to explain the website.
The links that were given to us examples:
CHOOSEN WEBSITE
REPORT ANALYSIS
Fig.1.1 week 1 28/04/2024 report web analysis
TASK 2: Web replication
- To replicate TWO (2) existing main pages of the website in order gain a better understanding of their structure
- The images used do not have to be the exact same the original website. You may replace it with a similar image. focus on the layout, type style, and color style.
The two website I choose
Fig.1.2 week 2 06/05/2024 the chosen website to replicate.
Fig.1.3 week 2 06/05/2024 screen grab
Fig.1.4 week 2 06/05/2024 And screenshot the website for example
PROGRESS EXRCISE 2
The photo that used in creating the website.
Fig.1.5 week 2 07/05/2024 First replication
Fig.1.4 week 4 15/05/2024
Fig.1.6 week 4 15/05/2024 final BANDIT
Fig.1.5 week 4 15/05/2024 final Morgan Stanley
Exercise 3/ Creating a Recipe Card
In this excise, you will be creating a recipe card using HTML and CSS. The goal is to design a basic webpage that displays a recipe's ingredients and instruction in a visually appealing format.
Process
Started and HTML document named (Index.html). Added the title, and section titles (using Selectors for CSS later). Then added the ingredients and instructions in list formats.
Fig.1.1 HTML, Week 7 (05/06/2024)
Started an external CSS style sheet and lined it to the HTML Document.
Fig.1.2 week 7 (05/06/2024)
Fig.1.3 week 7 (05/06/2024)
Fig.1.4 week7 (06/06/2024)
Was really struggling to finish my recipe card going back and front to finish the final and also to create a nice and appealing layout simple but nice.
Final
The Recipe Card website is below with a provided link.
Comments
Post a Comment