Advanced Interactive Design - Task 01

05/04/2023 - 06/06/2023 / Week 01 - 10
Ellyn Saw Mei Hui / 0353358
Bachelor of Design (Hons) in Creative Media 
Advanced Interactive Design Task 01

LECTURES

 12.04.2023 Week 02 
Lecture #2 - Effect house template testing
This week, Mr Razif told us to explore the various templates in TikTok Effect House.
Testing face filter on Effect House

He also asked us to download and test out some of the assets in Effect House.

Tested out 3D frog asset


WEEK 1: INTRODUCTION
In our first class, Mr Razif briefed us on the MIB for this module. He also introduced us to our first task which is to create a TikTok filter using Effect House. He also mentioned that there will be a filter competition hosted by TikTok Malaysia and our works will be entered in the competition. We were also told to have Effect House and Adobe Animate CC downloaded by the next class.

TASK 1: 
♡ To create a TikTok filter for the competition
♡ Can be a filter on any of these topics - randomiser, engaging game, fashion & beauty or 3D effects
♡ Has to be Android and IOS friendly

PROGRESS ( WEEK 1 - 05/04/2023 ) :  
♡ Mr Razif also told us to do some research about TikTok filters (or Instagram) before we start to generate our ideas. We are to provide 3 references and 3 ideas for the filters during class on W2. 

WEEK 02 - 12/04/2023 :  
♡ (this task would be on hold until we attended the TikTok workshop). During the feedback session,  I was told to do more research as my previous ideas (linked above) were not sufficient so I looked through TikTok again for some new ideas. I started going down the rabbit hole of funny filters as there are a lot of those on TikTok but I also wanted to create something that has our Malaysian touch to it. 

NEW IDEAS:


  filter with companion 

https://vt.tiktok.com/ZS8EKWwGm/


  eat nasi lemak like Pacman

https://searix.net/blog/8-ideas-for-instagram-ar-games-snapchat-facebook/


 create a filter to celebrate penang heritage day (no ideas or inspo)


WEEK 05 - 02/05/2023 : 
♡ The workshop was held on campus and everyone in our class had to attend. They invited speakers for TikTok Malaysia as well as a speaker that often creates filters using Effect House.

Fig1.2 Tiktok Effect House workshop

WEEK 06 - 10/05/2023 :  
♡ After showing Mr Razif my new ideas (shown above), we decided to go with the nasi lemak game filter as it was the one I wanted to try out the most. The idea is to make the ingredients of the nasi lemak fly from the left to right side of the screen and users have to blink to stop the ingredients in place.


♡ I started working on the assets that are going to be used in the filter first.

Fig1.4 Overview of nasi lemak assets

♡ Once the assets were done, I imported them into Effect House and started working on how to make the assets fly in from the left to right side of the screen. I was able to figure out how to input 2D images (which are my assets) into the face mesh but I was unable to figure out how to make them move from the left to the right side of the screen. There were very limited tutorials on this so I had to make do with what I had and change my idea.

Fig1.5 Filter draft 01

♡ Since I already have my nasi lemak asset ready, I decided to change my filter idea to Malaysian food as face filters instead. Users can change the filter to different food by tapping the screen. Since I haven't shown this idea to Mr Razif, I decided to only create another food asset which is curry puff.

Fig1.6 Karipap (curry puff) asset

WEEK 07 - 15/05/2023 :  
♡ After showing Mr Razif my progress he said I can proceed with my new idea so I started working on the other assets for my filter. 

Fig2.1 Chicken rice asset

Fig2.2 Cendol asset

Fig2.3 Air sirap (syrup) asset

♡ I came across this tutorial on making face filters so I decided to follow the steps provided in the video. With my limited knowledge and experience using Effect House, this tutorial was surprisingly quite easy to follow and understand.



♡ Once I was able to upload all my assets into the face mesh, it was time to figure out how to make the 'tap to switch' interaction. Sadly, I am once again stuck on this part because there were limited tutorials out there that cover this topic. 

Fig2.5 Filter draft 02

WEEK 09 - 31/05/2023 :  
♡ I was able to share the issues I encountered while working on the filter with Mr Razif and he told me to send him my working file so he could help me figure out how to make it work. He also mentioned that I could add a label somewhere to showcase the names of the food. 

Fig3.1 Label design

♡ I started to design the labels after class and tried them out

Fig3.2 Label test on filter

WEEK 10 - 06/06/2023 :  
♡ At last, Mr Razif was able to figure out how to make the 'tap to change' interactivity on Effect House. He also recorded a tutorial so I just followed his tutorial.

Fig3.3 Script panel for my filter

Fig 3.4 Testing the tap-to-switch button

♡ After that, I submitted my filter to Effect House and waited for their approval. 

Fig3.5 My filter under review

♡ Eventually, my filter was approved!

Fig3.6 Approved filter on Tiktok

FINAL SUBMISSION :


QR CODE to my filter
Fig4.1 QR code to my filter

Fig4.2 Demo video of my filter

Fig4.3 FINAL food assets overview

Fig4.4 FINAL label design


FEEDBACKS 
Week 02 - 12/04/2023
Lecturer Feedback: 
- good job
- do more research after this as now it is just very surface level

Week 06 - 10/05/2023
Lecturer Feedback: 
- nasi lemak game filter can be any food actually
-

 penang heritage day filter could be AR world but would be difficult to do

- go with the nasi lemak game as it is the one I like the most


Week 09 - 31/05/2023
Lecturer Feedback: 
- maybe add labels to let users know the names of each food
- air sirap was designed very nicely
- could also add a 'tap to switch' prompt in the beginning, to let users know

REFLECTIONS :  
Experience - 
Since I had experience with using Spark AR Filter for my diploma, I thought the task would be somewhat similar but I was wrong. Personally, I feel like Effect House is much harder to use than Spark AR. I also felt like since Effect House is fairly new, there were lesser tutorials out there so that definitely contributed to the struggles I faced. Overall it was a really fun task and I really enjoyed it as we were able to explore a totally new app that creates filter and let our creativity flow. 

Observations - 
I observe that it's pretty easy to create filters if you are doing simple face filters and using ready-made assets in the Effect House library. As long as the idea is there, it's quite easy for someone with zero knowledge to create a filter, just like the speaker who was invited to the TikTok workshop. He mentioned that creating filters was just a hobby for him and that he can create most of his filters in less than a day. He mostly used ready-made assets so the progress was much faster for him compared to ours where we had to draw our own assets. I also observed that filters that need visual scripting are also much harder to complete.

Findings - 
I found it cool that there was a whole section dedicated to filter assets on Effect House. Users can access the library and download any assets there to create their own filter. During the lecture session where Mr Razif told us to test out the asset library, I found that it was quite troublesome to use some of those assets as some of them could not be downloaded or were not compatible with MacOS? Some of the assets had colours but when downloaded and inserted into my laptop it became b&w or grey.



Comments

Popular Posts