Highlight on IA and Research in the redesign of a college website
My task was to redesign the tasks of finding application and scholarship information for the website of Syracuse University’s Newhouse College of Public Communications. Through the lens of a User Persona, I conducted extensive research, which led to key changes to information architecture and content strategy.
The primary user, a prospective undergraduate student, had difficulty navigating the existing website to find admissions requirements, and scholarship information.
Conduct an audit of Newhouse's existing content and information architecture to discover solutions, then validate changes with users.
- Comparative User Flows
- Site Mapping
- Content Inventory/audit
- Comparative Content Blocking
- Card Sort
Comparative USer flows
Research began with assessing of the current state of the Newhouse school website by comparing specific user flows relevant to the user's needs to the same flows on competing university websites. This allowed me to establish bearings for the site’s overall ease of use based on common industry standards and practices, as well as gather ideas for improving the site based on existing models.
I created a site map to gain an understanding of the site’s current IA, and reveal where things could possibly be rearranged. I highlighted in blue all places that might be of interest to a prospective student. As you can see, they are scattered all over the site. Furthermore, the two main tasks for my persona terminated in pages outside the Newhouse site (boxes highlighted in pink).
The purpose of the inventory was to identify places where content could be rewritten, moved, made more consistent, deleted, or otherwise streamlined. I noticed several instances of duplicate, extraneous, and/or misleading content. The inventory was specially revealing of places where similar content could have been contained on single pages.
Comparative COntent Blocking
Seeing how other sites display contented helped define areas where content could be streamlined, rearranged, or made more prominent. Newhouse generally had more types of content deeper into task flows, where other sites tended to remove potentially distracting elements on pages containing more specific detail. I found the most helpful convention to be the large but comprehensive blocks of text on a final page of most competitors’ flows. It was clearly better to have to scroll through lots of texts (especially if it’s well-formatted), than to click through several different pages to find relevant content.
In my card sort I asked participants to separate navigation elements from the Newhouse page into predetermined categories, then further rank those elements by order of importance. Over the course of two days I was able to conduct eight card sorts with eight different participants, altering my methology only once.
Each user incorrectly categorized the majority of the navigation links given to them, and threw out more than half. Another common complaint from participants was that they couldn’t find the navigation words they thought they might need. This told me:
- Navigation links could be better labeled
- Many of the links in the site’s top two levels of navigation can be moved to less prominent places
- Key sections of the site should be highlighted by moving them up to higher navigation
Combining key findings from my research, I jumped right into iterating my first wireframe mockup. Some things I attempted to address in this first iteration were:
- Reducing and relocating unnecessary content
- Streamlining navigation
- Keeping key information in one place, up front
A redesign of the Newhouse website would cater primarily to the needs of prospective students. Distracting content would be contained allowing the user to quickly identify relevant navigation and start moving through his task. Task flows would be shortened to better reflect industry best practices, and all important information would exist on the Newhouse website itself.
Having created my first wireframe of the site, I input the mockup into the clickable prototype app, InVision. I tested four different users with a scripted test in which I asked them to complete two tasks.
I created screen recordings of participants as they navigated the prototype, and asked them to speak aloud their thoughts, feelings, confusions, and questions.
I wrote down all user comments and observed hesitations and mistakes in their browsing, then created post it notes for each pain point. Using these pain points, I was able to identify several key insights that lead to changes in my next iterations.
- Grouping related content in nearby pages isn’t enough. One page is even better.
- People depend on conventions. Sticking to basics like clear navigation, well-placed calls to action, and prominent reminders of important information, helps.
- Big blocks of content can be scary. Formatting chunks and hiding some things makes it possible to keep it all in one place.
For my second prototype iteration, I addressed pain points from the first round of testing. I eliminated some navigation elements and rearranged others. I also reformatted the scholarship interactive element, reducing some categories such as Needs Based Scholarships (moving it to the “Financial Aid” page), redesigning the scholarship list to appear less daunting, and adding the option to apply directly to specific scholarships. This made the scholarships list both more beautiful and more functional.
In addition, I highlighted important dates and deadlines, moving them to more prominent places on the screen, eliminated confusing calls to action and moving other ones around, and deleted the Spotlight element entirely.
My prototypes solved some of the difficutlies my persona would have in completing his tasks. Some things my redesign achieved:
- Eliminated several levels of extra navigation
- Made important content more visible
- Consolidated information into better content formats
- Better labelling and navigation