top of page
  • Writer's pictureclara fairbanks

SmartMatter UX UI Case Study



About SmartMatter


SmartMatter is a physical therapy patient portal that uses augmented reality to guide patients through recovery under the remote supervision of their physical therapist.


Many PT patients are constrained by their

mobility, and getting to a doctor to evaluate an injury can be very challenging. SmartMatter wanted to solve this problem for patients by bringing the doctor directly to them in a meaningful way.


The Challenge


The challenge that many physical therapy patients face is immobility, limited mobility, and discomfort with mobility. For many injuries, patients in need of physical therapy either do not seek treatment or do not complete treatment due to these challenges. The process of recovery in physical therapy can be slow and patients get discouraged by the lack of immediate results.


SmartMatter's primary goal was to create a simple, easy, and fun to use patient interface for physical therapy patients to recover remotely. The interface solves patient pain points by offering:


1. Easy Booking

2. Progress tracking

3. Encouragement and Rewards for continuing their recovery

4. Effective feedback on their progress

5. Video check in - Patient records session - automatically to the portal

6. Guidance on exercises given by PT ( provided by video and augmented reality )


My Role

I created the Product Design  -  User Experience (UX) and User Interface (UI) . I conducted customer discovery with the help of my cofounder, and analyzed and researched product market fit under the guidance of NYC MediaLab.


Primary Tasks

1. Customers Insights & Ideation 2. Building the Project Vision 3. Planning and scope definition 4. User Experience and Interaction Design 5. User Interface Design


Design Tools


Design Process

Before even sketching out the design, I started with a couple of assumptions that I had about our product idea. I took those assumptions and tested them on potential users, talking to over 50 people who either are physical therapy patients, were physical therapy patients, or should be physical therapy patients.


From these user interviews I found common pain points and frustrations, as well as goals and desires. The user interviews helped me to identify the problem, which is key to implementing a solution.


Key Insights

72% of Patients don't complete their PT sessions

32% of people complete only ONE PT session after surgery

46% Of incomplete patients feel PT sessions are unimportant, and do not recover fully


Concept


From these key insights, I was able to start conceptualizing a solution. I used the interviews to identify problems that SmartMatter could solve for patients, then prioritized those problems in order to create a user experience that met their goals. Writing out these goals I put pencil to paper and sketched out the initial concept for the patient portal.


Sketch



App Map


From these initial sketches, I create a clean comprehensive app map. The app map tells me where everything should go and how it should all be linked together, and I clean it up so that I can reference it quickly and easily while designing my wireframes


The app map defines the key user flows



Wireframes

The app map, along with my quick sketches, gives me everything I need to create a quick wireframe of the application. I make sure the wireframe is simple and 100% focused on clarity and functionality. At this point it doesn't have to be pretty - pretty is distracting! - it has to be useable.


I then create an initial prototype from the wireframes, and this is where the fun really starts! I tested the wireframe prototype with some of the initial users I interviewed. In this first testing phase, I looked for a couple of key indicators of flaws in the user experience:


1. How long does it take a user to perform an action

2. Where does the user get stuck

3. What questions does the user ask



Setting the Mood


Before starting the UI, I made a mood board. This is something I always do, because 1. it is a delight and 2. it helps me conceptualize what I want the app to look like, feel like, and represent.


For SmartMatter I created a mood board using applications that the our target users already use and are accustomed to, as well as common medical applications and data heavy applications. I added fitness and wellness elements to the mood board and images of happy recovered people. This set the stage for creating SmartMatter's user interface.




Color and Typography

I used the mood board and the ever beloved Google Material Standards to create the primary and secondary color pallets, as well as the typography. I wanted the product to look, clean, trustworthy, and simple. So I chose the simplest typefaces, clean and easy to read, and cool colors




Ready To Rock

With all of my assets in front of me and all of my ducks in a row, I was ready to create a testable user interface for SmartMatter. The first iteration I simply applied my selected colors and typography to the wire frame. I then did a quick round of user testing to work out some of the usability bugs, and after a few tweaks, came up with the final design.



bottom of page