Ideation

I started the process by brainstorming and researching about TikTok filters that were available at the time. In the spirit of Hari Raya Aidilfitiri, I decided on making a Hari Raya-themed filter, that rules down the aesthetic of the filter later on. There were 4 categories of the University Effect House Campaign, and I decided to focus my process on the 'Engaging Games' category.I spent a few days going through Effect House creators in TikTok and how they come up with ideas for their filters. We had the chance to attend a talk by gameplus40, where he guided us on where and how should we start with filter Ideas.One of the happiest parts of Hari Raya to me was always the songs and music we got to enjoy as the festive season went on. Inspired by funny videos of people using a soundboard filter for their videos, I proposed a filter where people can play Hari Raya music in the filter, but make it gamified. As a person who has zero experience in music I decided to go with the sounds of a piano for the project so I searched piano-related TikToks too to understand the designs and mechanisms that I can apply for my filter.

Soundboard & Piano TikTok Video Example
(credits to @itsaubreyxo & @kiddquxn)

After my self research on potential ways I can make these types of filters gamified, I started sketching out ideas for my filter. When I was sketching, I had to take some things into consideration such as the limited space that is available & not to make the filter too heavy as the maximum capacity is 5MB. As my skills for Effect House was quite limited during the initial stages of this project, I had to figure out the mechanisms of the the filter first and continued my designing stage afterward.The basics of the filter mechanism is that the users will be guided to tap a "button" it will make a sound, which will be a piano note, and it will continue like a step by step guide.

Design Process

I started the mechanism part of my project by finding tutorials on how to make soundboards on Effect House. Afterwards, I started planning the musical part of the project with the help of my partner. My partner created a simplified version of the song "Suasana Hari Raya" by Anuar Zain & Ellina, which is an iconic song for Eid in Malaysia. He was able to reduce the song to only 6 notes and I finalised my sketch with 6 buttons for my gamified filter. 6 Buttons will appear on the screen and each of them will play a different note.I found assets online and each button of the filter is Hari Raya themed, such as different type of kuih & traditional food and items such as money packets. I also applied an Image of a Kampung for the background of the filter.

Initially, I planned to created a 'Tap' visual on the button that moves from step to step. However, when I learned to play the song on the piano, A key had to be played more rapidly compared to the other keys. Meaning a singular Tap did not make sense for the mechanism, to overcome this, instead of only it being 'Tap', I created 'Tap Once' and 'Double Tap' Buttons instead. 'Double Tap' allowed for the users to tap the note faster instead of putting a singular Tap ,twice, on a key.

Tap Once & Double Tap indicators that hover on top of buttons.

When arranged in Effect House, I had to make the buttons smaller than intended due to TikTok's UI and to created more white space. Furthermore, I added 'Tap the highlighted stuff' on top to easen users.I also created a Start Page that when a user tap on the screen the game starts & when the last button is clicked, a 'Thank You' page appears too.

Final Product & Reflection

When the the filter was completed, I had multiple people test it and one issue that I did not consider is when you double tap the screen, the front camera change to the back camera vice versa. It does not effect the filter per se but it does effect the recording part of it but it is generally was not a big issue.Reflection:-This project let me learn a whole new software that has always been in my bucket-list to learn. Throigh this project I was able to develop my development skill eventhough it was quite minor, it has opened my interest for programming. This project also made me understand some additional things when it comes to user experience. For example, the animation when the buttons are tapped became an indicator to the viewer's prespective, without the animation, the viewer of the video won't know which button the user tapped.Furthermore, this project has helped me experience being the programming side of a project rather than just the front-end as a designer. This opened to me being able to think a different or more practical way when designing. I hope I would be able develop more skills for effect house in the future and maybe also try to discover Spark AR.