Project Description
Project Overview
Klinche is a construction payment management platform that aims to eliminate many inefficiencies that regularly occur throughout the supply chain. Through its unique payment process, it becomes the middleman between supply chain payments. With Klinche, whoever is leading the construction project has the funding control and visibility of where payments are flowing.
Role
I was in charge of the entire design process, which included creating all wireframes and mockups for the Web App, iOS App, and Apple Watch App. I also created the brand structure for the company, which included the logo, colors, typography, and brand guidelines. Although we had a small design team, I was in charge of hiring a UX Designer, UI Designer, and managing all tasks between the development and design team while working closely with the product manager.
Problem
The process of completing a construction project has remained the same for decades yet still has significant flaws. Klinche set out to solve this issue by becoming a mediator between the different participants in the supply chain. Before Klinche, hand to hand transactions took place to make payments between parties. This allowed people to take advantage of one another and ultimately commit fraud.
For example, you can give a Direct Contractor, who is supposed to manage the construction of your project, a 10 million dollar check and they could potentially leave the country, and you have lost your money. This is one of the problems that Klinche prevents.
There are also a lot of legal agreements that are required for the construction project to begin and end. Legal documents like Pre-Liens, Waivers, Payment Confirmation are legally required, yet most small and medium-sized construction companies do not comply with these requirements. If anything goes wrong and this documentation has not been completed, enormous complications arise. These were the two significant problems that Klinche set out to solve.
Personas
The different constituents across the construction supply chain mainly consist of five different personas. These personas ended up driving the way the platform was developed. Each of these user types required their workflow.
Persona 1: Property Owner
The Borrower or Property Owner is the customer in the construction supply chain. They are the party that pays to have the property developed. Because they are the customer in the project, they are responsible for providing final approval on all payments before being released. They also need to approve all Liens and Waivers so that all work and payments are legally compliant.
Personas 2: Bank
The Bank or Financial Institution is involved in a construction project when the Borrower or Property Owner takes out a loan to complete the project. Once the Bank is involved, they need to have complete visibility into the project so that they can protect their investment. They remain within the budget that was submitted and approved for the project and fund the loan based on line items within that budget.
Persona 3: Direct Contractor
Direct Contractors are at the center of a construction project. They are responsible for making all the moving pieces come together to complete the construction project. They work with the Borrower to set price and expectations while hiring the Subcontractors and Suppliers to complete work. In order to hire these workers to finish the job, many legal documents need to be signed and exchanged.
Persona 4: Subcontractor
The Subcontractor is hired by the Direct Contractor actually to build the development. This means they are responsible for everything from pouring the foundation, to putting the final touches on the project. They work with the Direct Contractor and Suppliers to make sure all job materials are on site so that there are no delays in the construction. Being a Subcontractor means that there are many opportunities for error, so the organization of all moving parts is critical for their success.
Personas 5: Supplier
The Supplier’s job is relatively straightforward; they provide the materials for the Subcontractors and Direct Contractors to complete construction. However, they still have the responsibility of making sure all supplies arrive in full and on time. They are contractually bound to do so, and if they fail, their business can be hurt substantially.
Workflow
The workflow for Klinche was quite large due to the processes that were being digitized. Many situations where “if this, then that” were needed. Also, each of the five constituents had slightly different versions of the end product. There were also different workflows for all platforms Klinche was launched on. This included an iOS, Apple Watch, and Web Platform versions. Due to the size of the project, the example flowchart below is a very high-level version of the main navigation for a Direct Contractor for the web platform. Each action or feature eventually had their workflows.
Wireframes
Wireframing this project was vital for quickly creating iterations of the product. With the platform being so large, much time was spent tweaking these wireframes before final mockups were created. Similar to the workflow, only the wireframes as a Direct Contractor are displayed.
Mockups
Many mockups were created over the different versions I worked on. In some cases, after the design language was created, only wireframes were needed for the development team to program changes. In other cases, for user testing, mockups were needed for the clickable prototype. Klinche is designed using quite a few tools at different stages during the project. These tools include Adobe Photoshop, Adobe Illustrator, Sketch, InVision, and Zeplin.
Conclusion
Challenges
Many challenges needed to be overcome in this project. Due to the number of constituents that are necessary to be accounted for in the design, and the number of mockups, proper file management was vital for versioning and making sure nothing got lost in translation.
Being that five parties could transact on this platform, there were sometimes five different versions of screens that would need to be designed. This was a time-consuming process in comparison to other projects and made it essential for the mocks to be correct the first time around.
Klinche also processed payments and kept necessary information from the user for legal agreements to be made. This made compliance and security one of the most important things to consider throughout the design process- whether that was designing a screen where we collected this sensitive information or notifying the user of legally binding documents being exchanged.
Reflection
Having worked on Klinche for more than three years, there were many moments that I look back on where stepping out of my comfort zone was needed. This meant doing many things for the first time, which in retrospect taught me a lot and was beneficial for the development of my design career.