work redesign homepage
3
PEOPLE ON TEAM
PEOPLE ON TEAM
1
DESIGNER/ DEVELOPER
DESIGNER/ DEVELOPER
4+
YEARS IN USE
YEARS IN USE
22%
BOUNCE RATE DECREASE
BOUNCE RATE DECREASE
client
Westar Institute is dedicated to fostering and communicating the results of cutting-edge scholarship on religion. They provide publications, host annual events, and offer other products for sale.
objective
Redesign the homepage to be more welcoming and modern for the next generation of religious scholars.
results
The redesign was successful for both new and existing users, decreasing the Google Analytics Bounce Rate by 22% in the first 6 weeks. Two years later, Westar Institute is still using my redesign.
my roles
user research, ux design, front-end development, back-end development
tools
PAPER AND PENCIL
ADOBE PHOTOSHOP
WORDPRESS
PHP
MYSQL DATABASE
process and methods
understand • empathize
user interviews
- Top 3 reasons users come to the website:
- latest articles
- upcoming events
- seminar reports
understand • define
stakeholder interviews
- We had a small team of 3 people working on the redesign - the Chief Operating Officer, the Director of Marketing, and myself.
- I worked closely with all team members to keep communication a positive, open, and ongoing effort.
- Having worked on this website for over a year I had a few key insights to kick us off. The homepage needed to:
- match all existing subpages, to minimize style work
- don't alienate or confuse our existing audience
- keep the professional and educational look
- make sure key pieces of information continue to be accessible
competitive research
- The Director of Marketing and I scoured the internet for similar organizations who offered both published articles and events. We pulled some of the best ideas from top competitors into our sketches.
explore • prototype
- The Director of Marketing and I shared and discussed a number of paper sketches.
- Based on the final paper sketch, I created a high-fidelity prototype.
NOTE: I skipped a low-fidelity prototype because we had an existing website with a set style. - I made a series of adjustments to the prototype as requested by the Director of Marketing until we were both happy with the final design.
materialize • implement
- The code from the prototype was used to overwrite the existing homepage.
- The design change to the menu was applied in WordPress to all existing pages.
- The slider was filled with 5 of the top pieces of information.
reflection
- User research is so important. The Director of Marketing really wanted to strip everything from the homepage - upcoming events, recent articles, products. She wanted to showcase a welcome message and her blog, and that is it. But the existing users said how important it is to them to have access to the latest events and articles, because the website menu is difficult to navigate (another project for the future).
- Knowledge of best practices is also very important. Research shows that sliders look slick but are not all that usable, and the information in them can be considered to be hidden to certain users, including the baby boomer generation. Well, our main audience is the baby boomer generation, so if we only share important information within the slider, our audience will not see it. The Director of Marketing was adamant that we keep the slider, so the compromise was to have the information in both the slider and on the homepage (except for the first slide).
- In the months after implementation, GoogleAnalytics proved that the slider was very rarely used to access information, and the number of clicks increased for the same information further down in the page.
before
after

