NSF I-Corps Hub: Great Lakes Region Site Need Assessment & Usability Testing

NSF I-Corps Hub: Great Lakes Region is a node of the National Science Foundation’s Innovation Corps (I-Corps) program. The node’s website was relaunched at the beginning of 2022 and the organization in charge of the website sought assistance in evaluating and improving the website. As a UX researcher in the student team, I help the client find out users' needs and identify usability issues through interviews, surveys, usability tests, etc. and provide recommendations.

icorps project overview image

Duration

Jan – Apr 2022

My Role

UX Researcher

People

Chia-Ying Hsieh
Daiwei Zhang
Jiaxuan Zhang
Qingyan Li

screenshot of about page
NSF I-Corps Hub: Great Lakes Region is a node of the National Science Foundation’s Innovation Corps (I-Corps) program. The program aims to help researchers transfer their research and innovation ideas into implementation, and equip them with knowledge in business fields.

Goal

The goals of the website are to
(1) increase the awareness of the I-Corp programs (2) Attract people to participate in the programs

NSF I-Corps Hub: the Great Lake Region aims to

Gain a deeper understanding of the target audience

Exploratory Research

Acquire insight into the user experience of the relaunched website and improve it

Design Validation

Research Methods

Exploratory Research

Design Validation

Understand the product

  • Stakeholder Interview
  • Interaction Map
  • What is the product for?
  • How the product works?

Need Assessment

  • User Interview
  • Comparative Analysis
  • Survey
  • What do users need?
  • What are their goals?

Usability Evaluation

  • Heuristic Evaluation
  • Usability Testing
  • Can users quickly understand the mission and functions of the website?
  • Does the product meet users’ needs?

Research Process

Interaction Map

Walk through the website to understand the site structure and interactions.
Use different colors to indicate different user tasks (e.g. explore different programs, register an event)

interaction map

Interview

Participants

Research Questions & Answers

Persona

Based on the interviews, we made persona of each type of website users.
(1) Novice User (2) Former Participants / User (3) I-Corps Affiliate

Comparative Analysis

For the comparative analysis, we discussed and selected six potential competitors based on Newman’s taxonomy (Direct Competitors, Indirect Competitors, Partial Competitors, and Parallel Competitors).

Referring features of competitors' website, we gave out recommendations such as adding photos and making the program/event list organized, setting FAQ page would help users avoid confusion, more information
can be added to the get involved page, ans so on.

comparative analysis

Survey

The survey is for understand users’ motivation and behaviors towards the website.

Participants

Research Questions & Answers

(1) What kind of researchers are more likely to attend I-Corps programs?
➡️  People lean toward industry rather than academia
The table of people lean toward academia versus industry
(2) How would the I-Corps programs website help researchers with their needs?
➡️  List detailed and holistic info about the program.
➡️  The most important things are program overview and outcome
The chart of importance of program information
(3) How would researchers with STEM professionals like to utilize this website?
➡️  Seldom visit the website
➡️  Visit when searching programs/want to learn about I-Corps
The chart of frequency of visiting the website

Heuristic Evaluation

In order to identify usability issues within the website interface, we conducted heuristic evaluation based on 10 different heuristics principles from Nielsen Norman.

Here are some principles with major problems.

Visibility of System Status

  • The site won't give warn messages when the current page doesn't work well.
  • The indicator (breadcrumb trail) of the current page is not very clear.
error in blog page

Consistency and standards

two buttons with different texts link to the same page

User control and freedom

problems of searching feature

Error Prevention

Usability Testing

Participants

  • 5 novice users
  • User1: laptop / Edge
  • User2: laptop / Chrome
  • User3: laptop / Safari
  • User4: phone / Safari
  • User5: phone / Chrome

