Posts

Showing posts with the label Interactive

INTERACTIVE DESIGN / PROJECT 2 - WEBSITE REDESIGN PROTOTYPE

Image
INTERACTIVE DESIGN / PROJECT 2 -WEBSITE REDESIGN PROtotype - 20.11.2025 -27.11.2025 (week 9 - week 10)  Low Xin Er / 0374596 / Bachelor of creative media Interactive Design / Project 2 - Website Redesign Prototype PROJECT 2 -  Website Redesign Prototype Figma-prototype link https://www.figma.com/proto/QQ0sWfQuQt9WFhiKCZiuVI/Interactive-Prototype?node-id=1-38&t=22JbhYzjwL2tZ2Oy-1&starting-point-node-id=1%3A38&scaling=min-zoom&content-scaling=fixed Website Redesign Prototype: Key Features, Design Decisions & Improvements      This new website prototype shows a complete redesign of the Edial Boarding Kennels & Cattery site. The goal of the redesign was to make the website more modern, more organised, and easier for users to read. The old website worked, but it had several issues such as messy text layout, outdated visuals, and unclear structure. The new version solves these problems by improving the colour theme, layout, text arrangement, an...

INTERACTIVE DESIGN / PROJECT 1 - WEBSITE REDESIGN PROPOSAL

Image
INTERACTIVE DESIGN / PROJECT 1 -WEBSITE REDESIGN PROPOSAL - 13.10.2025 -31.10.2025 (week 4 - week 6)  Low Xin Er / 0374596 / Bachelor of creative media Interactive Design / Project 1 - Website Redesign Proposal LECTURE NOTES week4 (16/10/2025)  Dreamweaver Background design <body style="background-image: url(images/img-bg.jpg);background-repeat: no-repeat;background-size: cover"> Image Import <img src="images/img-profile.jpg" alt="My Profile Picture" title="My Profile Picture" width="30%"/> Table Design: border,color,rowspan,colspan <table border="2" width="60%" cellpadding="5" cellspacing="2" style="border-collapse; background-color:antiquewhite"> <tr style="background-color:cadetblue"> <th colspan="4">My Timetable</th> <th rowspan="2">Tue</th> Fig 1.1 HTML in Adobe Dream Weaver Fig 1.2 Webpage in Safari wee...

INTERACTIVE DESIGN / EXERCISE 3 - RECIPE CARD

Image
INTERACTIVE DESIGN / EXERCISE 3 - Recipe Card - 20.10.2025 -30.10.2025 (week 5 - week 6)  Low Xin Er / 0374596 / Bachelor of creative media Interactive Design / Exercise 3 - Creating a Recipe Card LECTURE NOTES week 6 (30/10/2025) CSS=2 part=property & value Selector elements selector class selector id selector universal selector Descendant selector  <table>     <tr>         <th> Child selector <il> is children of <ul><ol> Pseudo-class selector usually using in link text a:link (blue) a:hover (purple) a:hover (effect with mouse moving) 1 column Pseudo-element selector 2 column p::before p::after Notes new inline element stay in same line new block element come for new line Responsive design different device different version (desktop & mobile)

INTERACTIVE DESIGN / EXERCISE 2 - SIMPLE PERSONAL PROFILE PAGE

Image
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 structur...

INTERACTIVE DESIGN / EXERCISE 1 - WEB ANALYSIS

Image
September 25, 2025 interactive design / EXERCISE 1 - web analysis  - 22.9.2025 -5.10.2025 (week 1 - week 2)  Low Xin Er / 0374596 / Bachelor of creative media Interactive Design / Exercises - Web Analysis LECTURE NOTES week 1  Download Dream Weaver 5 Website analysis reports with different categories week 2 Norman door A door where the design tells you to do the opposite of what you're actually supposed to do. A door that gives the wrong signal and needs a sign to correct it. Discoverability: the ability to discover what operations one can do. Feedback: a signal of what happened Fig 1.1 Human-centered design Usability: Designing Products for User Satisfaction Usability refers to how effectively, efficiently, and successfully a particular user can utilise a product or design in a certain situation. A design’s usability depends on how well its features accommodate users’ needs and contexts. When users first encounter an interface, they should be able to find their way abo...