New York Foundation for the Arts (NYFA)
NYFA has over 1 million users. To address various usability issues and promote neglected sections of the site, I revamped the design system, and redesigned over 45 pages including a responsive website and a funds management portal.
Background
NYFA is a nonprofit that serves the arts community through its grants, fiscal sponsorship, and professional development programs. It boasts the largest job board in the arts in the US, with an annual traffic of 11 million.
Since rapidly moving their operations and services online in 2020, NYFA has faced challenges, particularly being inundated with inquiries from users attempting to apply for programs or access services.
Project Overview
Through a UX audit, stakeholder meetings and user interviews, I observed the following main areas for improvement.
- The website was hard to navigate, with many inconsistent page connections.
- The information and UI were overwhelming and confusing.
- Users had trouble performing key tasks such as logging in to the right page, managing funds and applying to grants.
My goal was to prioritize designs that would create the most impact within the time constraints. Specifically, these were:
- Reduce user reliance on direct staff support by making the website easy to use.
- Promote services and products that had long been neglected.
- Modernize the aesthetics with a befitting visual identity and create an overall consistent tone of voice (one of the organization’s main goals.)
Navigation redesign
The navigation defined the high-level information architecture and was a major source of confusion, so I tackled it first.
The confusion primarily stemmed from an overwhelming number of options organized around internal structures and inconsistent interactive features, which led to many pages being overlooked by users.
I created an initial redesign draft based on my observations and then conducted combined card-sorting and tree-testing sessions with 15 participants. The results from each card-sorting round improved the design for the following round of tree testing.
The final design organizes the navigation based on what users found most intuitive. It also resolves the issue of donors mistakenly donating to the organization instead of specific projects.
Program Pages Redesign
One issue with program pages was that they are text-dense, containing both marketing content and complex application instructions. Users often needed assistance from staff when attempting to apply for a program.
Users were also unsure about which programs required applications and which did not. (In the redesigned navigation, I separated application-based programs from the rest.)
I designed a layout for all application-based programs so users could easily distinguish between different types of programs. This layout significantly reduces text and guides users' eyes to key messages.
It is consistent yet flexible enough to meet the diverse needs of over 20 programs, each with distinct elements, across three departments.
- New side link section on the left to guide users to content at the bottom and to related links such as events to increase sign-ups.
- Rewritten UX copy that's much shorter and focuses on user benefits.
- New visual timeline to help users digest important dates.
- Use of accordions to collapse text to prevent long scrolls and to help users find relevant info quickly.
“When will I know the results?” is one of the most common questions staff get asked.
Funds Management Portal Redesign
Users struggled to complete tasks such as payment and deposit requests, citing a confusing interface, unfamiliar terminology and complex process.
I designed a new dashboard where essential info and frequently performed tasks are immediately accessible upon login. For a more focused experience, I removed unnecessary elements, consolidated the menu, and added interactive features to improve usability.
- New Quick Action menu upon login for easy access to most commonly performed tasks.
- An FAQs section placed above the fold to help navigate the platform.
Help Center Redesign
The Resource Center had long been overlooked by users, despite being the third option in the navigation. It contains forms and how-to guides that were helpful for completing tasks within the app.
In addition to redesigning the page, I also renamed the page from "Resource Center" to "Help Center", based on my hypothesis that users struggling with a task would be more likely to seek help, rather than looking for resources.
Payment Request Page Redesign
Most new users had trouble completing the steps on this page to fund their projects. The information and tips didn’t seem to help.
My redesign strategically places guidance and resources—such as tooltips and downloadable forms—exactly where users need them. I also used appropriate form elements for each question type.
By starting the sentence with the key differentiating info, "International payment," users can quickly decide whether to read on or disregard it.
Reflections
There was a lot more to this project. I also designed a listings portal, three classifieds boards, an advertising info page, a sponsored project donation page, to name a few.
New Design System
To revamp the design system, the directors and I decided on a style that doesn't deviate too much from what users have come to know NYFA to be, mostly through the brand colors. I improved the aesthetics with new typefaces and modern layouts, as well as increased color contrast for better accessibility.
Challenges & Learnings
Initially, this project felt like five different projects. NYFA's five departments are functionally distinct and comprise different user groups. Due to the time constraints, it was paramount for me to identify the priority items. I needed to be flexible with my user research and testing methods. Combining user interviews, card sorting, and tree testing proved to be effective.
Looking back, I wish I had requested more time to gain a more thorough understanding of the products before creating the research plan. Some questions only emerged as I began the design process.
“New York Foundation for the Arts is an arts service organization with many moving parts. I was impressed by how quickly and thoroughly Loren got up to speed on all of NYFA's offerings, and how she streamlined information into a more cohesive and professional looking site to meet both the needs and expectations of NYFA users. She was great to work with, well organized, and made every effort to be part of the NYFA team.”