Stepper - use case

[cdpestitschek]

Hello Paste team,

I have two scenarios 1) creating a widget and 2) editing a widget.

1- Creating a widget, is a linear process while 2- editing is not.

I wondering what component or how should I propose this design, I have consider using tabs, but in the case of change in any of them, following ones may would be affected. I would like to receive some guidance about which status should I use in the case of the (2) scenario. If is about to keep the stepper. MY follow up question would be: Should I present the steps as ‘incomplete’ or ‘complete’ in the Edit mode? we don’t have any neutral status as I noticed.

I would need to clarify this.

imagining in the scenario where I access the edit widgets and find everything incomplete, but previously it was completed. I would inducing the user to review all the steps without the need.

And if I provide all with completes, once the user accesses and updates, there will be no difference because previously all would be checked

🎨 Figma file - Create journey
🎨 Figma file - Edit journey

[loreina]

Hi @cdpestitschek,

Can you share a link to your Figma file? The context and visual reference will help our team provide a suggestion. Thanks!

[serifluous]

Hey @cdpestitschek ! The design decision is more up to you and your team since you're more knowledgeable about your customers, but we have 2 suggestions for the editing flow:

1. Use Progress Steps for the editing flow, and show all steps as "incomplete". The user is essentially entering into a new progress flow, so it shouldn't be too confusing that they're being asked to look over each step again, especially when there are only 3 steps. You can then set the state to "complete" after the user saves the step, even if the user didn't change anything in that step.
2. Show all 3 options at once in the Side Modal and not separate them into different views. This could work since the user might need less hand-holding through each step one-by-one since they might have already gone through the "create flow".