Skip to content

feat(EmptyStates): Update empty state docs

Jarek Ostrowski requested to merge update-empty-state-docs into main

KR

Closes #1051 (closed).

Empty state goals (As stated in these changes)

  • Increase feature adoption.
  • Improve learnability and feature discovery.
  • Improve usability.

Details

Follow up from the Empty State OKR to identify and determine empty state variants and use cases.

General assumptions:

  • Empty states should not be used for errors, alerts should be used for system errors.
  • Contains a title and/or description to describe why there's an empty state.
  • Can contain a CTA/Button to take action
  • Empty states can be small, like when they're nested in Settings
  • Empty states don't require an illustration
  • Descriptions should explain why there's an empty state
  • Banners look similar to empty states, but are used to promote features outside of the feature they're promoting.
  • Can be static, but can also be intelligent by providing suggestions to content that already exists.
  • Empty states are removed once a user takes action to add content or when content exists.

Empty states

Blank content

Assumptions:

  • Appears when no content exists, but is configured and available in the current license.
  • Contains a method for creating content:
    • CTA/Button to manually create content, if content can be manually created (Todos can't be created)
    • Instructions (Empty repository)
  • Can go beyond "static". For example, instead of encouraging the manual creation of content, provide suggested content to already that already exists, like when an Epic contains 0 related issues or a GitLab CI file based on code that already exists in the respository.
Example blank-content

Configuration required

Assumptions:

  • When a feature requires configuration in order to create content.
  • With "default to on", all features will be available even if they're not configured yet.
  • Contains a CTA to assist the user with configuration.
    • Link to documentation
    • Interactive configuration ("Click to configure" demo/template)
Example configuration-required

Empty search results

Assumptions:

  • Appears when no results are found after a search or filter
  • Does not contain a CTA.
Example Screen_Shot_2021-09-15_at_2.54.58_PM

Higher tier feature

Assumptions:

  • Features above current license are accessible, even though they're not usable in the current license.
  • Contains a CTA to upgrade their license
  • Redirects user back to this page once upgraded
Example upgrade-required
Edited by Jarek Ostrowski

Merge request reports