Category:
Quick redesign
Role:
Product Designer
Team:
Product designer, PO, CTO, 1xFE
Timeline:
4 weeks
In August 2024, my team got 4 weeks to implement a new feature to support Multi-Document uploads for contracts. It was a rather simple concept. During the early design phase, I recognised the document feature would clash with the outdated 'Attachment' functionality that backend could not deprecate within the timeline.
This case study demonstrates how I convinced the stakeholders with strategic design decisions to implement an interim solution to handle the outdated 'Attachment' without burdening the backend and complicating the frontend.
IMPACT ————
COMPANY CONTEXT ————
My team is highly developer-centric, prioritizing basic functionality first. Before my arrival, random elements were applied across use cases. While the platform is evolving and a full redesign is not feasible, I focus on the current and upcoming roadmap projects to enhance the platform strategically.
In this project, I standardize the document-item element, eliminate inconsistencies hindering scalability, and establish it as a reusable component for documents across the platform.
CHALLENGES ————
Reinventing the wheel was not an option.
Generating another project within a tight development parameter was not an option.
Any design proposal must be 130% compelling and feasible to get engineers' 100% devotion.
First of all, what are 'Attachments'?
What makes the 'Attachments' architecture fundamentally challenging to scale?
The Multi-Document Support structure introduces additional complexity, as overlapping actions like "Add Attachments" and "Link contract" create user confusion between document handling and attachment management, compromising interface clarity.
See the old interface for 'Attachments' below:
You will find the early iteration for Multiple Document Support in the Document tab below.
While the iteration confirmed that properly handling the list of attachments remains important, it also revealed that attachment-related actions should be removed to avoid confusing users.
L: Document list
R: Document viewer
SOLUTION SPACE ————
Users can now digitally file and manage contracts in a document repository supporting various file formats. The Document tab enables document navigation as shown above, while the new 'Related' tab organizes current 'Attachments' and 'Linked contracts' (later 'Related Contracts').
ITERATIONS ————
This solution rolled out quickly without pre-launch testing, reflecting our team's operational reality. As the only designer in a culture that prioritizes intuition-based implementation, I identified the problem, proposed an interim fix, and saw development begin within hours. Though I advocate for testing to prevent guesswork and rework, I supported our rapid development approach while closely monitoring post-launch user feedback.
My initial design aimed to preserve all attachment functions while planning for a gradual phase-out by replacing secondary buttons with icon buttons for "add attachment" and "link contract." Unfortunately, this led to user confusion, with many clicking the wrong "+" button, as shown in the left image.
To address this confusion, I quickly iterated the design by removing one "+" button. Now, a single "+ Add" button triggers a menu with options to "add attachment" or "link contract," as illustrated in the right image.
FURTHER ITERATIONS ————
While new users appreciated the clarity of the Related tab, longtime users missed the visibility provided by the previous dropdown menu for Attachments, despite its scaling limitations.
REFLECTION ————-
The quick redesign solved the Attachment issues but forced longtime users to adapt without preparation. It is a reminder to the team that pre-launch testing would have identified limitations earlier, preventing development rework by gathering qualitative feedback before coding rather than iterating after release.
We also relied heavily on CX and an Intercom message for feature guidance, prompting me to explore in-app feature introductions as a frontend solution.
