Know and grow your church with actionable insights
PUSHPAY INSIGHTS
A case study centered around the design of a brand new Pushpay product, from strategy to shipped 💫
THE HEART OF OUR MISSION
- Church Executive Magazine, on Pushpay's Insights
"Ministry is deeply relational. Data might seem impersonal, but it’s anything but. It tells a story about your people and how they interact, give, and attend. The story told through those charts and graphs can help you understand your congregation and strengthen relationships within your church."
Situation
MY ROLE
👩🎨 Product designer involved in every step from strategy to MVP.
-
Collaborated closely with a lead designer, product manager, & engineering team throughout
-
Directly led the design research, usability testing, and the final iteration of the design
⏰ Timeline: 1+ years
⚒️ Tools: Figma, Mural, Dovetail,
WHO IS PUSHPAY?
Pushpay is an all-in-one church management suite that provides management software, a giving platform, custom apps, and video streaming.
PROBLEM
Our customers, church leaders and staff, expressed a need for increased data literacy among the Pushpay product suite.
User research, competitor analysis, prototypes, executive presentations, final specs, roadmap, and more.
DELIVERABLES
Increased competitive standing in market, increased customer satisfaction, decreased reporting related tickets, and onboarded 800+ organizations by May 2024
IMPACT
Pushpay had inconsistent metrics and reporting experiences across its product suite.
1
Customers had no insight into how products and their metrics interrelate.
2
Customers were using third party tools like PowerBI and Excel to analyze and visualize data.
3
Customers lacked an understanding around engagement levels
4
PROBLEM FINDING
Customer feedback from the UXR team highlighted a pressing need for data literacy among churches.
USER GOAL
Decipher and utilize Pushpay data to understand organizational health and make data-driven decisions.
BUINESS GOAL
Centralize product suite data to improve retention, churn rate, and increase competitive stance in market.
Task
How might we improve data literacy and knowledge of organizational health for our customers?
DESIGN QUESTION
Action
FROM STRATEGY TO SHIPPED
Building a product from scratch involved many challenges and bumps in the road. I've split this case study into four stages: onboarding, the proposal, the adaption, and the final designs.
1
STAGE ONE: ONBOARDING ⛴️
Contractors had passed off previous concepts to the product managers. The lead designer and I dug into them but were ultimately met with challenges.
Design decisions were minimal, user testing was absent, and handoff documents were disorganized. So we decided to start from scratch.
See inside the full proposal
DIARY STUDY
We invited 18 participants to walk around their neighborhood and share five pictures of interesting things they encountered and explain why each picture caught their eye.
Findings
-
Selfies among younger users were incorporated into their exploration photos.
-
Scenic views and hidden gems were what a majority of participants took pictures of.
SURVEY
All diary study participants completed a brief survey, gaging their interest in the task, their thoughts on outdoor support for physical and mental health, and how connected they feel to their community.
Findings
-
94% of participants reported importance in being connected to their community
-
78% of participants felt getting outside was important to their mental and physical health during Covid-19.
-
78% of participants explored their neighborhood at least weekly, either by walking or biking
COMPETITOR ANALYSIS
We gained insight into the exploration industry. We compared seven different competitors, and did deep dives on World Brush, Like a Local, and Google Maps.
Findings
-
Community connection is lacking.
-
Main features include search, direction, and option to rate.
-
Limited feature sets are seen in apps such as World Brush, that have mystery elements.
-
User content creation is common in explore apps (e.g. adding professional businesses).
Detailed Data
Drill down into numbers; see where data comes from
Customization
The option to customize and edit widgets
Trend Analysis
View and analyze trends over time
Data Integrity
Tools to locate and clean up missing data
Smart Insights
Predictive trends and recommended actions
RESEARCH FINDINGS
We conducted two rounds of rapid prototyping, taking turns moderating. I used Mural to organize the feedback and identify key themes, then created a presentation for stakeholders.
The lead designer and I designed concepts based on the themes identified from our research. See the annotations below for more details.
WHAT WE LEARNED
The Good ✅
-
Participants saw value in a centralized analytics tool
-
Participants liked being able to locate missing attendance
The Bad ⛔
-
Participants did not understand the value behind the 'Smart Insights' panel on the right
-
Participants felt there were not enough metrics or actions to replace current solutions
-
Participants felt there was not enough configuration and filtering options to get them the information they need
The Requests 💡
-
Participants requested adding goals to track their progress
HIGH-FIDELITY PROTOTYPE & ITERATIONS
Here are a few examples of our iterative changes throughout the testing process. We tested our prototype on 5 people via Zoom, using a Figma prototype.
01. ON-SCREEN, LIVE MAP
V1 Feedback:
Users loved the combination of an Augmented Reality (AR), real-time view. However, users thought the location marker looked like a video ‘play’ button, and once you click into a pin they were unsure what to do next. Also, they were unsure why the pin was called space needle when it wasn’t directly on it, and what they would actually see once they reach the pin.
V2 Changes:
-
Adjusted location marker.
-
Made CTA language more clear.
-
Added elements to display the pin is user-generated (name of spot, name of post author, etc.)
-
Added more visuals to give sneek-peak of location
02. PIN PROFILE PAGE
V1 Feedback:
Once you get close to the pin, users were confused and one commented that the UI for our arrival screen looked like an ad. Is it the pin spot or something else?
V2 Changes:
-
Adjusted location marker to reflect the pin itself (to maintain consistency)
-
Adjusted layout of expanded pin to compliment the ‘Start Walking’ screen.
03. USER ON-BOARDING
V1 Feedback:
Users felt like they were unclear about the app's capabilities when they arrived to the home screen. So we needed to make our onboarding very clear so the user knows functions like navigating to "Pins" and how they can share their own content.
V2 Changes:
-
Included more action oriented language to describe the app’s core functions.
-
Switched from tapping ‘Next’ to navigate to the proceeding screen via a drag motion.
.png)
The PM created a survey where 139 customers rated the usefulness of product metrics, and this helped us prioritize which to include, as well as which to highlight.
We continued to communicate and validate designs with a Co-Design group via Slack, 1:1 conversations, and email.
We incorporated preference testing, overall feedback on direction of product, and any ideas or suggestions that they may have.
THE GOOD ✅
-
They found value in the new people-focused vision
-
They validated that we were showing the right data in the widgets
-
They validated that we were showing the right actions (export, mass actions)
THE BAD ⛔
-
They didn't trust the data due to inconsistent data entering on their end, and needed an easy way to locate and fix this missing data
-
They wanted to slice and dice the data even more
THE REQUESTS 💡
-
They reiterated that they want the ability to share and crack down on permissions
3
STAGE THREE: THE ADAPTION 🎯
We were asked to dream big in our proposal, but now we needed to be more practical. With a launch date set, it was time to scale back, refine our scope, and decide what to include and exclude.
Product management and stakeholders were more involved in this stage. We held ideation workshops and design sprints to further the direction of the product.
Show the right data
Focus MVP on showing the right data, and have engineering link it correctly on the back end
See the people behind the numbers
Drill down into numbers to see more detail on the people who attend, give, serve, and stream. Limited filter functionality.
See my church health
View health metrics per product and how they interrelate. Analyze trends over time.
OUR DESIGN GOALS
UPDATED REQUIREMENTS & USER FLOW
Our new flow would have a dashboard with pre-defined widgets, the ability to dive into product specific overviews, and seeing a people list behind the numbers (with the ability to take action on them).
As much fun as customizable dashboards are, we scoped it down to default pre-configured widgets with limited filtering options. We also removed the insights panel that was calling out recommended actions and top metrics, and instead focused on providing the right metrics and data first.
ITERATIONS
We had three major iterations over a span of months, which we connected with our Co-Design customers throughout.
Version 1 was a rough conceptual design that focused more on what to display and less of how it looked. Once we cracked down on requirements, we moved to Iteration 2. It was also canned for a couple reasons: 1) the design seemed flat and lacked reason behind visual hierarchy, and 2) It included nice-to-have features that we had to can for feasibly and tight deadline reasons.
.png)
STYLE GUIDE
For branding, the design lead and I pulled in unique colors for each product to make them stand out. For the main product theme, we chose shades of blue to invoke calmness, relaxation, and trust.
Though we utilized a good portion of our current Pushpay design system, there were many components that the lead designer and I had to build from scratch including gauge charts, configureable widgets, trend indicators, missing attendance indictors, and more.
The Final Design
01. Dashboard
✅ Quick, digestible snapshots of product health (Attenders, Donors, Volunteers)
✅ High-level metrics, with the ability to dive deeper into the numbers and the people behind them
✅ Compare numbers and trends easily among similar activity (Gestalt's Law of Proximity)
4
STAGE FOUR: THE FINAL ITERATION 🎉🎉🎉
I spearheaded the final iteration, involving a redesign of the dashboard and visual hierarchy refresh.
Other changes to the final version:
⇨ Moved all data above the fold on the home page
⇨ Grouped related content together (Gestalt's Law of Proximity)
⇨ Upgraded UI consisting of soft shadows, colors, new components, use of white space
⇨ Removed certain features and placed into backlog (ie. heatmap)
⇨ Finalized the people list page
02. Overview Pages
✅ View trends over time in a configurable table, with the option to further filter down
✅ High level metrics that you can dig deeper into (view people behind the number)
✅ View stages of engagement to learn where people fall through the cracks
03. People List
This is the 💙 heart 💙 of Insights — knowing your people and their engagement journey, and being able to act on that knowledge.
✅ Make data driven decisions: export a list, import list into other products to take mass actions (email, invite to event, add to group, etc)
✅ View all people or filter down to certain engagement stages, among other metrics. Every high level metric has its own list.
The first phase of Insights went live February 2024. We received positive feedback from customers, and they are excited to see how the product will grow over time.
-
Increased competitive standing in market, increased customer satisfaction, decreased reporting related tickets, and onboarded 800+ organizations by May 2024.
-
Consolidated data from three Pushpay products into one location
-
Hours saved per week on reporting tasks for admins
-
To keep our customers excited about Insights, product put together a future release doc, so they are aware about new features coming out.
View demo on Pushpay.com →
Results
Learnings
-
Balancing business and user goals can be tough when not everyone is aligned on the value behind a feature. I learned that communicating reasoning with data points and user quotes helps advocate for our users, and in our case got features back into the roadmap.
-
We had 6+ versions of design, including our original proposal. I learned this is normal and to be expected for a new product. It is not going to be perfect the first time around. It is a continuous improvement, and one where you communicate with internal and external stakeholders often.
-
In this project, the lead designer and I put on product manager hats because of a lack of vision originally. Though this was uncomfortable at first, I am grateful for the experience to work on requirements and advocate for features!
Let’s talk about Impact:
3 ➮ 1
consolidated data from three Pushpay products into one location
4+
hours saved per week on reporting tasks for admins*
800+
organizations now empowered to make informed decisions grounded on a clear image of their business health
There's an ocean of data out there for churches. How can we make sense of it, and what can we do with it?
In a world where a single person generates 146,880 MB of data daily, church leaders must navigate an overwhelming flood of digital information. With data pouring in from Pushpay websites, apps, and streaming services, the challenge for churches is to make sense of it all.
CONTEXT
2
STAGE TWO: THE PROPOSAL 💍
It was time to dream big with no constraints. Taking hold of ambiguous reigns, the lead designer and I crafted a design proposal.
Donning both a UX and PM hat, I blended industry research, competitor insights, and design trends to forge the first set of concept designs. We then sprinted through two rounds of rapid prototyping.
