Mortgage Center’s partners have a lot on their plate. They’re running a credit union as well as managing their relationships with their members and vendors. Mortgage Center partners with midwestern Credit Unions to help their members get great and affordable home financing. To help support our partnerships, we set out to create a secure online platform for our partners to access details and reports on their business with Mortgage Center.
I was brought into the project once the development team was brought on board with senior management. I assumed the roles of UI, UX, and Visual Designer.
Defining the Problem
We wanted to create a secure online platform where our partners could view their home financing program activity through Mortgage Center. It would become a one-stop-shop for reporting and loan activity for our credit union partners. The reporting process that we were replacing required a lot of manual work for employees and partners. By creating this portal we would increase efficiency and improve the overall partnership experience of our business.
Create the data system and flow for the portal between internal
- Define features and project requirements for the users.
- Design and develop the portal for our partners.
- Conduct UAT and launch the final product in 6 months.
- We had a tight turnaround time of 6 months from when I was brought in on the project.
- We were working on our data system alongside this project which required flexibility from both our team and the development team.
Understanding Our Users
Our users are somewhat familiar with using financial and reporting technology. They work at a credit union and use a computer, or tablet, at work. They are familiar with navigating financial portals through the internet. They also have at least some experience using Microsoft office products such as Word and Excel. Some users will be more advanced when it comes to using spreadsheets and Excel to build reports.
After seeing the initial wireframes proposed by the external development team, our team felt that there were pieces of the experience missing. I was responsible for redesigning the wireframes based on stakeholder, executive, and SMEs (subject-matter experts) feedback to better reflect the needs of our audience.
My process and its deliverables included the portals’ information architecture, wireframes, data visualization, interactive prototypes, and a style guide.
Structured the data and content in and around the goals and tasks the users are trying to accomplish.
Since we were presenting the designs to internal stakeholders, I stayed with higher fidelity wireframes that closely emulated how the final application would look.
I was responsible for figuring out how to visually display the data in the portal. There were important statistics about loan activity that we needed to display in a way that was easy for users to digest.
Making high-fidelity versions of the wireframes with clickable links and component states.
Once we started adding the colors to the platform, I redefined our digital style guide to match the current brand and define the visual systems of the portal. This allowed us to use some of our secondary colors to call importance to different areas of the portal.
Once we had a prototype of the first few pages of importance, we took it to a user group to get their reactions and feedback. We learned more about the way they were currently using what we were supplying them and that inspired additional changes to structure and hierarchy of the information on the pages.
We conducted UAT prior to launch to make sure that all content and features were designed and functioning correctly.
Issues during testing had us push some of the features and pages to the next phase to ensure they were working as intended.
Outcomes & Takeaways
While we may have had to make the project a little leaner than initially expected, we learned and delivered an exciting product that delighted our users. The new portal ended up being easier to use than the earlier platform and we got valuable feedback to look into in the future.