top of page

Case Study Documentation

Reimagining Contract Review: A Smarter, More Efficient Approach

This case study explores the end-to-end redesign of a key feature that optimizes how lawyers review contract documents, making the process faster, more intuitive, and AI-assisted.

Screen Design AI doc review

Mar 2024 - Dec 2024

My Responsibility

As a Product Designer, I played a key role in shaping the user experience and design strategy for this project. My responsibilities included:

User Research & Insights -Conducted in-depth interviews, gathered data, and identified key pain points.

Design Vision & Strategy -Defined the design principles and ensured alignment with business goals.

Scope & Planning - Collaborated with stakeholders to map out the product roadmap and feature priorities.

Interaction & Visual Design -Created intuitive, user-centered designs that enhance usability.

Prototyping & Validation – Developed interactive prototypes and conducted usability testing to refine the experience.

Collaboration & Stakeholder Alignment - Worked closely with cross-functional teams to align design decisions with business goals and user needs.

The Goal

The goal of this project was to improve the contract  document review efficiency by 30%

The Data

30%
less adaption of tool
because of the complex user experience.

60 %
of users complained that finding relevant data is difficult and that hidden data is a hidden risk to the company.

To understand it better multiple interview sessions were organized with subject matter experts 

We discussed with 15 internal lawyer to gather insights on various scenarios

User Journey

User Insights & Key Findings

Through stakeholder interviews, I uncovered key motivations and challenges that shaped the product's value proposition

Why do customers buy this product?

Customers need an interactive, dynamic way to manage their legal documents rather than static PDFs. This solution transforms documents into live, structured data, enabling seamless auditing and efficient processing.

What is the value gain for their team (legal team)?

The biggest impact is efficiency. By automating document reviews, legal teams save time, reduce costs, and minimize manual effort, allowing them to focus on higher-value tasks.

🏢 Who are the customers? (Business nature)

  • Companies managing large contract repositories

  • Organizations conducting third-party legal audits

  • Teams that require quick and structured document reviews

Bird’s Eye View of the Reserach Approach

Reaserch Approach

User Quotes

“I can see a value on doc page but feel helpless I need to feed in that data manually.”

Karl
Lawyer - EY

“Show fields which has no values so that reviewer can trace them back later.”

Ranjana
Head - Product Innovation

“I want to add comments at individual extracted value because I need approvals on certain values.”

“I find difficulty identifying the status of values. Make edit status visible.

“Ability to port data between P-C linked documents or documents which are similar, if we just clone data or port data between them.”

Anthony
VP - Product Innovation Sirion

Sumbul -
Lawyer - Sirion Reviewer Team

Customer Feedbacks

User Pain Point

User Persona

Name: David Lee
Age: 42
Role: Contract Manager

​Background: David has over 18 years of experience in contract management, focusing on procurement and vendor contracts. He holds an MBA with a specialization in Supply Chain Management and works at a leading technology company.

Challenges:

  • Handling a high volume of contracts simultaneously

  • Managing relationships with multiple vendors and stakeholders

  • Ensuring all contract terms are met and adhered to

  • Keeping up with regulatory changes and compliance requirements


Motivations:

  • Enhancing contract efficiency and accuracy

  • Reducing contract cycle times

  • Ensuring compliance and risk management

  • Achieving cost savings and operational improvements


Quote: "I need robust tools that help manage contracts efficiently, ensuring compliance and optimizing terms for the best outcomes."

Design Goal

How might we optimize the contract review process to achieve a significant reduction in review time while guaranteeing no critical terms are overlooked.

  • Design should meet the reviewer's first expectation

  • Design should support efficiency in performing tasks.

  • Design should be scalable to future use cases.

The Guiding Principles

Effectiveness

Match with real-world user behavior to make it feel seamless.

Learnability

Aim to design products that are easy for users to learn how to use, allowing them to quickly become proficient.

Effectiveness

Ensuring that users can successfully achieve their goals and complete tasks with accuracy.

Engagement

Focuses on captivating users' experience and encouraging continued use.

Prioritising Features

Feature Priority

To streamline the review process and improve user efficiency, we identified and prioritized features based on their potential impact on business value and the difficulty of implementation.

This helps us focus on quick wins while planning for more complex yet valuable enhancements

High Difficulty, Low Impact (Nice-to-Have Features)

These features are complex but may not deliver high immediate business value.

 

  • Create new contract from selective page
    Useful for modular contract generation but requires heavy backend work.

  • Status of user last edited and when online
    Helps track team collaboration but needs real-time sync capabilities.
     

💡 Design Consideration:

 

  • Implement visual indicators for tracking user presence.

  • Offer detailed activity logs for better auditability.

High Difficulty, High Impact (Strategic Features)

These features are challenging to implement but bring significant business value.

 

  • The user can see the counterpart reviewer if reviewing the same doc
    Enhances collaboration by reducing duplicate efforts and miscommunication.

  • Ability to see which text area counterpart reviewer is working on
    Provides real-time insights into work progress, avoiding conflicts.

  • Identify the Workflow (WF) current step
    Allows users to track progress and pending actions.

  • Communicate with reviewers for WF-related actions
    Facilitates seamless coordination within the workflow.
     

💡 Design Consideration:

 

  • Implement real-time collaboration features like Google Docs-style indicators.

  • Provide an intuitive way to visually track workflow status.

Low Difficulty, Low Impact (Hygiene Features)

These features provide incremental improvements but have a lower direct business impact.

 

  • Hotkeys for document navigation
    Improves efficiency for power users who prefer keyboard shortcuts.

  • Quick creation of OB entity from field level
    Speeds up metadata entry and tagging.

  • Page break ability
    Enhances document readability and structure.
     

