Create Scope Form.    

-85%
Completion time
-60%
Support tickets
5%
Scopes created

From an endless form to an easy 3-step form

At SCOPE Better, creating a new scope was the first thing a user had to do. It was also the thing most likely to make them give up. The form was poorly structured, hard to follow, and buried. Users stumbled into it rather than finding it. It wasn’t just a bad form. It was a wall between the user and the product.

DISCOVERY

This wasn’t on the original roadmap. I spotted it during a platform audit while working on a separate feature and confirmed the assumption after quickly testing it with some of our clients. We were already rebuilding UI foundations across the platform as part of a migration to Angular, which gave me the space to take it on as a parallel track without disrupting the sprint.

Create Scope Original form

I mapped the logic dependencies behind scorecard and output selections to find where users were getting stuck. The structure was the problem:  too many fields, no clear order, no sense of progress. I built quick prototypes to test whether simplifying the flow and language would be enough to fix it. client needs.

WHAT I DID

I redesigned the form into a focused 3-step flow. Each step had one job: essential details, financials, extras. A progress bar made it clear how close users were to being done. The language was simplified throughout. Backend constraints stayed intact. I worked closely with the PM and the engineering team to ensure that nothing that needed to be there was cut. We made it in one sprint and shipped in a week.

Create Scope User Journey mapping
Create Scope – wires
OUTCOME

Completion time dropped by 85%, under 30 seconds from start to finish. Support tickets dropped by 60%, most of them caused by users selecting the wrong options when setting up a scope, a problem that disappeared once the structure was clear.

The redesign also uncovered that different types of scoping needed different setups to work properly. That insight led directly to two new features: Create Scope by Role and Create Scope by Timeline, both built on the foundation of this redesign set.

Three-step Create Scope flow showing a simplified, guided form: Step 1 captures essential details, Step 2 focuses on financials, and Step 3 collects extra information — all with a clean layout and progress bar.
Final summary screen of the Create Scope flow, displaying all entered details grouped into sections with inline edit options for review before submission.

Company

SCOPE Better

Year

2023

Design Tools

Figma and Miro

Uncover more of my work

  • Ending the “needle-in-a-haystack” hunt. A zero-to-one feature that slashes the pain of editing 500-row scopes.
  • An initiative beyond aesthetics. A system and streamlined processes to drive velocity, alignment, and scalability. Laying the groundwork for future growth.
  • Agencies always work against the clock. Scope by Timeline gave them a way to plan and price a project visually, translating the existing scope table into an editable Gantt-style view that updated in real time.
  • 78% of users ignored SCOPE Better's pricing by role feature. Not because they didn't need it, because 30-second load times and a broken table made it not worth the effort.
  • A platform that worked but didn't feel finished. An 11-month platform-wide UX and UI uplift, running alongside a framework migration and a design system build, that turned a functional tool into something clients were proud to use.
  • Design a flexible structure that supports richer communication at scale, without adding visual or cognitive clutter
Back To Top
VIEW