Website Redesign Process Posted on August 19th, 2015 by

The Process

Roughly ten months ago, we outlined a process to redesign the website and presented it to the administration, and later, to the community. We broke this process down into four distinct phases.

  • Phase 1: Feedback and Idea Generation
  • Phase 2: Organization and Research
  • Phase 3: Design and Refinement
  • Phase 4: Development and Production

Phase 1

In the first phase, we spoke to members of the community and solicited feedback. Feedback was often delivered in-person during informational sessions, or via email afterwards. We met with individuals, classes, offices, and used every opportunity to gather information. We also created an online form where feedback could be submitted anonymously.

Since prospective students were quickly identified as our most important audience, we—with the help of the Admission office—created a survey specifically for this group. We heard from more than 160 respondents, and with a little faculty and student help, we started to make sense of the data.

What We Learned

We quickly discovered that search results were important to the community and to prospective students. The quality of our results depend largely on better content management (an issue we will continue to address in the future), but we saw potential areas for improvement through the use of design.

Despite the impassioned feedback about search, more people—including our all-important prospective student audience—prefer to browse for information. So information architecture and an intuitive navigation schema continue to be crucial. The ratio of searchers to browsers shifts dramatically on mobile devices where the majority rely on search. This also leads to another very important topic, the dramatic growth of mobile.

Mobile traffic to the Gustavus website increased 42% last year. Of those prospective students we surveyed, half said they visited College/University websites on mobile devices “occasionally” or “frequently.” While our old website had reasonably usable mobile styling, it came as an afterthought. We felt this process should focus much more intentionally on mobile and tablet design.

Phase 2

In this phase, we organized the feedback obtained from the previous phase and used it to set some guiding priciples (user-centered, mobile-friendly, visually simplified, logically organized, intuitively designed) and final objectives. We also spent a considerable amount of time analyzing other College/University websites—more than 500—and researching design trends. Our ultimate goals included:

  • Focus on mobile/tablet design
    • Increase the use of white space between elements
    • Decrease the “link clutter” on the homepage
    • Create a fully responsive (content/layout adapts to any size device) template
    • Increase text size and make buttons easily clickable on touchscreens
    • Make the search box more prominent on mobile devices
    • Improve mobile navigation
  • Increase the overall maximum width of the content area
  • Make banner images a useful focal point
  • Improve the search interface and the search results layout
  • Add a utility bar for easy access to search and frequently used links anywhere on the page
  • Make social media activity more visible on the homepage
  • Create a more contemporary look and feel

Phase 3

We worked closely with the Marketing and Communication office to produce several mockups that were later shared with various individuals and groups for further refinement. Some of our ideas proved unfeasible in initial tests, but we ultimately settled on a design that reflects our goals and gives us a stable platform for future development.

Phase 4

We’ve scrapped nearly everything—styling and code that has been hanging around for the better part of a decade. This means a lot more work now, but going forward, we’ll have the opportunity to bring more consistency to our web applications. Any good website is a work-in-progress, and ours will continue to see incremental changes long after the new design is launched. If you experience a problem or see an area in need of improvement, please don’t hesitate to contact us about it.

What’s Next

We’ll be sharing a preview of the new website in the next couple of weeks, and launching the new site before the academic year begins. We appreciate all of the feedback we’ve received during this process and we hope you’ll continue to send your thoughts our way.

 

Comments are closed.