Advanced Interactive Design - Final Project

-

Advanced Interactive Design



11.11.2021 - 02.12.2020  (Week 12 - Week 15)
Wong Kai Yi (0340236)
Advanced Interactive Design
Final Project

1. LECTURE

Week 12  (11.11.2021)

Final project briefing 

The final project consists of the use of Adobe Animate and Spark AR to make a Website and Filter for a campaign (can include selling products). The website is to promote the campaign and the filter (download app)

Signifier to let users know that they can click it: when hover over; drop shadow, dot, underline, glow (with pulse), outline around the button
What if it is too busy? It creates a cognitive load

Layout design: everything is in grids, properly aligned
Spacing to categorize
3-5 font size
minimum 3 colors: background, foreground, accent

most important content > element
Content organization: grouping (through spacing)
more important: more spacing 

W rule for button: 2 Ws left right, 1 W up down (use the same font used in the button)

2. INSTRUCTIONS



Final Project

I decided to work on a campaign from last semester's Creative Brand Strategy Module. Click here to view the post.

This is a made up Zero Waste Campaign organized by Zero Waste Campaign.

Website


This is the original website design:






I changed the website design to make it page by page.

Adobe Illustrator

Designing in Adobe Illustrator

Choosing typeface 1

Choosing typeface 2

Version 1.0 (Syne typeface)

Homepage v1.0

Download the App page v1.0

About page v1.0

Workshops page v1.0

Past Events page v1.0

Contact Us page v1.0

Due to some issues with the typeface when publishing in Adobe Animate, I used another typeface, Montserrat Alternates, to replace the initial Syne typeface.

The problem is shown as below:

Problem with Syne typeface after Publishing

Adobe Animate view:

Adobe Animate view v1.0



YouTube Website v1.0 (Syne)


Final Submission: Version 2.0 (Montserrat Alternate typeface)

Homepage v2.0

Download the App page v2.0

About page v2.0

Workshops page v2.0

Past Events page v2.0

Contact Us page v2.0

Website Final Submission video:

Website Final Submission YouTube video

Spark AR Filter

I decided to make a catching game, where players will catch a tumbler (zero waste product) with the basket. There is a score counter as well. To encourage users to play the game, there is no "losing" when the player fails to catch an object but the object will bounce off and make a sound.

Progress in Adobe Photoshop (drawing assets)

Drawing assets in Adobe Photoshop

Assets drawn



Progress in Spark AR (creating the filter)

Spark AR Patch Editor

Spark AR filter close up view

Progress video


Catching Game v1.0 - Spark AR filter (Kita Kitar Campaign) progress video

Final Submission (Spark AR Filter on Instagram video)


Kita Kitar Instagram Filter - Spark AR Filter Submission

Website Final Submission video:

Website Final Submission YouTube video

3. FEEDBACK

I have to change the typeface from Syne to another typeface because we would not give the clients an incomplete file as well.

Comments

Post a Comment

Popular posts from this blog

Design Research Dissertation

-
Image
Design Research Dissertation 27.08.2020 - 26.11.2020  (Week 1 - Week 14) Wong Kai Yi (0340236) Design Research Dissertation 1. INSTRUCTIONS 2. SUBMISSIONS Turnitin Report (PDF) Fig 1.1 Turnitin Report (PDF) Flipbook (Fliphtml5) Fig 1.2 Flipbook Journal Article (PDF) Fig 1.3 Journal Article (PDF) 3. REFLECTION This module is very different from the other modules in the Creative Media course, because it focuses on research. This journey through design research methodology and design research dissertation has been interesting yet challenging, as we are exposed to the systematic way of conducting research. I have learnt a lot on research, such as methodology, discussion etc. It is also crucial to include references from reliable sources and provide justification wherever required. Otherwise, the research would be not convincing and reliable as it is not backed up by academic sources.  Although I have faced many difficulties throughout both modul...
Read more

Publishing Design - Final Compilation & Reflection

-
Image
Publishing Design - Final Compilation & Reflection 28.08.2020 -  27.11.2020 (Week 1 - Week 14) Wong Kai Yi (0340236) Publishing Design Final Compilation & Reflection 1. INSTRUCTIONS Exercises Project 1 Project 2 Final Project 2. SUBMISSIONS Exercises Determining book size We are to take an A3 paper or stick 2 A4 papers together then fold it into half. After that, we have to determine our book size by making at least 3 sizes which are between A5 to A4. Fig 5.1 determining book size - red line (chosen size) Fig 5.2 determining book size - 32 pages cut out (untrimmed) Fig 5.3 determining book size - opened book (untrimmed) Here is a video of how it looks:  Fig 5.4 paged book before trimming Fig 5.5 Final 32 paged book Fig 5.6 Final 32 paged book Fig 5.7 Final 32 paged book Fig 5.8 Final 32 paged book Van de Graaf Grid Fig 5.9 Van de Graaf grid and with text Text formatting Fig 5.10 text formatting 1...
Read more

Brand Corporate Identity - Project 2

-
Image
Brand Corporate Identity - Project 2 28.08.2020 - ..2020  (Week 1 - Week 14) Wong Kai Yi (0340236) Brand Corporate Identity Project 2 1. LECTURE Project 1 2. INSTRUCTIONS Progress 11.09.2020 (Week 3) After checking our brand profiles, Mr Vinod explained to us how our brand profile was supposed to be. The brand value is a bigger aspect for the brand. 18.09.2020 (Week 4) Brief Brand Profile for my brand: Fig 2.1 Brand Profile 25.09.2020 (Week 5) For the progression, we are to do: 1. mindmap keywords 2. sketches (ideas and concepts) 3. finalize sketches 4. digitization 3 chosen ideas 5. rationale My mindmap for my brand is as below: Fig 2.2 keywords mindmap Then I drew the mindmap of possible symbols for the logo: Fig 2.3 symbols mindmap Ideas and concepts: Fig 2.4 Idea 1: video + rating Fig 2.5 Idea 2: community + rating Fig 2.6 Idea 3: shopping + video Fig 2.7 Idea 4: shopping + video Upon receiving feedback, ideas 1 to 3 did not work. Therefore, I h...
Read more