# Overview The current banner that shows in-app when a license is going to expire soon is not in-line with our design system standards and could be improved to include things like the ability to dismiss it, better targeting, better visual design, etc... # Goals * Make the banner follow our design system * Provide clear and ample warning for when a license will expire * Provide a clear CTA for what to do * Allow the user to understand when their license will expire and once it has expired and what they are losing as a result # Requirements * Display warning banner as license expiration is approaching * Display subscription expired banner once the license has expired * Link to the customers app from the banner * Allow the banner to be dismissed. * For the final expiration banner, stop displaying it after 30 days. Allow the final banner to be permanently dismissed. * Explain to the user once they've been downgraded (design TBD?) - this banner would be dismissable and be permanent * Only display to account admins that have the ability to renew * Do not display to users with auto-renew on * Account for the difference in .com vs. self-hosted downgrade where .com is immediate and self-hosted is 14 days after the renewal date # G/W/T GIVEN: User is a billing admin for self-managed OR an `owner` for .com WHEN: It's 30 days from their renewal date AND they're logged into their account THEN: They will see the relevant [warning banner (.com)](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/dot_com_renewal_banners.jpg) / [warning banner (self-hosted)](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/self-hosted_renewal_banners.jpg) for their type of instance WHEN: They see the banner THEN: It will contain the date that their license will expire, a call to action to renew that links to the portal, and an overview of features they will lose if they downgrade to free WHEN: They click the CTA to go to the portal THEN: A new tab will open that takes them to https://customers.gitlab.com/customers/sign_in WHEN: They click to dismiss the banner THEN: They will not see the banner again until the next banner is set to display (Day 14/7, expired, or downgraded) GIVEN: The user has previously dismissed the banner WHEN: The time has come to display a new banner (Day 7, expired, downgraded) THEN: The new banner will display GIVEN: The user has not previously dismissed the banner WHEN: The time has come to display a new banner (Day 7, expired, downgraded) THEN: Remove the old banner and display the new one WHEN: The license has expired (.com) THEN: They will see the [subscription expired banner](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/dot_com_renewal_banners.jpg) WHEN: The license has expired (self-hosted) THEN: They will see the [subscription expired banner](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/self-hosted_renewal_banners.jpg) AND: When the banner is dismissed, it will not re-appear WHEN: They click to dismiss the license expired banner THEN: They will not see the banner again until the next session WHEN: License expired + 14 days (self-hosted) - The subscription is downgraded THEN: They will see the [subscription downgraded banner](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/self-hosted_renewal_banners.jpg) WHEN: Auto-renew is enabled THEN: The message will change based on this issue: https://gitlab.com/gitlab-org/growth/product/issues/143 GIVEN: The user is viewing the final banner WHEN: They dismiss it THEN: No longer display the banner again (permanently dismissed) GIVEN: The user has not dismissed the final banner WHEN: It's 30 days past their expiration THEN: Stop showing the banner # Solution | | Gitlab.com | Self-hosted | |-|------------|-------------| | Flow |  |  | | Designs | [](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/dot_com_renewal_banners.jpg) | [](https://gitlab.com/gitlab-org/growth/product/issues/102/designs/self-hosted_renewal_banners.jpg) | [Flows in Mural](https://app.mural.co/t/gitlab2474/m/gitlab2474/1575450132746/521acbe33ccf781a467cfa98021b564451c6968e) ### Copy for the banners <details> #### GitLab.com **Your subscription will automatically renew in [30/14/7] days** Your GITLAB_PLAN subscription for GROUP_NAME will expire on [EXPIRY_DATE]. After that, you will not be able to use {feature 1}, {feature 2} and {feature 3} as well as many other features. Main CTA: Renew subscription Secondary button: That’s ok, I don’t want to renew **Your subscription expired!** You didn’t renew your GITLAB_PLAN subscription for GROUP_NAME so it was downgraded to the free plan. Don’t worry, your data is safe. Get in touch with our support team (support@gitlab.com). They’ll gladly help with your subscription renewal. Main CTA: Review your subscriptions #### Self-hosted **Your subscription will automatically renew in [30/14/7] days** Your GITLAB_PLAN subscription will expire on [EXPIRY_DATE]. After that, you will not be able to use {feature 1}, {feature 2} and {feature 3} as well as many other features. Main CTA: Renew subscription Secondary button: That’s ok, I don’t want to renew **Your subscription expired!** No worries, you can still use all the GITLAB_PLAN features for now. You have 14 days to renew your subscription. Main CTA: Renew subscription Secondary button: That’s ok, I don’t want to renew **Your subscription has been downgraded** You didn’t renew your GITLAB_PLAN subscription so it has now been downgraded to the GitLab Core Plan. Main CTA: Upgrade your plan </details> ### Illustrations for the banners * [Subscription cancelled](http://gitlab-org.gitlab.io/gitlab-svgs/illustrations?q=illustrations%2Fsubscription-cancelled.svg) * [Subscription downgraded](http://gitlab-org.gitlab.io/gitlab-svgs/illustrations?q=illustrations%2Fsubscription-downgraded.svg) * [Subscription: auto-renewal / renewed](http://gitlab-org.gitlab.io/gitlab-svgs/illustrations?q=illustrations%2Fsubscription-success.svg) * [Subscription warning](http://gitlab-org.gitlab.io/gitlab-svgs/illustrations?q=illustrations%2Fsubscription-warning.svg) NOTE: the banner/form for giving feedback should be added later [via a separate issue](https://gitlab.com/gitlab-org/growth/product/issues/274) # Tracking Requirements * track when a banner is dismissed * track clicks to the customer portal