product-creation-workflow

View project on GitHub

Problem

Product creation is a central issue in Equipment Rentals. Variations in product offerings can quickly become confusing and difficult to present in a user interface. At Beachy, our MVP was a simple interface to allow Operations personnel to create products instead of developers. This initial interface was bare bones.

However, having the Beachy operations team set up all products for clients was not scalable. We needed to push this task off to a user that works for the client. In order for that to be possible, a more intuitive interface was needed.

Stop saying interface.

Before Images that have better names and point out things

Image of a thing

Solution

Some words here.

Overview

New Product Edit View With Arrows

a. Some elements of the previous UI were kept.

  1. Instead of tabs, we use a step system.
  2. Better UX b/c see progress and summary.
  3. Add tool tips to help user.
  4. Elements of the summary are collapsed and match the steps.
  5. Included placeholder text.
  6. The button is only clickable if the required information is present.

Results

Discussion

Code reusability between create and edit