Kaiser Permanente Case Study on floating card

Kaiser Permanente

More informed mothers leads to healthier babies. Metajive partnered with Kaiser Permanente to create a digital ecosystem that assists mothers and expecting mothers from pre-conception through to their babies first birthday.

Solutions

Strategy
UX
Design
Web Development
iOS Development
Kaiser Permanente Logo
Smiling Baby

Challenge

We worked with a corporate client who wanted a truly progressive solution to help a large portion of their patient base. We needed to create a digital ecosystem consisting of a responsive website and native iOS app that kept user data synced across all devices. To serve a wide range of demographics all data needed to be HIPAA compliant for security and ADA compliant to help those with disabilities.

Expecting mother using the Kaiser Permanente iOS app Metajive developed on tablet

Strategy

In order to help mothers through this stressfull time our goal was to keep the app as simple as possible while supplying all the information that would help them through this trying time.

Kaiser Permanente iOS App design system showing user experience on floating cards
We utilized multiple responsive breakpoints so that moms will always be served the perfect interactive experience across devices. We also diligently checked colors against contrast values established by ADA interactive standards.
Alex Mustacich - Design Lead

Design

We created a space that felt at home in a hospital without being clinical. By using cool colors, soft lines and minimal icons we did our best to keep users at ease.

Kaiser Permanente iOS App design screens on floating cards
Details we Love

Header

Kaiser Permanente iOS App font
color: #6f6158
font-family: Avenir Medium
font-size: 48 pt
line-height: 90 pt
letter-spacing: -30 pt

Subheader

Kaiser Permanente iOS App font
color: #12a49a
font-family: Avenir Medium
font-size: 36 pt
line-height: 90 pt
letter-spacing: 0 pt

Body

color: #6f6158
font-family: Avenir Medium
font-size: 16 pt
line-height: 90 pt
letter-spacing: 26 pt

Colors

We create a branded color palette to distinguish the app as a unique experience within the Kaiser Permemente brand standards

Grid

A rigid 12 column grid system with dynamically spaced gutters gives us the consistency a user needs to easily identify information as the experience scales.

Iconography

We created a library of custom icons throughout the digital ecosystem to guide the users journey.

Technology

This project took advantage of our abilities in native iOS development, fast performing server setups, custom API creation, high level responsive design patterns and security settings. By creating a user centered API we were able to create a seamless integration between the app and web experience for all users to enable data to continuously sync to the server in real time. Additionally, to promote the success of the project and healthy babies, we created user centered emails to keep users engaged and on track with their pregnancy.

Responsive Website

A site that adapts to look great on every screen.

HIPAA Compliant Security

HIPAA compliance is a government standard to ensure patient medical record privacy is maintained.

ADA Compliant

Designed to help users with disabilities within the standards outlined by the Americans with Disabilities Act (ADA).

13 Tracking Tools

A series of tools to help mother's track vital health information ranging from glucose levels and minutes of mothers activity to kick counters and diaper changes.

Native iOS App

Built for the highest performance on Apple devices.

Smart Content Management System

Our content management platform customized for each project.

Social Integration

Ability to effectively share on social media networks with optimized tags, text and images.

User Account Systems

We segment user's data to allow customized experiences and security around individual data.

Stage Based Content Customizations

Adjusting content based on user specific data.

Location Based Content/User Customization

Customization of user experience based on their physical location.

Hospital & Clinic Specific Event Integration

Each user is promoted specific events, classes and appointments based on their associated hospital.

Custom User Based Email Communication

Each user gets customized emails based on their pregnancy stage, tasks completed and relevant articles.

CDN Integration

Delivering files at ultra-high transfer speeds to increase site loading time and decrease server load.

Server Based Image Optimization

Our content management system creates multiple sizes of each image to optimize user experience and create faster loading sites.

Custom Reporting

Detailed reporting based on client specified metrics delivered ad hoc or at pre-determined intervals.

Conclusion

We spent 18 months creating 240 Wireframes, 6 prototypes and spending countless hours on iterations in an effort to help mothers make better decisions. We couldn't be more proud of our collaboration with Kaiser Permanente.

Kaiser Permanente iOS App on iPhone with smiling baby