Advanced Interactive Design / Task 2

05/10/2023 - 04/11/2023 / Week 6 - Week 10
Anna Ong Su Kuan / 0353775
Advanced Interactive Design / Bachelor of Creative Media / Taylor's University
Task 2

cover pic

CONTENTS

- Lectures
- Final Submission 
- Feedback 
- Reflections

INSTRUCTIONS



Continuing the concept from the first task, we are to create & design a prototype for our website's pre-production phase. 

Task 2 - Interactive Website Application Pre-Production & Prototype

Fig 1.1 Pinterest Board Inspiration, (07/10/2023)

The initial start was going through Pinterest & other platforms to look for inspirations.

Fig 1.2 User Flow Chart, (10/10/2023)

Before I started creating my prototype, I made sure the user flow chart covered all the different sections.

Fig 1.3 Wireframing in Figma, (18/10/2023)

Fig 1.4 Pinterest Inspiration, (20/10/2023)

In Figma, I use images on Pinterest that I found similar/close to what I would want the final design to be like. This also helps me to have a better sketch/base when I properly design & execute the final project based on this prototype.

Pinterest Board: https://pin.it/62ljkkW

Fig 1.5 Prototyping, (25/10/2023)

Once everything was done, I started to use the wireframing tool in Figma to create a simple & basic prototype.

Final Submission



Above is the slide presentation that consists of references & sketches to get a better idea of how the animations would be.



Above is the guided video to walk through what the website concept will be like.

FEEDBACK

Week 8
General Feedback
Ensure there's a user flow included so that we can ensure no details are missed for the website page design.

REFLECTIONS

Experience
Week 6-10 : Building the prototype wasn't too much of a new experience or issue, but animating a website design was something new. I was excited to discover how it's done as it could be a great thing to know when I start working or want to use it for my own personal use.

Observations
Week 6-10 : Finding inspirations that is what I envision for my final design to be was a bit difficult, some elements were easier to find than others. Figuring out how Figma works to do wireframing was not too difficult either since I've seen some of my friends' work before & with my own experience in the past. 

Findings
Week 6-10 : Having Pinterest was very helpful as it consists of a lot of ideas and references that I can use to explain my prototype better. Figma was a very useful software to use for this task as it can help show others a vague idea on how the website animation & composition should be like.

Comments

Post a Comment

Popular posts from this blog

Video & Sound Production / Final Compilation

Image
29/08/2022 - 22/11/2022 / Week 1 - Week 13 Anna Ong Su Kuan / 0353775 Video & Sound Production / Bachelor of Creative Media / Taylor's University Final Compilation CONTEXTS Project 1 : Sound for Visual, Sound Shaping, Creating Sound Effects Project 2 : Shooting Practice & Editing Final Project : Stop Motion/Visual Effects INSTRUCTIONS SUBMISSIONS Project 1 : Sound for Visual, Sound Shaping, Creating Sound Effects 05/09/2022 - 20/11/2022 / Week 2 - Week 12 1. Audio - Sound for Visual 2. Audio - Sound Shaping Google Drive Link 3. Audio - Creating Sound Effects Google Drive Link Project 2 : Shooting Practice & Editing 05/09/2022 - 08/10/2022 / Week 2 - Week 6 Editing Exercises Exercise 1 Exercise 2 Shooting Exercise Shooting & Editing Exercise Final Project : Stop Motion/Visual Effects 29/08/2022 - 22/11/2022 / Week 1 - Week 13 REFLECTIONS Experience Having done the digital photography module, the experience I've gained from there ...
Read more

Video & Sound Production / Final Project

Image
29/08/2022 - 22/11/2022 / Week 1 - Week 13 Anna Ong Su Kuan / 0353775 Video & Sound Production / Bachelor of Creative Media / Taylor's University Final Project CONTEXTS -  Lecture -  Feedback -  Reflections INSTRUCTIONS Visual Effects Short Videos (Research) I like the transitions & flow of the entire video, especially the change from solid land to under the sea. The way it still looks natural got my interest, including the transformation of "Alexa" the AI from a product to a diver.  I find the use of different angles & perspective a very smart way to bring this video its' success, this video in particular uses this to bring the illusion of the pumpkin to being a mug & an actual big pumpkin. I find it very suiting & hilarious to fit the celebration of Halloween.  This is one of my fav videos as it still amazes me how he is able to be stuck onto the wall like an actual spider, eventhough in real life it is imp...
Read more

Major Project

Image
25/09/2024 - 08/01/2024 / Week 1 - Week 15 Anna Ong Su Kuan / 0353775 Major Project / Bachelor of Creative Media / Taylor's University Major Project cover pic INSTRUCTIONS Progression The pdf slide above is the accumulative progression for the past 3 weeks. Above is the pdf slides for week 4's progress, mostly working on the sketches & designs. Above is the pdf slides for week 5's progress, I completed all the planet sketches and developed the base prototype. After that was done, I started organizing the slides to prepare for the presentation happening on week 7. The above slides mostly show more sketches & all the pages being consistent with the design. The slides above show only the progression for all sketches and developments for the planets, as I start to digitalise all of them. The presentation slides were not included here as it was the previous pdf slides but with most of the pages hidden. Week 8 and 9 I've been working on completing the planets which is...
Read more