Dementia Awareness Design Research

Design and focus group evaluation of a dementia awareness website for older adults.

Overview

Overview

My thesis project, conducted in two phases, investigated the effectiveness of allowing older adults to self-tailor or personalize a website's information architecture (IA) structure. The content used on the website is dementia awareness videos from Cyber-Seniors, who supported this project. View the entire thesis here.

This case study describes the first phase of the project, during which I developed an initial prototype, using Framer, based on existing literature and guidelines for older adults. The key feature of the prototype is having the ability to switch between a linear and matrix website structure.Based on the results of a focus group, changes were made to the prototype, which was then evaluated during the second phase of the project.

Problem Statement

How do older adults envision the option to switch between linear and matrix IA structures and how can their perspectives be reflected in the website's design?

Team

  • Trevor Cross

Tools

  • Figma

  • Framer

  • Zoom

  • Microsoft Forms

  • Microsoft Excel

Timeframe

4 Weeks

My Responsibilities

This project was done completely independently. My thesis supervisor, Dr. Olivier St-Cyr, consistently gave valuable feedback, but all of the work shown below was completed by me.

Constraints

This phase of the project, and my entire thesis, had to stick to a very tight timeline. Additionally, my sole focus when creating the initial design was ensuring that the website would be accessible, usable, and comprehensible to older adults, meaning I strictly adhered to existing design guidelines and research on designing for older adults.

Initial Design

The prototype consists of two main webpages: a homepage and a page for each of the dementia risk factor topics.

The homepage is what a user sees when they first visit the prototype using a web browser. This page has a description of the site as a whole, a top navigation, and a button to go to the topics, or “lessons,” pages.

The topic page, which has the same design for each topic available in the prototype, has four main areas:

  1. The same top navigation as the homepage

  2. A video player

  3. The navigation element which allows users to self-tailor the IA structure

  4. Text information which is separated into an overview tab and an additional resources tab

The initial matrix IA (left) allows users to go to any topic from any other page; clicking “Condensed View” changes the page to show the Linear IA.

The linear IA (right) allows users to go through topics in a linear order, either forward to the next topic or back to the previous one; clicking “Show All Topics” changes the page to show the Matrix IA.

In anticipation of comments regarding the amount of text information, an alternate version of the topic page was created, which grouped the text information into dropdown elements.

Including dropdown elements added complexity to the prototype, so gathering feedback from the focus group participants was crucial to ensure that the dropdowns would not hide text information from the usability evaluation participants.

Focus Group Evaluation

A 90-minute focus group was conducted with 11 older adults. Participants identified potential issues that they noticed and discussed potential solutions to the issues and other improvements that could make the prototype more usable. The protocol for the focus group can be found below.

Participants were required to complete a consent form before they could participate in the study and had to meet a set of inclusion criteria:

  1. You are over the age of 65

  2. You are fluent in English

  3. You have previous experience using a computer and browsing websites (basic IT support to be provided by researchers)

  4. You have access to a desktop computer or laptop

  5. You are interested in a self-guided dementia awareness program

  6. You do not have a form of dementia

  7. You consent to have your audio recorded

Focus Group Protocol

The focus group consisted of a walkthrough of the website followed by a semi-structured discussion of various features of the website and potential improvements.

Data Analysis

For the purposes of my thesis, I conducted a qualitative thematic analysis (a rigorous but less visually appealing affinity diagram) of the focus group conversations using NVivo to identify themes and insights.

Example of how direct quotes were grouped into themes

Summary of Feedback

Based on my analysis, there were clearly certain aspects of the design that could be improved. The most significant participant critiques and suggestions include:

  • The “Lessons” button in the header is redundant

  • Make the length of each video clearer

  • The font is too small

  • Use consistent labelling

  • Change the website title

  • Mixed reviews of the colour palette used

  • Too much text information

  • Button labels should be descriptive

  • Text labels are confusing

  • The topics in the matrix IA should have a meaningful order

  • Better convey the purpose of linear IA

Redesign

Based on the feedback from the focus group, changes were made to the design of the prototype to improve the experience of the participants who would take part in the usability evaluation.

Original matrix IA (left) and redesigned matrix IA (right). The topics were put into four categories noted in the image by red arrows. The red boxes show the label change on the self-tailoring button.

A separate page was created for the categories so the participants could choose which category of topics they wanted to look at, though the matrix IA structure still allowed them to navigate to any topic.

The linear IA element was also redesigned around the categories to better convey its purpose and how the participants could use it.

The new linear IA only went through one category of topics at a time, taking participants back to the categories page if they reached the end of the category.

The text underneath the videos was changed to a series of four dropdown elements.

When hovering the mouse on the dropdown elements, text stating “Click to Open!” or “Click to Close!” appears to the element's functionality is clear.

Several other small changes were made to the prototype based on the data from the focus group:

  1. Updated “Lessons”/View Categories” button

  2. updated descriptive label, “Home” became “View Homepage”

  3. Video length added to webpage

  4. Website title changed from “DementiaAP” to “Dementia Awareness

Next Steps

Using the redesigned prototype from this phase of the project, I conducted usability evaluations to rigorously examine older adults' preferences when using linear and matrix IA structures, and how having the option to switch IA structures impacted their experience when navigating the website.

Reflections

This phase of my thesis project gave me the opportunity to design and conduct a UX research completely independently. I definitely learned a great deal about how to effectively engage with many different participants at the same time in the focus group.

When designing my thesis project, there were questions regarding whether two rounds of user involvement were needed. Based on the changes made to the prototype design and the feedback I received from the participants, having this formative evaluation clearly made the subsequent usability evaluation more insightful. I was able to address design issues which may have interfered with finding answer to my core research questions.