Shop360 HK

Shop360 HK is a solution that allows local Hong Kong shops to showcase their stores online through 3D panorama images. The goal is to help these local businesses attract more customers.

Comment

Shop360 HK

Inspiration

In Hong Kong, many local businesses struggle due to lack of publicity. For 15 years, I've frequented an electronics/convenience store that doesn't even have a name, brand, website, or any marketing. It remains hidden, not because it's subpar, but because people are unaware of its existence. This inspired us to create Shop360 HK, a solution that provides local businesses with 3D panoramic images, allowing users to virtually experience these hidden gems.

What it does

Shop360 HK offers two main features:

  1. For Users: Explore and interact with local Hong Kong stores through immersive 3D panoramic views.
  2. For Shop Owners: Submit a simple email request to get their store featured on the platform. They can also add interactive hotspots to provide more information about their business.

How we built it

  • Frontend: React
  • Map Integration: Leaflet.js
  • Panorama: Three.js

Note: The github repo states that we have been working on this project before the time it started, but we actually copied the contents of our previous project and took the panorama script to edit, and so we also accidentally took the git files as well. Note: This project is currently a prototype without a backend.

Challenges we faced

Integrating maps proved challenging. Initially, we attempted to use Google Maps but encountered a paywall. We then discovered OpenStreetMap and Leaflet.js, which provided an accessible solution with user-friendly features for shop-specific map integration.

Accomplishments we're proud of

Completing a functional project in just two days demonstrates our dedication and discipline, especially considering this is only our second hackathon.

What we learned

We gained experience with new libraries:

  • Email.js
  • Leaflet.js

These tools have expanded our skillset for future projects.

What's next for Shop360 HK

  1. Implement a cloud database (e.g., Supabase) for data storage
  2. Develop a service to capture panoramic images for local businesses
  3. Add features such as:
    • Review ratings
    • Business metrics
    • Enhanced user interactions

Tech Stack

  • React
  • Three.js
  • Leaflet.js
  • Email.js

Shop360 HK: Bringing Hong Kong's hidden businesses into the spotlight, one panorama at a time.

Share this project:

Updates