In Japan, signers use a Hanko to represent their signature on paper documents. Adobe Sign Stamp functionality, allowing signers to upload and apply their personal Hanko to represent their signature on an agreement.
In Japan, a "hanko" personal stamp or seal serves the same role as a signature here. Featuring a person or organization's name, the hanko is used on important documents, bank transactions and major contracts.
The goals were to make the experience easy to use but still feel credible and professional.
Because there were so many details and requirements we had to capture for this project, I worked very closely with the product managers and went through many rounds of design before we came to this point.
Visual Design, Interaction Design
first part of THE DESIGN PROCESS
There are two parts that we can set up and add stamp on the documents, from computer and mobile. First, I figured out how to set up the stamp as a sender. My solution was quite simple: The user would drag and drop the stamp component where they want it, adjusting the size as well, then upload a picture of the stamp from their computer. It’s pretty similar to how you can upload anything from your local storage to the cloud.
Another cool thing about this app is, you can send a link from your computer to your phone. after users snap a picture of their stamp on their phone, it automatically uploads to the cloud and is ready for you when you open your desktop app.
second part of THE DESIGN PROCESS
The second step was figuring out the flow of how to take a picture of the stamp and apply it on the document. I used a native camera component which is better for implementation, especially given the range of users’ devices and screen sizes. After taking a picture of the stamp, the user has two options: retake the picture, or use the one they just took. My priority was keeping the experience to as few steps as possible.
When the design was ready, I created specs and worked closely with engineers to implement the finished product.