Powerability: Design Elements
Routes included onboarding, manual wheelchair, and scheduling, as well as edge cases. A prototype was created using wireframes which were used in the guerilla usability test using Marvel.
Five users tested it to see if the design and flow made sense. Their feedback led to the creation of the style guide which would lead design decisions for the Powerability app.
The name for the app would be called Powerability, as both caregivers and patients want to have power and ability in their daily lives and freedom.
A mood board was created in the creation of the brand that led to the style guide.
Personality: Purpose gives caregivers and patients the power and ability to have more confidence in their daily lives
Attributes: Safety, compatibility, effort, and caring
The images were inspired by the attributes of safety, efforness, caring, and compatibility.
The inspiration also uses the two terms that make up the name: power and ability which are seen in the images.
Images were chosen from options that emulated a calmness and trustworthiness, which is seen in the colors.
The UI was inspired by attributes of effortless, caring, safety, and compatibility
The colors that were chosen were warm, accessible colors of trust and calmness.
The UI examples were chosen from healthcare options that were clear, simple, and easy to understand and navigate
Created the colors, logo, grid, typography, icons, UI elements and imagery so that they were consistent across the app.
In creating the logo for the app, it was originally using separate elements that emulate power (in a person) and ability. Unfortunately those elements didn’t quite work and were on the harsh side. This is the second iteration, realizing that the image needed to be consistent across platforms and background. The original had multiple colors and a font that did not work for the final design. As this image for the logo, still uses the mobility and power themes, was chosen to represent the Powerability app for caregivers.
Here are the greys that were used depending on the background:
The primary colors were chosen based off of the purple of calm and peace and the blue that was a color that showed power and resilience:
Font Family: Roboto
Header and Body
This is the weight and font of H1: Roboto bold, 32 pt font
This is the weight and font of H2: Roboto bold, 24 pt font
This is the weight and font of H3: Roboto bold, 18 pt font
This is the weight and font of the body: Roboto Regular, 14 pt font
This is the weight and font of the captions: Roboto Regular, 12 pt font
This is the weight and font of the footer: Roboto Semibold, 12 pt font
After the style guide was complete, it was used to make decisions in the high-fidelity mockups. Red routes, including onboarding, scheduling, wheelchairs, and settings and account information.
The initial profile screen included a text box which showed to be unsuccessful. In the high fidelity screen, I changed text boxes to check boxes and included patient assessment questions.
In addition the bottom bar was simplified to just have equipment, home, search, and profile. It also included a setting button.
No Results Screens
In the scheduling, the difficulty was in determining whether or not to use a regular button, a radio button, or a toggle switch. After the usability tests, I elicited to use the radio button for simplicity sake.
Initially there was no “home” screen, as the equipment page served as a home page but users felt that having a simplified home page created a better user experience. Preferences relate to the actual equipment used, as opposed