💡 Design Consideration:

 

  • Use industry-standard keyboard shortcuts to ensure familiarity.

  • Provide customization options for power users.

Low Difficulty, High Impact (Quick Wins)

These features are easy to implement and offer immediate value.

 

  • Better annotation on document viewer
    Ensures clarity and structured feedback during review.

  • Sequential values to review
    Streamlines the process of reviewing multiple data points.

  • Ability to search on fields and values
    Empowers users to find critical contract elements quickly.
     

 

💡 Design Consideration:

 

  • Introduce an AI-powered search suggestion feature.

  • Implement filtering and sorting for faster access to relevant clauses.

 

Ideate, brainstorm, create, fail, iterate

Info graphics design
User Flow

Wireflow Blueprint

After multiple iterations, I created a wire-flow blueprint to consolidate concepts.
A wire-flow blueprint is a complete flow of screens at the wireframe level.

This helped to track when and what to achieve and importantly backend dev was aligned with the flows

Wireframe + Flow = Wireflows

Before moving ahead let's dismantle the the construct of any contract document.

Understand the components of any typical contract document. 
Understand Contract Doc

Hypothesis

Lawyers generally read the contract document physically and highlight the important data and clauses

  • Users can quickly skim and consume metadata highlights directly within the text.

  • This method aligns with the common human behavior of swiftly digesting information.

  • Lawyers often prefer this approach as it ensures thorough content consumption.

Review Method - visual selection

Design Desicions

Annotate the specific values that a reviewer needs to verify directly within the document using OCR and AI LLM capabilities to analyze the text and clauses.

Visualisation 

Contract document annotated with values

Added Action Card on hover of values for user's input

​The card has value and AI-generated labels. eg 90 days are termination days for force majeure.

Pros
Colour coding offers clues about the information extracted and its placement on the page.

Cons
The significance of colour coding not immediately clear until users get accustomed to it.

We also observed frequent mouse movement to see the values of annotated text.


Doc Viewer Editable

To solve the above points and minimize the mouse movement across documents - Assist bars are introduced

This enables users to view AI-extracted data and actions in a sequence on the page.

Design Document Viewer

The user needed a preview section to finally check the content before publishing

Also, the preview panel needed few manual values entry.

Wireframe

However, this third panel felt overwhelming for the user in initial feedback session.

Can we get rid of the third panel?

We conducted a QnA session to get the answer of the question below and learn more about user expectations:

Question -
Does the user want to fill in added fields on preview at the same time or do they want to review extraction and then move to the preview panel?

Insight:
They want to consume AI-assisted content and view it simultaneously and frequently. Because AI-assist content helps fill the manual values on the preview panel. 

 visual selection

Conclusion

 

  • The user wants to review extracted AI fields first and then fill in the custom/manual values as needed, simultaneously on the preview panel.

  • The 3rd-panel approach looks promising to go ahead considering all tech & experience checkpoints.

  • So both panels should work in sync. 

  • But, to overcome three-panel anxiety we made a one-panel view as the default and added an icon to navigate to related manual fields on the preview panel.

  • Design should make sure that any relevant information is just one click away
     

 

I began refining the final UI components after understanding the layout, user behavior, and how they prefer to consume AI-generated output.

I added a visual cue to the assist bars. This provides users with clear UI feedback, ensuring they interact with the correct values and recognize their interconnections.

Shapes below

Icon

Icons below

Icon on rows

Icon​ v/s geometric shape for Visual Clue. - User Feedback

Result of User feedback

Analysis

Geometric Shapes

  1. Dots/shapes help establish a connection between AI assist bars with the annotated text on the document.
     

  2. Providing visual feedback to the user is the primary experience here.

Icon

  1. The icon aims to add meaning to the text, yet users, who are already engaged in consuming the text and content, might not find icons useful for any decision making.
     

  2. The repetition of icons during scrolling does not significantly enhance the user experience. Rather it increasing cognitive load

insights key takeaways

📌 “85% of users found dots more intuitive than icons for linking assist bars to text.”
📌 “Users struggled to interpret the icons, leading to confusion and slower navigation.”
📌 “Think-aloud sessions revealed that geometric shapes provide clearer visual feedback.

The Design

The icon on left v/s shapes on the right 

Icon on rows

The added benefits of the shapes are they can be customised for clients and provide scalability.

Suppose a clients need to see "Force Majeure termination days" in red as it can marked critical for any use case.

Geometry shapes

As we consider scaling, implementing a filter was felt for navigation.

Based on the usage data. I've segmented some items to the sidebars and a few to the top as a clickable chips.

The intent was to show the count as well.

Design

80%

Participants liked this drop down approach.

Info graphics design
Screen Design Drop Down

Exploring the drop-down designs

Design

Review assist to help the reviewer consume the information quicker, increasing the efficiency of the  review.

Screen Review Assist

An interactive viewer showing info on hover for better accessibility and navigation.

Simply click "Accept" or "Reject" to progress sequentially and complete the review efficiently.

You can either retag information directly from the document text for accuracy or manually enter data to ensuring flexibility in experience

Seamless interaction between AI Assist bars and the general form enables lawyers to input relevant data simultaneously.

Added a citation on the preview card to enhance recognition of previous actions and provide better context.

Navigate, review, and take action seamlessly with intuitive shortcuts designed for a faster workflow. 

Streamlined UI with smartly revealed tools and seamless search, ensuring users find what they need when they need it.

Specification & Detail Design Handover

A structured approach to transferring design specifications, ensuring seamless collaboration between design and development teams.

Spec Handover to Dev

Project Impact

30%

Gain in Review Efficiency

80%

Faster Contract Migration

60%

Reduced error rates

Older Screen

Review Document

Prototype walkthrough

bottom of page