📝 The Design Process Behind Quick Actions

Are you curious about how a software UX Design team decides what will work - and what won’t? Ever wonder what kind of creativity, patience, and hair-pulling goes into creating new features in a hybrid app like Active Oversight? Interested to pull back the curtain and see how the UX sausage is made? Join me now for a journey into the Active Oversight design process as we walk through a brand new feature creation from beginning to end!

But of course, first, we must start with a good problem to solve. Let’s say...doing things in the mobile app is too slow. 

What things? How slow? Well, I don’t know yet. We have to research!

This is the story of how the Active Oversight Design Team researched, refined, developed, and delivered the Quick Actions feature.

Understanding the Issue 

The seed of the feature that eventually became Quick Actions came straight out of interviews with our field users. The first inkling we had that some actions were too slow within the mobile app arose during normal interviews, conversations, and check-ins about other topics. If we hadn’t already been forming feedback relationships with our users we would never have had visibility into what was actually a major usability issue. What we were hearing was that it was tedious and time-consuming to have to navigate into a Task structure to take a photo from the app, then need to navigate out and back into the next step in the Task each time another photo was required.

Two Active Oversight team members keeping the skies clear during an on-site visit

These bits of feedback from field users came into further clarity during two of our early field visits. If at all possible, visit your field users while they work! There are 1 million issues that can arise for your real users that you will never experience in the office. For us, we realized that not only was this extra navigation on a mobile device a drag in general, but it was extra difficult in bright sunlight...and doubly so when our field users were wearing gloves and standing in a basket lift. Once we saw what they were really dealing with, we knew we had to find a solution.

Ideation i.e. The Better Brainstorming

If you aren’t familiar with the UX Design practice of “Ideation” you can think of it as the better version of your standard brainstorming session. Ideation is more structured, usually consisting of some number of preset and timed exercises, and it is also done individually, with participants only coming together at certain times for discussion. This avoids groupthink and ensures the proliferation of unique and risky ideas.

The Team during an intense Ideation process

For Quick Actions, we went into our Ideation process with a strong understanding of our problem but a fairly loosely defined solution. This is perfect if you are planning a detailed and protracted Ideation process, and it was perfect for us...because we decided to hold a One Day Design Sprint for Quick Actions!

The One Day Design Sprint is an Active Oversight original and an invention of our Product Manager, Kimberly Gant. It is a one-day version of the famous Google Design Sprint, which typically takes a full 5 days. For a Design Sprint, your whole team (and some guests from other teams) come together for a day to ideate, storyboard, mock up, prototype, and test a solution with real clients! 

A real storyboard Active Oversight produced during a Design Sprint in 2018

For us at Active Oversight, this process inspires and engages us like no other. It allows us to play with ideas, get validation from users, and if necessary - fail fast. But our Quick Action Design Sprint was extremely productive and out of that came a strong notion of the direction our solution would take functionally and visually.

A Lot Of Design Magic, A Little Hair Pulling

After the hectic energy of a One Day Design Sprint, it was up to the Design Team to transform a group of wild and daring ideas into an actionable software design. Designers at Active Oversight produced a proposed solution that clearly and directly addressed the problem, incorporated the learnings from the Design Sprint, and leveraged our existing interaction patterns. This process is usually pretty difficult because it needs to be a close collaboration between Design (producing mockups) and Product (producing requirements). Having coworking sessions between these groups is invaluable to avoid missed or mismatched requirements and also to validate assumptions made during mockup production. Having a detail-oriented helper from QA or Support is a great idea, too!

If they’ll wear silly hats for your tea party (true story) they will definitely help you perform Definition

One of the best design decisions we made with Quick Actions was to create a modular solution. This made it easily delivered as a Minimum Viable Product (MVP) that could be expanded on iteratively in the future. While this is the gold standard in an Agile shop like ours, it’s not easy to execute - you really have to prioritize it from the beginning and account for future work before development on the MVP has even begun.

Spoiler alert! Within six months of launch, we released 2 major improvements to Quick Actions, all made possible by this modular design approach.

A Hint System

By this time we had created a strong new pattern for taking and uploading photos from mobile with comparatively blazing speed! We cut down on clicks, navigation tasks, and time to perform our target action.

Perfect! Or...not quite.

Our feature was strong, but it wasn’t very discoverable. Quick Actions uses a brand new pattern: swipe left for details. We didn’t have anything like it yet, so how could we make sure our users knew it existed?

The answer came in the form of a classic video game solution. Since my background is in video game design, and my co-designer had been working on an animation library, we put our heads together and created a “new pattern hint system” using motion design. A little tab would ‘peak’ out from the side of the screen to cue the users on the element’s interactive potential. 

Our new pattern hint system was a little peak for our users, which turned out to be just enough

This was a brief, inobtrusive, and yet playful and engaging way to clue our users into a new interactive feature. Sometimes all your users need is to be a bit intrigued.

The Final Product

An actual image of (what) launch day (feels like)

Active Oversight launched Quick Actions on mobile on April of 2019, two months after our One Day Design Sprint.

Even after launch, however, our work is never done. Within your Product Team it’s important to develop a method of assessing the success of your features against quantitative KPIs formed when your product objectives are set. At Active Oversight we get insight into our features’ value from Google Analytics, our Support organization, and direct interviews with users. In the case of Quick Actions, our performance was by no means an unmitigated success. We wanted to have more active users for the feature faster. But setting reach goals for your organization is vital, so we have to get used to mixed results without ever having a clear win. 9 times out of 10 if we smashed it, we didn’t push ourselves far enough.

KPIs are meaningless unless your team is really pushing the limits of what’s achievable

Over time Quick Actions has become one of our most used features - in fact, some weeks it is our number one most popular app action! This wouldn’t have been the case without our robust discovery and ideation process and our modular design approach. What we didn’t succeed at upon launch - particularly around user uptake - we chipped away at in following months by continuing to invest in improving the feature, and it was these improvements that really drove feature uptake. But of course, no feature is ever truly done, so stay tuned to our Release Notes to see how we continue to enrich Quick Actions in the future!