SCIENCE 37
Role
Creative Director, ISBX
Creative Director, ISBX
Director of Digital Product Design, Science 37
Methods/Skills Used
Branding
Branding
Mobile Design
Landing Page Design
Prototyping
Prototyping
Design System
User Testing
Interviews
Shadowing
User Testing
Interviews
Shadowing
The Challenge
Science37 wanted to make clinical trials easier and more accessible by eliminating the barriers of traditional clinical trials by bringing the trial to the participant’s home.
Overview
Design System | Web App | Native iOS app
Science37 is a clinical trials research startup that was founded by Noah Craft, MD, who wanted to make clinical trials easier and more accessible by eliminating the barriers of traditional clinical trials by bringing the trial to the participant’s home.
Noah and his wife and cofounder Belinda Tan, MD got connected with the mobile app design agency, ISBX in 2015 where I was the creative director at the time. ISBX helped to design and develop the MVP, helped with presentations and strategy to secure early Series A funding.
I wore many hats for Science 37 in the beginning as everyone does in a lean startup. From branding and strategy, to pitch decks for investors, multiple versions of the marketing website, design of the MVP mobile app, brochures and posters, that didn’t leave much room for creative input on the internal trial staff-facing web app, which was headed up mainly by the engineering team.
As Science 37 began to take off with series B funding, I had the opportunity along with my long time friend and founder of ISBX, Kelly Chu to join Science 37. This was a good opportunity to see what it’s like to live day in and out with an MVP, and to commit to making one product work better and better.
However...
With the ISBX creative team consumed by the rush to get a marketing website up, VC funding decks completed, and shoring up various marketing materials for Science 37, he Trial Staff facing web portal had minimal support from design. All that was asked was a single CMS template that the dev team could run with. They were going to modify a pre-existing platform with a logo and colors. Not ideal, but this is how the NORA web app started, with a 2015 state of the art bootstrap angular template.
Design now or pay later.
After having been in house at Science 37 for some time, juggling marketing, social media, and a wide variety of creative challenges, NORA became more and more a problem to be solved. The tech team had grown exponentially and the MVP became a mishmash of short-term features that was only used for specific trials once. NORA, having been touched by many different developers, all without a solid design system to follow, was suffering from "featuritis", and inconsistent ui patterns. Internal user pain, and the increasing prioritization on product to deliver converged, and the daunting challenge of redesigning the NORA web app to a more scaleable architecture was upon us.
Let’s take a look at how NORA looked before the redesign. I don’t want to get too close up. It’s pretty much what you would expect to see from a bootstrap CMS template circa 2015. You get the idea. 🤮
What we needed was...
Part of the headache of working with this platform was that there was no source of truth or guidance to a developer. Every time a developer was tasked with a feature, some of the most basic questions arose like, “What kind of button should I use here?” Or “What’s the error state?” or “What is the rollover of this link?” etc. this can bring product development to a crawl or grinding halt, even more so than being in the FDA regulated space. It’s unacceptable and unscaleable.
Every small tweak, required a comp because of the lack of …
A Design System.
Everybody is talking about them now, but at the time, it was just coming to light. I have worked agency side for many years but living with the product long term was new. I needed to know how other product leaders worked at scale. I looked to the internet for inspiration and answers. Check out my links page for more info. My favorites were High Resolution, Pablo Stanley, Stephen Gates, Brad Frost and Jared Spool.
The solution to the problem was a design system. What’s a design system you ask? A design system allows designers and developers to use a common visual design language and ui pattern library to create consistent content and user experience.
What I did.
Science 37 essentially had one product designer — me for a team of a handful of product and project managers, and dozens of developers. We had to pivot quickly. Was I going to start with a design system from scratch? Ah, no.
We chose to custom tailor the strongest existing design system we could find and went with Shopify’s Polaris. However, the vp of technology chose to have the dev team build the components in Bulma, because of the acceptance on Github over Polaris and similarity.
Knowing that a design system is not enough, I created a deck that included new designs and why it matters to get buy in from key stakeholders. These are some of the visuals used in the larger story of the deck.
Outcomes
It was determined that NORA would be rebuilt on react due to the limitations of scalability of the technology on which it was previously built.
Fortunately, when that decision was made, the design system was ready to go. We could embark on rebuilding and redesigning every page and feature in the NORA web app, design and development, using the same vocabulary from the start.
The design team was able to stay well ahead of the pace of the dev team, tackling section by section, and page by page, the ui patterns for the entire application.
The efficiency of designing with a system in place allowed me to use my time to simultaneously conduct user research interviews and exercises that helped inform design decisions along the way
Following are some samples of that work.
NORA Mobile App
The NORA mobile app is installed on an iPhone by Science 37 IT and shipped to the trial participant. It is the primary point of contact through which the patient communicates with trial staff and participates in trial activities remotely.
NORA Today
NORA is still actively being worked on by the internal engineering team at Science 37. They are working toward releasing NORA as a SaaS product and have recently started to license the application to other research organizations.
