Mike Smick UX Sketch Sub Page Image

Cathedral Basilica Project

The Cathedral Basilica website was planned and built to bring their old Joomla site to something they could have more control over. This required a new design and paying particular attention to layout. They had a lot of orphaned pages that had some content, but a visitor wouldn’t be able to find it. And there was a clear ‘decay’ happening with the CMS version and plugin versions being out of date. Things were broken and functionality was no longer working for the content updates they made most frequently.

Project NameCathedral Basilica Website
TaglineRebuild the site so the administration could use it and the visitors could access the most important information.
Project SummaryChoose a new content management system and build a new website for the Cathedral Basilica. Take the previous content and repurpose into new pages, consolidated pages and ensure that the most important content is accessible.
ClientCathedral Basilica of St. Louis
Date or TimeframeApril 2014 – August 2020
Tasks & ResponsibilitiesChoose and build inside a new CMS. Create a process for uploading content. Recreate multiple tour galleries. Create a megamenu of organization of the content so patrons could browse different areas of the site easily, such as parish, school, music, visitor and donor content. Help set up system for live streaming mass to web.
Design Tools / UX MethodsUser personas, journey mapping, card sortation, sitemap, wireframing, site design, using Xara Designer Pro, Photoshop. Implementation with WordPress, Foundation 4, Bootstrap 3, Google Docs, Youtube, Omnia-app streaming service.
KPIs / AnalyticsUnique visitors #, return visitors #, live stream visitors total & per stream.
Team / CollaboratorsMike Smick, Nicole H, Tom F, Doug W.

Build Notes

The Cathedral website needed to feature attractive banner images, art galleries and calendar features.  There are also a number of charitable and giving periods where videos and program info is set to the home page. The site layout was built to be responsive with visitor devices spanning from desktop computers, to tablets to mobile handheld screens. One major challenge was to have a navigation menu that gave visitors a categorized entry point to nearly anywhere in the site with as few clicks as possible. And Subsequently the addition of mass live streams was added.  Google analytics was employed in order to track the frequently visited pages and entry locations by individuals. 

Technologies Used

The project was wire-framed on paper and flows created in mindmap form.  The design was then rendered in medium to high fidelity graphical mockups in Illustrator and went through a series of feedback loops.  An earlier iteration was built using the Foundation CSS framework highly customized. After a few years, it was then developed using Bootstrap 3 and a responsive mega-menu was augmented.  The site sits on a WordPress CMS and a series of templates were custom developed to accommodate page content types. 

Result / Summary

From the initial state of the website, a mostly neglected and insecure Joomla instance, not only has the design improved and become infinitely more flexible. Control is back in control of the client. The design has been well-received and updates over the years have been frequent and responsive to the request of patrons and the parish leaders. The traffic to the site was tracked over several years and has increased at peak to over 700%.

What I Learned

Maintaining this site for many years, my primary takeaway was this size of endeavor is WAY too big for one person to maintain. I truly believe it should have been built and maintained by a number of people and more resources put towards maximizing every aspect of it. Thankfully it will be handled that way moving forward. In regards to content, there were a lot of missed opportunities of content development, and marketing new content. While the design was fantastic and well-received and it brought the site to new heights, it wasn’t sufficient I don’t think to capture the imagination of new visitors as it could have been. There should have been A LOT more focus on capturing images and videos and create a thorough history. Focusing on more content for in-person visitors to this historical landmark. Possibly fund raising through product sales or creating other collateral.

I’ve learned that some of these bigger projects, there are simply organizational barriers that a designer cannot get past without buy-in AND momentum from the client. And if there’s not enough incentive to push through them those things will not be addressed. While there were many great aspects to the relationship, there was always barriers to creating and publishing new content. There was also a disconnect from myself and their social media marketing, the approval process and organized execution. Being more aware of what they were doing on the client side, could have inspired and influenced a lot more content updates on the site. It’d be the same anywhere. You can only suggest content for an event if you’re made aware of the event happening.

Lastly I learned a bad lesson in streaming technology. As a consultant, I made a recommendation for video streaming that ended up presenting problems over the 18 months we used it. Had I chose differently for the client, perhaps gone with a bigger vendor that would have cost more, those problems never would have materialized. I made a bad call even with the best intentions. I felt my choice was the right complexity at the right costs, but in the end, technical problems that should NEVER have happened did more than once. A more expensive vendor means the client would have paid more per month, even when not in use but the reliability and features were a lot more epic and professional.