Home

Overview

In this case study, we will be focusing on user research interviews based on two founders: Kay Linayao, Co-Founder and COO of MotleyData, and Vanessa Andrada, owner and founder of StudioFX. The research obtained and collected in this case study uncovers daily workflow patterns, challenges and inefficiencies within their businesses, and technology pain points faced by these founders to inform the design of user-centric solutions that address their needs.

Problem Statement

Organizational leads rely on digital tools such as DocHub to streamline the document signage process with clients. However, DocHub’s interface is error-prone, allowing clients to submit documents without filling out all required fields. This creates an inefficient back-and-forth cycle where clients must resend incomplete documents, leading to delays. As a result, these inefficiencies have a negative impact on communication, client retention, and slow down the process of finalizing documents.

Contribution

Collaborated in curating design direction for the user interface, aided in the written components of the project, and conducted user research with stakeholders in order to obtain direct feedback utilized to create our redesign of DocHub.

Timeline

9 weeks (January - March 2025)

Kay Linayao
Co-Founder and COO of MotleyData

Kay’s role involves managing operations, HR, finance, fundraising, and sales. Her daily routine includes tasks such as pitching to investors, managing contracts, and networking. While she relies on tools like Google Suite, Slack, and QuickBooks, inefficiencies in DocHub for managing contracts and Slack’s group chat features hinder productivity. She also expressed the need for better integration across tools and highlighted scalability challenges related to team culture and operational workflows as her company grows.

Vanessa Andrada
Owner of StudioFX

Vanessa’s works focuses on emphasizing the greater San Diego dance community in order to provide more access to dance & movement education resources. She overlooks 5 departments each specializing in their own tools and workflows including front desk, media, management, directors, and teachers. Vanessa balances the widespread of foundational art forms through movement with business goals and stresses the inclusive and accessible instruction of dance forms. Her workflow involves using tools like Mindbody, Slack, QuickBooks, ADP, Google Suite, and Dochub, but switching between software and organizing communication among groups is cumbersome. Vanessa wishes there was an app to centralize team communication and contract management to boost the overall productivity of her business and passion.

Motivation & Intention

The objective of this case study was to enhance the client signing process on DocHub. Company/business managers and their clients need an efficient, more intuitive document workflow that ensures all required fields are signed without unnecessary delays.

Goals

Process contracts faster by reducing back-and-forth communication.
Streamline document editing with smart detection of required signature fields.
Improve usability by automatically highlighting fields that need to be signed.

User Resarch Methods

The research was conducted using semi-structured interviews with open-ended questions, allowing participants to share their experiences in detail. Topics included:

Daily Routines: Understanding how tasks are managed and prioritized.
Tool Usage: Identifying commonly used tools and their limitations.
Workflow Challenges: Exploring communication, collaboration, and tool integration pain points.

This approach ensured an understanding of the participants’ workflows and challenges, enabling insights to inform design solutions.

Findings

1. Workflow Inefficiencies

Kay highlighted challenges with DocHub. DocHub does not show the client of the stakeholder the full finalized contract and does not include all highlighted signage. Kay is frustrated with this feature because they must ask the client to sign the missing signatures they need. Slack’s inability to rename group chats or consolidate messages adds to communication hurdles.
Vanessa specified challenges with finalizing contracts through DocHub. DocHub does not flag when clients fail to cover all fields during the signing process. She often has to reach out to the client(s), herself, in order to complete necessary operations. Vanessa also expressed frustration with Slack, as it is not her team’s optimal form of communication. She desires a more intuitive app to give her team the space for centralized correspondence that everyone can get on board with.

2. Tool Integration Gaps

Both participants expressed a need for better integration between tools. For example, Kay’s reliance on multiple apps for notes and task management (Notion, Apple Notes, and Google Slides) leads to inefficiencies. They use multiple note-taking apps for different teams. For example, they use apple notes for miscellaneous notes they need throughout the day. Notion is used for team notes and communication. Google slides are used for taking notes with their stakeholders and clients.

During our interview with Vanessa, she stated that Mindbody has been her main tool for managing her business for over 15 years. In this system, she is able to schedule classes, book students, send emails and marketing materials, and manage revenue. Although this tool has many of the features that she requires to keep her business running, she stated that if she could create an app, she would want it to be a “one-stop-shop”. In her ideal app, she would want to be able to send and receive documents from clients and students, have a place where those documents can be stored within the website, and have a page to sell merchandise.

3. Collaboration and Communication Challenges

