Call BlackLine

Providing mobile crisis counseling to individuals across the United States and Canada.

Project Type
Non-Profit Work
Duration
Nov. 2022 - Jun. 2023
Role
UX Design Lead
Teammates
Tiffany Lee
Shana Chen

Project Overview

Crisis Counseling Beyond the Web

Call BlackLine (CBL) is a non-profit that provides immediate crisis counseling to families and communities in the U.S. and Canada.

Over the course of one school year, our team created a mobile application for CBL. As the lead designer, I worked closely with CBL to develop a realistic solution that included required features.

Being Lead Designer

As the lead designer, I designed our app zero-to-one with two other designers. I led 3 design-thinking workshops and built out a design-system for the mobile application while using iOS HIG and WCAG standards to improve accessibility.

Our app is a mobile resource to seek crisis counseling and resources.

Project Overview

Product Requirements

Requirements

Before starting the design process, I was given a product requirements document (PRD) from the product manager on the team. This PRD outlined the base features we wanted in our minimum viable product (MVP). These were the features outlined:

Expanding the Product Requirements

TL;DR, the features are broad from an experience perspective. To get a better understanding, I created user flows for each feature to: better align myself and set a foundation for my deliverables between devs and clients. Here are some example flows:

Tackling Product Requirement Gaps

Upon showcasing these user flows, the cross-functional team was able to uncover gaps in our proposed features. This enabled us to have important discussions with our client to remediate these gaps in this early stage prior to iterating designs or undergoing development.

Ideation

Building Our App

App Information Architecture

Next, we developed our app’s navigational flow and architecture. Based on my user flows, I suggested a draft to give our team something to work off of.

Low-Fidelity Wireframes

With our app navigation mapped out, I led the team in a brief low-fidelity workshop to see how we each envisioned the app. These are my wireframes:

Prototyping

Designing for Mobile

Understanding Mobile Best Practices

This was my first project in a mobile setting in a while. To better understand this space, I read up on Apple's Human Interface Guidelines (HIG) and Google's Material Design. This helped us design with the specifications that iOS and Android have. Here is an example:

Design System

Moving forward, we created a design system to create guidelines for our high-fidelity prototyping. I worked on our color system, input fields, top app bar, and the bottom navigation.

The below images represent our final designs for the MVP.

Prototyping & Iterating

Usability Testing

After designing our first iteration, we conducted usability testing with 11 potential users. The outcome included small revisions to improve our experience and making our designs as intuitive as possible.

Introducing the

Call BlackLine App

Conclusion

Next Steps

In-Development

Our MVP designs are currently in-development and are scheduled for a live release in late-April 2023!

This is the first app I've made that has been released and I'm absolutely proud of what the team has been able to accomplish.

With that said, there's still work to be done! We're currently developing our second phase designs that feature design revisions, a redesign of the resources page, and push notifications.

Conclusion

Reflection

Know When to Move Forward.

As design lead, I had a lot of leverage when it came to what the team would be doing next. After usability testing, I found myself wanting to redesign the entire app. However, I took a step back and reminded myself that we had only so much time.

With this realization, I made a priority list of what needed to be redesigned for usability purposes. Those action items were prioritized over redesign initiatives that were for things like aesthetics.

Client Communication

Working with a non-profit wasn't something new to me when I took on this project. However, client communication always has ups and downs. In this project, many of the features were left unclear at the beginning. To overcome this, I created various low-fidelity versions of our features to give us a starting point.

This project showed me that, as a designer, I have the power to help a team get out of uncertainty and confusion. I can create low-stake designs, present them, and empower our team to get a solid understanding of what we want to do from these designs.