Arzu Oran

Other




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.







      Team
      Idil Agcagul
      Alice Wong
      Role
      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


      Introduction
      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.

       
      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 menus



      Recommendations
      The 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

      Provide a search bar near the header of the website

      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.


      RECOMMENDED SOLUTION






      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

      Clear organization and labeling of the navigation bar

      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.


      RECOMMENDED SOLUTION




      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

      Re-labeling educational materials

      ISSUE




      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


      RECOMMENDED SOLUTION




      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.






      Conclusion
      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:

      1. Provide a search bar function near the header of the website
      2. Clear organization and labeling of the navigation bar
      3. 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.


      Read the detailed report here




      Get in touch
      FlavorHunt
      © 2024 ARZU ORAN