realty agent app design
mobile & desktop application for realtor agents to manage their client network
Embedded Files
AgentDash
AgentDash
AgentDash is a business management solution for realty agents to streamline real estate transactions. Agents can organize their business pipeline, add new clients and track their progress through the home buying process.
PROJECT ROLE
Solo UX Designer
TIMELINE
September 2022 - February 2023
In the time I got to work on this project, my main contributions included updating the invoice payment workflow, making updates to the Design System, and recommending changes for accessibility compliance. I made sure our design elements were consistent with Material 2 design standards and updated parts of the component library. I collaborated with the Product and Development teams to iterate ideas and deliver features directly to users.
Accessibility Assessment
Accessibility Assessment
When we made Angular Material updates to the app overall, I came across a couple of accessibility issues with the color system I was using for the buttons, and the Focus state specifically no longer passed WCAG standards with our Primary color choice.
Starting point - the left Focus button displayed here had an outline that was way too light and did not pass contrast ratio requirements. I also assessed the standard 12% Focus State overlay recommended by Material Design, and researched how to make the change in state more visible but still pass contrast requirements.
I also recommended an update to many of the displayed links text to be clear for someone using a screen reader (footer link is displayed below).
After spending time assessing the app overall and researching different ways to present the Focused state, I made several recommendations for the Product team to choose from.
Once I shared my recommendations with the PO, I changed the Focus State overlay to 24% opacity to make it clear where the user is on their screen. I then redesigned all of the component button states for the Design System so they would pass accessibility compliance.
Invoice Payments Workflow
Invoice Payments Workflow
This section of the app was designed to let an agent know they had a commission to claim and route it to the paying party for payment. The dynamics of the existing download icon needed to change as agents weren't going to need that functionality as much as they'd need to be able to share the document with their bank or route for payment directly through the AgentDash DashPay payments app.
First ideation below - I added a share & options icon and worked on solving issues for a mobile screen size. I removed the date field to fit two new icons and added a dropdown menu with the new actions the agent would need to take (bottom center image).
In user tests, the icons confused the test group so I tried making the them into buttons (bottom right image).
In my fourth ideation, I removed the table outline to give everything more room and be more readable. I then combined the icon and text buttons, then continued to explore a dropdown action menu idea.
For the final product I worked with the PO to determine what the most necessary actions were for the invoice and then created buttons for those actions. I moved the other actions into their own form as they were still considered necessary but optional.
I also worked through an update to the overall design to be up to material standards.
Before and after of the invoice table. The design on the right was pushed to the users. Overall the actions were more clear and it gave the other necessary fields room to be readable.
Client Pre-Approval Workflow
Client Pre-Approval Workflow
This section of the app was designed for an agent to generate a financing pre-approval letter for their clients.
The form was determined to be confusing with intermixed optional and required items. I started with the screen in the center and assessed the hierarchy of the information first.
First, I assessed the hierarchy of the required/optional fields and worked with the PO to figure out what information was critical for the Payments team to process payments.
I created a simplified form for the Agent to use with only their required fields. This had very positive feedback from agents with reduced frustration / confusion. Agents still have the option to add the additional information by checking the box. This design change ended up being a test run for the PO to see if they can remove the optional fields altogether as the agents aren't using them often.
Final product that was shipped to the user in the images to the right.
Final Thoughts
Final Thoughts
Some of the main challenges I faced on this project were working directly with the business vs. the user. User feedback came through my PO or I got design direction from the marketing team. I had to work on balancing the needs of the business with advocating for the user and how they experience the product.
The project closed at the end of February 2023 which is when my contributions ended.
Page updated
Google Sites
Report abuse