Skip to content
Snippets Groups Projects
Closed Better UX for Project Creation
  • View options
  • Better UX for Project Creation

  • View options
  • Better UX for Project Creation

    Closed Issue created by Haris Delalić

    The Problem

    When creating new projects from a template or by importing existing data, the user experience is not conducive to the discoverability of these features or an easy understanding of the flow.

    "Create from Template" and "Import Project" options are hidden behind tabs, which leads to two potential user experience issues:

    1. The user doesn't notice the tabs and doesn't consider these options before creating the new project. This problem is exaggerated by the fact that, once the project is created, it is no longer possible to apply a template or perform an import.
    2. The user may notice the tabs but may assume that they will still have a chance to apply a template or an import, given that the tabs pattern looks a lot like one that may "walk" the user from tab to tab before the project is finally created. Similar to an online checkout experience. See the example image below: image

    The Solution

    A new UX flow that offers all 4 project creation options as equal choices and forces a conscious decision on which "adventure" to choose.

    Additional solution discovery of this flow: #25647

    Solution Validation

    • Create solution prototype
    • Determine research goals
    • Design user research script
    • Conduct user research
    • Synthesize the research results
    • Apply the conclusions to the solution

    Summary: TBD

    Solution validation issue: #217033 (closed)

    Long term prototype ideation

    InVision prototype link

    Images

    These are the illustrations for the new "tabs"

    New Blank Proj Create From Template Import Project CI/CD External Repo
    create-new-project-md.svg create-project-from-template-md.svg Import-Proj1.svg CICD-Repoj1.svg
    - Landing page Blank Project Import Project CI/CD External Repo
    Before - Screen_Shot_2020-04-13_at_12.15.52_PM Screen_Shot_2020-04-13_at_12.16.10_PM Screen_Shot_2020-04-13_at_12.16.20_PM
    After Import_1.0 Import_1.1 Import_1.31 Import_1.41

    Text

    This is the text to be used for each one of the choices, below the new icons:

    Create new project
    Create a blank project to house your files, plan your work, and collaborate on code, among other things.

    Create from template
    Create a project pre-populated with the necessary files to get you started quickly.

    Import project
    Migrate your data from an external source like GitHub, Bitbucket, or another instance of GitLab.

    Run CI/CD for external repository
    Connect your external repository to GitLab CI/CD.

    Telemetry

    We should collect metrics on the tab/panel clicks to be able to measure user interaction from both variants, to be able to accurately measure whether there's an improvement in engagement or not.

    This page may contain information related to upcoming products, features and functionality. It is important to note that the information presented is for informational purposes only, so please do not rely on the information for purchasing or planning purposes. Just like with all projects, the items mentioned on the page are subject to change or delay, and the development, release, and timing of any products, features, or functionality remain at the sole discretion of GitLab Inc.

    ✓ 6 of 6 checklist items completed · Edited by 🤖 GitLab Bot 🤖

    Linked items 0

  • Loading

    Activity

    • All activity
    • Comments only
    • History only
    • Newest first
    • Oldest first
    Loading Loading Loading Loading Loading Loading Loading Loading Loading Loading