Project 3: Columbia Journalism School Website
TASK
Redesign the Columbia Journalism School Website.
Time frame: 2 weeks
RESEARCH METHODS
Content Inventory
User Interviews
Personas, Identifying Main Persona
Task Analysis
Heuristic Analysis (Based on Nielsen Norman Usability Heuristics)
User Testing (both current site and redesign tests)
Card Sorting (open and closed)
Competitor Analysis
Content Inventory
I made a content inventory to gain an overall understanding of the website, and to look for R.O.T. (redundant, outdated, trivial).
User Interviews
I interviewed 2 former Columbia Journalism school students, a Columbia J-school administrator, and an NYU J-school student. I wanted to understand the needs of journalism students, and how/how often different users (prospective students, current students, alums, faculty, alumni) engage with the website.
Primary Persona
Ideally, my redesigned site would work for everybody, but I decided to focus on the Prospective Student. Prospective students need the most information in the shortest amount of time, and have the least familiarity with the website.
Task Analysis/Primary Need
The primary need for a prospective student is to: Research which program to apply to, and then apply.
Task Analysis: Research available programs > Choose a program > Check application requirements/deadlines > See financial aid/tuition > Apply
Heuristic Analysis
Next I conducted a heuristic analysis of the current site, based on Nielsen Norman Usability Heuristics. The heuristic analysis was quite lengthy, so I’ll just provide a few of the slides here:
User Testing:
I had users test the current site, by asking them to accomplish basic tasks that a prospective student would have to do. The following quote best sums up the testing:
“What I would expect from a site like this… would be a consistent hierarchy and structure. If I were going to go down a path to learn about one degree program, that I would be able to do the exact same thing for a different degree program. But this site was structured so inconsistently that there was no way I could go from one program structure to the other. It was totally illogical.”
After all this research, I came to some conclusions about the current site:
Research Conclusion
-Overall the site is usable, but extremely cluttered and inconsistent.
-Apply Sidebar feature was not noticed.
-There are too many unnecessary pages.
-Users can find the information they need, but the experience is not enjoyable.
THE REDESIGN
REDUCE menu options.
REORGANIZE features into more efficient groupings.
Use a less cluttered LAYOUT.
Redesign Methods
Card Sorting
Competitor Analysis
Site Map
Wireframing/Prototyping/Iterating
Card Sorting
Used Xsort program (I recommend) to narrow down Navigation Categories. I reduced the amount of main navigation options from 18 down to 11, and removed Calls To Action (Sign Up, Apply, Donate) from the main page. Users were not interested in these Calls to Action (for example, it didn’t make sense to Apply directly from the main page before you had researched the programs and financial aid.).
Site Map
Using the Card Sort results, I created detailed site map of how the new site should be organized. I think the new layout creates improved organization and usability, without losing any information or features.
Competitor Analysis
Noticed better use of Sidebar navigation on other college websites, and borrowed those features in my re-design.
Designs & Iterations
New Site
It would have been a full time job to build out the entire site, so instead I built out the flow for a prospective student who needs to research a program, and then apply.
I feel my current navigation and layout is cleaner than the original website, although I will need to incorporate more images and pictures in order to make it more stimulating to the eye.
Video of user using prototype:
You can see the prototype here, built with Axure: kzcid6.axshare.com/#p=home (Password: Salsa1234)
And as an extra project, I used HTML, CSS, and Jquery to build a coded version prototype, here:
I’d like to note that I did plan out the basic Information Architecture for the full site, which you can observe in the Site Map I made, but these pages are not built out in the prototype.