GitLab Create Editor Group, 3 Jun 2022

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Create:Editor - Concept default editing Handbook pages with Web IDE

Description

https://gitlab.com/gitlab-org/gitlab/-/issues/363608

A

Hi, my name is michael lee of the editor group and today I'll be talking about a potential um direction for the flow for navigating to the web ide to make content edits.

A

I was inspired by this by two things and looking at the general flows in and out of the web, ide plus also an earlier issue talking about um having a markdown preview that mimics the handbook so looking into the current flow.

A

We have these two buttons at the moment that these two links view source and open web ide clicking on view source takes you to the single file editor and from here you can. Edit um click on the thing to edit.

A

Another way to get to editing is also clicking on the open web ide that opens up this view. This view of markdown historically, the feedback on this is that web id is good for multiple file edits. You know, if you want to add an extra page or extra images, it's a good way to do that, but at the same time it's very intimidating to go from the handbook page into something that looks really foreign and with markup everywhere.

A

With the thought of moving towards the vs code, inspired markdown handbook, vs code inspired web ide clicking on the web id. This is potentially how it could look still pretty intimidating with the text everywhere, but the web vs code also has a markdown preview that you can open up side by side.

A

So now this is the part where I use the idea of having the handbook rendering, and so, if we created our custom renderer for a markdown preview that mimics the handbook, styling and treatment that would take the journey from the open web id here pops you open into something that's code here, but there's a little bit of familiarity with the rendering of the page here so from here.

A

What we could um explore further is, is this view less intimidating than the full code, and can people get into editing and making their changes as needed.

A

So, taking all this into consideration, um I thought about how this whole interaction could be changed. So at the moment we have these two links here view source and open in web ide. If I'm looking to make changes and edit here, there's nothing that says it right, everything is just. I will open this in the web id or view source and nothing says edit, there's no direct link to there.

A

So if we change it to something like this, where we have edit page and view history, we can click on edit page, and that would take me into the web ide view with the preview and that's the markdown rendered the code here. I can change and make the edit and see the live updates here.

A

Once you make the changes vs code would then display the changes up here. How we handle commits is something that we're still going to go explore further, but we could commit directly from vs code or whether we should explore ways of opening gitlab's commit view um there.

A

Navigating back will take me back to where I came from, so if jumping into that was seemed really daunting at least there's a way to go back and and viewing history is um something that I feel could be useful to see.

A

You know when was the last change is made, and it gives a little bit more differentiation between the different actions here um at the moment we have view source and open and web id, which are essentially two paths to editing here, we're very opinionated that edit page will take you to the web id directly and we are leveraging um history instead of navigating them to a viewing source, or this could remain view source as well, but I think the biggest change here is being very opinionated on what tool we want people to edit with.

A