Wing

Wing, the flagship product from Sparo Labs, aims to help patients control their asthma using a pocket-sized sensor and smartphone app that measures lung function.  Wing aims to give peace of mind to people suffering from respiratory conditions and help them better manage their condition. This project was my first foray into the healthcare world, and it felt good to be working closely with a product team making a positive impact of people's lives.
Only have a minute? 

I worked with Sparo Labs from Sept 2014 to help create the iOS app for their flagship healthcare product, Wing. I was responsible for requirements gathering, synthesising design research and generating validated UI designs.

My key learnings from this project include: 

Introduction

The figures associated with Asthma are astounding. There are 25 million people in the US alone with the disease and asthma attacks killed 3200 people in 2007. But it’s not just the headline figures that are worrying. There are the day to day realities which thousands of people live with.

And it’s tragic that we have the medications and technology to control almost everyone’s asthma. With the right drugs and measurements, anyone can live a healthy life. But due to a chronic lack of education amongst doctors and patients about how to manage the condition, many people continue to struggle.

This is the huge problem that Sparo Labs hope to solve. The young, ambitious startup was born out of a University of Washington research project. The team had secured seed funding and developed the hardware for Wing but were missing a key component; how the hand-held spirometer would interact with it's users. And that's where I came in. Working as part of KennedyTurner, myself and James worked closely with the St Louis based founders to create Wing's first digital component - the iOS app.  

The Team

As a digital nomad, I travelled extensively throughout the duration of this projects. Kicking off the project in Canada and ending in Spain via Iceland, Hong Kong and Thailand. Working remotely on a project with a physical component certainly presented some challenges which I go into a little later.

Of course I didn't work in isolation on Wing - between us James was responsive for leading design research and project management. I took on the role of lead designer - covering both interaction and visual design. From the Sparo team, we worked very closely with their iOS developer, Robert Asis and Adam Howard who handled branding and visual identity.

Understanding the problem

At the start of any design project there's always a feeling that you're on the back foot and playing catch-up. My first few weeks on the Wing project was no different. Abby and Andrew, Sparo Labs co-founders, had been working on this project and engaging with Asthma patients for a number of years. Rightly so, they knew their industry inside out.

The silver lining, if you could call it that, would be that I myself suffer with allergy-induced asthma so did have a degree of first hand experience with my own diagnosis journey and medication. But asthma is a complex condition and we insured there was a 2 week immersion phase of ploughing through all of the secondary research and information that we could. Sparo Labs had conducted their own validation research when they begun the venture, and were more than happy for me to review their transcripts and learn as much as I could.

At the time James and I were coming to the end of a 9-month roadtrip around the US and Canada. Luckily we had a secured a great apartment in Montreal and spent 10 days covering the walls in post-its and synthesising all the data that we could. From this we were able to determine where the information gaps were for us to fully understand Wing's future customers.

Stakeholder workshop

Telling clients that you don't have all the answers is a fundamental first step in establishing a good working relationship. They hired you for your tried-and-test knowledge of a design process that works, and not to have a solution in-mind from day one.

The initial stakeholder workshop in this project was extremely important. We were lucky to find ourselves in the States at just the right time, and flew down to St Louis from New York. This was the first and only time we would be in a room with the Sparo team and it was important to not only get the information that we needed, but also gain their trust that we knew what we we were doing and that their project was in safe hands.

James and I ran a two day on-site workshop to answer the fundamental business questions that we needed before being able to plan the project. I choose exercises from Dave Grey's Gamestorming book, which have had a good track record with smaller groups in my past projects. These exercises are a great way to engage everyone in the room and establish that this workshop wasn't just 'business as usual'.

On the second day we focused on the hypothesis and outstanding questions we had about Wing's users and their behaviours. The output of this exercise was a solid research plan and set of objectives for validating the assumptions we, and the Sparo team, had made about their users. 

