An internship project to improve the usability and aesthetics of a Military Retirement Community's Resident Portal.
While studying for my Masters degree in Human-Computer Interaction in the United States, I interned at a Retirement Community to help them improve the usability and aesthetics of their resident portal.
The Knollwood Military Retirement Community relied on a resident portal for essential information like dining menus, meeting schedules, and community activities. However, the end users were retired veterans who found it challenging to use the website. The portal (built on Ning), had quite a few usability issues and a confusing Information Architecture (IA). It needed improvements so that the website would become easy and intuitive for the residents.
The website wasn't managed by IT professionals, but by a small team of 3-4 residents. The goal was to improve the experience for the users while ensuring the administrative backend remained sustainable for the resident-led web team.
How might we improve the usability of the resident portal so that it is intuitive and displays the right information at the right place thereby increasing utilization and boosting resident confidence in the portal?
I began by performing an expert review of the portal using a combination of Heuristic evaluation + Scenario-based evaluation. Based on the user personas I built, I identified a series of key tasks that the residents performed regularly, and for each task, I used Jakob Nielsen's 10 Usability Heuristics to identify issues, their severity and possible fixes.
Some of the key findings were:
Scroll Fatigue on Content-heavy Pages
Some pages like the Home page, being content-heavy, got very long at times. This could lead to scroll fatigue for some residents to scroll back to the top of the page.
Flat, Non-interactive Resident Directory
The resident directory did not have an easy way to get to a specific resident's name quickly. In its current state, it was just a flat, long list of names with room numbers and phone numbers.
Missed Interactions within Global Nav
The primary menu items on the global nav displayed a sub-menu item list on hover as well as were themselves clickable without clear indication.
Long Menu Lists
The menu lists for some of the primary global nav items were very long which could make it difficult for some residents to easily get to the bottom menu items within the list.
Next, I conducted a round of usability study to capture the user's needs and pain points while using the portal. I interviewed 8 participants (all were current residents) giving each 4 task-based scenarios.
Learnings
Through the study, I noted the issues the participants were facing while performing some of the tasks along with any feedback or suggestions they gave. Additionally, I learned that the residents had unique mental models for where information should live. This prompted me to conduct a Card sorting activity.
To solve the navigation issues and to hear from the residents on where certain content should live, I facilitated an Open Card Sorting activity. I asked residents to categorize 20+ pieces of content and name those categories themselves.
Learnings
This activity showed a clear preference for a flatter navigation structure and more descriptive labeling, which formed the foundation of the new sitemap.
I started by translating the new Information Architecture (IA) into wireframe prototypes and had them reviewed by the resident admin team.
Based on the feedback received, I made tweaks to the sitemap, and converted the heuristic fixes and high-priority resident suggestions into high-fidelity prototypes.
To validate and test the proposed design, I conducted usability tests with 10 participants who completed 4 tasks each. The tasks included:
What's for dinner tonight?
When is Karaoke night?
I want to see the latest monthly coffee meeting minutes.
What's Mr. XYZ's contact number?
Learnings
The participants had a very positive reaction towards the updated design, and appreciated the clear color contrast ratios and easier navigation within the website. However, in addition to a few minor change requests, one common request was to make the global navigation menu easier to access since some menu lists were still a little long for them to hover over, even though we reduced them to a max of 7 items.
I used the feedback received from the usability test participants, updated the designs and had them reviewed by the admin team iteratively until we were happy with the final designs.
Once the designs were finalized, I went ahead and updated the Resident Portal built over the Ning CMS platform.
Since I was an intern, the project's success depended on what happened after I left. My final step involved creating a comprehensive 44-page "Guide to Modifying the Website" documentation to ensure the resident committee could maintain the site after your internship.
Documentation highlights: