FYNN COMMUNITY
UPDATED BEHAVIORS

Overview

These "Behaviors" are the collection of information given to us through data via staff members that check off how a person is feeling or acting during a task or situation. In other words, when a staff member gives a resident a shower they are doing a task for that resident; but how did that resident act when they were given that shower? The staff member would click the image of the Behavior icon to let us know. If the resident was mad and threw the soap at the resident the staff member would be the user to tap the Behavior of "Combative".

My part in this process, was to update the design and function of these Behaviors! I did everything from research and concept to implementation. With the implementation, they are being used in multiple applications today.

My Role

UI Designer

Responsibilities

Research
Illustrations
Wireframes
Prototyping
Detailed Mockup for developers
Graphic designer for print materials

Date

May 2023

My Location

Alpharetta/Milton, GA

Challenge

Iterate the Fynn Behaviors for staff to understand better by providing improved images of the different states of the Behaviors.

Solution

The updated Fynn Community will let users have multitenancy which will affect all users accessing the platform by having it based on permissions to grant them access to certain information and tasks or actions.

Design Process

Empathy & Research

Define & Evaluation

Ideate & Solve

Mockup & Prototype

Test & Iterate

Product Launch

Research & Define

Test Community

Village Park

Milton

Senior Living Community

Resources

Interviews
Surveys (gift card rewards)
Shadowing
Competitive Analysis
and more

Audience/Users

Caregivers/CNAs
Nurses
Med Techs
Directors
Community Owners
Other stakeholders

Main Survey and Interview Questions

What is the most difficult part of selecting the resident's behavior?

When do you select the behavior?

Immediately after the task is completed
After all the required tasks for the resident is completed
After all assigned residents are completed
Before the shift ends

Are there co-workers who seek assistance with determining what the Behaviors mean?

How often do members of the staff need help understanding the behaviors?

Is it the words or the illustrated image that is the cause of the confusion?

Persona

Name: Alina K.

Education: Bachelor's Degree

Hometown: Alpharetta, GA

Ukraine

Family: 1 dog, 1 cat

Occupation: Caregiver/ CNA

Alina is a busy employee who works full time as a CNA in a Senior Living Community. She needs a clearer message for documenting a resident's behavior to ensure that other staff members can know how the resident is acting or feeling during a task so that they can be prepared to make changes when necessary. As it is now, the Behavior images are hard to translate, especially when English is not your first language.

Personality

Optimistic

Friendly

Thoughtful

Interests

Reality TV

Social Media

Karaoke

Motivations

Family

Friends

Doing their best

Role Model (inspired by and influenced by others)

Empathy Map

Says

“I am not sure what Behaviors to pick because I do not know what this means.”

"They all look the same."

Does

Ask a coworker for help.

Quickly selects the Behaviors with not much thought invested into the selection.

Thinks

Guess what it means and hope it is right.

Hurry and pick one because you are running out of time.

Feels

Slightly embarrassed because she did not know what a word/term meant.

Frustrated that she had to ask for help with something.

Defining Behaviors

To grasp the full concept of these Behaviors, we had to research and define the meaning of each one. This helped understand the pain point of what the user needed. With this new understanding, I was able to get the updated images designed and approved to launch for the applications.

Pain Points

Communication

Some staff members do not understand what the Behaviors mean.

The Behaviors' text description is hard to translate for people who do not know certain English words. the Images are not helpful as they are a frown face, smiley face, and a flat, neutral face.

Increased Errors

Users are rushing to complete a task which causes them to select the wrong Behavior. From the incorrectly selected Behaviors, there are increased errors posted to the resident's records.

Wrong Data

The wrong data points, that are collected from the Behaviors, give the community staff the impression that the residents are in a better or worse state than they are. The points are to be accurate for auditing and reporting purposes. The data collected also help with prevention to help the staff make plans before an incident or event happens.

Competitive Analysis

Analysis Conclusion

The feature that sets us apart from our competitors is our focus on Behaviors and the data points we utilize from the collected Behaviors.

Empathy, Research,
& Findings

We found that the Behaviors that were shown did not present a clear picture to fully understand what needed to be conveyed. The results from user surveys, tests, and comments confirmed that the pain point some users had is that English is not their first language. That meant that the words were too hard to comprehend on their own, and the images were not helpful.

Originals

Iteration (made by my manager)

If/Then Statement

If the staff members had better images that illustrated the description, then we can decrease the amount of confusion caused by not understanding the text.

Ideation & Design

