[Hackathon Mini Series] — Vodafone VR
Welcome to our seventh blog of our mini series on our Hack-to-the-future hackathon. This time we have Meghal who was based in India during the hackathon talking about their experiences.
Hackathons are a breath of fresh air for those who dare to create what hasn’t been created, to try something new and different, and to break out of their shell and push the envelope of their skills. This is an experience where you feel excited, nervous, rushed, motivated, tired, passionate, enlightened all within few hours. The Vodafone hackathon is where ideas become a reality, the unthinkable is achieved, and disruptive solutions are born. In the month of October, Vodafone hosted “HACK TO THE FUTURE” — A hackathon to create the future, where people gathered in two separate locations, Pune (India) and London (UK), and these two locations across the globe connected virtually and once again the ideas that flowed were downright crazy and brilliant. While as always, the hackathon resulted in new products, features, and solutions, this time we also got the opportunity to unleash our superpowers in the hackathon.
The Power of Crazy Innovation:
“People who are crazy enough to think they can change the world are the ones who do.” — Steve Jobs.
In 2 days, that was exactly the attitude the determined hacking teams embraced. The need to transform and innovate in a highly competitive environment motivated the teams to adopt new ways to seek change and improvements. Despite the chaotically fast and short-lived nature of this hackathon, it inspired participants to focus on a problem statement and think about innovations with a diverse set of inputs.
And what would be more innovative than creating a VR Store for e-commerce clients of Vodafone?
The 3Dimensional 360° look and feel of VR store would give a great in-store shopping experience wherein distinct rooms/sections would be created to showcase various products that the store has to offer. The core idea here was to provide the consumers with a far more immersive shopping experience compared to the online one. In theory, with just a tap on the mobile, they would immediately find themselves in the midst of a virtual superstore, with the flexibility to browse the products in a similar way to that of a physical store.
We all are aware of the pandemic years world went through, locking us in our homes, restricting us from walking into a physical store for purchases and how it impacted customer engagement and sales.
So, keeping all that in mind we decided to tackle above problem statement by creating VR-based store that would not only provide customers a smoother 360-store experience, ability to access remotely, but also offer immediate assistance on request.
As they say, coming up with a great idea solves half the problem, it was time to focus on the other half — Execution.
As per the agenda, the Hackathon started off with a bang on Day 1, a presentation extending a warm welcome to all the participants, introduction of teams, key-note speech, and summary of what to expect for the next 2 days. 110+ participants, 14 unique ideas, 2 different time-zones and one GOAL — ‘It’s all about taking chances, trying new things, having fun, making mistakes and LEARNING from it.’
Our team comprised of 6 highly motivated hackers (yes, that’s how we called ourselves at the hackathon), and our hacking began with a brainstorming session. Our first challenge was to come up with a design for the store and set up a User-Interface. We came up with a design prototype and identified initial task-list — exploring the background 3D images, implementing the surface coordinates at the required position, improving the UI (User Interface) styles, rendering the 2d images on the 3d surface etc.
With roles and responsibilities identified for each member, tasks assigned based on knowledge and expertise, we started hacking with ‘The Plan’. Our focus was virtual reality, so we decided to code with React 360 — framework for building interactive 360 experiences with React that runs in your browser (Desktop and Mobile) and supports VR devices. We used Three.JS ray-caster functionality for interaction where “object picking” is defined as “the process of figuring out which object a user clicked on or touched”. A pointer is cast from your mouse or finger (on mobile) through the frustum of the scene to the object that it intersects. We created the QR code link to make sure users would be able to open the app on the mobile devices (only Android for now). We hacked for few hours straight and were totally engrossed in coding, when we heard someone’s stomach rumbling, and in seconds, laughter filled the room. Well, you can’t be on a coding marathon and expect innovation on an empty stomach. We decided to take a break, luckily, we had pizzas and cold drinks waiting for us. Like a car, your brain functions best when it gets premium fuel, and we were back at hacking for almost 4 hours again. This is the Parkinson’s Law at work, wherein increasingly complex work relatively induces procrastination according to the amount of time available. We wrapped-up Day 1, with few achievements, ongoing challenges, stress, learnings, and a plan for the next day.
We started Day 2 with a quick kick-off session including key-note speech, in sync with London as per the agenda and dived right into hacking. Our energy and excitement were at peak, sailing through bugs, progressing well but it all came to an end with what no one would want in a hackathon — Our app stopped working all of a sudden! 🙁. We were able to navigate to the app using QR code but none of the functionalities were working. We spent an hour trying to figure out what went wrong, removed all connections, and reconnected them, tried a dozen more things we could think of, but nothing worked. We panicked as we were close to the presentation hour. A ray of hope — ‘Git version control’- is what saved us. Isn’t this why GIT developers made this amazing feature 😊. We reverted to the commit that was working fine and with the help of git history were able to fix the issue. A sigh of relief, and an important lesson learnt. Not so secretive, but valuable one for you all -
A quick tip: One missing/misplaced bracket can ruin your whole hackathon, I mean App. So, never underestimate importance of linting-rules/using code-editors that highlights linting errors/fixes it (Preventive Measure) and Version control (Reactive Measure).
Anyways, all the hustle and bustle of 2 days boiled down and we were ready for a short 7-minute presentation with demo in front of the judging panel and audience (with audience poll as judging criteria included, it would be fair to say all the hackers were judges too!!), and after much deliberation, the panel and audience picked the top 3 hacks that made the difference in the 12-hour coding marathon. Sadly, our VR shop wasn’t amongst the winners, but we still got a lot of positive emotions for being able to create something vastly different from our day-to-day work in such brief period. And frankly, meeting people, the learnings, the effort, the result and all the fun — whole experience was all worth it!!
To experience our VR store first-hand, scan the below QR code. (Note: only Valid for Android Devices)
For IOS device users and others, please check the video.
This is not the end; it is just the beginning.
We are not planning to stop with those 10 hours — we are already waiting for the next hackathon where we want to expand the idea with additional functionalities like adding a bot that does the work of a sales rep in-store, selling not only products/devices but even NFTs, providing a lot better user experience etc. One of the advantages of a virtual showroom being cost effective/cheaper to set-up unlike physical showroom which requires constant maintenance, upgrade and incurred cost is certainly a deal breaker.
In general, we understood that with new trends emerging every other day, users want to opt for new products and services. However, due to lack of time and other constraints, users might not traverse or purchase their preferred trend right away. Behold! Virtual Store would be there to rescue all of you who like keeping up to date with latest trends. Just a tap in the app and you would be able to find/explore right options as per your need, anytime you want to, with the help of a bot-sales rep and from the comfort of home.
Learnings
Finally, what we learnt and would advise everyone who is planning to be part of a Hackathon:
- Understand the Theme and Judging Criteria
- Read/Understand all the instructions
- Prepare and Plan — Create a To-Do List and Prioritise tasks
- Simplify, simplify, simplify — Clearly define the problem you are trying to solve rather than working on all possibilities.
- Work smart, not hard — Relax, take breaks, worrying won’t solve your issue.
- Time is precious — Take feedback regularly
- Use versioning to avoid last minute coding and errors.
- Present like a boss — Focus on Presentation and Details (do not leave it for last minute)
- Practice Matters — Mock Run your presentations to time-box and avoid any technical glitches.
- Utmost important one — ‘Don’t forget to have fun, it’s about learning and having fun than winning’.
We experienced the joy of being part of the hackathon, and to all the tech geeks out there, if you haven’t participated in one, grab the very next opportunity you get. Add it to your bucket list right away!!!
Want to know more?
If this article has inspired you, and you want to know more please reach out to us on our various social media channels.
If you want to work with us, find us on LinkedIn and drop us a message, we would love to hear from you! ✉️
