S.S. John W. Brown Project Liberty Ship
Alongside a few of my classmates, I worked to implement a site redesign for the S.S. John W. Brown Project Liberty Ship using WordPress. In order to complete the site redesign, we conducted user testing with targeted users for the new site. These users included volunteers, donors, educators, customers, and the general public. Based upon our discussion with the clients and our user testing we decided to focus our efforts on these deliverables:
- Make the new site more user friendly and easy for people of all ages to navigate
- Include more history, imagery, focus on events, and a better functioning store
- Reorganize the navigation bar as well as internal pages
- Train clients in WordPress CMS
- Create a unique site that can grow with new information
In order to make this site a reality, we had to settle on a hosting service, theme, color scheme, navigation layout, and plugins. We ended up utilizing WordPress’s Fleming theme and Hostgator for the hosting service.
Navigation Layout:
Original Navigation:
Redesigned Navigation:
Color Scheme:
I came up with two color schemes for the new site. The first color scheme included gold, white, and blue, while the second color scheme included red, white and blue. Because the gold contrasted better on the navy blue, we decided alongside our clients to utilize the gold color scheme. Below I have included an image of this color scheme as well as hexadecimals for the colors:
Logo Redesign:
The S.S. John W. Brown Project Liberty Ship originally had two logos. One colorful, vertical logo and one black silhouette of the ship. See below:
We originally decided to go with the colorful, vertical logo for the site logo as our users liked this logo better. However, the shape of the header area became very awkward because of the vertical logo. I started playing around with the silhouette logo and made some different color variations for it, but we ultimately ended up using the logo I created below. This logo stands out in the header and includes pops of color in the text.
