My REMAX Ultimate Agent Portal
My REMAX Ultimate is a comprehensive in-house portal designed from the ground up to be as easy to navigate as possible for the agents working for the company. Every page was designed to be easy for someone with very little tech literacy to find their way around.
Role
User Research
UX Design
UI Design
Graphic Design
Project Management
Tools
Wix (Classic Creator)
Adobe Illustrator
The Problem
REMAX Ultimate is a 40 year old Real Estate Brokerage that has been slowly increasing its digital presence over the last 10 years, however a lack of an easy-to-use platform for the agents to access resources has made it difficult to retain new, younger talent. Because of an existing subscription,Wix Classic was decided upon as the web development platform despite its difficulties.
My Solution
Design a portal using Wix that will clearly communicate to agents all of the important information they need to know about their brokerage. It should be easy to use for older agents as many still take advantage of older technology for their day-to-day work, as well as feel modern and slick for newer more tech-literate hires. Site hierarchy should be clear and navigation should be easy and intuitive.
Research
At the start of the project I took the chance to familiarize myself with the resources the agents currently had access to, as well as how easily they could access the ones most important to them; agents at the brokerage had expressed they wanted easy access to legal documents, social media templates, and print marketing. Upon accessing the official REMAX Agent Broker Hub I realized many of these resources were either nonexistent or extremely hard to access - print marketing was two pages deep + another two redirects to other, outside websites like Staples. A hub for our brokerage would need to be easier to use.
Above: REMAX Agent Hub Home Page | Resources Page | Sign Supplier Redirect
User Testing
Without a test site to work with and with limited time - the bones of this site were made in about a week and a half - I asked a few agents to go through the above hub on their own computers and find various pages / resources I thought would be easy enough to access. What I expected was some difficulty finding things but not a lot of difficulty navigating what I considered to be basic website structure. Here's a list of surprising pain points I discovered.
-
Could not go back to the previous page / unaware of browser back button
-
Kept trying to touch the screen
-
Not an issue on their personal laptops, but interesting on office desktops
-
100% an issue when they tried it on my personal laptop
-
-
Difficulty seeing smaller buttons / hyperlinks
-
Avoided content with fewer images
-
Got "lost" at the bottom of pages
Key Takeaways
It'd be disingenuous to say these were overwhelming issues, and being in office would have skewed the testers a bit older, but it left me with an interesting challenge - I needed to design a website with big buttons that could be touch-screen friendly, while assuming a lack of browser literacy. Going forward this informed the creation of a site with lots of large cards, big buttons, & navigation shortcuts. This would ensure almost anyone in the brokerage could use the site without difficulty.
Design System
Left: MyRemaxUltimate Design System Breakdown, two pages
Bold Red Buttons
Big red buttons across the site make it easy for users to differentiate what is a button and what isn't. The red is also the official REMAX Dark Red so as to maintain recognizable brand consistency. This rounded red style is used for almost every major & minor button on the site.
Large Cards
For important content like templates, events & news posts I used large cards with a red bannner at the bottom to match the REMAX Dark Red used on the buttons. This makes it more obvious at a glance that they're clickable. On-hover the cards expand slightly to help make this clear as well.
Back Buttons
Back buttons across the site allow for easy navigation for users unfamililar with browsers, and are clearly labeled to indicate where they're going back to.
Non-interactive Cards
Cards made the most sense to me for displaying signage and print templates to the agents, but they needed to look different from the clickable cards on previous pages. To that end I used REMAX Dark Blue instead of red, and removed the hover effects.
Final Thoughts
With very little time to work on the bones of the site - just a few weeks, including time to get many of the templates ready - the biggest focus for myself was to get the site as functional and usable as possible. Since it's creation extra features have been added like event calendars and an online learning system, but all of these follow the same design systems and are organized as best as possible to avoid over-crowding the navigation.
The biggest struggle really was how much I underestimated how tech-illiterate a lot of the possible users would be, and designing for possible touch-environments as well as making sure the site could be navigated without utilizing any browser functions wasn't a challenge I had anticipated. I believe - however - that I managed to create something
If I got the opportunity to make the site again I would use the far more feature-complete Wix Studio Creator - more similar to builders like Webflow - in order to have more control over the hierarchy of the site and individual elements. Thankfully, such an opportunity is coming soon. Over the next few months the site will be rebuilt from the ground up, so stay tuned for 2.0.