2056 Raffle

Inspiration

After recently watching some shows like Electric Dreams and Talesfrom the Loop I wondered what a raffle might be like in the future. Imagined what some common products might look like or do that would be not so out of the ordinary in a couple decades.

What it does

It generates a random number for your raffle ticket and prompts you to check if you are a winner. Every time you open the experience you'll get a different number and the prizes you win are also random.

How we built it

Used A-Frame, some 3D models with CC0 license, an AI generated texture with a dissolve shader and voice recordings. The experience is using world tracking and there is also a shader to create a shadow below the objects, which are floating in the user's space.

Challenges we ran into

At first I wanted to make it more socially engaging by adding a system that could add a message into the experience, like a postcard. The message would then be copied to the URL parameters and that same link would be shared with other users which upon opening the experience would see the message, write their own and send to other people. had to drop this idea since the way Zappar hosts the experience does'nt work with URL parameters.

When thinking of products I wanted to explore an option that can add more fun into the mix rather than just visualizing the product you would like to buy at an e-commerce experience. So I thought of a raffle, which brings some excitement for the user, will they win? and if so then what will they win? Will they try their luck again or share it with friends and realize there are different prizes? Certainly makes things more interesting.

I also wanted to make an "uncover" effect once they won the prize to add some more mystery. Then I ran into some issues with the dissolve effect as I wanted it to fade in when the prize would be uncovered, form a sphere and then dissolve, having the prize appear. This didnt work as intended as the shader had its own timing, making it impossible to get the timing perfectly for this effect. Opted for having 3 layers with different timings and a different effect to make up for it.

Accomplishments that we're proud of

Was proud to pivot into a different idea after not being successfull on the original one and come up with some interesting ideas for futuristic products by using already made assets of our modern world objects.

What we learned

Learned to create a nice effect with the dissolving shader, adding some layers with slight changes in colors and made a randomly generated raffle ticket that will show each number one by one, allowing to add suspense and sound effects as it goes.

What's next for 2056 Raffle

Adding more random prizes of course! Wanted to add 5 different ones to keep people trying their luck (and winning) and uncovering different futuristic prizes with products we can only imagine today.

Built With

• a-frame
• css
• html
• javascript