Progressive Web App: Kasbergen's Kaart
s'-Hertogenbosch
A first attempt at building a progressive web app. Themed after Harry Potters Marauders Map, say the secret line to see the locations of all teachers of Avans University Of Applied Sciences.
Mockup psd created by pmvchamara - www.freepik.comFeature-packed
s'-Hertogenbosch
Kasbergen’s kaart is a full-fledged PWA with a manifest, service workers, cache and device functions.
It’s content is protected by a password. Using the microphone and google’s speech recognition API, say the magic words to reveal the map.
In the concept, the location of any app-user is shown in the map. This is just a simulation. However, the location function is fully implemented for the users device! Making use of MapBox, a fully customized map implementation with 3D capabilities could seamlessly be realised.
The PWA uses Bootstrap for its panels, wherein you can use your devices camera to take a profile picture and turn on device notifications!
Add the PWA to your home screen to use it In Fullscreen and benefit from its cache functionality to use the app offline!
Kasbergen’s Kaart is fully responsive and has different design approaches for big and small screens.