Redesigning complex workflows with explicit modes and guardrails.

The product carried multiple complex tasks — configuration, editing and reviewing — for users who needed throughput, on a system that required governance:

• Consistent save behaviour across flows.
• Clear validation feedback on every interaction.
• Unambiguous separation between reviewing and editing.

• Different pages behaved differently for saving and exiting.
• Users couldn't always tell whether they were editing or viewing.
• Detail popups and nested flows hurt navigation, deep-linking and comprehension.

• Standardise patterns to reduce cognitive load.
• Make state visible so user mistakes become hard to make.
• Build reusable components so engineering stops re-inventing the same UI.

• Introduced explicit modes — View / Edit / Preview — across authoring and configuration.
• Replaced popups with dedicated detail pages for clarity, deep-linking and shareability.
• Standardised Save / Save & Exit / Next behaviour across flows.
• Added unsaved-changes prompts and consistent validation messaging on every form.
• Promoted empty, loading and disabled states to first-class, designed UX patterns.

• A scalable pattern-library approach adopted as the basis for future features.
• Improved wayfinding and a measurable drop in accidental changes during user testing.
• Tighter alignment between UX behaviour and compliance expectations — fewer late-stage QA reworks.
• Reduced design-to-build friction by giving engineering reusable, opinionated components.

• Consistent patterns reduce errors and training burden — both real costs in regulated environments.
• Mode clarity (View / Edit / Preview) is a high-leverage decision; it removes whole classes of bugs.
• Treating empty, loading and disabled states as design work — not afterthoughts — pays back fast.