Case Studies
Designing a document management SaaS with effortless digital signatures.
I worked on the overall design process and oversaw aspects related to product scoping, user flows, wireframes, rapid prototyping and usability testing.
MY ROLE
10 days
Individual
Figma, Discord, Zoom, CSP
TOOLS
TIMELINE
PROJECT SCOPE
In order to narrow down the requirements to design an MVP, we first prepared ourselves with a desktop research, and then conducted a user interview. This way, we can dig deep into what the potential users need and cater to their specific needs.
Based on the interview results, we made an affinity map to group the information we gathered based on the commonality between them. This plays a pivotal role by organizing and synthesizing design ideas and insights.
And we also distilled a persona that would help us contextualise the design we are aiming for. By empathizing with this fictional representation of real users, we can tailor the interface to meet their specific needs, resulting in a more intuitive and user-centric design.
Now we see that EasySign should help someone like Beatrice tremendously. But first, we need to narrow down the features that would make an MVP.
To do that, we are going to generate user stories as they encapsulate the user's perspective and needs. These succinct narratives should serve as a valuable tool that help us empathize with users, prioritize features, and maintain a user-centric focus throughout the design process.
Now let's place Beatrice in a situation where our design is needed. This way, we could see how our design would eventually help our users.
We also map out the journey users would potentially take within a digital product or interface. By visualizing the steps a user follows to accomplish a task, we can streamline the user experience by optimizing navigation and interactions, ensuring a seamless and intuitive journey.
First, we outline the basic structure and layout of the SaaS. This will be the blueprint to EasySign, helping me visualize the user interface's organization and functionality before adding detailed design elements.
LET'S START BUILDING
HERE COMES THE FINALIZED DESIGN
After meticulous planning, iterative refinement, and careful work, we are thrilled to unveil a user-centric and visually captivating digital experience. This final interface design embodies my commitment to simplicity, functionality, and aesthetics — ensuring that EasySign remains the epitome of intuitive document management.
Get ready to explore a seamless and efficient way to sign and manage documents like never before.
LOG IN SCREEN
The log in screen showing correct state and incorrect/error state.
DASHBOARD HOME
Home screen showing the overview of the documents to be signed, documents that need other people's signatures, documents that are time sensitive, and completed documents.
ALL FILES
Overall view of all files stored in the cloud.
Tools:
Convert to PDF
Request E-Signatures
Upload Documents
OPENING A DOCUMENT
Allows some editing to the document such as adding signatures or images and drawings.
SIGNING A DOCUMENT
Signature Tool:
Choose saved signatures
Add new signature
Add initials instead of signature
Add new signature:
Type
Draw
Image/Scans
Signature is added with a bounding box.
It can be resized, rotated, or transformed however as needed.
The bounding box won’t appear on print.
COLLABORATIVE TOOLS (COMMENT, DRAW, AND ANNOTATE)
The comment tool allows user to add a comment to the document.
This helps in supporting the collaborative process between users.
The comment will then appear as a sticky note on the document.
It can be hid when needed so it doesn’t bother document viewing.
Other users can reply to the comment or resolve it with the check button to put the comment into archives if the problem has already been solved.
If a comment has already existed, the comment button can be used to view all of the logged comments and even set notifications for new ones.
CONVERTING FILES TO PDF
Only when it is ready to be converted, the CTA for conversion is then turned on.
REQUESTING E-SIGNATURES / CREATING AN ENVELOPE
With this tool, users can request signatures to other users without having to open an email application. This process is called creating an envelope.
Before sending the envelope, users are asked to mark the spots that need to be signed by the recipients.
POWERFORMS
SETTINGS
HELP PAGE
By subjecting our platform to real-world scenarios and user interactions, I hope to gain invaluable insights into its effectiveness, efficiency, and overall user-friendliness. Usability testing helps us pinpoint potential pain points, streamline workflows, and enhance the user experience. With this test, we ensure that EasySign remains not just a powerful tool for document management but also a delight to use for everyone.
BUT, DOES IT REALLY WORK?
PROJECT TAKEAWAYS
In the journey of crafting EasySign, I've learned that simplicity is the key to the product. By prioritizing user-centric design and seamless functionality, I've not only revolutionized document management but also set a new standard for intuitive software. EasySign reaffirms that technology should empower, not confound, and that user experience is at the heart of innovation.
THANK YOU FOR READING!
OTHER PROJECTS: