Web System Case Study
QR Code Location Sorting System
A lightweight web-based QR system designed to collect scan activity and help sort users by town/location without relying on multiple tracking links.
The Problem
- Creating separate QR codes per town would be time-consuming
- Tracking links were not preferred for this workflow
- Manual sorting after scans needed to be easier
The Solution
A single QR-based web page that asks users for location permission, captures location data when allowed, and provides a fallback option when users continue without location.
Core Idea
Instead of generating multiple QR codes for different towns, the system uses one QR code and sorts users based on captured location data or submitted scan information. This reduces setup effort and keeps the process manageable.
UX Consideration
The location permission prompt was designed to prioritize “Allow Location” while keeping “Continue without location” available as a smaller optional action.
Privacy-Aware Flow
Since browser location access cannot be forced, the system respects user permission while providing a fallback path for users who deny access.
Key Features
Tech Stack
- HTML
- CSS
- JavaScript
- Browser Geolocation API
System Flow
User scans QR → Web page opens → Location prompt appears → System captures location if allowed → User continues with or without location.
Challenge
A major limitation was that location permission cannot be forced by the website. The system had to be designed around user consent, meaning the fallback flow became an important part of the overall user experience.
Outcome
- Reduced need to create multiple QR codes
- Created a more scalable scan workflow
- Improved location-based sorting process
- Introduced practical geolocation handling
What I Learned
This project strengthened my understanding of browser permissions, geolocation limitations, user consent, and practical UX decisions for real-world web tools.