Blog, Portfolio, Slider•
on April 22nd, 2011•
University:
Northeastern University, Bouvé College of Health Sciences
Website Link:
http://www.northeastern.edu/bouve/
Date Launched:
Redesign – Thursday, April 21, 2011
Original Design – October 1, 2010
Design / Development Notes:
HTML, CSS, PHP, Javascript, JQuery, Cascade Content Management System
Website Notes:
This is the biggest project that I have worked on. It was a two-part project. The first part was a complete site restructure where a new sitemap was generated to create a better user experience navigating through the website. Here, the expertise of Josh Willis was used to create a structure where every Department and School program could be reached from the home page of the website. Before this, only 3 departments were accessible from the Bouve home page.
The second part was the design. I tried to focus on a simple design template that could be used for each page of the website. There are a number of different content formats that needed to fit within the main content area of each page. One example of this is the faculty pages. For these pages, I worked with Craig Cocca of Threemagination who created the entire faculty database and code to allow for a dynamic, image-centric solution within the Cascade Content Management System. This was a very enjoyable project as design, development, and website architecture were all required to create a user-friendly solution.
Update
In April 2011, the redesigned version of the Bouvé College of Health Sciences website was launched. We made updates to the Home Page and to the Main Navigation. I worked closely with Bouvé staff and an outside consultant on the project. The home page used to contain Flash elements that did not work on mobile Apple products. The new slideshow on the home page is JavaScript-based and works on mobile devices. The menu also has a lighter feel. I used JQuery to soften the approach and have the menu roll out instead of drop immediately. I also changed it from dark grey and red to a transparent white background, providing a lighter feel for the website.
Blog•
on October 4th, 2010•
Over this past weekend, my biggest project to date was launched at the campus of Northeastern University. I just completed the website overhaul of the Bouvé College of Health Sciences website. Bouvé is part of Northeastern University in Boston, MA.
This was a very challenging project as the biggest part was in restructuring the site architecture. The previous website structure caused confusion as there were numerous paths to the same information. My goal was to make navigation easy and have all information accessible by as few clicks as possible.
The first part of this project included a trip to Boston to meet 30+ Bouvé faculty members to hear what they wanted in a new website redesign. That was a very interesting process as there were a number of different college departments represented.
The next step was figuring out the best structure for the new website based upon what I learned in the faculty meeting. For this part, I worked with Josh Willis, a website architect in the Atlanta area. He recommended a very simple structure in which each department was represented on the home page, so that each department, and the programs within each department could be easily accessed from every page within the website.
Once the website structure was chosen, I started work on the design. The structure largely dictated many aspects of the design. I also had to fit the design within the Northeastern requirements.
I created two main templates. One template was for the home page. The other template was for the inner pages.
A key part of my design was the top navigation and the left navigation. The top navigation is the same on each page and allows the user to access each department and program from any page in the website.
The left navigation menu changes depending on which department or main area you are in. For instance, if you click on the School of Nursing, the left-side navigation will refer to all areas within the School of Nursing. This allows the user to determine a path in the website and have easy access to dig in deeper using the left menu. The top navigation allows the user to navigate out of that area if they have accessed an area they didn’t mean to pursue.
Another aspect of this design was to upgrade the Video page. Bouvé currently has a number of videos highlighting their college. I created a page where all video thumbnails from YouTube are shown. If any of the thumbnails are clicked, a pop-up appears allowing the user to watch that video within the Bouvé website. Darren Beckett of Threemagination assisted in this video area.
A final component of this website was the addition of a robust faculty directory. This faculty directory consists of images of each faculty member, the ability to search by letter, and the ability to type in a search term to find a faculty member. The faculty & staff of Bouvé also have the ability to add/edit information to this faculty directory. Once they add or edit information, it automatically shows up on the front end of the website. This faculty area was created by Craig Cocca of Threemagination.
I really hope to work on more projects like this one. I enjoyed the challenge of the site restructure, the design work, and the implementation of my design with the Cascade Content Management System.
Recent Comments