Sketching session: Pipeline Editor Visual Builder

Hi team! 👋 @gitlab-com/pipeline-authoring-group

As I'm iterating on the designs for the Pipeline Editor Visual Builder, it's becoming clear that the ideal vision for the user experience we're exploring can't be easily broken down for small iterations due to implementation constraints and complexity of the solution. (see this discussion for details)

I know that our engineers and the team as a whole has lots of great ideas for what an MVC may look like, but that experience is difficult to explain in words. I'd like to invite you to participate in a fun and quick 15-minute sketching game to brainstorm and share our ideas in a visual way. 🎨

What is this game?

It is a brainstorming exercise that helps us to quickly visualize potential solutions to a design problem. ​It is not a mandatory activity, but I would love your inputs and ideas!

How to play?

Sketching prompt

New CI/CD users struggle with writing CI YAML. We want to make their job easier for them by abstracting the syntax in the UI. Our big vision is to offer a full visual builder which will allow you to build the configuration and set up all of its parts in the Pipeline Editor UI.

Questions to think about:

  • How else might we abstract the YAML syntax in a more MVC way?
  • What may the Pipeline Editor layout look like and how will it work?
  • What would be the simplest and most meaningful iteration now that provides a value, moves us closer to a goal, but we can ship in a single iteration?

Let's play!

  1. Preparation: Prepare 2 sheets of paper, pencil/pen/markers, and reserve 15 minutes to play
  2. Round 1: Brainstorm 4 different ideas.

Divide your paper into 4 empty boxes.

image

Set a timer for 5 minutes and sketch 4 different ideas/ solutions, one per box.

  1. Round 2: Sketch out 1 big idea

Take the second sheet of paper, set a timer for another 5 minutes and sketch out one idea in more detail. It can be one of the ideas you briefly explored in Round 1, or it can be a new idea.

  1. Share your sketches: Take a photo of your sketches and submit them with your comments/ description in this issue.

Yay, now you're done! 🎉

Recommendations for the game

  • This is a 10-minute activity in total (+5 minutes to share the photos of your sketches) You don't have to spend more than 5 minutes for each round.
  • Let's not think about layouts such as the top-header, GitLab logo, and left menu.
  • There are no right or wrong answers.
  • It doesn't have to be beautiful or detailed. Draw just enough to illustrate an idea.

References

  • How this framework works
  • Lean-UX methodology
  • Design-studio workshop
Edited Dec 15, 2020 by Nadia Sotnikova
Assignee Loading
Time tracking Loading