Shelf-nu
Feat: PWA install prompt
After doing tons of research here. It seems like almost no app is doing a popup prompt for users.
I like the @rphlmr approach the most. Show after sign up + also via the notice popup we have. Both can be dismissed.
On the marketing website I will make a page for it too.
Desktop: Let's use the component we have for notices for this purpose. The black box will be a gif showing how to install on mobile. Full tutorial will send to this page: https://www.shelf.nu/blog/new-shelf-pwa-progresive-web-application-live-learn-how-to-use
Mobile: I would add it to the landing page after signup (Asset Index) / message can be dismissed
Dashboard: Using the existing notices component we will also promote the message and URL to marketing site.
On mobile menu (if they click skip):
Desktop: Let's use the component we have for notices for this purpose. The black box will be a gif showing how to install on mobile. Full tutorial will send to this page: https://www.shelf.nu/blog/new-shelf-pwa-progresive-web-application-live-learn-how-to-use
This component we already have so nothing new to develop here. We just need to change the content. Also would be good to change the cookie name so even people who dismissed it already can still see it.
Mobile: I would add it to the landing page after signup (Asset Index) / message can be dismissed
Okey so a few things here. I like the design and general visual approach but I have some feedback. Doing it after sign-up I dont think is enough. Users could sign up via desktop and open it later via mobile. Also there could be long existing users who also should be informed about it. Here would be my suggestion:
- Show it to any user that opens shelf(logged in) on mobile (not pwa). So if they are opening it from the browser
- Give 2 options for cta: "Remind me in 2 weeks" or "No thanks". They both close it, one does it for 2 weeks the other one forever. We can control it via cookie expiration.
- I think the text is not great. Installing PWA vs using in browser doesnt change the features you can access. At least not yet as we dont have any PWA specific features. I would write something like: "For the best experience, install shelf on your mobile device. Read more(link to extra explanation)"
Also looking at the example we have from Rapha, this seems to consider just iphones where we cant add an action for it and we want to show a short looping video showing how to do it. On Android I believe we can actually force a prompt for installing PWA directly from there. @hunar1312 could you please check that and confirm.
@hunar1312 I think you could already start on it. There is some technical stuff to already do:
- Detect iphone vs android
- Detect if user is already in pwa or not(idk if we can do that or we have to set up our own control)
- Prepare the modal that will trigger on mobile.
I will send you some code examples on discord.