Case Study:
ChesapeakeBay.net Site Search Redesign

Status: In Development

Project Overview:

The redesign of Chesapeakebay.net's site search aimed to enhance the search experience for both external users (public) and internal staff by adding a more dynamic, informative, and user-friendly design. A major focus of the redesign was the integration of an AI summary feature, allowing users to see an AI-generated summary alongside traditional search results. The project was informed by user research to ensure the AI feature would be something users wanted and would add value to their experience.

Pain Points:

The existing search functionality on the site was outdated and lacked several important features, which impacted user experience:

The original site search interface, which lacked predictive input, clear categorization, and used a restrictive modal layout — making results hard to scan and reducing usability across devices.
Old Search Results Modal

The Solution:

I redesigned Chesapeakebay.net’s search experience from the ground up, replacing the outdated, modal-based results with a full-page, intuitive interface that supports predictive search, clear categorization, multiple layouts for different content types, and robust sorting and filtering tools. A new AI summary feature provides concise, clearly labeled overviews with source citations and an on/off toggle, giving users both quick insights and control over their experience. Informed by user research and validated through prototype testing, the redesign improves accessibility, engagement, and content discovery for both public users and internal staff, while aligning visually and functionally with the rest of the site.

With the addition of the AI summary feature, we wanted to first validate if this feature would meet the needs of our users. Thus, we conducted a user research study to understand perceptions and needs surrounding AI-generated content and how it could impact the search experience.

My Role:

Who I Worked With:

This project was a collaboration between myself, the Chesapeake Bay Program Web Team and site search provider, Cludo. I also worked closely with our UX researcher to develop interview questions and tasks for prototype testing. Additionally, I participated in interviews, taking notes and gathering valuable insights to help guide my decisions.

User Interviews:

The interviews involved 16 participants, split between 9 public-facing users (3 students, 5 teachers, and an environmental specialist) and 7 internal staff (across different teams):

Some users commented:

AI does save a lot of time, which is great because… we’re really pressed to get out into the field and meet certain metrics, so it is really nice to have tools like that.”

"I use AI to condense long technical documents into short, easy-to-read summaries. They just want the important points, not three pages of notes."

Comparative Analysis:

After analyzing both AI-driven search features and existing site search systems, my team and I identified a list of desired features for our site search:

  1. Simple, Elegant Search Form: A search form that is easy to use and aesthetically pleasing.
  2. Consistent Design: Design that matches the look and feel of the main site.
  3. Predictive Search: Suggesting search terms as the user types.
  4. Scannable Search Results: Results to open on a new page with more real estate for content and supporting features.
  5. Multiple Content Formats: The ability to display text, images, videos, and different layouts for different content types.
  6. Sorting and Filtering: Ability to sort by relevance or date, and filter by content type, date range, etc.
  7. No Results Scenarios: A clear path forward if no results are found.

Prototyping:

Based on user research and comparative analysis, I proceeded to design high-fidelity prototypes using Figma that incorporated the following features:

  1. Predictive Search: A search form that is easy to use and aesthetically pleasing.
  2. Multiple Layouts for Different Content Types:
    • Text-only results for Pages, FAQs, Publications, Projects, and Meetings.
    • Text and image results for Plants & Animals, Stories, Press Releases, People.
    • Video and text results for Videos.
  3. Clear Content Hierarchy: Results now include the content type, heading, breadcrumbs, media (if applicable), last updated date, summary and a download button for results with associated files.
  4. Pagination: Easy navigation between pages of results.
  5. Sorting Options: Results sorted by Relevance, Newest, and Oldest.
  6. Filtering: Multi-select filtering that dynamically displays filters based on available results.
  7. Error Handling: Clear feedback for users in case of errors or issues with the search.
  8. No Results Scenarios: Clear suggestions for further action if no results are found.
  9. AI Summary: The AI summary provides a concise overview of the content, with an option to toggle it on or off. Each AI-generated summary also includes a clear indication that the content was generated by AI, along with sources for credibility.

User Testing:

We conducted user testing with 8 participants (4 external users and 4 internal staff). The key findings were:

Some key user insights include:

AI Summary: "I knew it was AI-base due to the logo and the text animation. I would feel more comfortable with sources, or a note that the generation came from Bay.net resources. Knowing the bounds of where the source information came from would help users with similar distrust of AI-generated text."

AI Summary Opt-out: "I think that’s a philosophical question almost. You could justify either way, but my preference is to have it on by default. I might turn it off if I knew a topic had recently changed and the summary might be outdated."

Predetermined Date Range Labeling: "I think past week and past month are great for, for people who are looking for a meeting. If they're trying to see when was this talked about in a meeting? I think that's very relevant. "I like last 30 days and last seven days better because it's very clear. There's NO ambiguity."

Final Outcome:

The redesigned site search now includes:

The updated search interface brings the redesigned features to life — providing a clean, modern layout that supports faster discovery, richer content, and a more intuitive experience.
Scroll to explore the full layout.
Redesigned Search Results Page

Impact & Next Steps:

Key Takeaways:

Case Studies: Local Waterways | Org Pages | Watershed