Process

  • Pre-test questionnaire
    (get to know users' technology background)
  • 4 tasks
    (use think-aloud protocol with follow-up questions)
  • Post-test questionnaire
    (collect feedback on the satisfaction level of users' interaction with the website)

User Tasks

Goals of the website
Users' need
Usbility Testing Tasks
User Performance
Increase the awareness of the I-Corp programs
Look for program to bridge the gap between academia and industry
1. Find the information about what I-Corps is and what I-Corps offers.
😀
See detailed Information of programs
2. Find information of Summer 2022 Sustainability Jumpstart Regional
🧐😀
Attract people to participate in the programs
Join program to bridge the gap between academia and industry
3. Apply to the Summer 2022Sustainability Jumpstart Regional I-Corps Course Program.
🧐😀
See detailed Information of programs
4. Find examples of what previous participants did.
🤔❓

All participants complete all tasks and complete each task within 3 mins. Most participants completed the first 3 tasks smoothly and said the navigation is easy to understand. However, participants spent twice the time on average on task 4 in comparison to the first two tasks. The followings illustrate the reasons why people have difficulties finding the assigned page and other problems bothering users while browsing the websites.

Findings

Unclear hierarchy on the menu bar cause confusions.

The indentation is not intuitive. One participant said that she didn't notice "success story" (level2) under "about" (level1) and thought "success story" look like another level1 item because it follows by other level1 items.

menu
menu hierarchy problem
menu hierarchy problem
Word choices cause confusions.

"Programs" under "About" Tab and "Event" Tab serve similar functions. If users want to attend "programs", they have to go to "events" page. It's like programs are composed of events but the relationship between the two terms is not clear for novice users.

Moreover, some participants thought they can find previous cases in "blog" or "resources" while they were actually in "success stories".

problem page vs events page
Some paragraphs are text-heavy and makes users lose interest.
There are some random bugs in the layout.
Drop-down menus on the program application form are redundant and too long.

Key Findings & Recommendations

After completing research, it's time to review the questions remaining to be answered at first
(see the blue texts below).

Exploratory Research

Design Validation

Understand the product

  • Stakeholder Interview
  • Interaction Map
  • What is the product for?
    > Increase awareness of I-Corps
    > Attract people to join
  • How the product works?

Need Assessment

  • User Interview
  • Comparative Analysis
  • Survey
  • What are their goals?
    > Turn knowledge to implementation
    > Bridge the gap between academia and industry
  • What do users need?
    > See holistic and detailed information of programs
    > Know if the programs are beneficial for them

Usability Evaluation

  • Heuristic Evaluation
  • Usability Testing
  • Can users quickly understand the mission and functions of the website?
    > Users can easily understand what are I-Corps programs
  • Does the product meet users’ needs?
    > Overall, Yes. But...
    > Some inconsistencies make confusion
    > Some minor issues such as heavy texts/long lists…

As the bottom right (light blue) grid showing, While the website help users understand what are I-Corps programs well, there are some minor usability issues negatively influence user experiences.

The followings are some key findings and the corresponding recommendations. (We provided findings and recommendations in each research, and here are just some main ones for a recap.)

Insufficient information of program page

From our research, we found that When searching for the programs, users are looking for detailed information. Here’s a ranking of the main content that users are looking for. Participants value the learning experience and the outcomes. While the basic info such as contacts is their least concern.

ranking  of importance about program information
Recommendation: The program website can highlight the requirements for participants and how the program helps participants achieve their goals.

Navigation bar content inconsistent

The result of usability tests show that there could be some improvement in the navigation bar. First, all of the participants were confused about the “Event” tab on the menu and the “Programs” tab under the “About” drop down since they eventually go to the same destination. When participants attempted to find success stories from the previous users, they tend to go to the “Blog” and “Resources” tab. They told us that they intuitively thought the blogs should contain all stories.

navbar
Recommendation: Combine “Programs” and “Events”. Combine “Success Stories” and “Blog”.

The client accept the recommendation of combing “Success Stories” and “Blog”. Now they replace "Success Stories" page with FAQs and put the stories in "Blog"

new navbarsuccess stories page is combined into blog page

Error prevention and efficiency issues in the program application form

Page Refreshing

  • When refreshing the page, all the information they filled in will be gone.
  • No alert to remind users what will happen when they click the refresh button.
  • The input field lack spelling checks

Drop-down menu of program name

  • Users tend to click it and hesitate for a while to find that it has been set since they click the apply button from a program page, so choosing program name is actually a redundant step.
  • The list of universities is too long and thus make mobile users keep swiping to find a certain school
problems in the application form
Recommendation: Remove the program selection menu in application form. Add auto-saving and error-checking. Enable typing search of drop-down menus on the mobile site.

The client accept the recommendation of remove the program selection menu. Now it is unclickable.

unclickable drop-down menu of project name

Shortcoming and Next Steps

More projects

Worldiff screens

Worldiff

App Design

#UX Design #Mobile App #Online forum

Prototype a social-media-like app for new foreign residents to share their cultural-related experiences as posts, aiming to help foreigners to understand the local culture.

thumbnail

Braid

Web UX Design and Implementation

#UX Design #Website

Designed features/UIs for a new social media website and improve mobile responsiveness

Back to Home