Trees New YorkCase Study
Trees New York is a NYC-based non-profit organization dedicated to urban forestry, tree planting, education, and activism. Through usability testing, potential users walked through Trees New York’s website. Based on the findings, this case study proposes three recommendations to improve its navigation structure and accessibility.
Idil Agcagul
Alice Wong
Usability Testing
UX design
Interface design
Problem
The usability testing identified several key issues, including difficulties navigating to specific pages, a desire for a more intuitive navigation structure, and accessibility challenges.
Solution
Based on the findings, three recommendations have been proposed to enhance the user experience
- Providing a search bar function near the header of the website
- Clear organization and labeling of the navigation bar
- Re-labeling educational materials
Trees New York is a non-profit organization committed to enhancing the urban environment through tree planting, education, and community engagement initiatives. At the core of its mission lies the alignment with OneNYC 2050 goals, which aim to create a more sustainable, resilient, and equitable city for all residents.
Trees New York’s website is a platform dedicated to promoting urban forestry and environmental stewardship in New York City. This interface serves as a digital hub for individuals, community groups, and policymakers to access resources, engage in educational programs, and participate in tree-planting initiatives.
Goals & Motivations
Evaluating the effectiveness of Trees NY’s website in facilitating- user engagement
- promoting donations
- access to educational resources
- driving action toward urban forestry initiatives
By identifying strengths and areas for improvement, we aim to provide actionable recommendations that align with TreesNY’s mission and contribute to its ongoing efforts to foster a greener, more sustainable urban environment.
Users & Tasks
Two participants were involved in this case study, both residing in New York. Neither of them had prior knowledge of Trees New York or was familiar with the goals and initiatives outlined in OneNYC 2050.
Two participants were involved in this case study, both residing in New York. Neither of them had prior knowledge of Trees New York or was familiar with the goals and initiatives outlined in OneNYC 2050.
They were given six tasks to simulate various interactions on Trees New York’s website that demonstrate processes such as
- event registration
- locating contact details
- setting up donations
- recalling past activities
- accessing information on tree care and pruning
Key Findings
01
Difficulty in Navigating to Specific Pages
Users had difficulty finding specific pages like educational materials due to unclear labeling and navigation cues.02
Search Bar is a Helpful Tool
The search bar proved helpful for users in locating information, showing the importance of robust search functionality.03
Accessibility Issues Impact User Experience
Low contrast and missing hover-over text hindered navigation.04
Preference for Consolidated Information
Users preferred having related information combined on fewer pages.05
Desire for a More Intuitive Navigation Structure
Users wanted a more intuitive navigation structure with clearer labels and fewer dropdown menusThe usability of Trees New York’s interface wasn’t received well by the participants. They encountered challenges while navigating through the navigation bar. The inaccessible placement of the search bar further hindered their ability to browse for information on tree care and planting. Consequently, we propose three recommendations aimed at improving user experience with website navigation and information comprehension.
01
ISSUE
Search Bar Found on the Footer
While Tree’s New York’s interface is thorough and informative, users found it an overwhelming and unorganized experience. While running through tasks, all users expressed they “kind of wished they had a search bar.”
The website’s navigation bar features eight tabs, and each tab contains drop-down menus with several more pages for users to click. With so much information on the website, it is difficult for users to browse and find the specific information they are looking for.
Tree’s New York does have a search bar, but it’s located at the footer. Because it sits near the bottom of the website, most users overlook this feature. By placing it in an unexpected spot, it can cause frustration for users.
Search Bar Located on the Header
Provide a search bar function near the top of the website. Recognizing that users expressed an interest in a search feature, the search bar can be relocated on top of the navigation bar to make it easy to find. It will provide a way for users to sort through a ton of information and find what they need faster.
02
ISSUE
Dense and Unclear Navigation Bar
While completing the tasks, unclear labels on the navigation lead participants to spend time navigating irrelevant sections of the website or resorting to trial-and-error clicking, which increases mental effort and hinders task completion. During testing, participants needed help finding basic information such as the fundraising page, previous projects, and educational material, spending significant time navigating the navigation bar without success.
Organized Navigation Bar
To address this issue, we propose restructuring the navigation bar and implementing a clear labeling guide. Organizing related content under broader categories to create an intuitive navigation structure and reduce clutter for users, we limit the number of top-level menu items. Additionally, the use of descriptive and straightforward labels that accurately convey the content within each section is implemented, avoiding ambiguous terminology, such as “Citizen Pruners,” which may confuse users.
03
Hidden Titles and Accessibility Issues
During testing, both participants resorted to navigating to the Frequently Asked Questions section in search of additional information about tree care and educational materials, only to encounter an empty page, further enhancing their frustration.
The educational materials page primarily presents photos in a grid format, with article or video titles appearing only upon user hover. The inadequate contrast between the text and the images leads to confusion for users as they try to make sense of the images
Improving Readability and Navigation in Educational Materials
Re-labeling educational materials with easily readable titles and adding short captions underneath to provide context for each resource. Ensuring that titles are visible with- out requiring users to hover over images would allow for a clearer understanding of each resource. Additionally, including hyperlinks to external platforms such as Vimeo or YouTube for presentation videos would enhance the user experience by informing users of the destination before clicking, which would improve their navigation experience and provide transparency.
The usability testing identified several key issues, including difficulties in navigating to specific pages, accessibility challenges, and a desire for a more intuitive navigation structure. Based on these findings, three recommendations have been proposed to enhance the user experience:
- Provide a search bar function near the header of the website
- Clear organization and labeling of the navigation bar
- Re-labeling educational materials
Implementing these ideas will not only reduce existing user challenges but will also support Trees New York’s aims of urban forestry and sustainability. By improving the website’s user experience, Trees New York can better engage people, promote its initiatives, and contribute to the building of a greener, more sustainable urban environment in New York City.
Next Steps
The next steps for Tree’s New York would include collaborating with developers and web designers to implement the recommended changes. Following that, more user testing will be conducted to analyze the impact of these enhancements, and iterations will be made based on user feedback to ensure that all user experience issues on the website are properly addressed. This iterative process will ensure constant improvement in user experience on their website.
Learnings
This was my first experience with conducting usability testing, including the preparation of informed consent forms, pre and post-test questionnaires, and execution of tests. I also developed patience and the ability to resist the urge to guide participants directly through tasks, which helped me observe their natural interactions with the website's interface.