Advanced Interactive Design / Project 2
02.11.2022 - 20.11.2022 (Week 10 - Week 12)
Lulu Luisa Linardi / 0349358 / Bachelor of Design (Hons) in Creative Media
Advanced Interactive Design
Project 2: Interactive AR Application
LECTURES
![]() |
Fig 1.0: Thumbnail |
INSTRUCTIONS
Task 2: Interactive AR Application
Augmented Reality Experience Filter
AR is the latest form of interactive design nowadays. Students are required to develop AR applications with AR interactivity that will detect user faces and expressions.
*Software Requirement:
Spark AR Studio
Students are required to develop an AR application for an online store. For example, an AR application for glasses, hats, or cosmetic shops. Customers of the shop will use the AR application to try different options before making their purchases. Students are welcome to propose new AR application ideas as well but must obtain approval from the lecturer.
Since I chose a sunglasses brand as my first project, it is safer for me. It doesn't have to be complicated and have various effects. So I made 3 different types of sunglasses and put 6 backgrounds. Users can click on the UI button to change the sunglasses type, and can simply tap once to change the background.
![]() |
Fig 2.1: Work process |
While doing this, I encountered an error. The glasses would disappear when we put our device a bit farther. However, I got the solution from the lecturer and thankfully it can be solved right away. I don't know why my device can't support the AR filter to be used on my Instagram. It was a bit sad that I can't try it directly on my own. Even my friends can use the filter when I asked them to try it. So in the end, I only got to try the filter on the Spark AR app that I downloaded on my phone. Even though I can't use the AR filter I created on my own device, I still manage to submit it to the Meta Spark AR and publish it to my Instagram so people can try it.
Fig 2.2: AR filter overview #1
Fig 2.3: AR filter overview #2
![]() |
Fig 2.4: AR filter insights |
Fig 2.5: AR filter on my Instagram profile
Fig 2.6: AR filter overview on my Instagram |
You can try the filter by scanning this QR code or clicking the link I provide below.
https://www.instagram.com/ar/446256684342296/
Fig 2.7: QR code for Instagram AR filter |
And finally, below is the folder of the final outcome compilation.
https://drive.google.com/drive/folders/1Gssez_2BkpY7dvZsO6yN7gUXhZ5MPArp?usp=share_link
REFLECTIONS
This project is kinda a rushed one. We only got 2 weeks to work on this. There was not much material provided by the lecturer, so we had to find the tutorial ourselves on the internet or youtube. This is also my very first time creating a filter for Instagram, so my skill on Spark AR is not that great. However, despite those shortcomings, I surprisingly really enjoyed working on this project. Compared to the other projects from this module, I think this one is my favorite. I got to learn about creating AR filters for social media, which is not all people can do. This can perhaps be a kickstart if I want to be an AR filter creator in the future. Overall, I had so much fun!