St. Charles Borromeo is a Catholic parish located in Brooklyn Heights.
Challenge
Make newcomers, visitors, as well as parishioners feel welcome and improve the overall user experience of the site for everyone
Solutions
• Direct lines of communication with priests and lay leaders
• Balance between content relevant to newcomers and regular parishioners
• Prominent mobile-responsive cards for navigation
• CTA's for newcomers
Roles
Interviews, Comparative Analysis, Wireframing, UI Design, Prototyping
Research
Interviews
Parishioners were interviewed with the goal of discovering how they interacted with the existing site as well as those of other parishes.
Comparative Analysis
Some sites were analyzed by the parish's Media and Communications group beforehand. I added a few of my own contributions when I performed the analysis. Many of these appealed to a young audience, which was important given the prevalence of young professionals attending St. Charles Borromeo.
The analysis proved useful in understanding the conventions available for designing a church's site; many of which would end up informing the redesign.
Design
The landing page was the central focus, as this was the most important point from which users would set off. A cost-friendly Wordpress theme would be selected and remaining pages would be built out from it.
Ideation
Sketches were created and shared with the Media and Communications Group for feedback.
Wireframe and Prototype
Once their feedback was gathered, a wireframe was created for the landing page. I aimed to create a page that was inviting, provided direct channels for communication, and led to easy access to relevant information; all while being mobile-responsive and as minimal as possible.
For the prototype, two additional pages were created in order to test user flows.
It was important to include many displays of images in a carousel banner and in the cards as, during interviews, images with people were noted as humanizing and inviting.
User Testing
Tests revealed that the cards performed very well; to the extent that they even detracted from the navigation bar's discoverability. The choice of some cards in the Quick Links section were found to be lacking in relevance and copy in the nav bar menus didn't always match with users's mental models.
Final Design
The final design was updated in response to what was learned during user tests and was visually designed in collaboration with a fellow parishioner who is a graphic designer.
