top of page

Kinotek's Move.ly

Reimagining Move.ly, Kinotek's 3D visualization movement analysis software, to improve patient outcomes, quality of care, and patient education.

KinoTek Mockup.png
KinoTek Logo.png
KinoTek2.png

Client

KinoTek

Context

Client Project

Role

UX Designer

Time Frame

4 months

Tools

Figma, Qualtrics

Team

Eliza, Jaon, AJ, Gillian, Ioana

 CONTEXT

What is Move.ly?

According to Patient Compliance in Physical Therapy (2019), 65 - 75% of physical therapy patients DO NOT complete their treatment plan.

 

This issue not only poses significant challenges for patients, many of whom do not achieve full recovery and continue to suffer from pain, but it also results in increased financial burdens for insurance providers, patients, and clinicians alike. By addressing the knowledge gaps between clinicians and patients, there is an opportunity to enhance the overall quality of care, reduce recovery time, and lower out-of-pocket expenses.

​

MOVE.LY, the flagship software of the startup KinoTek, serves as a digital health platform that enhances the assessment and educational processes for movement-based evaluation and rehabilitation, benefiting both clinicians and their clients. It aims to provide quantitative, objective, and accessible solutions, bridging the knowledge divide between clinicians' expertise and their patients' performance.

KinoTek Old 1.png
KinoTek Old 2.png
KinoTek Old 4.png
KinoTek Old 3.png

Current Move.ly platform: Clinicians interact with these screens to see the 3D visualization of the patient's movements and quantitative metrics

 PROBLEM

The platform currently has usability issues

My team sought to improve the user experience of the KinoTek web application with an investigation that combines human-centered design, aesthetics, and Human Factors standards. 

​

The main problems we addressed in the redesign of the current Move.ly interface include:

  1. Reducing the mental workload it takes to use the application

  2. Improving the interface interactions between the clinician, patient, and application: the clinician is better informed and the patient is more involved and educated during their recovery process

  3. Allow clinicians to seamlessly adopt this technology into their day-to-day workflow

How might we design an intuitive interface to help clinicians better navigate, present, and educate their patients to improve their engagement and time to recovery?

My contribution

In the User Research stages of the project, I served as a UX researcher and human factors engineer. In the design stages of the project, I shifted gears and served as the lead UX designer, with my teammates consulting my designs for feedback. Our group had weekly meetings and because the KinoTek Creative Director was a part of our group, we also had frequent communication with the KinoTek executive team.

 SOLUTION

An improved Move.ly interface

Solution note

In the User Research stages of the project, I served as a UX researcher and human factors engineer. In the design stages of the project, I shifted gears and served as the lead UX designer, with my teammates consulting my designs for feedback. Our group had weekly meetings and because the KinoTek Creative Director was a part of our group, we also had frequent communication with the Kinotek executive team.

 RESEARCH

The discovery phase

My team's research approach involved summative research to better understand the needs, lives, and physicality of our user groups and to uncover inconsistencies in the interface. Our findings ultimately informed comprehensive system requirements to guide a newly designed, streamlined digital interface that improves patient success.

 

We collaboratively conducted and created:

  • Questionnaire

  • Affinity map

  • Multidimensional task analysis

  • Human-computer interaction task diagram

  • Personas

​

We referenced:

  • KinoTek's customer discovery interviews 

  • Human factors standards

Affinity diagram

One of the first brainstorming activities my group and I conducted was a CLIMBER analysis, a framework developed by Professor James Intriligator at Tufts.

​

The two user groups that we focused on are:

  1. Clinicians who specialize in movement assessment (physical therapists, chiropractors, trainers, and occupational therapists)

  2. Patients

​

As a group, we identified user goals and key needs, mapped interactions between the system and both user groups, and pinpointed specific challenges that we sought to address.

 

For example, we noted the need for a way to track patient progress, which is a feature that was not available but will be beneficial for both the clinician (in order to make better-informed treatment decisions) and the patient (for greater engagement in their recovery journey).

Screen Shot 2021-09-29 at 12.00.22 AM.png
Affinity map analyzing customer

CLINICIAN

PATIENT

Affinity map analyzing customer's life

CLINICIAN

PATIENT

Affinity map analyzing customer insights

CLINICIAN

PATIENT

Questionnaire

From our initial CLIMBER analysis, we were interested in topics such as what client information is useful to users, the potential for a printable report, how insurance is connected, specific software pain points, and overall thoughts on the current interface. We created and distributed a questionnaire for current KinoTek beta testers.

​

Common trends include: 

  • Customizable and printable patient plans would be helpful for successful patient interactions: Currently, no respondents had an exportable summary report for patients to take home with them and all respondents indicated a need for this functionality

  • Confusion with software, such as video's frame speed: The screen should be automatically brought to a “best frame” where the figure is in the maximum muscular flexion of that movement, removing the burden of choice from the clinician

  • Combining data from multiple sessions: This enables clinicians to assess long-term treatment

  • Want for exportable insurance report​