The output of the workshop was a roadmapping document, project scope and clear next steps for starting to conduct customer research.
Learnings:
You can never be too prepared for an on-site workshop. I worked on some materials and exercises before landing in St Louis and found a local print shop to add some colour to the room. This piqued interest and excitement from the team as soon as they arrived and set the tone for a creative day.

Validating assumptions

The initial research phase for Wing consisted of a series of interviews with adult asthma patients, and parents of children with asthma. James facilitated the interviews remotely as we were travelling at the time. After each interview we would condense the relevant insights using RealTimeBoard, our virtual war room. We conducted 6 remote interviews over 2 weeks and spent some time knowledge transferring the basics of qualitative research methods to the Sparo team to allow them to conduct their own in-person research.
Having gathered the data we then affinity mapped the results and grouped our findings into themes.

From this, I created a set of 4 personas and wrote a series of scenarios for each as a thought exercise to visualise how our personas would interact with Wing.
Learnings:
Organising and conducting research isn't always plain sailing. It's a logistical challenge when you're a 2-man team, relying on dodgy Thai wifi AND the adding sensitivity of facilitating healthcare research. We budgeted to use a Marketing recruitment agency in the US to source participants. Often with startups this is something we can do on the fly, but our selection criteria for this research to be meaningful meant using professionals. The drawback being that adding another team into the mix slowed the process down, eating into our overall project timeline that we hadn't accounted for.

Affinity mapping is a fantastic tool, but not a design deliverable. The value of the exercise is in synthesising design research, not the end result. My key take away here would be either a) involve clients in this process or b) create a deliverable that's easier to digest and understand.  We were trying to be lean in the project, and not over-produce material when it wasn't needed. But on reflection, a research findings summary would have been more valuable at this stage than sharing a RealTimeBoard link with the Sparo Team.

Design toolbox

I have a love-hate relationship with Personas. Coming from an agency back-ground I appreciate them as a design deliverable. Having a visual outcome to refer to that offers a quick and digestible insight into the weeks of research conducted can be really powerful. And clients like them. 

But personas are only useful if you:

a) create good personas
b) use them throughout the whole project
c) commit to updating them throughout the product lifecycle
d) ensure your whole team are very familiar with them

Whilst a,b and c are within your control. It's d where I always seem to come unstuck. Educating the team, often unfamiliar with personas, to use them as part of their daily decision making is hard. With Wing, we worked closely with stakeholders to ensure they contributed to the creation of their personas. This helped alot, but unfortunately we didn't update them quite as often as we should have so they soon become outdated.

I often find the creation of personas the most valuable part of the process rater than the finished article. This is especially useful when creating scenarios for each of the personas. This exercise really helped to understand the primary user goals and played a large part in the concept design phase of the project.

Design Iteration

Throughout the whole project we documented each task and discussion into an online wiki - Hackpad. This was a valuable resource for tracking decisions, collaborating with the clients and keeping a record of ideation through to execution for each feature.  

We worked in agile sprints with Sparo's iOS developer which allowed us to focus on a couple of key product areas at a time. Because of this we moved quickly from concept sketches, to rough wireframes, to visual designs.

The design phase lasted around 8 weeks, which included a couple of rounds of user research to inform the design iterations.

Requirements

We created 54 user stories that needed to be included in the first iteration of the iOS app of Wing. These stories formed the basis of our design concepts which we approached in themes; onboarding, first-time use, logging, tracking and review. 

Benchmarking

As a measure of success in the initial workshop, we asked the Sparo team "what good looks like" to them. This included listing out their favourite apps and tools and identifying what it was about them that made them subjectively successful. Using this as our basis, we continued to benchmark journeys as we tracked each of the key areas. e.g. which apps out there have really simple onboarding, whilst still asking the user a series of personal health-related questions.

We also looked outside of our vertical and even outside of digital tools for inspiration. We looked at hardware companies such as Mu or Nest (cliche I know) when researching unboxing experiences. And when benchmarking how we could communicate best with a younger personas we looked to educational content such as the campaign #Rosettaarewethereyet below.

