INTERACTIVE DESIGN - PROJECT 2: INTERACTIVE PROTOTYPE DOCUMENT

-
12.05.26 - 23.06.26 (Week 4 - Week 10) 
Michelle (0373843)
Interactive Design/ Bachelor of Design (Honours) in Creative Media / Taylor's University
Project 2: Interactive Prototype Document

TABLE OF CONTENTS

CLASS: LECTURES, TUTORIAL, & PRACTICAL

Week 4 (12/05/26)

Modifiying template using google developer tool.



HTML Favicon
ICO, PNG, GIF, JPEG, SVG

Advanced Search
Table
default format




padding&spacing
colspan&rowspan
styling
table colgroup

Video
VSCode - table


Week 5 (19/05/26)

Create website design in Canva.



Download image - ask AI tools to generate code


Paste the code to coding softwares (VSC, Dreamweaver, etc)
index.html
styles.css
Edit & replace elements (links, texts, images)


LISTS






BLOCK & INLINE




DIV
within container
internal style can be overwrite by inline style.

has padding

same height?



CLASS (.)
no space bar
can call multiple class - separated with space


Week 6 (26/05/26)

!

INSTRUCTIONS

!

PROCESS WORK

Week 4 (12/05/26)

Finalizing assignment 1: Digital Business Concept

Week 5 (19/05/26)

Submit assignment 1
Plan website


FEEDBACK

Week 4 (12/05/26)

  • What we can't (don't know how to) do, ask AI.
  • Some AI are limited, so have other sources.
  • Can get w3school certificate - need to pay.

Week 5 (19/05/26)

  • Work tips: request salary higher than desired > bargain less, still get what we want.
  • Can request for an online class alongside the physical class if we can't come.
  • Need to understand structure to be able to alter code AI generated.

REFLECTION

Experience

!

Observation

!

Findings

!

Comments

Post a Comment

Popular posts from this blog

INTERACTIVE DESIGN - PROJECT 1: DIGITAL BUSINESS CONCEPT

-
Image
21.04.26 - 12.05.26 (Week 1 - Week 4)  Michelle (0373843) Interactive Design  / Bachelor of Design (Honours) in Creative Media / Taylor's University Project 1: Digital Business Concept TABLE OF CONTENTS 1. Class: Lectures, Tutorial, & Practical 2. Instructions 3. Process Work 4. Feedback 5. Reflection CLASS: LECTURES, TUTORIAL, & PRACTICAL Week 1 (21/04/26) Introduction, assignment brief, group forming, & idea brainstorming. Web Languages: HTML CSS JavaScript PHP Phyton SQL etc.  Week 2 (28/04/26) Code Learning Website: w3schools AI Tools: Deepseek Qwen Gemini Microsoft Copilot GitHub Notepad Fig 1.2.1 Notepad Visual Studio Code Install extensions: Fig 1.2.2 VS Code Extensions ...
Read more

VIDEO & SOUND PRODUCTION - FINAL PROJECT

-
Image
21/05/25 - 23/07/25 (Week 5 - Week 14)  Michelle (0373843) Video & Sound Production / Bachelor of Design (Honours) in Creative Media / Taylor's University Final Project: Visual Effects TABLE OF CONTENTS 1. Instructions 2. Process Work 3. Feedbacks 4. Reflection INSTRUCTIONS We were encouraged to pair up and create a visual effects video from scratch, starting with idea, story, breakdown, visual board, shooting, until editing, then publicize. This final project is a challenge for us to transform our creativity into reality with proper techniques learnt from this module and self-explorations. PROCESS WORK Week 7 - Forming Pair A brief mention of our final project was brought in class. We're told to pair up for our final project. I partnered up with Muthiah Salsabila Harsono (0360613).  Week ...
Read more

INFORMATION DESIGN - EXERCISES

-
Image
04.02.26 - 14.02.26 (Week 1 - Week 2)  Michelle (0373843) Information Design / Bachelor of Design (Honours) in Creative Media / Taylor's University Exercises TABLE OF CONTENTS 1. Class: Lectures, Tutorial, & Practical 2. Exercises: Process Work 3. Feedback 4. Reflections CLASS: LECTURES, TUTORIAL, & PRACTICAL Week 1 (04/02/2026) Information Design :   Design to deliver information - clarity of message first, then aesthetic. Flip Topic 1: Infographic meaning, examples, and its different types. infographic  by Group C - Green Team Bonus Marks Question : Why is it that making people take action is the hardest step in infographic design? Some infographics could be overwhelming due to the many amount of information provided causing cognitive load. Most infographics are made to be understood simply and attractively, so they're good in educating but they could be lacking i...
Read more