Inspirational Research

Brand Identity

Staying within the design laid out for us to follow:

Semi-thick lines
Lines do not have to fully connect to form a solid object
Eyes should be thick stokes or shapes with rounded corners
Curves, no straight lines
Clean, simple design to convey the message

A great example of this is found with the company's character, Fynn the dog.

Behavior Colors

SAD

#7FC352

#FFFFFF

#006838

#7FC352

#F05038

#4E0000

NEUTRAL

HAPPY

How Might We

To "Amp up the good," I could add hands to the exaggerated facial gestures to further push the meaning. So for the Combative Behavior I can have the hands balled into fists and have them shown around the lower portion of the face. Another example is having the Calm Behavior have its hands do a soothing yoga pose so that it exudes zen, peace.

Designing the Behaviors

I did the styling a few different ways:

Mouth Open
- Mouth open with pink and red interior
- Mouth open with white tongue and black interior
- Mouth open with only a black line
- Showing teeth, smiling
- Not showing teeth
Placing facial features in different positions
- Head Tilt
- Facing forward
- Features are higher on the face
- Features are lower on the face
Eyes
- Looking at the user
- Looking to the right, while facing at an angle
- Eyes closed
- One eye closed
- Larger
- Smaller
- Wider apart
- Closer together
Eyebrows
- Yes
- No
Hands
- Filled
- Not filled
Head shape
- Circle
- Rounded square

I did designs with the image having a black outline.

Helps define the face from the hand.
Ties back to the company's logo for consistent brand identity.

I created some images without the black outline for the face.

Cleaner designs
Lighter, not weighed down by outline

*In the end, the team voted for this style for the Behaviors.

Here are samples of some other designs I did before deciding on the final images.

Mouth adjustments
Visible teeth
Eye open or closed
etc.

Inspired Design

The hands were inspired by and pay homage to the old classic cartoons where the hands were covered with white gloves.
White gloves allows the user to see the hand and its gesture against the face more clearly to better understand the meaning it is conveying.

Design Sizing Details

The images had different expressions for each Behavior but the size would remain the same for consistency and uniformity.

The head would be 40px
the bounding size is 70px.
The head can shift to the left or right by a few pixels as long as the hands remain within the 70 px width and height perimeter.

Designing the Behaviors Style & Function

To improve the Behaviors, I updated them to not only have more expressive faces that coincide with their labels, but I included the hand gestures as well. With these updates, the pain points for not understanding the Behaviors were resolved.

The default state of the Behaviors show the outline as the positive, green or negative, red color.

The disabled state of these Behaviors will show that the fill will be #B4B4B4, and the stroke or outline is #E5E5E5.

The selected state will display the Behavior in full color.

My Final Designs in Different States

Name

Aware

Social

Cooperative

Calm

Neutral

Reclusive

Confused

Combative

Distressed

Default

Selected

Disabled

Testing

Study Type

Unmoderated Usability Study

Length

10-20 minutes

Participants

7 women, 2 men

Location

Village Park Milton

Senior Living Community

Atlanta, GA, USA

Test Steps

Log into Fynn Community
Check the list of your assigned residents, and view their service plans
Prepare to start and complete ADLs or PRNs for the resident
See if you will need assistance with the tasks
After arriving at the resident's room and greeting the resident, notice the resident's mental and physical state.
Preform task as instructed via the notes or regular practice
When the task is completed go back to Fynn Community
Locate the resident's ADL or PRN to mark it as completed
If there are notes then review the notes to ensure no steps were missed
Answer ADL/PRN questions
Add notes if needed
Select the Behaviors that best describe the resident's mood or action
Sign-off for the ADL or PRN to mark it as completed
Move to next task or resident

Usability Findings

All of the feedback was positive. They said that the new design of the icons was better to interpret and understand.

The hands were useful for the full understanding.
Data points decreased in errors resulting in having the correct reports.

Implementation

The stakeholders received the new designs will great enthusiasm. The hands were a widely appreciated step up from the previous iterations. With the approved updated designs, the Behaviors were implemented throughout the Fynn Community platform and the new Fynn Care mobile app. From there, we started the training for the staff at the communities to reinforce the understanding and steps of the Behaviors.

Training

For the user's training, I was tasked with the design for multiple prints and the video thumbnail. I found this task to be enjoyable because it allowed me to go further than just the designing of the Behaviors. Meaning that with this whole project, I was able to do the UX and UI of the technical side and the graphic design of the print materials and training video.