VApedia UX — Cut off the 5 clicks

A small winter-break project with Thao Tran.

I first knew about VietAbroader in 11th grade, when I participated in VietAbroader Study Abroad Conference. Now, whenever people ask me about studying abroad, I usually give them a link to VApedia. VApedia is a website where VietAbroader shares information and insights about applying to U.S. highschool, community college and university.

Recently, VApedia changed its website’s appearance to a more friendly-looking, but not really user-friendly one. Therefore, we want to find out problems of users using VApedia to suggest solutions.

Objectives

Figure out how users use website vapedia.vietabroader.org

VApedia homepage

Test Parameters

What: VApedia website, focus on University*

Who: Students who start to find information for studying abroad in the US

Where: Skype with screen and voice recording

Test Tasks

Task 1: Find information about Common Application

Task 2: Find information about University of Cincinnati

Task 3: Find how to send transcript to university abroad

Key Issues

Issue 1: Users need to click and hoover many times to find an article they need

Students have so many worries when it comes to preparing for studying abroad. They will probably get more stressed out when searching information on such an unfriendly website.

I have to hoover over those images to know what’s in there. Why they didn’t put labels right away?
I’m so confused!

On VApedia homepage, users need to hoover over each image to see the page destination.

Issue 2: Don’t understand or misunderstand meaning of the main navigation

When interviewees found information about Common Application, they normally clicked to “Thủ tục cần chuẩn bị" (What documents to prepare). This page right now only includes information for applying F-1 Visa.

“Thủ tục cần chuẩn bị” (What documents to prepare) page

Moreover, when interviewees wanted to find information about University of Cincinnati, they clicked to “Hệ thống trường" (School system). This page right now is for introducing definitions of US school system in general, National University and Liberal Arts College.

“Hệ thống trường” (School system) page

Meanwhile, some interviewees didn’t understand or misunderstood the meaning of “School Insiders”. This “School Insider” page is where VietAbroader stores articles about each university, written by Vietnamese students who are studying there.

What does “school insiders” mean?
I thought it only includes articles about Vietnamese students who study there.
Where users can find School Insiders page on Main Navigation

Issue 3: Users don’t know how to search for an university in School Insiders page

Link: http://vapedia.vietabroader.org/category/dai-hoc/school-insiders-ht-truong/

VietAbroader wants users to click on the first article “Danh sách các trường Đại học trong mục School Insiders" (List of all universities in School Insiders) to find the list which links to each university.

First article leads to a list of all universities in the system

However, interviewees thought that this list only contains universities’ names but doesn’t link to articles. And because the first article has the same format as others’, some users didn’t recognise it.

When users finally clicked to the first article, they look to category list on the right with a hope to find the list of all universities. This category list only includes all pages of this website.

Users look to the right category list to find school names

Solutions

Internet users want to find information as fast as possible. Thus, a simple website is more convenient for them and more attractive for them to stay longer.

Solution 1: Determine user’s need on VApedia first page

Right now, VApedia focuses on 3 topics: US High School, Community College, University. However, based on our solution, users will choose which topic they want to know more about. Since VApedia website can save user’s preference with cookies, whenever they come back to VApedia, they will come right into their topic’s main page. It will help users to save a lot of time searching for information they need.

Choose which information they need: High School, Community College or University on first page

Solution 2: Put articles out right away

After users choose their preference, they will be led to their homepage. In this case, a person who wants to apply for US universities.

Users can change their preference later by clicking on the top-left-corner arrow.

Topic’s main page after users choose their preference

Because users want to see information right away, this homepage includes featured articles from all categories. We don’t want to use infinite scrolling in this case because users can feel overwhelmed with too much information.

Furthermore, when users click to “Chuẩn bị hồ sơ du học" page (What to prepare), they will be led to articles of sub-categories: “Giấy tờ cần nộp" (Essentials documents), Common Application, and “Bài luận" (Essays). Users then easily know where to click to find desired information without clicking or scrolling too much.

Solution 3: “School Insiders” page — Find schools faster

With many problems mentioned above, “School Insiders” page containing stories by alumni and current students of colleges should be redesigned carefully based on how users actually like to use it.

On the right, there will be a list of all available universities and colleges. Users only need to type in search box a school name or scroll down to see more schools.

Once clicking on each college, the information will be displayed instantly on the left without loading a new page.

If a college is not available yet, a user can register to write about his/her school (“Viết về trường của bạn” button) or submit a request for information of that college (“Không thấy trường của bạn?” button)

Other problems

If one wants to search, he/she has to type the exact word. For example: if you want want to find information about Common Application, you cannot search with keyword “common app”.

Solution: Web developer can design a better search engine

It is very difficult to go through a long list of items in drop-down menu. Also, a user cannot move the mouse freely.

Solution: Try to avoid unnecessary drop-down menu

VApedia drop-down menu

When people want to read an article, they have to click exactly on the title or “Read more” button.

Solution: May incorporate a featured image for each article so users can click on the image and easily navigate to that article.

You cannot click the excerpt, you have to click exactly on the title to visit an article

VApedia branding

When being asked “When visiting the homepage, do you feel the brand reliable?”, everyone said no.

It looks like cartoon, I thought it is just cartoon without any significant text.
It is drawn by hands and looks very friendly but doesn’t make me feel reliable.
The logo is a bit blurry.
I like the previous logo.

A website that publishes content must gain trust from readers. A website with a simple design, using few colors and a professional look will give users a greater sense of reliability compared to overly-complicated websites.

VietAbroader main page
One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.