user experience.
Today, that belief translates into my work as a UX consultant and strategist for companies like HoneyBook, the leading cloud-based financial and business management platform for solopreneurs and freelancers.
In my free time, I’ve been developing a subscription management application, $cribe, and Paw Lab– a mobile application that connects users with adoptable companion animals. Paw Lab, my passion project, stems from a desire to provide solutions for the 6.5 million companion animals that enter U.S. animal shelters nationwide every year, many of whom never leave. By providing a more intuitive, positive, and frictionless interface than the current animal adoption applications on the market, my hope is that Paw Lab provides an effective solution to preventable euthanasia, and a space for users to connect with rescue pets like never before.
digital work.
I. overview.
THE CHALLENGE: Develop one of the world’s first financial platforms built to meet small business’ specific needs and priorities. Help HoneyBook achieve one of their most ambitious OKRs to date by setting a strong foundation for their financial MVP.
THE OUTCOME: A financial platform that solves for one of small business’ biggest issues, tax withholding, in addition to various other features that fit user needs.
MY ROLE: Lead UX Researcher, Strategist (both quantitative and qualitative research)
I. overview.
THE CHALLENGE: Research and develop a series of archetypes that best represent HoneyBook’s user base of small business owners. Based upon those archetypes, design various templates targeted to HoneyBook’s user segments. The ultimate goal of the one flow product was to help optimize users’ client flows quickly and effectively by offering templates that users could naturally identify with and tailor to their individual brands.
THE OUTCOME: An asset library that users can intuitively search and edit due to easily identifiable characteristics that feel representative of their business.
MY ROLE: Lead UX Strategist (research, interaction design, visual design)
I. overview.
THE CHALLENGE: Create a mobile subscription management application that can be used by a broader audience than my stakeholder’s desktop-only website.
THE OUTCOME: A mobile application that provides a comprehensive snapshot of user’s subscriptions, and enables them to easily manage those subscriptions.
MY ROLE: Lead UX Strategist (research, interaction design, visual design)
II. map.
Before diving into the discovery portion of product development, I put together a project plan that would organize and systematize my approach, as well as provide time limits for each part of the process. Creating a project plan is particularly important for a project like $cribe that needs to move from a blank slate to a high fidelity prototype on a limited time table.
SECONDARY RESEARCH: MARKET RESEARCH
I started my research by taking a look at other industry leaders in the space like TrackmyBills, Truebill, & Subscription Manager. I wanted to learn more about the functionality of each service, what components they had in common, what qualities set them apart, and what I liked and disliked about each product. Based on that research, I developed a shortlist of action items- application qualities that I felt were important to integrate into a new application.
Ultimately, I discovered that to make $cribe not only competitive but to create something BETTER than what exists in the market, I’d need to incorporate some core functionality that enables the user to:
See all of their subscriptions in one place so that they can get a comprehensive view of their spending on subscriptions
Allow users to unsubscribe from their subscriptions to reduce needless spending, and
Notify users if any of their subscriptions are about to be auto-renewed so that they can make a decision about whether they want to renew the subscription and continue spending money
Enter subscriptions manually or connect their bank accounts, as other applications limit the user’s ability to choose
III. sketch.
USER FLOWS
With my research in mind, I mapped out a potential end-to-end user experience as a foundation for creating my user flows, and to help orient my solution sketches. Then, using Miro I translated my end-to-end user experience into a visual user flow for both new and existing users.
LOW-FIDELITY SKETCHES
Using those flows as a guide, I began sketching low fidelity wireframes to get an idea for how the application would be laid out, and ultimately prototyped. By inserting these sketches into Invision, I was able to transform them into a clickable prototype for my first round of usability testing.
IV. validate.
USABILITY INTERVIEWS I
Before my first round of moderated testing, I drafted a test script, which included a comprehensive list of tasks I needed users to work through in order to better understand the strengths and weaknesses of my design. Using that script, I got to work- interviewing 5 users with specific qualities specified by my stakeholders. To qualify as a “user” I ensured that each participant:
Uses a mobile phone daily
Is over the age of 30
Has a bank account, and
Subscribes to at least two services
My research questions were all geared towards learning whether:
The onboarding process is intuitive
The learning curve of new $cribe users as they navigate the application, and
The most common errors users make as they complete basic tasks
I took notes during each session, and after each interview, I recorded any issues along with their priority rating and a plan for integrating them into the next iteration of the application.
V. design.
BRAND IDENTITY DEVELOPMENT
Then, after evaluating what existed in the space, the pros and cons of each available option, and my user research, I began developing what was missing in the subscription management space.
I created a company name- $cribe with a dollar sign, because I wanted a name that was a little edgier than the competition. And I wanted it to appeal to users in their 30s who make up the main user base for the product. I picked the word Scribe specifically because it starts with an S similar to subscription, and shares many of the same letters. It’s short, memorable word, and means “a person who copies out documents, especially one employed to do this before printing was invented.” The meaning, though a little dull, connotes a feeling of reliability, antiquity, and tradition- arguably the perfect tone for a product dealing with finances. By pairing that conservative meaning with an edgy font, you have the perfect name for a modern app.
Next, I developed a color palette, fonts, and UI kit that I felt best aligned with $cribe’s brand. The main colors in my palette are a true white I call “Peace of Mind”, which feels crisp and clean, a near black called “Easy Sleep” which works nicely for high contrast, a vibrant green called “Pay Day,” and a regal purple tone called “Trust.” Green and purple were easy picks for me- green is traditionally a positive color and is associated with money and wealth. Purple is a color associated with royalty and leadership. The logo utilizes a font called “Afrah,” which has a similarly regal, modern quality to it. And for the font throughout the app, I selected SF Pro, as it’s the standard for ios applications and would feel secure, reliable, and complimentary to the logo.
HIGH FIDELITY DESIGNS
With my first usability test complete and my brand identity created, it was time to really dive into $cribe’s design and create my high fidelity wireframes. Due to the time and budget constraints on this project, I started with a basic User Interface Kit, which saved me a bit of time up front, and tailored existing screens or created new ones in Adobe XD to incorporate my own layouts, colors, and components. Each decision was influenced by my competitor research, user feedback, and the goals specified by my stakeholders.
VI. iterate.
USABILITY INTERVIEWS I
After prototyping my high fidelity wireframes, I went through a second round of testing with five new users. These users shared the same quality as those I tested in my first usability round, and were asked the same questions. My goal was to learn whether this iteration of my designs solved the issues that came up when testing my original sketches. Ultimately, outside of a minor contrast issue and the realization that a few of the components weren’t connected properly in my prototype, this last round of testing revealed very few issues and resulted in an intuitive and helpful user experience.
I’m particularly proud of this project because its development was a bit out of my comfort zone- admittedly finances and financial management aren’t strong suits, and unlike many of my other projects, this wasn’t a topic I felt ultra passionate about from the get go.
However, as I dove into $cribe, my feelings changed. I decided to approach the assignment from a different angle- what would make someone like me EXCITED to manage my subscriptions? And what would keep users on the other end of the spectrum, folks who LOVE to geek out on finances, want to use this app? In the end, I believe that this approach is what made the end result so delightful and user friendly.
I. overview.
THE CHALLENGE: Create a mobile app that will provide a more intuitive and enjoyable experience for pet adopters.
THE OUTCOME: A mobile app that seamlessly facilitates the search for and adoption of shelter pets.
MY ROLE: Lead UX Strategist (research, interaction design, visual design)
II. research.
During the research phase, I sought to understand the trends that set the standard in the pet adoption space. I also needed to uncover the needs and frustrations of the target user to better understand how to appeal to them.
RESEARCH GOALS
Define the shelter pet problem
Learn why individuals bring a companion animal into their homes
Understand why some consumers prefer to buy a pet instead of adopting one
Define common behaviors of consumers when trying to adopt a pet
Determine user needs and frustrations when trying to adopt a pet
Understand the characteristics of an animal that adopters care about
Identify areas where the pet adoption space could be improved
SECONDARY RESEARCH: MARKET RESEARCH
First, I conducted secondary research to familiarize myself with the animal adoption apps that are already on the market. I gathered data on the shelter pet problem in America and the use of technology to tackle the issue.
SECONDARY RESEARCH: HEURISTIC EVALUATION
A competitive analysis was performed to understand the strengths, weaknesses, similarities, and differences between competitor pet adoption applications
My competitive analysis produced the following insights:
There are are a handful of competitors in this industry, but I found that even the most popular applications aren’t a great match for the real needs of the user
Many pet adoption applications have too much or too little information
The tone of the applications felt uninteresting and uninspiring
There is little incentive involved in the existing pet applications for a user who would typically purchase a pet from a breeder. They are left out of the equation entirely.
SECONDARY RESEARCH: EMPATHY MAPS
I created three provisional personas that reflected the data I had collected through user research. Understanding the target audience helped me think about how the app would appeal to different demographics with varying needs.
PRIMARY RESEARCH: INTERVIEWS
To better understand the perspective of the target user, I screened 45 potential users. Of those users, I interviewed six people- four female users, and two male users ranging in age from 33 to 67 years old. The users I interviewed had a few important characteristics in common:
They were open and willing to share their experiences with me
They have owned a pet and/or are open to welcoming a pet in the future
They are free of physical limitations that would prevent them from owning a pet
AFFINITY MAPPING
Following each interview, I noted each individual finding and created a series of notes. Each individual interview was assigned a color
Then, I worked to define umbrella layers based on the various insights I gained from each interview, filing the information into its correlating layer. Ultimately, I ended up with 4 layers.
Participant Status → Here is where I filed details regarding each user’s history as a pet owner, and what their current obstacles are to pet ownership.
Pet Notes → In this layer, I filed insights regarding how each user feels about adopting a pet versus purchasing one, how they have searched for a pet in the past, how important age and disability are when choosing a pet, and what qualities are important when selecting a pet.
Application Preferences → Here, I filed details about each user’s favorite mobile apps (and why), what turns them off when using an app, how they feel about swipe apps, and what features they’d want to see in a pet-search application
Brainstorming→ Lastly, layer 4 took the most important and common insights from the other 3 layers and incorporated a number of potential solutions in response to user needs and pain points.
Through this process I identified several user insights:
What users say is important to them in a pet may be different than what is actually important to them
Users often feel that they would need to live somewhere different, work differently, or have a different financial situation to adopt a pet
Users connect with animals, and want one “under the right circumstances”
Expense, lifestyle, and adoption misconceptions are roadblocks to rescue
Breed, age & personality are of utmost importance in “matchmaking”
PERSONA CREATION
Next, I used all of the qualitative data I gathered during the research process to create my user personas: the ambivalent adopter, the ready rescuer, and the pet purchaser.
POINT OF VIEW STATEMENTS & HOW MIGHT WE QUESTIONS
How might we convert users who would purchase a dog from a breeder to rescue animal adoption?
How might we help make the homeless pet search easier and more efficient for users?
How might we provide resources to users that make owning a pet more affordable and lifestyle compatible?
How might we change the tone of homeless pet shopping from depressing to exciting?
How might we balance privacy and social sharing in the pet search space so that users feel comfortable?
III. define & ideate.
BUSINESS & USER GOALS
Next, I reflected on the business goals, user goals, and technical considerations for all stakeholders. Once I had identified common goals, I could decide what product features were necessary for the prototype.
USER MAPS
To help me align my ideas with the user’s goals, I crafted user stories that showcased what the user might need to do to accomplish a task and why they need to accomplish it.
IV. information architecture.
A high-level list of app features was created to further define and guide the vision for the product. Prioritizing the features with supporting research created a clear order of execution.
SITE MAP
Next, I created a site map for Paw Lab that outlined the app’s navigation and information hierarchy.
V. test.
WIREFRAMES: LOW FIDELITY
I began the process of wireframing with sketches of several of the main screens for Paw Lab. During this process, I thought about how the layout and content could be structured to satisfy user and business goals in a technically feasible way. The sketch I chose served as a guide for my digital wireframes.
GUERILLA USABILITY TESTING
In order to test this iteration of Paw Lab, I sourced six volunteers to work through my low fidelity sketches. I provided each volunteer with a link to the wireframe (HERE) that I prepared on Marvel. Then I conducted various Zoom conferences where asked each user to work within the following scenarios:
You’re a new user and have never used this application before.
How would you sign up for an account?
You’re a returning user.
How would you login to view adoptable pets?
How would you change your pet preferences?
How would you view your favorites?
How would you request an adoption?
My goal, through each of these interviews, was to ensure that our users are able to easily and intuitively accomplish the core tasks associated with the application: signing up and/or signing in, specifying their pet preferences, perusing pet profiles, viewing and saving favorite pets, and requesting an adoption.
WIREFRAMES: MID FIDELITY
I created a UI requirements document to outline all of the features and elements I wanted to incorporate into the design. Once this was complete, I started creating digital wireframes for the main screens in Adobe XD.
VI. next steps.
VISUAL DESIGN: HIGH FIDELITY PROTOTYPES
Incorporating color scheme, typography, and a brand identity. I’ll be posting updates soon!