Concept Design

Hackpad really came into it's own when we reached the concept design phase. As my very favourite part of any project, I'm a huge fan of sketching to quickly iterate ideas or get concept across to others. When designing remotely, this proved invaluable to simply snap a photo of my sketchbook and upload to Hackpad to frame a conversation.

This continued throughout the project as we sketched out user flows and eventually more detailed UI to share with the team.

Detail Design

The detail design phase of the project was certainly the most challenging. We had spent longer than anticipated on validation and concepts, which left only a few weeks in the budget to execute the final solution. I had hoped to bring a contractor onboard to help with visual design as unfortunately Sparo's in-house graphic designer had moved on. Due to time and budget constraints, I executed both interaction and visual design at this stage.

As my career began in visual design, this is something I'm happy to contribute to when working with a small team. But I'd happily admit that I'm a little rusty. It's not where my passion or strengths lie in the design process, but working with startups has certainly taught me that everyone mucks in where they can.

The Sparo team had a clear brand direction they wanted to take Wing. There was an established print styleguide, typography, photography and font guidance. For our MVP we kept this simple - opting for a straightforward stoplight zone system as a visual concept throughout the app. The green, yellow, and red colours give a clear indication and description of how the user’s lungs are doing. Everything is built on a mission to detect declines in lung function early and take the right course of action at the right time to help prevent asthma attacks.
As expected, we went through a huge number of iterations when it came to the journey that meant the most to the Sparo Team - the one that interacted directly with the hardware itself. The key use story went something like this: 

As a user, I can use Wing to accurately record my FEV1 and PEF values so that I can determine how my lungs are doing at any moment in time.

As this is where the hardware interacts with the software, there were a number of limitations and constraints we were working with due to the FDA regulations and approval process. The Sparo co-founders were very involved in the creation of the testing and results screen which was both extremely valuable and also challenging to separate the subjective feedback vs regulation-specific feedback. Again, our Hackpad wiki proved to be an invaluable form of communication as the co-founders sketched out their ideas (above) and we were able to track communication and discussions all in one page related to the user story.
Whilst the details of the project themselves are interesting, due to NDAs in-place I won't go into more detail on the solution itself. The below concepts and design evolutions took place rapidly over a number of weeks.
Learnings
When working within a small team you all have to pitch in. Being a generalist really helps with this. I have a background in visual design, and whilst it's not my favourite part of the design process, I realise the importance of spending time and budget on the right things. In this case that was really investing upfront in the research and strategy. Fully understanding the habits and needs of our customers was key to the success of the product. The iOS MVP was just that - a validated solution ready to be iterated as part of it's own product lifecycle.

Outcomes

Wing was launched with an Indigogo campaign in November 2015 and raised $55k. In January 2016, the co-founders raised a further $450k from a group of investors. This, along with their original 2014 investment of $1.4m, allowed them to pursue for FDA approval and begin working towards their web and Android platforms. In June this year, The FDA approved the Wing device with an over-the-counter clearance, meaning the product can now be marketed directly to consumers.

There were a few things I'd change about this project if it landed on my desk today. After the project handover, we also conducted a post project review with the Sparo founders to figure out if anything could have been improved in the process we went through.

There were some interesting things I learnt from this which definitely had an impact on future projects. Whilst working remotely has countless perks, our vastly different timezones in this project did prove a little problematic at times. I was working 10 hours ahead of the Sparo team whilst in Thailand. This had the benefit of completing work whilst they were asleep, so they’d come into the office to new designs and discussions. But what proved frustrating for them was that discussions felt slow as we weren’t available for their entire working day.

Discovering Hackpad and documenting our steps is one of my most proud outputs of any design project in my career. The product itself, whilst I'm extremely pleased with, didn't show the hard-work and thinking that went into (and rightly so). Our Hackpad did. In all it's glory! Maybe I'll show it to you one day :)
Up Next: Launching 15Five Plus (coming soon)

Back to Work