COFI
YEAR
2023
CLIENT
CoFi
ROLE
Design Lead - Product
IMPACT
Spearheaded the design and successful launch of a comprehensive suite of construction finance apps (Payments App, Builder App, Credit App), driving significant improvements in user experience and operational efficiency through strategic cross-department collaboration and the implementation of a refined design system.
METRICS
PROJECT DESCRIPTION
CoFi is a construction lending and finance company that offers a suite of apps designed to help builders, lenders, and general contractors efficiently manage their construction projects digitally. Their primary app, the Payments App, serves as an all-in-one platform for adding and managing job members, processing payments to job members, uploading project images and videos, accessing job history, and more.
CoFi had just received a new round of funding and needed help with elevating their current state of design for their primary Payments App, as well as help them in finding paths forward in regards new designs / features for their 2 other apps (Builder App, Credit App).
Worked alongside the CTO & 6 developers daily. 3 of those developers were also project managers that I collaborated heavily with for weekly sprints. Also had weekly check-ins with CX team.
ACCOMPLISHMENTS
I began by conducting an initial audit of their products, as I do with each of my clients. This initial step allows me to gauge the current state of their product from a personal and professional standpoint. During this phase, I recorded my screen while navigating through each screen, vocalizing my initial thoughts and reactions to what I observed. This approach mirrors how I conduct some of my user interviews, where I encourage users to voice their thoughts aloud as they interact with the product. This helps us gain deeper insights into the user's perspective and pinpoint what's working well and where improvements are needed.
Next, I reached out to the CX team to obtain a list of builders, lenders, and general contractors in their system who had previously engaged with our chat system and email. This allowed us to identify individuals for interview purposes. In each interview, I posed a series of questions, covering topics related to the specific flow or sprint we were focusing on, as well as more general inquiries about their overall product experience. Collaborating with CX and conducting these user interview sessions enabled us to uncover common themes across multiple interviews, shedding light on areas that required attention, whether in the form of new features or addressing product frustrations expressed by users.
Recognizing the critical importance of user research and feedback in a product's success, I prioritized the goal of having users' needs come to us rather than always initiating contact with users. To achieve this, I conducted a user session with the head of CX to streamline our chat process and our feedback collection methods. CX highlighted the need for users to become more self-sufficient, as they had observed users relying excessively on chat to resolve their issues. Despite CX having created and uploaded numerous instructional videos on common app functions and addressing user issues, many users were unaware of their existence.
To address this challenge, we revamped the initial chat option into a "Provide Feedback" button, which we prominently placed in our fixed bottom bar, ensuring its visibility and accessibility on every page. We also engaged users to gather their preferences regarding chat gate filters, ultimately settling on categories such as "Provide Design Feedback," "Report a Bug," and "View Tutorial Videos." Moreover, we incorporated a fallback option on the "View Tutorial Videos" screen, enabling users to "Chat with an Agent" if they encountered any difficulties. This strategic shift significantly reduced CX chat volume while facilitating direct communication of design feedback from CX to the design team.
Lastly, I collaborated closely with two members of our Credit team to develop a streamlined digital solution for credit applications. This encompassed creating a user-facing credit application process as well as an internal version tailored to meet the specific needs of the Credit team. The internal tool facilitated efficient application refinement, search functionality, and real-time application status monitoring. Most importantly, it allowed for the assignment of applications to individual team members. Within the user-facing credit application, we introduced a feature that enabled users to add notations to specific areas of the application, which proved invaluable in addressing questions or issues that arose from both user and customer perspectives. This enhancement streamlined the application finalization process, ultimately resulting in a smoother experience for each applicant member.
cofilending.com
Weekly meetings with the CX lead were conducted to understand their daily focus and identify potential areas for added value.
One key issue we identified was the unfiltered and excessive content in our general chat, which required streamlining to enhance efficiency and clarity. This led to the creation of the 'Provide Feedback' feature, which I spearheaded.
We ran internal collaborative discovery sessions with department heads and developers to identify user needs and requests, and to scope out the next few months' sprints.
These sessions fostered cross-departmental collaboration, streamlined our sprint planning, and ensured alignment with user needs.
Working closely with the lead developer to ensure seamless implementation, we created user flows to visualize and streamline the user journey, making the interface more intuitive and user-friendly.
Collaborated weekly with the lead developers to refine the list of product questions we had been receiving from our internal teams as well as our users via our new "Provide Feedback" button we had implemented over our previous general non-targeted chat feature.
This ensured that we continuously gathered targeted user feedback, allowing us to make informed decisions and improve the user experience based on specific concerns and suggestions.
What CoFi looked like prior to my hire and what CoFi turned into: Beautiful, simple, clean, minimal, and most importantly, usable and appreciated by our users from feedback we received via our new "Provide Feedback" button.
We created an extensive design system for our suite of web apps
A look at the "Provide Feedback" flow presented during an internal ideation and implementation workshop with developers, the CTO, and the marketing lead.
We created GIFs that were both informational and humorous, aligning with our brand image, to showcase the new functionality.
A look at our updated login page, praised by users as easier to use. It features rotating images of projects currently being developed and funded by CoFi, showcasing real-world results to build user trust and engagement.
Users were frustrated by the need to log out and navigate between different URLs for our apps. Our update addressed this issue, significantly improving their experience.
A look at our prototyping flow for the "Switching between apps" function, which allowed users to seamlessly navigate between our suite of apps, similar to Google's functionality.
A look at our Job Details page, now featuring dropdown functionality for information-dense categories, with important data displayed prominently to ensure a clear hierarchy and a more organized user interface.
A look at our Budget screen, one of our most important and widely used interfaces. Below is an example question regarding triggers for specific notifications that I had for the developers.
We considered the smaller, yet equally important, pieces and functionalities of our UI. Tooltips were enhanced to display informational or educational GIFs, providing context and clarity to the elements they highlight.
One of our more complex functions, "Draws" (requests for funds from a loan or line of credit), had many elements and statuses, often confusing users about the current state and ownership of their draws.
To fix this, we redesigned the UI to highlight critical information, making essential details clear and easy to find, addressing areas that were previously missed or overlooked.
We developed an all-in-one in-app feature to centralize all job-related files. Previously, users had to send files outside the app, leading to disorganization and lost documents within emails and internal threads.
Conversations were getting lost in emails between job members. Based on user feedback from surveys, we decided to explore an internal chat feature for job members to easily communicate about projects.
To enhance clarity and context, we added a "Create a Callout" feature, similar to the screenshot functionality on iOS devices. This allows users to make specific callouts without complicating or lengthening the workflow, ensuring a smooth and frustration-free experience.
A look at the newly redesigned Inspections page. We revitalized this page by prominently featuring images for each inspection, allowing users to easily differentiate between multiple inspections at a glance.
Additionally, we made the inspection progression more engaging and interactive with bold, noticeable, and user-friendly sliders.
Previously, changes to a job were made and updates shown without clarity on who made the changes or why, leading to confusion.
Our solution: the newly created Job History page, which details all actions performed, by which user, and at what time. This feature enhances transparency among job members.
A look at our newly redesigned Job Settings page. We streamlined this page by consolidating settings from various parts of the app into one cohesive location, making it easier for users to change or update crucial job-related settings quicker and more efficiently.
A look into a complex flow within job settings that allowed team members or admins to add and modify job members, as well as assign different permissions.
Overcoming this tricky problem significantly improved team management and control within the app.
A smaller OKR involved creating email templates for instances such as when a job member is added or a passcode is sent for login security purposes. Marketing took this template and ran with it!
GENERAL CHAT ENGAGEMENT METRICS
In any give month, the general chat option had around 300 submissions. These submissions were primarily surrounding things not functioning properly or user commenting on the look and feel of the product being, “Too complex or confusing” or, “This feature would be better suited on page X”. In the first month after the implementation of the new Provide Feedback feature, we were able to bring down the number of general chats to 20 submissions, alleviating the chat bloat CX was experiencing. More importantly, we then saw great engagement over the next month of the new feature options. This led us to be able to conduct focus sessions and figure out easier on what users were having issues with and what we needed to focus on time on.
GENERAL CHAT ENGAGEMENT METRICS
