Queens Economic Development Corp

Redesigning a resource hub for Queens' small business owners → see the final prototype
QEDC site redesign laptop mobile and tablet

Overview

The mission of the Queens Economic Development Corporation (QEDC), a non-profit, is to provide local entrepreneurs with resources and guidance to start, promote, and maintain successful small businesses. After yearlong restrictions directly impacted the community and its local businesses, QEDC’s mission matters more now than ever.

Its website, however—the main way to connect with QEDC and access its resources—was failing the organization's mission and the people it serves, and the team at QEDC knew it.

“The website is large and chaotic because we keep adding more pages," Michael Gillen, QEDC’s Director of Technology and Communications, told me. "So it's confusing and not as easily accessible and understandable as we would like. We want people to go on the site and immediately be able to learn how we can help, access our programs and resources, make an appointment with an advisor, sign up for an event, or just find whatever info they're looking for. Right now, it's not quite doing this very well."
My Role
UX designer
Information architecture
Prototyping
Testing
Platform
Desktop website
Tablet website
Mobile website
Timeline
April - May 2021
Team
Michael Gillen,
Director of Technology
QEDC site redesign before and after

The Problem

Discover the problems
Evaluative & Heuristic research
To improve the website’s organization and discoverability of these key features, I needed to understand where exactly people were getting stuck and giving up.

I defined my research goals (below) and got to work: Based on the business goals mentioned above, instead of a SWOT competitor analysis, I did a heuristic evaluation of similar sites' homepages and then conducted in-depth user interviews with usability tests with six early-stage business owners, including three existing QEDC users.
Research Goals

Evaluate the findability of the Calendar, Appointment Booking, and Video Library on the website

Learn how users expect the website content to be organized and categorized

Understand how users find what they’re looking for, and where and why users get lost on the website

Explore how similar nonprofits establish visual hierarchy of key features on the homepage
3/6 QEDC users
2/6 ESL users
6/6 target audience
Key findings:
"I want to know what they can offer me right away."
→ INSIGHT: 😬  4/6 participants mentioned that the homepage felt “overwhelming.”

"I have to scroll to understand what they do."
INSIGHT: 🤔  3/6 participants felt unclear about the services and resources QEDC provides.
"It would be great to promote that the advisor meeting is free."
INSIGHT: 😬  5/6 think that hiring a 1:1 business advisor is too expensive.

→ INSIGHT: 🙏  4/6 are looking for affordable or free expert guidance in starting their business.
"Seeing success stories from people who have been helped by the QEDC would make me excited about their programs."
→ INSIGHT: 🧐  5/6 look for testimonials to understand whether QEDC can help them.
Define the problem to solve
To put it lightly, there were...a lot of challenges that users faced on the site while trying to complete their tasks. I wanted to clearly define and identify the biggest confusions and frustrations—but also what's working—to understand what changes would be most impactful. So I mapped out my IDI findings on this affinity map.
affinity map for QEDC site redesign
One thing became clear: The biggest opportunities revolved around the need for new business owners—regardless of their first language or business savvy—to feel confident and reassured that they're in the right place for guidance and resources.
Our User mindset
But before I made any decisions about improvements and changes to the site, I got clear on who exactly I'm designing for. I developed two personas based on the insights from my IDIs. With my project objectives and goals in mind, I centered the site improvements around the older career changer who is also an ESL speaker—my primary persona. According to Michael, ESL speakers comprise a large share of the QEDC audience, but I heavily relied on both to inform my proposals for improvements.
QEDC target audience personas career changer and up-starter
Problem Statement
Local early-stage small business owners often feel unequipped with the right knowledge, connections, and resources to take the next step in entrepreneurship. Our solution should deliver a way for them to easily understand QEDC’s services and access available resources.

How might we redesign the homepage and navigation of queensny.org to help people easily discover and take advantage of QEDC’s resources?

The Redesign

Information Architecture: Auditing the sitemap
One insight that stuck out to me from the usability testing: I observed that nearly all participants started at the top navigation to find what they were looking for.

So a major piece of making the site easier to use and improving the findability of key features was ensuring that the information architecture is set up in a way that is intuitive and straightforward. The current navigation went as deep as four or five levels, making it difficult for anyone—much less someone who speaks English as a second language—to find what they're looking for. In fact, one out of two ESL speakers I interviewed during usability testing could not find the video library.