Both of our stakeholders identified communication issues within tools like Slack. For example, unorganized DMs and group chats slow down teamwork. One instance they had an issue was when the CEO and COO are in a few group chats with some overlapping team members. This issue is the CEO and COO are now part of two separate group chats with similar participants but different purposes. The chats are automatically named something like “@Alice @Kay @Andre @Erin” (based on members’ names), making it harder to distinguish between them at a glance. This makes Slack inefficient for team communication because the CEO can accidentally send messages about marketing strategy to the product team’s chat and become confused. Team members waste time clarifying which chat is for which purpose.

Another collaboration and communication issue both of our stakeholders have is their clients being able to finalize their contracts without filling in all required fields on Dochub. Dochub does not always enforce the completion of all required fields before a document can be finalized. Clients can submit the contract even if they have missed a signature, initial, or other mandatory field. This is inefficient because the sender has to review the document, identify missing fields, and send it back to the client to complete. Clients have expressed feeling annoyed at having to redo the process, especially when the contracts are extensive. The back-and-forth can slow down the contract signing process, potentially delaying important business deals. Dochub’s current functionality doesn’t always include validation to prevent finalization until all required fields are completed, unlike Docusign.

User Personas

Competitive Analysis

We performed competitive analysis on several alternative platforms and through our analysis, we found 4 key features we believe are integral to the optimal design of a contract signing user interface.

Design Analysis

Creating a one-click signage feature could eliminate reoccurring communication issues DocHub users have with clients. This will improve DocHub's inefficient communication and its signage process, and this will make DocHub up-to-date with its competitors.

Collaborative signing can increase client retention. One of our stakeholders has stated they will no longer be using DocHub for its limited collaboration between the user and their client. Collaborative signing can retain users by having an effective collaboration system.

UX Flows

One Click Sign

Collaborative Signing

UX Flow 1 focuses on streamlining the signing process for all parties involved. This flow begins as soon as one person opens the sent invitation to sign documents. Once that person opens the document sent, we hope to implement an AI detection system that detects all required signature fields as accurately as possible. To streamline the signing process we also hope to add features that allow for a one-click signing option (there will be a sign button that applies a person’s digital signature to every single required field if the party has a saved signature).

This flow highlights the main issue at hand which is that DocHub makes it hard and complicated for parties on both ends to have a seamless experience of signing important documents. It is our goal to add a page that blocks someone from sending the document back if at least one signature field has not been signed. The 2 personas showcase the frustration that our stakeholders have with DocHub, which is highlighted in our UX flow.

UX Flow 2 focuses on multi-party signatures and streamlining the signing process as well. We aim to rework some of DocHub's key features, it is our goal to allow multiple parties the ability to sign a document with the least amount of trouble as possible. The entry point of UX flow 2 also begins when a person opens a document to sign. Once they are on the document, they will only be allowed to sign on their specific signature field (they cannot sign on someone else’s). We hope to integrate AI to help with this process. After they one-click sign it will detect missing fields and if everything is filled out it will allow that person to send the document back, if not it will lead them back to the missing signature fields. This makes it easier so they do not have to scroll and look for the missing field.

This flow helps to streamline the signing process because it allows for less confusion when it comes to multiple signatures needed on one document. The personas also capture this frustration. Both flows are focused on reworking DocHub's signature features, specifically how to streamline this process in different ways.

UI Sketches

Reflection

Each sketch was categorized according to sections from our UX flows as well as focusing on screens that users interact with frequently. We used these sketches to not only attempt to fix existing screens, but also explore alternative screens visually and functionally to benefit our future redesign. Some sketches included subtle modifications, such as repositioning elements for better usability, while others introduced more significant changes, like reimagining features to improve overall user experience. By using insights from our Competitive Audit, we were able to identify common user pain points within DocHub and address them by incorporating better feedback and more intuitive features.

Creating these sketches proved to be more challenging than we had anticipated. While sketching and annotating the sketches was straightforward, it was difficult to think of meaningful improvements and translating them onto paper. At times, we struggled to come up with distinct sketch variations without repeating ideas, also keeping in mind if the changes made would benefit our design or not. Given our experience with well-designed websites, we also made sure our sketches maintained high usability standards rather than drawing inspiration from less effective designs. Overall this process was helpful in curating ideas for our final redesign and deepened our understanding of how subtle adjustments can significantly impact user experience.

Low Fidelity (Lo-Fi) Prototype

For our prototypes we decided to focus on redesigning the Dashboard UI to fit the needs of our stakeholders. We wanted to change our design prototype from our UX Flow 1 because a one-click button that completes all signages of a contract is an unethical practice.

