Responsive Redesign (2016)

Co-led project to redesign CSIO.com in 2016 to a responsive web design. Handled information architecture, card sorting and usability testing. Also led content strategy and communications for redesign launch.

Axure wireframehttp://h8epy4.axshare.com/
Problem/Challenge: the CSIO.com website lacked a responsive design, which would give it a more modern feel and allow us to stop having to maintain a separate mobile website. Some members had indicated in a survey that they thought the website navigation could be more intuitive, and they found the page loading times to sometimes be too slow. These were used as success metrics in defining the project (improve navigation and page loading speed).
Solution/Train of thought: in keeping with the redesign's modernized look and feel, I chose to use a mega menu to display the site navigation in a clearer and more usable way than regular drop-down menus afford. Based on card sort data, I revised menu item labels and reclassified pages to allow for more intuitive navigation. Secondary navigation displayed on the right-side of internal pages allows users to recognize exactly where they are in the website on any given page. Disparate content pages were unified together under a single CSIO Blog. The CSIO Video Library was also redesigned to have clearer navigation and more findable videos.
Process: as personas had already been developed for the 2012 redesign of this website, I already had a strong idea of user goals and needs. To kickoff the project, I facilitated a meeting/workshop with the entire CSIO team to brainstorm and gather requirements for the redesign. With the requirements document in hand, I then co-led an extensive research project to identify a web development firm to work with on the redesign, ultimately selecting a firm specializing in Drupal. I supervised the creation of an OptimalSort card sort study and email campaign, resulting in 61% sort completion rate (33/54) and used this data to improve the site information architecture (IA). I created an interactive wireframe using Axure to demonstrate the mega menu idea and improved IA. Finally, I conducted usability testing with members before site launch. From the testing, I uncovered some minor bugs and usability issues that were fixed by developers before site launch. The team followed an Agile development process on this project, consisting of short, goal-specific iterations to meet user stories.
Results: website bounce rate lowered to < 40% few months after site launch (from ~55% bounce rate pre-launch), avg. page loading time reduced to ~2 seconds, positive feedback from members on new website.
Testimonial: “Wow! The new website is pretty good! Nice and clean but not so different that one is at a complete loss. Good job!” - Insurance company member
Back to Top