BCM Website Redesign
The challenge of updating an outdated site in order to increase visits by college students for the coming Fall Semester.
Meet our Student, Mia
Mia is a Freshman at Virginia Tech where she is studying to become a Dietician. When she's not in class or studying, Mia spends her time trying out different campus organizations to meet new people. Mia is also passionate about her beliefs and is curious to know more about the campus ministry, BCM. Mia needs a quick and reliable way to find out if their beliefs are in-line with her own, what the culture is like, and ways to get involved.
Target audience - busy college students curious about Christianity who wish to build friendships during their college experience.
These students need something that's simple and quick to navigate and provides highlights for events and ways to join that makes finding an organization easy.
Find their beliefs and what their culture is like
Quickly find ways to get involved
Find out more about upcoming events to attend
Wants to make long-lasting friendships with people who share the same beliefs
Busy class schedule and homework
New to college and unfamiliar with the area
Worried about finding good friendships
Mia Jones needs a way to quickly and easily find out more about the campus organization, BCM, because she's interested in finding a group to join that shares similar beliefs where she can form long-lasting friendships in college.
Sketching out all possibilities
After we realized the needs for the students and the website's current state, we decided just to scrap everything we currently had and to start from scratch. This way we were given free-range in terms of design and functionality.
We knew the site needed to be modern (including a clean design with sleek and easy to read fonts), simple and easy to navigate, and most importantly provide the right information that students will go to the site for.
The previous design was an outdated Wordpress theme from the early 2000's. We needed this to match what other sites looked like at the current time of 2015. Our hope was that by doing so, students wouldn't be deterred or turned away by a site that was "boring" and "ugly".
We made comparisons with other campus ministry sites, such as CRU, and took those similarities and differences to create our new look. If other students are looking at other ministry sites, then our site needs to match if not exceed those user expectations when comparing sites.
Code It Out
After months of sketching and mockup designs, we finally came up with this end solution.
This is your first introduction to the BCM. Here, we applied a clean and modern design to the page and added simple and easy to understand navigation along with links to the social media connections.
The main photo is a part of a carousel of slides that share more information about what is going on in the BCM. It's an easy way to feel connected and intrigued to learn more.
Small Groups are one of the major aspects of joining the BCM community and getting involved. We decided to go with a creative way of highlighting these to stand out more from the rest of page by creating these colorful bubbles.
Find Out More
Once you click on a Small Group, we added this modal popup block to introduce you to the current members and leaders along with when/where they meet.
Accordion Event Calendar
We implemented an accordion folding style calendar to display upcoming events at BCM. Once you click on an event, it unfolds to show more information about that event. It allows the site to contain all the necessary information, but only to display it when the user wants to view it.
How Do I Get There?
We decided to add to the site the simple graphic they use on all of their print media to easily display their location. Every student on campus should know Washington St. and if you follow all the dorms down that street, you'll be able to easily make sense of this map. Adding this to our About Us page allows students to easily access the BCM building location.
One thing the previous site lacked was a mobile-friendly design. You would pull up the BCM's site on your smartphone and see the entire webpage as you would see it on a desktop screen. Eek!
With the ever increasingly mobile world, we took on the challenge of creating a mobile-responsive site.
The main landing on a desktop gets shrunk down to a mobile phone screen where everything is simplified.
When students are on their phones searching the web, it's because they are on the move or need to gather information quick.
So we removed the carousel and made the podcasts, about us, and events more easily obtainable.
We also made some other features more easily obtainable and navigable.
The Menu Navigation Bar gets converted into a dropdown menu to make selection easier with finger tapping.
The text on each page is made more legible and easier to read on smaller screens.
Let's Look at the Metrics
In summary, you can see a healthy usage of the site throughout the year.
Almost a 55:45 ratio for Desktop vs. Mobile Device usage.
The most popular visit times during the week are between Monday - Wednesday as students are looking up Large & Small Group events and information for Tuesday, Wednesday, & Thursday evenings.
We're getting a ratio of 3:1 ratio of returning vs new visitors. This is good for getting people introduced to the BCM, but what's making them not return to the site? Further investigations will need to be studied upon.
The most directed ways someone reaches the site are either Organically, Direct, or Social Media.
Most sites are to see information about small groups, about the BCM, and for leadership members only pages.
Let's Wrap it Up
Whether in the middle of class or in a hurry, the newly mobile-friendly site can help you find out more about BCM in a matter of a couple of minutes!
With the newly redesigned site, students like Mia can now easily find out more about when and where she can attend events and how she can make lasting friendships with people who have similar interests.