Yuanyuan Wang
Streamline
Worship Online
Simply accessibility and design features for online worship, boosting user flow efficiency by 62%.
User Research
Responsive Design
UX Design
Project
problem.
25% drop in online worship attendance due to complicated Zoom accessibility
WCRM (World Christian Restaurant Ministries), a non-profit church, relied on Zoom for streaming Sunday worship services. But users needed to obtain the Zoom link via social media before they join the online worship, the process was cumbersome.
Over the last three months, the organization observed a 25% decrease in Zoom online worship attendance.
Role
UX/UI Designer
User Researcher
Team
1 Product Manager
1 UX/UI Designer
1 Developer
Timeline
1 Month
Project Objectives
-
Simply Online Worship Accessibility
-
Increase Participation in Online Worship
Solutions
Streamlined Online Worship Access through Integrated Live Streaming into Organization's Web
We integrated the live stream platform into the organization's website and added a unified CTA poster on the homepage. Users immediately see this poster upon visiting the homepage and can click 'watch online' to access online worship.
Before
Use
User
Social Media
Obtain
Link/IDs
Zoom
Oline Worship
Our Solution
User
Join
Enter
Offical Web
Join
Oline Worship
Home page
Online worship page
(Live stream times)
Online worship page
(Non-live stream times)
Success Metrics
62%
User Flow Efficiency
94%
found the entrance quickly
Average entry time for online worship has decreased from 8 to 3 minutes.
94% of users could find the 'Online Worship' entrance within 5 seconds.
User
Research.
Target Users & Research
Assessing Online Worship Pain Points of Target Users
Given that this service is primarily for our church members, we identified over 300 congregants as the target users for this project.
To gain a more comprehensive understanding of the pain points and needs for online worship across different age groups, I conducted one-on-one interviews with five users each from young adults, middle-aged adults, and seniors.
Young Adults
20-35 years old
(50 people)
Middle-aged Adults
36-55 years old
（140 people)
Seniors
56 years and above
（110 people)
Key Finding.
Insights
Elderly Users Struggle with Zoom due to Unfamiliar with Online Environment and Lack of Digital Skills
User research revealed that 66.7% of users did ‘t consider Zoom is a good platform for online worship—this was we were unexpected!
Participants mentioned that navigating across multiple platforms was challenging.
The underlying reasons were they‘re unfamiliar with online environments and lack of technical skills.
In this church, about 62% of members are over 50 years old.
Unfamiliar with online environments
Lack of technical skills
Design
Direction.
Design direction
Integrate YouTube Live into the official web
Based on user pain points and organization’s development, we decided to integrate the live stream platform into the organization's official web.
-
Within a familiar environment without switching multiple platforms.
-
YouTube Live can better adjust video quality.
-
Increase subscribers of the church's YouTube channel to broaden its reach.
Direct Access
Optimize Viewing
Expand Reach
Design Challenge
HMW help elderly users, unfamiliar with digital platforms, to easily locate and join online worship on the church’s website?
Design
Process.
To help elderly users quickly find the online worship entry point, during the workshop, I proposed four design options.
Option 1
Add an 'Online' Category to the Navigation Menu
Pros:
-
Allows users to directly locate and access livestreams.
Cons:
-
Requires redesigning the existing website layout, potentially needing significant initial resources.
-
Elderly users unfamiliar with navigation menus might overlook this element.
The 'Online' category
The search bar
Option 2
Add a Search Function
Pros:
-
Enables users to quickly find live streams by entering keywords.
Cons:
-
Elderly users unfamiliar with the internet or search tools may struggle to use this feature effectively.
Option 3
Add Online Worship Section on Home Page
Pros:
-
Placing online worship content on the homepage directly guides users to perform desired actions.
Cons:
-
Too much information can overwhelm elderly users seeking simple solutions.
-
Maintaining accurate content may require additional resources and effort.
Option 4
Add a Live Stream Section on Home Page
Preferred option
Pros:
-
Positions the live stream prominently on the homepage, visible to visitors.
-
Simplifies access by allowing direct viewing from the homepage, eliminating the need for further navigation or search.
Cons:
-
Could impact the website’s loading speed, especially during initial visits.
I preferred featuring the live stream on the homepage for its simplicity, especially beneficial for elderly users unfamiliar with technology. Yet, the slow loading speed posed a challenge.
After consulting with a developer, we agreed on a compromise: hosting the live stream on a subpage, improving navigation and reducing data usage, effectively balancing accessibility and technical feasibility.
Was it the ideal solution? No!
Just when we thought our solution was ideal, the stakeholder rejected it, stating that while it made joining online gatherings easier, our primary service was the Sunday offline worship, and thus the livestream should not be the main focus. He suggested balancing both services.
So, I proposed two iterations:
Iteration 01
A carousel poster
Iteration 02
A unified section with CTAs
✅
After presenting these two designs to the stakeholder, He preferred this carousel posters approach because our current website uses this method to display various services and events.
However, after testing with 10 users, 93% of users could quickly find the online worship entry point with the unified poster with CTAs.
So, we chosed the unified section with CTAs as our final solution.
-
Intuitive Color
Dark background and bright text and buttons make key information and navigation elements visually prominent.
-
Readable Typography
Using large, clear fonts for headlines and concise text for buttons, ensuring ease of reading and understanding.
-
Prominent Navigation
The call-to-action (CTA) buttons guide users to take specific actions, enhancing the experience.
What happens after users enter the online worship page?
Scenario 1
During live streams, users can directly watch and participate.
Live streaming
Scenario 2
Non-live stream times, users can‘t watch and participate.
Then I've proposed two design solutions：
Pros:
-
Provides clear updates to clarify current site status and minimize confusion.
Cons:
-
Users do not know when the livestream starts.
Design 01
Live Stream Status Notification
Design 02
Dynamic Countdown Timer
Pros:
-
Offers a visual timer that shows the time until the next live stream.
Cons:
-
Incurring substantial development time.
✅
After discussing with the team, we all agreed that this solution was more intuitive. This feature not only informs users the exact time until the next worship starts but also enhances page interactivity. So, we chose it as our final solution.
-
Effective Visual Contrast
The dark background with white text and numbers offers high contrast, ensuring readability on various devices and lighting conditions.
-
Clear Information Hierarchy
The top title states the countdown's purpose, making it instantly clear to users. The enlarged countdown numbers below enhance this visual focus.
Responsive
Design.
Based on user research, 42% of users expressed their preference for participating in online worship using their mobile phones. Therefore, I designed responsive websites that adjust to mobile devices, ensuring optimal user experience regardless of the device being used.
Testing
Result.
First Round: Accessibility Testing
Given our elderly user base, I checked that these designs adhered to WCAG standards. These two designs meet WCAG standards.
Home Page
WCAG AA standard
Online Worship Page
WCAG AAA standard
Second Round: Usability Testing
Additionally, I conducted usability testing with 10 users, focusing on:
-
To determine if users could easily find the online worship entrance after accessing the website.
-
To gather user feedback on their experience with the online worship page.
The results showed 94% participants accessed the worship page via the poster unified section with CTAs, one through the navigation menu, and none used the search function. Overall, users expressed positive experiences with the new live-streaming page.
"
Can I view past worship episodes
on the online worship page?
"
Some users suggested the possibility of watching past worship episodes on the online worship page.
In response to this feedback, we added a 'Recent Episodes' section below the live stream to enhance user engagement. This feature allows users to watch past episodes while waiting for the live stream, with a direct video to the organization's YouTube channel for viewing.
Before
After
Success
Metrics.
62%
User Flow Efficiency
94%
found the entrance quickly
Average entry time for online worship has decreased from 8 to 3 minutes.
94% of users could find the 'Online Worship' entrance within 5 seconds.
What've I Learned?
-
Strategies for Collaborative Problem-Solving with Developers
When facing technical limitations, first, communicate actively with developers to clarify design goals and user needs, ensuring they understand the purpose and details. Second, integrate developers' feedback into decision-making to collaboratively explore feasible solutions. This method enhances collaboration and helps identify practical design solutions.
-
Managing Stakeholder Disagreements in UX Design
When stakeholders disagree with designs, UX designers should listen carefully to their feedback, support design choices with prototypes and user testing, maintain open communication, and seek compromises that align designs with user needs and business goals.
END
Thanks.
More projects...
Achieved an 83% improvement in data processing efficiency by visualizing core sales dataI.
Achieved an 83% improvement in data processing efficiency by visualizing core sales dataI.
Restructure the website's information architecture and content, resulting in a 37% increase in average session duration.
Restructure the website's information architecture and content, resulting in a 37% increase in average session duration.