Case Study
DealTap
Case Study
DealTap
Improving digital real-estate transactions and
helping align the product team.
Background
What is DealTap?
DealTap was a bespoke Real Estate transaction platform. Conceived of just as eSignature tools were emerging, the goal of the product was to streamline the Real-Estate transaction process and bring it into the digital age.
This was an exciting, agile, start-up environment, where I was very fortunate to participate in every phase of the product’s life-cycle.
Real-Estate Transactions are not simple
The process often requires multiple initials, and signatures from multiple parties on across many different forms. Every step in the negotiation requires its own form, from the initial offer to the receipt of funds. Mapping out the workflow was critical objective for aligning the product team.
The platform had to be both robust and easy-to-use.
In order to effectively facilitate smoother Real-Estate transactions the platform had to not only generate any necessary legal documents, but import scans and PDFs of existing documents as well. Through regular, research-based iterations we improved the work-flow by refining the UI, and accommodating a new users with a clear and simple on-boarding process.
Highlights
DealTap – Mapping the Work-Flow
This document flow diagram referenced when generating additional UX Artifacts, such as user journeys
Mapping the Work-Flow
Real estate transactions are not as simple as purchasing a pair of shoes. There are a few more steps involved.
To help align the product team, on the intricacies of the transaction workflow, I took some time to digest, and comprehensively map out, the relationships between all the forms potentially involved in a real estate transaction in Ontario.
Re-Working the ‘People’ Section
We found many opportunities to streamline the transaction workflow by re-working the ‘People’ section of the deal editor.
- We used simpler, more common nomenclature because Offering and Receiving, while being the legal terms, required more recall bandwidth than Buyer and Seller.
- A two-column layout allowed us to fit more information on the screen. We also prompted the users when columns were empty.
- A quick delete button. Prior to this update the user had to click on the edit icon to delete a party from an agreement.
- Removed the cancel button because it was redundant.
DealTap – Re-Working the ‘People’ Section
This was the version of the problematic “people” section, which needed improvement. Notice the single column layout, and labelling used to describe the participating parties.
1. Initial nomenclature centred around ‘Offering’ and ‘Receiving’ parties. We changed this to ‘Buyers’ and ‘Sellers’ as this initial terms were confusing. 2. A two-column layout allowed us to fit more information on the screen. 3. Quick delete button 4. Removed the cancel button because it was redundant.
2. We also flagged columns when they were empty
This is the mobile version the revised “People” section
DealTap – Designing the Input Field Editor
Empty, filled and active signature input field examples
The dynamic-doc input field editor
Empty, filled and active textbox input field examples
Designing the Input Field Editor
The DealTap solution was built as a bespoke solution which had all of the relevant forms built into the system. However, PDF documents – which are often scanned in – could not be ignored as they are widely used in Real-Estate transactions.
We needed a robust ui element for adding input fields. It had to be simple enough to use on a touch-screen as small as an iPhone 5.
This UI element allowed users to do the following:
- Add a simple text input
- Initial and signature input
(multiple user, single input) - Field position
- Field size
- Field editor actions: edit, deleted, duplicate, undo
On-Boarding Slideshow Prior to Signing
When we asked research participants to initial or sign a mock real-Estate transaction, we observed that it took a bit longer than we had liked for new users to find and use the UI components involved in signing a document.
We discovered product tours in our initial exploration of on-boarding UX solutions – which would have been ideal – but ultimately decided to go with a slideshow due to time constraints. We added product tour the feature list for DealTap 3.0.
DealTap – On-Boarding Slideshow Prior to Signing
Reflections
Measuring Success
Unfortunately, the product had to ship before we had an opportunity to test our improvement against our initial user-research data, some measures of success would have included:
- Reduced transaction abandonment
- Faster deal generation
- Less user-reported frustration
- More completed deals
