NLI catalogue search

NLI catalogue search

NLI catalogue search

2023 | NLI

The NLI (National Library of Israel) catalogue search interface got a revamp to make searching easier. We tackled the pain points of users having to sift through tons of info, functions like 'expand' and 'get item' not being easy to find, and the challenge of understanding item accessibility status.

Our main goals were to add more features for researchers and share more item details, like file count, accessibility status, and full-text availability. We wanted to make it effortless for users to scan results, minimize mental effort, and maintain a consistent design look using NLI's new design system.

This was a long and complex process, here I'll show you two main issues we had to tackle.

Try it here.

My role

Product design lead

Services

UI & UX Design
Design system

The Team

Danny Streifler
Einat Eidelman

Timeline

14 months

Looking for a change

With the library moving to a new building and design, we decided to address several usability issues and enhance functionality.

The old search design.

Before creating Canvas, users had to use a form to publish a campaign.

Main pain points

1

Adapting the old search interface to the new design system while keeping all essential information

2

Users struggled to interpret file accessibility and additional details

3

New features needed a clear hierarchy to avoid clutter and improve navigation

Our Mission

Revamping the library’s search experience with a clear, intuitive design and added functionalities to enhance user navigation and content accessibility.

UX Goals

Integrate the search interface into the new design system while maintaining clarity

Improve visibility of file accessibility and additional details

Organize new features to enhance browsing without clutter

The process

Redesigning results

In the redesign process, we conducted visual and experience research to find the best design options. We studied the layouts of Google, Airbnb, Yelp, and booking.com, among others, to see how they organize their data-heavy results. After refining different design variations based on feedback, we divided the search results into logical sections and used various visual tones to highlight metadata and actions.

Redesigning results

In the redesign process, we conducted visual and experience research to find the best design options. We studied the layouts of Google, Airbnb, Yelp, and booking.com, among others, to see how they organize their data-heavy results. After refining different design variations based on feedback, we divided the search results into logical sections and used various visual tones to highlight metadata and actions.

Redesigning results

In the redesign process, we conducted visual and experience research to find the best design options. We studied the layouts of Google, Airbnb, Yelp, and booking.com, among others, to see how they organize their data-heavy results. After refining different design variations based on feedback, we divided the search results into logical sections and used various visual tones to highlight metadata and actions.

Design exploration of information-heavy results

A detailed overview of the hierarchy of search results, including the structure before and after modifications.

Making it simple

We also tried to simplify the interface and manage the increasing number of functions. However, not all the changes we proposed were approved after testing, like putting format types inside a dropdown.

We also tried to simplify the interface and manage the increasing number of functions. However, not all the changes we proposed were approved after testing, like putting format types inside a dropdown.

We also tried to simplify the interface and manage the increasing number of functions. However, not all the changes we proposed were approved after testing, like putting format types inside a dropdown.

Proposed design for the formats menu. This design was not approved for the final version.

Smarter search experience

In the end, the redesigned interface successfully integrated more information and functions while keeping things easy for users to process. Our use of a grid, typography, and color hierarchy aimed to make it a breeze for researchers to find what they need, quickly.

If you're curious about more aspects and challenges of this project don't hesitate to drop me a line.

Final result, a responsive design in 3 languages

3%+

Use of the formats bar

15% +

queries per session, filter usage, and click-through rates, indicating improved usability.

Boosted key actions

from search results by 10%, demonstrating a more effective discovery experience.

More work

Simplifying campaigns with smarter, more intuitive tools

Campaign building canvas at Copilot.cx

Modernizing NLI’s digital experience with a scalable, cohesive design system

From style-guide to design system at the National Library of Israel

More work

Simplifying campaigns with smarter, more intuitive tools

Campaign building canvas at Copilot.cx

Modernizing NLI’s digital experience with a scalable, cohesive design system

From style-guide to design system at the National Library of Israel