Ingleside Resident Portal

COMPANY OVERVIEW

Ingleside is a non-profit organization that provides management and strategic leadership to three retirement communities.

Summer / Fall 2021 UX Internship at Ingleside Engaged Living.

DURATION

6 Months

TEAM

UX Researcher, CIO, Engineer, Developers, Resident IT Committee, and me! (Role : UX Designer.)

CONTRIBUTION

UX Research, Qualitative and Quantitative Data Analysis, Competitive Analysis, Ideation, Re-design, Iterations, User Testing, Design Systems, Responsive design

TOOLS USED

Figma
Procreate
Miro
Calendly
Zoom

PROBLEM OVERVIEW

The old Ingleside Resident Portal was overwhelming for senior residents due to many reasons such as:-

Difficult navigation
Difficult flow
unclear terminologies
lack of guidance
poor content organization and UI
accessibility issues

The redesign of the website has been completed, and the team required a UX designer/researcher (that's me!) to conduct user testing and redesign the prototype based on the findings.

OUTCOME

I completed the redesign of the website and evaluated it through:

Conducting formal User testing
Conducting interviews with participants talking about their experiences on mobile.
Design solutions for problem areas

TARGET USERS

The target users of this project are the Senior Residents of the Ingleside Engaged Living at King farm.

There are 170+ residents living in this community.
The users belong to the senior age group.
They are 65 years of age or older. Many users were non-tech savvy.

1. RESEARCH - USER TESTING AND INTERVIEWING

From a research perspective, I wanted to contact users for two purposes:

Conduct user testing on the prototype
Contact users on their experiences with the website on mobile

1.1 CREATING THE TEST PLAN

I decided to test the most happening sections of the current website. I dug into google analytics of the current website for better insight into where users go the most so that I could make the most of the hour I had with them. Through that, I could decipher 6 tasks that covered the functionality of the website.

Finding a resident in the resident directory (The most popular part of the website)
View new residents
Register for an event
Find the weekly newsletter
View a resident group
Request maintenance for a broken microwave

Along with that, I created an interview script for residents who used the Ingleside website on mobile. I asked them:-

What features do they access on mobile?
What do they like about the mobile version of the website?
What challenges do they face when accessing the mobile version of the website?

I wrote to the Institutional Review Boards (IRB) to allow me to conduct this study, which helped me understand academic writing and taught me how to advocate for usability testing in a formal manner.

1.2 FACILITATING TEST

Once the live prototype was complete and functional, I began scheduling both studies through Calendly, and I got 15 users who wanted to user test, and 9 who wanted to talk about their experiences on mobile. They were lively, with infectious enthusiasm to help and talk about the community and the redesign. After that, I broke the ice by asking them questions like:-

How's your time been at Ingleside?
What's your current experience with the website?
What's your favorite part of the website?

Once the participants were comfortable, I shared the task and my screen for the participant to control. I asked them to think aloud while navigating through the app, and at the end, I would ask for their feedback about their experience.

1.3 QUANTITATIVE RESULTS

I asked participants to fill out a survey with demographic information and information about device usage.

1.4 QUALITATIVE RESULTS

The feedback from residents was widely positive, but also highlighted some areas of improvement. From an aesthetic most users liked the design, but the prototype highlighted some functional problems.

PROBLEM #1 : Visual Heirarchy

The first feedback I received was for the visual Hierarchy of the text, within the Headings and subheadings.

Participants were confused by subheadings and sub-subheadings
Sometimes felt like different sections
The typeface was small in some areas
Underlining in subheadings made them feel like links.

PROBLEM #2 : Need for Better Resource Visibility

I learned from talking to participants that Ingleside stored a lot of information, that was hard to access for participants at times.

They published a newsletter every week with a lot of information (sometimes over 11 pages), and it was hard for residents to keep track of.
Some residents mentioned needing a strong search engine.

PROBLEM #3 : Fixing Naming Convention

Participants felt confused about the names of sections within the website, as well as actions, that they felt were ambiguous to them.

"Get Involved" led to Resident Committees and Groups. Almost all participants felt the name wasn't informational enough.
"My actions" contained forms submitted, and residents felt that it was too generic.

PROBLEM #4: Homepage needs more Pizzazz

The residents had a lot of feedback for the homepage itself, which was effectively the face of the website.

The participants liked the compactness.
Some residents found it bland and not engaging, and "unfriendly."
The boxes were similar, with no distinction, which confused some users.

PROBLEM #5: "Get Involved" section needs to be changed

Within "Get Involved", which had resident Groups and Committees, the participants struggled a lot. Some of the things they struggled with were:-

"Get Involved" Name
The categories of Groups
Within the page, there were many options, and participants felt overwhelmed.

2. REDESIGN BASED ON USER TESTING

Throughout the internship, I worked on different aspects of the website that needed attention. My methodology followed understanding problem space - research - design - feedback - redesign.

2.1 SEARCH FEATURE

I discovered the importance of having a good search functionality for the website. A lot of information was inaccessible to residents because they were buried within documents, and residents would have to look through multiple documents to find the information they need.

“Sometimes important information is within page 6 of 11 of the insider (newsletter on campus) and then 2 weeks later, I have no idea how to find that. If I try searching for it, it’s as unhelpful as sifting through the documents on my own... ”

~Fellow Resident

2.1.1 RESEARCH

A good search engine should be:

Federated - Search through all content through one search query
- Can be achieved by providing a single search box
- Communicating with developers
Faceted - Narrow options and find what they want
- Provide a filter
- Categorizing results
Fast - Deliver sub-second response times
- Talk to developers

2.1.2 EVALUATION OF OLD DESIGN

With the design principles in mind, I evaluated the current websites' search page for more insight on the current user experience and it's pros and cons.

2.1.3 COMPETITIVE ANALYSIS

Google Search Engine

Google had interesting strategies within its search engine. What I learned through inspection :

Autosuggest, autocorrect, and recent searches.
Sorted the mass information by type of result.
Adequate use of space - and used sections to reduce cognitive overload.
To help the user dive deeper, google matched the query to popularly asked questions.
Incorporated images into results.

LinkedIn Search Engine

LinkedIn had similar datasets to Ingleside (people, employees, events, etc.). I wanted to assess how they incorporated it into a single search. Here's what I found.

LinkedIn sorted mass information by the type of result.
- Additionally, they divided the results by type
They included context within results
- Images provided more context - recognition rather than recall.
Pagination chose the category based on search terms.

Both engines were extremely powerful and intuitive, and I wanted to incorporate elements from each of them into the redesign to help the residents.

2.1.4 LOW-FIDELITY DESIGN

With a more distinct vision of what an Ingleside search engine could look like and the requirements from the residents set out, I dropped my laptop (not literally!) and picked up my pen and paper to illustrate what it may look like.

2.1.5 HIGH FIDELITY DESIGN

The search engine I designed had

Recent searches and auto suggest to help the user
Sections within the results representing categories, as well as easy toggle between the categories.
Context within result cards, whether through text or images.
Search tips for additional help.

2.2 RESIDENT DIRECTORY

The resident Directory was another major part of creating a strong community throughout Ingleside. This directory helped residents start conversations, participate in activities and connect with each other.

Resident Directory's usage increased during the pandemic, as residents looked for emails and phone numbers online.
Google analytics claimed that the resident directory was the most used part of the website.
During Mobile experience Interviews, most of the participants claimed to use the mobile version of Ingleside for this functionality.

2.2.1 CURRENT DESIGN EVALUATION

With the design principles in mind, I evaluated the current websites' resident directory to see the good and the bad, and what I needed to incorporate in the final design.

2.2.2 REDESIGN WITH TWO DIFFERENT OPTIONS

To provide the residents with multiple options of functionality, I designed two layouts to display functionality.

Style 1 : Clickable options on side

Pros :

All options are available on one page - no clicks required
Follows more one-track mind, easy to comprehend
Good usage of space

Cons :

Must scroll to see all options - cumbersome
Too many CTA's

Style 2 : Clickable options under Pull-down

Pros :

Compact design - conserves space
Easy transition for Ingleside users
Individual search possible.

Cons :

Order dependant - confuing
Two search buttons CTA's confusing

2.2.3 POST USER TESTING RESULTS

From formal user testing, we decided to go for option #2 with a few tweaks because :

More compact and sleek - No need to scroll
The first design looked too "amazon-like", users felt like they were buying items
Would be an easy transition for Ingleside users
Resolved Order Dependency

2.3 'GET INVOLVED' TO 'RESIDENT COMMITTEES AND GROUPS'

"Get Involved" consisted of a long list of resident Groups and Committees, which overwhelmed participants and caused confusion. So we went back to the drawing board with the team to discuss the requirements.

2.3.1 FUNCTIONAL REQUIREMENTS

Differences between committee types are very confusing, especially to new residents
- Some sort of categories option?
Need for better discoverability for committees and groups
- Maybe a search option?

With the IT committee and the CIO, we worked on how to redesign this section, and increase its functionality.

2.3.2 CURRENT DESIGN EVALUATION

2.3.3 REDESIGN

Committee and Group Finder

While searching for committees and Groups, users would have a filterable search bar that would list out the committees, but would also allow users to search keywords.

Committee Information

Each committee and Group would have a separate page in the form of a multi PDF Page with:-

About
Information about Committees (By-Laws)
Meeting Minutes (with a filterable option by month and year)
Members of the Committee/Group

Information in different Formats

Users would have the option of viewing the groups and committees in list or card format, for more options.

2. 4 DESIGN ITERATION - HOMEPAGE

The homepage was one of the most challenging pages to complete, because of it's impact. I contacted the marketing team for images that I could use, and through iterating on how sections within the page could look.

Current Design

Iteration 1 : Homepage Pre- User testing

Iteration 2 : Homepage Post User Testing

NEXT STEPS

I am currently working with the IT Team and developers to finalize the design. We hope to get the design pushed by December 2021. If this study has taught us anything, it's how important user testing can be. So, in January, we will conduct another round of user testing with a more developed prototype of the website. And once everyone is satisfied with the design, it will be published!

WHAT I LEARNED

This project was my first time out in the world as a UX Designer and Researcher, and I had a lot to learn. I felt challenged at times, with new requirements, and I learned how to talk design in a non-design world. Since I was a solo designer on the project, I felt lost at times, and I learned how to rely on peers and online mentors for support on what to do next.

A piece of wisdom I'll carry with me; if you have time and the space, it's good to explore and make mistakes while you're in the low or mid-fidelity phase, as opposed to following through on just one idea. While most of my designs were accepted, some ideas I'd worked on weren't, and in those moments I felt okay because I was able to follow through with the idea and move forward.

Thanks for looking through my work!

Connect with me on LinkedIn or email me at sowmyaa.chandra@gmail.com. I would love to talk design, plants, or anything you have in mind!

Website Design/ User Testing/ Interviews/ IRB