top of page

Case Study Documentation

How i increased the doc review efficiency by 30%

Get offline PDF
Screen Design AI doc review

Mar 2024 - Dec 2024

The initial indicators

15%
Decrease in adoption

60 %
of users complained about bad user experiences.

To gain deeper insights, I conducted multiple interview sessions with subject matter experts. I collaborated with 15 internal lawyers to explore various scenarios and gather valuable perspectives.

User Journey

Gathered info on each layers

Reaserch Approach
Firstly,
Let's understand the data and their relation in the contracting ecosystem
Screenshot 2025-04-03 at 16.12.42.png

Data on contract documents

Understand Contract Doc

User quotes that helped understand their exact pain points

02

Karl
Lawyer - EY

04

01

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

Ranjana
Head - Product Innovation

03

“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

“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.

Sumbul -
Lawyer - Sirion Reviewer Team

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

Collated Feedback List

User Pain Point

Conclusion & key findings

🏢 Who are the customers? (Business)
  • Companies managing large physical (in form of pdf or doc etc) contract repositories

  • Organizations conducting third-party legal audits

  • Teams that require quick and structured document reviews

The biggest impact is efficiency

AI automates document reviews, legal teams save time, reduce costs, and minimize manual effort, allowing them to focus on higher-value tasks.

The Reason for bad metrics
  • Low Usability: The Interface is not intuitive; users prefer manual contract management or competitor platforms.
     

  • Lack of Key Features: Missing essential functionalities like clause tracking, version control, or integrations can cause users to drop off.

Iterating 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
Simplicity

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

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

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

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

Screen Review Assist

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

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 ensure flexibility in experience

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

A citation was added to the preview card to enhance the recognition of previous actions and provide better context.

Shortcuts help you 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.

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

18%

Gain in Review Efficiency

9%

Increase in Adoption 

20%

Reduced Error Rates

Older Screen

Review Document

Prototype walkthrough

bottom of page