Empathy vs. Design

Redesigning a government website on both mobile and desktop.

Who is the National Science Foundation?

The National Science Foundation is a federal organization that provides funding to STEM (Science, Technology, Engineering and Mathematics) individuals. You can apply as a student, teacher, researcher or as a company.

My team and I were tasked with redesigning the National Science Foundations mobile and desktop websites. When we started, our direction was very clear... but then they redesigned their site.

Project Scope:

Client: National Science Foundation

Time Constraint: 4 week sprint

Role: Project Manager

Problem: Entire remodel of desktop and mobile website

Tools/ Software used: Figma, Google Drive, Trello, Pitch, Maze, WebAIM

Desktop Prototype

Mobile Prototype

1

Empathize

2

Conceptualize

3

Design

But they redesigned it and it looks so good?!

Initially, my team and I felt so stuck. We're just students and they just spent thousands of dollars to redesign it and it looks so much better now!

When users were to go to the website initially, they would see that it looks so much better. However, when you create a website do you create it to look good or for your users?

Having a very visually appealing website may not mean your users' needs are being met so, they're still going to be pained.

1

So what are the users goals when visiting the NSF's website?

Empathize

The main goal is to apply for funding. Easy right? Well, after conducting usability testing on their current site, 5/5 users felt like there was way too much information to digest.

They weren't sure where the due dates were.
They didn't know the requirements for a specific grant.
There wasn't an apply button at the bottom or anywhere on the page??

So with that, 7 user interviews were conducted. What is it that will allow users to feel at ease while applying for funding?

"I feel like there's so many funding opportunities, I wish there was a way to save them for later, especially if I'm on the go."
"I wish the requirements were easier to find, there's so much information."
"I'm not even sure how to apply, but I don't like going to third party websites, it makes me feel like my information isn't secure."

2

There's still problems even after the redesign?! How can we help?

Conceptualize

After gathering information from user interviews and synthesizing information, it led us to a developing a User Persona.

Problem Statement:

"Alex, a graduate student, is looking for a grant to support their research, but is having a hard time finding the proper information and doesn’t want to miss out on any opportunities for funding."

How might we help?

How might we highlight funding opportunities and reduce the time a user takes to find relevant information?

How might we help the users track the status of their applications more easily?

How might we make the application process more efficient for users?

3

Design

Brainstorming Ideas...

Highlighting the insights gathered from research it was easy to tell what was needed. The takeaways were:

Bookmarking specific funding opportunities.
Making sure requirements are easy to find.
Allowing users to apply within the site.

One of the changes we first realized we need to make was changing the sites secondary navigation. To make sure users were achieving their goal, this made the most sense to my team and I.

Here are some of the gray-scale wireframes highlighting the flow on mobile.

To make sure users were easily able to view key components of a grant before applying, separating these sections were a must in order to provide clarity to users.

After sketching ideas, making up gray scale wire frames and having three hi-fi iterations, we tested and tested our redesign to make sure user needs were being met with efficiency.

Bookmark this for later!

When users are researching funding opportunities but don't always have the time to apply, they become frustrated because they have to do extra work to make sure the don't miss that opportunity.

Giving them the ability to "Bookmark" an opportunity solves that problem. They can save as many as they'd like and apply when they're ready!

5/5 users felt that the "Bookmarking" feature was intuitive and helpful!

Now you know what's required to apply!

Giving the user the freedom of knowing the requirements to succeed within the application process is a top priority. Now eligibility is listed right at the top for mobile and desktop.

5/5 users found out the "Eligibility" requirements in less than 10 seconds!

Just apply right on the website here!

When users' are looking for funding opportunities just to end up having to apply through a third party, it's not just frustrating. Users' don't feel like their information is secure anymore after leaving the government website.

So why not make users feel more secure by implementing an "Apply Now" feature within the website?

5/5 users prefer to apply for funding within the website rather than a third party!

Next Steps

The next steps I would like to take is actually an idea I had right at the beginning of this project.

You know when you look at cars online and it has an AI Chat bubble? Well, this would kind of be like that. It would have the following features:

It would have a "Five minute survey", that way users could "check" what applies for them and funding opportunities would be displayed that way. It would save time!
FAQ's, so users could have them displayed anywhere within the site, rather than having to navigate to a different page.
Contact information, either via email or by entering in your phone number to text or call at a scheduled time.
AI Chat, so users could ask basic questions to help them find what they're looking for.
Bookmark page, assuming the users have an account and this feature were to be implemented, of course.

Having this feature would be a really big time saver for users. Rather than navigating through a site to try to find what they're looking for, this would be displayed at the bottom right corner on every page!

Another insight I would like to implement would be to have an application tracking system. Either within their Portal and/or via email to update users about the stage(s) their application is at.

Take Aways

At first given the task to apply UX Design to an outdated government website seemed easy, until they redesigned it. Even so, issues were still found. The users weren't kept in mind the way they should have been. They did tackle design flaws and did allow better flow within the site.

However, time, eligibility and security are all top benchmarks for users. Our job as UX Designers is to empathize with the user and make sure their needs are being met.

Back to Home