This week we launched a redesigned Office of Student Financial Aid website. The previous (left) and new site (right) are pictured above.
Not only was the website due for a redesign but it also marks the end of a milestone for the work that we produce. This site will be the last non-responsive major department website that was in our pipeline. From here on out we will be designing and implementing for mobile first and responsive.
Like most of our redesigns the push came from the overgrowth of the original scope of the navigation. Users can deal with “old” looking visuals, but as soon as the website is hard to find crucial information, it’s time for an overhaul. Our first task was to reign in the thirteen item main menu to just six. This helped the visitor scan and find a direction quickly.
We then took to overhauling the architecture of the information on the homepage. The previous website had information where it didn’t belong. New programs, deadlines and priorities cluttered the previous homepage. We set out to compartmentalize information in easy to scan columns that could expand if needed in the future.
The structure of the page content was not the worst we have seen, but there were a lot of areas that needed improvement. For example, the new information chunking on the homepage gave us the ability to visually separate different information and allow for areas to grow in the future. For example the promotion buttons below the menu can expand or contract depending on the time of the year. The main image can be clickable if needed and each column can have more or less resources as needed.
On the child pages we highlighted the selected menu area to make it stand out. Since we only have six main menu items, the secondary menu list is a little larger than normal. We didn’t want to remove the other main menu items so we could keep the context but at the same time we didn’t want the local menu items to get lost. We also added a “Related Links” right side menu to each page. This allows the Financial Aid department to pull specific resources to the top even if they are linked from the content area.
View the new Office of Student Financial Aid website at http://finaid.wayne.edu/