Crossroads MV
Mar 24 - Current
Team - Social Media Curator, Graphic Designer and Photographer, Lead Developer, and me.
My Role - UX/UI Designer
The Challenge
Having a web presence in this day and age is as important as ever. A local church wants assistance with designing a mobile app and redesigning its current website to increase new attendees alongside enriching current church-goers.
The Outcome
A working mobile app that assists with notetaking, watching sermons, donations, and getting connected. A cleaner desktop website to give a first impression that fits the church.
Main Deliverables :
- Get Connected
- Watch Sermons
- Take Notes
- Donations
- Improve Usability
Building the Baseline
What does leadership say?
Wireframing
Creating the basic experience around the main users flows of getting connected, sermons, and donations with a mobile first approach.
Prototyping
Creating a clickable prototype and getting feedback from users and stakeholders.
USER RESEARCH
Target User
After talking with primary stakeholders, the primary users would be current attendees and prospective attendees.
Research Goal :
- Understand struggles the user may encounter with the current website along with preferences they may have.
Participants :
- 5 1-on-1 interviews with church attendees
User Research Plan
Research Objectives :
1. Understand user pain points with the current website.
2. Empathize with where each user is coming from.
Time :
- 15 min
Main User Feedback
- "I feel like the website doesn't match Crossroads."
- "Everything has a different font."
- "Some of the pages I don't even know what it's saying."
DESIGN & IDEATION
After
Before
The font for titles changed to be more consistent throughout. Also added in a short description of events. Users enjoyed "Coming up..." separated from "...at Crossroads."
Hi-fi Prototype
ITERATIONS
Crossroads then joined forces with Subsplash to begin development of the website and mobile application.
Throughout every step in the process, we would have bi-weekly meetings to discuss the designs and ways to improve them.
Here are some of the changes we made.
Before
After
Users new to the church aren't familiar with the vernacular. To increase ease of use for new users to the mobile app and new attendees to the church, "Sermon" was changed to "Message."
"Media" was an ambiguous title that didn't communicate that it was to view the live stream of the message. Changed to "Live Stream" for clarity.
Changed graphic to TV with a play button
Changed order to allow for "Live Streams" to function like a "Saved" area as users were more accustomed to that layout.
"If we can reach even 5 new people, it makes all of this worth it."
- Care for the community
- Reflects the kind of community within Crossroads
- It's not about the money for Crossroads
Why spend all this time & Money?
For a church that stresses building a community, the project focused on allowing users to get connected. Building experiences for both desktop and mobile versions created some challenges that we are still working through today.
Future Features:
- Improved desktop experience
- Calendar view for events
Closing Thoughts
First Impressions are important. Non-verbal cues have 4x the impact of anything said in a conversation.
The designs focused on the homepage to allow for the first impression to match how users felt about Crossroads.
Sketches