digitalfabrik / integreat-app

React JS and React Native App for Integreat
https://integreat.app
MIT License
47 stars 14 forks source link

Banner to install app from store is not displayed when using web-app #2805

Closed dkehne closed 2 weeks ago

dkehne commented 5 months ago

Is your feature request related to a problem? Please describe. We want users to install the app on their phones over using the web app. Therefore, we want to notify the users about the app in the google play store.

Describe the solution you'd like When the web app is opened on Android phones and the android app is not installed, a banner that the app is available in the google play store. Since this is natively implemented on iOS, this is only an android issue. Reimplement the banner on iOS, see screenshot below.

This should work for for the other whitelables as well (e.g. malte, aschaffenburg).

If the banner is either closed or the link to the store is pressed, the banner should not be shown anymore until a specific amount of time has passed (to be discussed). To this end, a value might be saved in the local storage (preferable over cookies).

Describe alternatives you've considered

Additional context

Side note, in iOS, the banner is only shown on real devices, not in emulators.

LeandraH commented 4 months ago

I thought I might find something in the translations about this banner but I didn't. I think a design would be a good idea.

steffenkleinle commented 4 months ago

I thought I might find something in the translations about this banner but I didn't. I think a design would be a good idea.

@LeandraH we never provided the banner ourselves. This is something that should be displayed automatically by browsers using corresponding meta tags in the web app, see e.g. for ios here: https://developer.apple.com/documentation/webkit/promoting_apps_with_smart_app_banners

LeandraH commented 4 months ago

It's still there in iOS but you have to reset the phone if you've ever dismissed the banner on your phone. I'm not quite willing to completely wipe my phone to check since the banner to open the page in the app is the same banner according to Apple. And the banner is obviously not shown in the emulator :(

IMG_ADB1EF45C13C-1

It looks like Android never really implemented this banner. Or does someone with an Android remember things differently?

vthejay commented 4 months ago

Android: With a brand new device, Samsung A23 5G: Wenn I open integreat.app on the browser, there is no banner appearing, asking me to install the app. This happens on the landing page and also when I choose a region. Of course this is a brand new device and the app is definitely not installed.

steffenkleinle commented 3 months ago

I think this was never implemented for Android, at least not with the react native app.

steffenkleinle commented 2 months ago

I think we should discuss how to tackle this. At least it is not a bug/was never implemented. If we want this, we need to implement it ourselves. @dkehne should we still do this? Might need considerable amount of work.

dkehne commented 2 months ago

Maybe it was dropped when migrating from xamarin to react, but we should invest in that especially if it acceptable effort

steffenkleinle commented 1 month ago

@hauf-toni if we implement this for android browsers, should we just follow the design for iOS or do you want to create a custom design for it?

hauf-toni commented 1 month ago

@steffenkleinle since I would do it exactly the same way, a design based on the ios version is a great choice here, a custom design for android is not necessary.

steffenkleinle commented 1 month ago

@dkehne @hauf-toni what do you think would be a good time frame to show the banner again after the user dismissed it? 3 months?

dkehne commented 1 month ago

3 month sounds good, I am completely open for Antonia's suggestions

hauf-toni commented 1 month ago

Hmm, best practice would be a "respectful delay". Google and Apple often suggest waiting at least 7-14 days before showing a banner or modal again after it's been declined. this gives the user a bit of time, respects their decision, and still encourages them to download later. We could also include an option like "Don't show again" for the banner to reduce friction.

💡 My recommendation would be to make it contextual: We could set the banner to reappear when the user has completed a certain number of sessions (like five or more). This has the benefit to show the banner when the user has already seen what the app can do and is more likely to download it. Would that be possible with the data we currently collect? @steffenkleinle @dkehne

steffenkleinle commented 1 month ago

Hmm, best practice would be a "respectful delay". Google and Apple often suggest waiting at least 7-14 days before showing a banner or modal again after it's been declined. this gives the user a bit of time, respects their decision, and still encourages them to download later. We could also include an option like "Don't show again" for the banner to reduce friction.

💡 My recommendation would be to make it contextual: We could set the banner to reappear when the user has completed a certain number of sessions (like five or more). This has the benefit to show the banner when the user has already seen what the app can do and is more likely to download it. Would that be possible with the data we currently collect? @steffenkleinle @dkehne

I think in general this would be possible, but I am not sure if this is worth the additional effort. Do I understand correctly that you would not show the banner in the first session? @bahaaTuffaha has created two proposals already, lets have a look at them and then go from there. The problem is that we can't really know whether the app is installed or not, so we can only go with either one.

hauf-toni commented 1 month ago

I'll add my response to Bahaa here as well:

Hi Bahaa, in this case the banner should be visible, which would be displayed if the user has not yet installed the app.

I noticed something else: unfortunately, the contrast of the body text on the background is too low, here the specification is that at least a contrast of 4.5:1 must be met (currently 1.87). could you adjust the body text color so that this is guaranteed (e.g. with #1a1a1a)?

hauf-toni commented 1 month ago

@steffenkleinle The banner should be displayed in the first session and then - on dismissal - again after a respectful delay/a certain number of sessions.