Skip to content
GitLab
Next
    • Why GitLab
    • Pricing
    • Contact Sales
    • Explore
  • Why GitLab
  • Pricing
  • Contact Sales
  • Explore
  • Sign in
  • Get free trial
  • GitLab.orgGitLab.org
  • GitLabGitLab
  • Issues
  • #15622

Graphic visualization of `.gitlab-ci.yml`

Problem to solve

A .gitlab-ci.yml file can be difficult to understand, and even for the author if it is a complex CI configuration. Without a visualization of the pipeline created by the yml file, it could be hard to imagine how the pipeline might behave.

Intended users

  • Sasha (Software Developer)
  • Devon (DevOps Engineer)

User experience goal

When a user views a CI yaml file they should have the options to see graphic representation of the file.

Proposal

Translate the .gitlab-ci.yml file into a graphic visualization when viewing the static, checked-in file from a page like https://gitlab.com/gitlab-com/www-gitlab-com/-/blob/master/.gitlab-ci.yml. The first iteration of this feature is a view only representation.

Design proposal (see Design section for most current version): Screen_Shot_2020-08-18_at_10.32.04_PM

Links

  • Wercker's plugin to Bitbucket: http://blog.wercker.com/2015/12/02/Pipeline-Viewer-For-Bitbucket.html
  • gitlab-ce#21485

UX Definition of done

Entry Criteria for `workflow:design`
  • Problem has been validated going though the workflow::problem validation
  • Issue has a clear problem background (why it is prioritised) description
    • User stories and acceptance criteria have been created
    • Edge cases were considered and described by PM and Product Designer
  • UX label is added to the issue

Criteria for UX DoD (exit criteria for `workflow:design`)
  • Cross-team dependencies have been identified and documented, if applicable
  • Incremental design approach was applied to split the design problem into small problems and deliverables (UX to work with Engineering)
  • Prototype or mock for each user story have been created
    • Empty states
    • Responsiveness
    • Edge cases
  • Design proposal was ran and is aligned with engineering team to avoid not feasible solutions and ensure the iteration in our development process
  • If changes involve copy, UI text label has been added
  • Pajamas: UI Component design have been identified
    • Pajamas issue is created (new workflow)
  • Marked as Ready for engineering evaluation per user story moved into workflowplanning breakdown & needs weight

Entry Criteria for `workflow::ready for development`
  • Scope has been defined and reviewed with engineering
  • User stories have been weighed and are less than 5. See more information on weighting issues
  • Create new issues for follow up user stories

**NOTE: **The above criteria is subject to change with iteration on the process.

Further details

Permissions and Security

Documentation

Availability & Testing

What does success look like, and how can we measure that?

What is the type of buyer?

Is this a cross-stage feature?

Links / references

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.

Edited Oct 20, 2021 by 🤖 GitLab Bot 🤖
Assignee
Assign to
Time tracking