Prototype #1

For our prototype 1, users are able to sign and send their document or send and receive their document to the client. In contrast, our prototype 2 shows the status of their most recent action at the top of their dashboard to notify the status of this document.

Prototype 1 depicts the customizing options users can have when creating a template on Dochub and gives control to the user of who can access this template.

Prototype #2

Prototype 2 follows UX Flow 2 by showing the highlighted signages required for the user. The client is also alerted if they are missing any required fields. We have decided to make that the alternative option as opposed to the one-click auto sign button.

Our stakeholders had issues of their clients sending contracts back with missing field requirements so we decided to add the prompt that alerts the client if they have not completed all signature fields before sending their contract back to our stakeholder.

User Testing

User Testing Findings

Prototype #1

What Users Liked:
- Users preferred the view of sent documents and found the document status sections (e.g. “Needs Action”, “Waiting On”) useful.
- The workflow made sense in general.
- Participants suggested making “Needs Action” and “Waiting On” more distinct (e.g., bold or red text).
- Users preferred Auto Detect for detecting signature fields to save time.
What Users Struggled With:
- Users found the text generic and confusing, preferring real document templates for better realism.
- There was no clear indication of what was clickable, and users didn’t recognize that some elements were interactive.
- The signing section was unclear and users questioned whether they were looking at an example or a real signature.
- Some users didn’t realize they were looking at documents.
- Dashboard felt too wide, resembling a mobile design on a web browser.
- Hamburger menu felt oversized and the text was too large.
- Some did not trust AI detection and would manually review fields before sending the document out to their client for signing.
- The one-click sign feature raised concerns about people signing documents without proper review.

Prototype #2

What Users Liked:
- Users liked having a “Shared With You” section but suggested renaming it to “Finalized” or “Completed”.
- Some users didn’t realize DocHub had certain features, which were better highlighted in this version.
- It was generally acceptable but could be larger.
What Users Struggled With:
- Users were confused by “Create New” and “New Document”, as they seemed to perform the same function.
- The difference between “Sign & Send” and “Send & Receive” was unclear. Users didn’t understand the “Create template for now” option. “Client Name” section was unclear and users weren’t sure how it related to documents.
- Sidebar felt too large and unnecessary.
- Users expected to return to the dashboard using the top-left home button or logo.
- Some users weren’t sure if they could create a document without uploading one first. The second upload screen felt unnecessary.
- Users wanted clearer roles (e.g., “Needs to Sign” vs. “Receives a copy”).
- They expected a better way to add/remove recipients. Users weren’t sure what they were customizing when asked to edit document fields.

Final Verdict

When comparing Prototype #1 vs. Prototype #2, most participants preferred Prototype B, but with adjustments.

Prototype #2 was preferred because it had a more intuitive dashboard layout. The Recent Documents section was useful. The search functionality was better integrated.

Prototype #1 had some preferred elements such as clearer document action sections (e.g., “Needs Action” and “Waiting On”) and a more compact dashboard layout.

Users liked Prototype #2’s dashboard organization but preferred Prototype A’s clarity in document statuses and action items.

Point-of-View Statement

Users understand the logical flow of the prototype however, they did not find the screens to be aesthetically pleasing and also thought the signing process to be ambiguous because it lacked overall intuitiveness.

We need to find a way to balance efficiency and comprehension. We want to make sure our system doesn't completely take away the user's ability to perform the task, but also ensuring users complete all required fields to review and complete the form.

Next Step Plans

Moving forward with our project, we will set Prototype #2 as our foundation, incorporating elements from Prototype #1 that users preferred, such as the clarity in document status sections and compact dashboard layout. As we work toward creating a high-fidelity prototype in Milestone 6, we will make sure to address specific redesign decisions such as:

Dashboard Organization Refinement

Keeping the Recent Documents section from Prototype #2, but improving the visual hierarchy.
Making sure the “Needs Action” and “Waiting On” sections are clearly distinguishable.

Improving Signing Experience

Implements better and more detailed document previews.
Include elements that allow for signified interaction.
Improve signature instructions so that users understand where and how to add signatures.
Adding an additional “manual review” step for AI-detected signatures to account for user trust.

Rewording of Confusing Terms

“Shared With You” can become “Needs Signature”, “Finalized”, or “Completed depending on the required action.
Streamline either “Create New” or “New Document” to avoid redundancy.
Change “Sign & Send” and “Send & Receive” to clearer labels.

