AndZyk Posted August 4, 2020 Share Posted August 4, 2020 (edited) The ecumenical city pilgrim trail in Villingen, Germany is a small trail through the city where you can visit churches and other places of interest. This Progressive Web App is a small website to guide visitors through these places and give additional informations. You can install it on your smartphone or tablet and walk the trail with it. app.stadtpilgerweg-villingen.de Features: Interactive Map Progressive Web App Interactive Map Before entering the map you get a little tutorial where you can choose between two routes, the standard trail or a more accessible trail. You can track your position on the map and click on the markers. Each marker is a view with additional information to the place. The views can contain texts, quotes, images or a chat element. The map was realized with Leaflet and styled with Mapbox. Progressive Web App The website can be installed as Progressive Web App on your smartphone or tablet for a better experience. The PWA remembers the last visited view and has no unnecessary browser navigation. It can also partly work offline and caches almost everything. The PWA was realized with the help of Workbox. Modules used: Repeater Matrix ProCache Map Marker (Google Maps) Sitemap ProcessWire Upgrade TOTP two-factor authentification Tracy Debugger Regards, Andreas Edited August 23, 2020 by AndZyk Fixed typo 9 Link to comment Share on other sites More sharing options...
LostKobrakai Posted August 4, 2020 Share Posted August 4, 2020 Nicely done. I like the color schema a lot. You might want to make the "Los geht's" CTA a bit more clear though. I wasn't really sure what I need to do/click on the introductory page. Also I feel more whitespace after it wouldn't hurt as well. 1 Link to comment Share on other sites More sharing options...
AndZyk Posted August 4, 2020 Author Share Posted August 4, 2020 Thank you for your feedback. ? More whitespace for the buttons is a good idea. I added a little bit more whitespace to the buttons at the bottom. Link to comment Share on other sites More sharing options...
psy Posted August 9, 2020 Share Posted August 9, 2020 @AndZyk great work. ? Only other feedback I have is that the buttons "What do I see?", "What do I hear" & "How does the hustle & bustle affect me?" don't go anywhere/show anything. My cursor changed from normal arrow to an 'edit' icon, not pointer on hover. Is this supposed to happen? I'm using Chrome on an iMac 1 Link to comment Share on other sites More sharing options...
AndZyk Posted August 11, 2020 Author Share Posted August 11, 2020 Thank you. ? Those "buttons" are actually just a list that looks like a chat, for example like in a messenger. You should see a text select cursor on hover over the text. ? Link to comment Share on other sites More sharing options...
psy Posted August 11, 2020 Share Posted August 11, 2020 OK @AndZyk get it after the explanation but a bit confusing without that knowledge. The cursor changing to a text selector on edit threw me. Maybe turn off pointer events to let the user know it's just a display thing? Link to comment Share on other sites More sharing options...
AndZyk Posted August 12, 2020 Author Share Posted August 12, 2020 Strange, that you can see a different cursor. There are no pointer stylings on this element and you should get the standard text cursor. Maybe it is a caching issue. Either way this website was designed for smartphones and tablets, so visitors don't see a cursor anyway. ? Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now