Create an 3D e-commerce tool for instagram

What it does

It showcases a product in 3D. You can change colors, move and resize the product

How I built it

I used substance to paint a more realistic texture using normal maps. Imported it on Spark and started to built the demo

Challenges I ran into

Initially my idea was to use the Deeplink functionality to enable online stores to dinamically change the displayed price on the filter just changing the linked URL. Just after almost finish implementing it testing it on the spark player I discovered it was not supported on Instagram. Also I discovered that its not already possible to change textures using just patches in Spark Studio. So I had to dive into documentation and figure out a way to do it through scripts

Accomplishments that I'm proud of

Finish the product and create scripts using Javascipt which is a language that I'd not used for a long time.

What I learned

Javascript reacitve programming and that although we use the same tool to produce the filters there are differences on the features supported by Fabebook and Instagram

What's next for DemoTennis

I want improve the textures of the 3D model and enable the user to choose different products. I hope that Facebook enables the netwoking functionalities in Spark filters soon.

Built With

Share this project: