RouteRewards

🚀 Inspiration

Marketing research shows that people demonstrate 25% better recall when engaging with 3D graphics environments. We are creating a powerful marketing platform for retail locations at RouteRewards by combining Google's cutting-edge Photorealistic 3D Maps with gamification.

82% of marketers plan to use more retail location data over the next two years, with traditional marketing often struggling to meaningfully connect with users during their travels. Our solution transforms everyday journeys into adventures that benefit both consumers and retail businesses - and by incentivizing users to explore franchise locations along their routes with redeemable vouchers, we create a dynamic marketing channel that drives foot traffic and recall while delighting customers with an engaging experience.

🌟 How RouteRewards uses the 3D Canvas as a Marketing Device

1. Gamified Engagement: Leveraging Google's photorealistic 3D maps, RouteRewards encourages customer memorization of location structures and routes to franchise locations through gamified incentives. Users to earn points and redeem vouchers by interacting with franchise locations on the map, and are challenged against a time limit to find and remember nearby locations.
2. Franchise Discovery: Highlights participating franchise locations along the route, revealing important location details such as open status and distance as they are clicked. Sampled is the likes of McDonald’s, Starbucks, and KFC.
3. Rewarding Exploration: As played, RouteRewards reveals new locations along common routes, making it easy to find a franchise on your journey, road trip, or just daily commute.
4. Dynamic Route Mapping: Visualizes the journey with immersive 3D maps and polylines.
   

🛠️ What It Does and How We Built It

RouteRewards is an interactive web application that gamifies everyday travel and creates a rewarding experience for users and serves as the perfect marketing platform for retail businesses attempting to capture this daily traffic

1. Frontend:

   • Developed with Next.js and React, leveraging the Google Maps JavaScript API for map rendering.
     
   • Integrated Photorealistic 3D Maps for an immersive visual experience, using gmp-map-3d for rendering and gmp-polyline-3d for route visualization.
     
   • Utilized custom markers and interactive 3D models to represent franchise locations dynamically.
     

2. Backend:

   • Built using Next.js API Routes with the extensive integration of Google Maps Platform APIs, including:
     
     • Directions API: To calculate routes and provide step-by-step navigation.
       
     • Places API: To locate franchise locations along the route.
       
     • Place Details API: To enrich franchise data with operating hours, ratings, and more.
       
     • Geocoding API: To streamline user route inputting.
     • Distance Matrix API: To calculate travel time and distance to each location.
       

3. Game Mechanics:

   • Designed a point-based system where users earn rewards by clicking on franchise markers.
     
   • Generates random vouchers for users at the end of the journey based on their points.
     
   • Dynamically tracked scores for each franchise.

4. Interactive UI:

   • Created easy to use modals for starting the game, showing rewards, and displaying franchise details.
     
   • Streamlined funnel to encourage users to easily learn and return to play again.
   • Designed a responsive and user-friendly interface styled with Tailwind CSS, supporting both light and dark modes.
     

💪 Challenges We Faced

Real-Time Map Updates:

• Managed real-time interactions like marker clicks, dynamic route rendering, and camera movements efficiently on the 3D map.
  

🏆 Accomplishments We’re Proud Of

• Successfully integrated Google’s Photorealistic 3D Maps for an immersive and visually stunning user experience.
  
• Built a seamless gamified system that connects users and brands through meaningful interactions.
  
• Optimized geospatial API usage to handle multiple requests efficiently.
  
• Delivered a fully functional app that combines geospatial technology, gamification, and marketing within the given timeframe.
  

📚 What We Learned

1. Geospatial API Expertise: Hands-on experience with Google Maps Platform APIs, including Directions, Places, and 3D Maps & Objects.
   
2. Gamification Mechanics: Leveraged gamification to create a fun and rewarding user experience while adding value for businesses.
   

🔮 What’s Next for RouteRewards

1. Franchise Expansion: Partnering with more franchises and expanding reward options and tiers.
   
2. Genre Expansion: Reaching out to other industries such as retail chains, entertainment venues, and clothing stores.
3. AI Integration: Using AI to personalize franchise suggestions and optimize routes based on user preferences.
   
4. Social Features: Adding leaderboards, challenges, and social sharing options to enhance engagement.
   
5. Enhanced Gamification: Introducing levels, achievements, and exclusive rewards for long-term user retention and replayability.
   
6. Mobile App Development: Creating a mobile version for on-the-go access, integrating native GPS for better user experience.
   
7. Multi-Mode Travel Support: Adding options for walking, biking, and public transport routes to widen user base.
   

Built With

• 3dmodel
• google-3d-maps
• google-maps
• google-places
• nextjs
• react