Personas

Screen Shot 2021-09-29 at 12.26.56 AM.png
Screen Shot 2021-09-29 at 12.27.45 AM.png
Screen Shot 2021-09-29 at 12.27.28 AM.png

User & system requirements

From our user research, we compiled a list of user needs and translated it to corresponding system-level requirements. The major design decisions that I made were based on this list.

Screen Shot 2021-09-29 at 12.47.07 AM.png
Screen Shot 2021-09-29 at 12.47.35 AM.png
Screen Shot 2021-09-29 at 12.47.53 AM.png
Screen Shot 2021-09-29 at 12.50.52 AM.png
Screen Shot 2021-09-29 at 12.51.11 AM.png
Screen Shot 2021-09-29 at 12.51.25 AM.png

 IDEATION

Paper wireframes

Based on our findings, I began to ideate designs in the form of features or revisions to the interface that reflect an improved user experience for our users.

 

For example, one of the needs we discovered through customer research was a more streamlined, informational process to record a patient's movement. Users were confused as to which options they should select in terms of frame rate and recording length. With that in mind, in our wireframing and prototyping, we will need to design a more fluid interaction that tells the users that these options directly correlate to the upload time for the movements. Another feature seems to be a patient-facing exportable document that allows patients to view their progress, their treatment plan, and data visualization on their current movement capabilities.

Screen Shot 2021-09-29 at 1.11.08 AM.png
Screen Shot 2021-09-29 at 1.11.22 AM.png

Mid-fidelity prototype

Next, I created a mid-fidelity Move.ly prototype on Figma to test with current beta testers. These mockups are primarily focused on the visual structure of the new redesign of the user interface. This prototype started to emanate visual and emotional responses, simulating the wireframes in a more visually expressive, responsive form. The color palette of the design is based on KinoTek's orange, purple, and teal to portray a light-hearted and welcoming feel — Move.ly is reliable and here to provide support.

 

The primary goal of this prototype is to be able to test the information architecture that the wireframes are built on. The purpose is to ensure that the concepts that we have architected works as intended and the usability meets expectations and user requirements. In this phase, only some visual attributes will be designed with a basic visual hierarchy.

Landing Screen.png
Start Recording Screen.png
Screening Hub Screen.png
Screening Hub Screen 3.png
Screen Shot 2021-09-29 at 1.21.36 AM.png

 TESTING

Usability testing & results

Our team got the opportunity to test our prototypes with a licensed chiropractor with 15 years of experience and a current user of Move.ly. He noted there were significant improvements between the prototype and the existing UI of Move.ly.

​

Some User Testing Feedback:

  • Recommended features such as a visual or audio countdown to optimize the screening session and integration into the workflow

  • Wanted a pause button, so users are able to control and manage the camera

  • Wanted video cropping capabilities to erase any unused data or excess screening time

  • Patient profiles on the dashboard platform contained too much information that may not be necessary

  • Highlighted the note-taking features as a highly beneficial addition to the software 

  • Add screenshotting capabilities in the screening viewer

  • A speeding up function in the playback manager would be beneficial, in addition to a slowing down function

​

With this user testing feedback, I worked on iterating the next design!

 HIGH-FIDELITY

Iterated mockups & prototype

Based on user testing feedback, in this new iteration:

​

  • A help icon was implemented where the user is able to see a pop-up on hover, informing the user what the difference is between the default recording quality versus the extra-high quality, which is essentially upload and processing time.

  • A hamburger menu was also added to the top navigation bar for easy access to help/FAQ, account information and preferences, and sign-out.

  • A visual indication that a recording is in progress was implemented as well as a “Stop Recording” button to allow users to cut the screening short if the movement has been completed

  • A “Restart” button was added to cancel the ongoing recording and restart. A countdown was also added to inform the user the progress of the recording.

  • A Review Recording Screen was added, enabling users to review the recorded video and corresponding information to make necessary edits, such as cropping, to obtain the most optimized screening.

  • On the Screening Hub section, extraneous client information was removed with the exception of client name, muscle type, injury location, and duration of treatment (the most important information when making clinical decisions).

  • In terms of playback features, faster speeds were added in addition to slow playback speeds.

  • On the screening viewer, a screenshot shortcut icon was added to allow users to take and save a screenshot of the still currently shown.

​

All of my team's work was passed off to the design and development team at KinoTek, who will continue building off our research and begin development to implement these UI changes, which will directly impact clinicians and patients.

Landing Screen-1.png
Start Recording Screen 2.png
Recording In Progress 3.png
Recording In Progress 1.png
Start Recording Screen 3.png
Screening Hub Screen 3.png
Screen Shot 2021-09-29 at 1.49.33 AM.png
Screening Hub Screen 1.png
bottom of page