In addition to reworking these features, we ultimately aim to develop high-fidelity prototypes in Figma. By taking our ideas produced through our wireframes and implementing them into high fidelity prototypes to be tested by our stakeholders, we will be able to create a refined UI for DocHub, addressing concerns about visual appeal and usability.

High Fidelity (Hi-Fi) Prototype

Based on our user testing findings, we ultimately decided to progress with, and base out Hi-Fi Prototype after UX Flow 1. Our stakeholders showed a preference for it compared to UX Flow 2, our team also decided this was the better option. UX Flow 1 allows us to focus directly on the needs of our stakeholders. In this case, our stakeholders are business owners who use Dochub as a means to get signatures from their client(s). By moving forward with this flow, we are able to make the signing process faster and more efficient not only for clients but for our stakeholders as well.

Our previous screens for UX Flow 1 were not aesthetically pleasing, so we fixed our high fidelity prototype to have screens that reflect the feedback we got from our stakeholders.

One major critique we aimed to fix was not clarity in our texts and signs, more specifically it was stated that the text in screen 1 (the dashboard) was confusing. Therefore, in our high fidelity prototype we added texts that are clear as well as making sure the signs were intuitive for the user.

We changed most of the dashboard screen to have more functionality, instead of having previous clients on our sidebar - we added a list of functions for easy navigation.

Alternative Screens

The first alternative screen is a rework of the dashboard page found in UX Flow 1. One of the main critiques our stakeholders had was that the prototype did not feel realistic and how the overall text and symbols were confusing.

To fix this, our team decided to not only add more color to the screen but utilize more of the space on the screen to make it feel less empty. We aimed to make this alternative screen be more intuitive and functional all while being minimal to ensure our stakeholders don’t feel overwhelmed with the very first screen they see.

One of our top priorities for this screen was to be able to have the top assets that our stakeholders use frequently front and center; by doing so, it makes the interface easier to navigate.

Alternative Screen 1

Alternative Screen 2

User Feedback on Hi-Fi Prototype

User Testing 1

During the evaluation of DocHub, users provided the following insights. They stated that the interface is well-organized and familiar resembling Google Docs in terms of usability. The “Shared With You” Section is perceived as a useful feature. The status feature is unique and stands out compared to other document signing options. The platform is easy to navigate, providing a seamless user experience. They found multiple colors in the alternative screens to be more appealing.

They also pointed to some areas of improvement. The interface appears too plain and could benefit from a color scheme to improve visual appeal. The “Create Template” and “Upload Document” buttons should be more visually distinct, possibly with a stronger color presence. Documents in the “Recent” section should be labeled with more details, such as timestamps for when they were last opened. The dashboard appears too empty. The user suggests trying to add more buttons or interactive elements to improve functionality and aesthetic appeal.

User Testing 2

User expressed they felt the overall design is familiar, it is similar to tools they already have experience using (i.e. Google Suite, etc.). My consistently reiterated how much they enjoyed the visual layout and formatting of our prototype.

One thing the user did point out as a potential pain point would be to add a more distinct way to click on buttons. Although, general about the matter, I infer they were referring to the “New Document” and “Complete & Send” buttons as these were the aspects of the design the user had attempted to hover over a few times. Other than this, the user was very impressed with the interface as a whole, especially with regards to its straightforward nature.

Before-and-After Stories

Final Prototype

Users found the interface well-organized and easy to navigate, with a familiar structure similar to Google Docs. They appreciated the "Shared with You" section and highlighted the status feature as a unique advantage compared to other document signing platforms. However, they felt the design was too plain and suggested incorporating a color scheme to enhance visual appeal.

The "Create Template" and "Upload Document" buttons need more emphasis through color, and the dashboard appears too empty, requiring additional interactive elements. Additionally, users recommended adding timestamps or labels to the recent documents section for better clarity.

To improve our prototype based on these comments, we decided to focus more on color and text style. Our main goal was to make the dashboard look more visually appealing, we did this by incorporating shades of blue and green. One alternative screen implemented these improvements, furthermore we added 3 buttons to the dashboard which are the main focus. However, further improvements could be made such as changing the current colors of the buttons (which are currently green) to other colors to signify other meanings. Overall, our improved prototype should have more color to make it less bland and more appealing.

Page updated

Report abuse

Kay Linayao Co-Founder and COO of MotleyData

Vanessa Andrada Owner of StudioFX

Collaborative Signing

Reflection

Prototype #1

Prototype #2

Before-and-After Stories

Kay Linayao
Co-Founder and COO of MotleyData

Vanessa Andrada
Owner of StudioFX