UX Redesign of University website (SUTD ESD)
University websites are crucial to a university’s business.
It is usually the first thing a prospective student sees when looking for a university, and it is the main site a current student uses throughout their course of study.
To say the least, it gives a bad impression of the university if users have trouble finding information on it, or are distracted by useless information.
0. Website Chosen
I decide to take a closer look at the SUTD ESD website to see if there are things they can improve on.
1. Review University Site
First, a few things pop out:
- It has a very different colour and design from the main SUTD page, which may be confusing to users navigating from the main SUTD page
- It has horizontal dropdown menus on its site, which disappear if you accidentally move away from it, making it difficult to click on the link you want.
- It has too much text that doesn’t break down information in small chunks, making it difficult to understand.
- Broken links, especially on the “Apply Now” button under the undergraduates page
- Courses, a vital link, are accessible from the home page, but difficult to find and in the footer of the page, requiring a scroll down to see.
2. Identify Target Users
Three target users crucial the to university business was defined, along with their needs and pain points, as well as how and when they visit the university site.
3. Competitive Comparision
Next, I took a look at three of its competitors’ websites, and tried to find out how well they fulfilled these needs and goals.
I came up with a rating system for the features — 5 is extremely easy to find and use, and 0 is impossible.
The SUTD site got 51 points in total. It was useful, but compared to the rest, it was still lagging behind.
4. Refining Sitemap (Information Architecture)
Based on the analysis, I came up with a possible site map, and tested my assumptions by doing card sorting with 8 users who fit the 3 personas.
Card sorting is a process where target users themselves categorise content into different headings, so we can get an insight to how they would like to arrange information on a website.
I went down to the SUTD school to look for current students, as well as relied on my own personal contacts to find prospective students.
I learnt that users preferred to keep some information in their student login page, and some on the main university site, instead of the faculty site.
So I edited my site map:
5. Wireframing
Based on the sitemap, I came up with a prototype in Axure, and conducted a usability test with 3 users who fit the prospective student persona.
Their feedback informed my final prototype, and resulted in some modifications to my sitemap.
6. Final Prototype
Link to prototype:http://4sr0om.axshare.com/masters2.html
First, in the About Us page, I made sure the main selling points of the university was clear and obvious, in short points.
Next, on the Undergraduates page, I re-arranged the information about the courses so that it is easily understandable at one glance.
Both of these sites have the same information, but the tracks and possible career options are much more visible in my prototype.
Users also do not have to open up new tabs to view more information about the focus tracks — all the information is kept on one page.
I also condensed information from 9 different pages into the about us page — in the original site, there were 6 webpages for people, and separate links for location, contact, and about us.
This reduces the number of webpages a user has to visit to find the information they are looking for.
For Master Students, as most of them highlighted that part-time courses, skills learnt, cost, and course timings are important to them, I made sure these are the first things they see on the site.
Time commitment especially is highlighted at the end of every course.
For the information that most users prefer to see on the main college page, I still provided links within the faculty page, with a brief explanation and a very obvious button.
7. Learning Points
- Usability testing is extremely important.
After the first round of testing, I found many problems with my prototype and even had to revamp the sitemap.
Information I thought wasn’t important was requested by users, and information I included was regarded as unnecessary.
2. A full prototype isn’t necessary to start user testing.
I could have started testing earlier, when there was just a navigation bar with drop down links, without even having built the other pages.
That would have saved me alot of time reworking the pages. After all, being able to find something on the navigation bar is the first step to completing each task, and if that is not validated early, all the other work to build the other pages will be wasted.
3. If you have more than one persona, it is vital to test with all personas.
During the card sorting, each persona placed their needs as the top priority, and arranged the headings accordingly.
It will be impossible to satisfy all of their priorities because they conflict — current students requested for courses to be the main highlight on the homepage, but prospective students want to see the university awards and news.
The final decision has to be made by analysing the company’s business and which persona’s needs have to be prioritised for the business to work.