I created an affinity map to re-organize the pages based on user needs from my research and edited the sitemap so that the navigation only included the major pages. I then conducted a card sort study to validate my first pass (the post-its below) and realized I still had work to do to. I ended up doing several iterations of the sitemap until the card sort results aligned with my navigation re-work.
post-its card sorting exercise
I proposed the following changes to the site's IA:
1. Re-organized where certain pages live and are linked
To be more natural and intuitive
2. Edited the global top navigation for page and resource findability
And streamlining it so that top nav doesn’t go more than two levels deep
3. Added a global footer with direct, visible links
To key pages that may be hidden on the top nav
4. Re-named key labels/pages
For clarity or specificity
Then, to redesign the homepage's content hierarchy and modernize the UI, I proposed using from Elementor, a free drag-and-drop website builder for WordPress, for two reasons: 1). ease of implementing a redesign, and 2). automatic responsiveness across devices. Click to enlarge the below first drafts!
QEDC redesign drafts
After several iterations, I landed on the proposed responsive design with a modernized logo while keeping the QEDC's visual brand identity and typography styles (click on the right-side arrows to see tablet and mobile).

Testing the improvements

After receiving stakeholder alignment on my proposed adjustments and hi-fidelity homepage redesign, I conducted two rounds of user testing via Maze to validate the site improvements:

First, a tree test to evaluate the findability of features on the homepage to determine any flaws in the updated information architecture.

Second, a task-based usability test to validate any revisions needed following the tree test, and to gather behavioral and attitudinal information to measure the success of the homepage redesign.
Tree Test

Where would you go to find upcoming webinars to attend?
If you want to speak with a business advisor, where would you look?
If you were looking for the video recording of a past webinar or workshop, where would you go?
Where would you go to find information about the industries in Queens?
If you want to reopen your business this summer, where would you go to find helpful information?

The Results

An unexpected finding
In the first round of user testing at the beginning of the project, users successfully located the video library under 'Resources,' In this tree test, I was able to test my assumption that changing "Resources" to "Learn" would yield equally successful results. However, only 1 in 10 users clicked on 'Learn' in the tree test to find the videos.

Additionally, out of 11 testers, 7 could not locate the resources for reopening—which is another page I had placed under a menu label called "Learn." Before the next round of usability testing, I changed this label back to "Resources."

The adjustment is reflected in the sitemap below.

QEDC redesign sitemap
Then, using the high-fidelity prototype I created using Figma, I tested the revised design with 10 total users: 3 QEDC users and 7 non-QEDC users.

Usability Tasks
Make an appointment with a business advisor on the website.
Find upcoming events to attend and sign up for the next one.
You can watch videos about starting and growing your small business on QEDC's site. How would you get to this video library?
Where would you go to find information about the industries in Queens?
If you want to reopen your business this summer, where would you go to find helpful information?
The results?
100%
Testers who successfully found upcoming events to attend on the homepage on first click.
100%
Testers who successfully made an appointment with a business advisor on the homepage on first click.
100%
Testers who successfully found an access point to the video library on the homepage on first click.
"I went very fast through the tasks.  Overall very clear and concise."

"Typically, I feel like financial websites aren't as inviting as this one, so great job on the UI!"

“Everything worked well—I had no issue completing the tasks.”
My final (tested) recommendations
The top navigation shouldn't go more than two levels deep if possible (any other page can be linked out to from a landing page) for simplicity and responsiveness across desktop and mobile.

Add a global footer for more entry points to key pages.

Video library can link out from other pages, such as the Full Events Calendar (“Missed an event? Watch the recording here!”) for more promotion.

Add a nav category called Success Stories, as most of the feedback I received from users pertained specifically to wanting to see and read testimonials.

Add a nav category called Our Borough where pages with info and data for Queens’ economy, neighborhoods, and leadership can live.

Create new nav dropdown items to group together similar pages (see Our Borough example in sitemap).

Add a Contact Us page under About Us.

Takeaways
While the real outcome is yet to be determined (the KPIs and metrics to measure success of the QEDC site redesign—which is currently still in the works—are an increase in visitors landing on the calendar, the page to book appointments with a business advisor, and the video library), this project was a great reminder of one important lesson: Redesigning a site doesn't mean that everything should or needs to change. One of the biggest updates I made to the site's global navigation was invalidated in testing and was ultimately reverted back to its original label—which is, in the end, a happy discovery!

As a four-year resident of Long Island City and a regular at the many diverse restaurants and “mom and pop” shops around the borough from LIC to Jackson Heights to Flushing, I feel particularly drawn to QEDC's mission for supporting and promoting local businesses, and I look forward to how these recommendations can help further the mission of the QEDC!

Interact with the final prototype
Back to top