CASE STUDY
Improving the
search function
‍
Year: 
2022/23
Duration:
4 months
My Role: 

‍
‍UX/UI Design
& Research
UX Research methods:
- Competetive analysis
- User Interviews
- Usability Testing
HiDrive is a cloud storage service, similar to Dropbox or Google Drive, and is based in Germany. As part of Strato, it serves both business and personal customers across six countries.

As a UX/UI designer for HiDrive, my role was to enhance the product's usability and aesthetics, ensuring alignment between business objectives and user needs.
PROBLEM
Users were not engaging with HiDrive's search functionality.
How to integrate advanced search filters into HiDrive without overwhelming users or violating technical constraints?
SOLUTION
We redesigned the search interface with always-visible dropdown filters and a cleaner results layout, making search intuitive on desktop and mobile.
BEFORE
Keywords search only
AFTER
Advanced filter search
Below you can see an advanced filter search with breaking points for desktop and mobile.
IMPACT
By prioritizing desktop breakpoints—since over 78% of our users access HiDrive via desktop—this redesign drove a jump in search-bar click-throughs.
Reading the entire process takes about 8 minutes.

For quicker access to certain steps, use the menu below.
PROCESS
During several months I used a Double Diamond innovation and design process, including User - Centered design and Design Thinking.
Double Diamond
Phase 1: Discover
Uncovering Barriers to 

Search Adoption

Overview

I led the redesign of HiDrive’s search functionality across desktop, mobile, and tablet platforms, collaborating with stakeholders, developers, and UX peers.

The project focused on balancing technical constraints (e.g., IONOS white-label dependencies) with user needs for intuitive search. Through iterative prototyping, usability testing, and stakeholder alignment, we delivered a streamlined interface that improved usability while maintaining familiarity.

Why users avoiding search?

To understand the problem, we needed to check the current state, examine our data, review our competition, identify any limitations, and explore new design trends and patterns.

Current state

The navigation bar included a search by keywords, along with sorting options by name, type, size, and the last modified date.

Data

Statistics show that a very small number of users utilize the search option.

Over 75% of users are using the web frontend, and the number of users on devices is slowly rising.

Competition

Offered beside keywords & sorting a variety of advanced search options.
*Navigation bars from the competition with the dropdown menus.
*gDrive
*Dropbox
*OneDrive

What was discovered?

  • Analytics audit. Only 4% of active users clicked the search bar; most resorted to manual folder navigation.
  • Competitor analysis revealed gaps in HiDrive’s search compared to industry standards. Lack of advanced filtering options like: date, file type, and size.
  • Inconsistent search patterns over Web and Native apps.
    (iOS & Android).
  • Technical limitations are preventing modifications to the navigation bar due to existing dependencies, which were discovered later in the process.
Phase 2: Define
Refining the 
Problem

Defining the goals

In order to refine the problem, we needed to define certain goals that came after our discovery phase.
01. Balance innovation with familiarity to avoid user frustration.
02. Integrate search filters without overwhelming users.
03. Design an intuitive search experience within technical constraints.
04. Prioritize desktop over mobile based on usage data.
This led us to the problem statement

Proble Statement

“How might we integrate advanced search filters into HiDrive without overwhelming users or violating technical constraints?”
Phase 3: DEVELOP
Iterating toward
a feasible
solution

Concept development

To develop a feasible solution, I created two distinct concepts.

01. Modern Ambition

Search with navigation bar and integrated filter chips.
(later discarded due to technical constraints).

02. Classic Pragmatism

A search with dropdown menus below the Navigation bar.
(chosen for feasibility and user familiarity).

Modern Ambition

Search Field Size Constraints

Limits exist on the search field’s width in the desktop navigation bar and on its height in the mobile view (where it can occupy almost one-third of the screen).

In the desktop version, the search field performs well until users add multiple filters, at which point the navigation bar quickly reaches its maximum width. Similarly, in horizontal (landscape) mode on mobile devices, the search field’s height can become excessive.

Classic Pragmatism

Functional & simple

After many temptations with the first version, the search feature was placed under the navigation bar.

This took up space in the “content area,” but the trade-off proved to be a better long-term option.


For users, it was simple to understand and faster for development. Chips were added for improved usability.

Prototyping

Based on four user flows, 
I developed prototypes in Figma for usability testing purposes.
Since this is a prototype, only a few selections are working, so when trying, please use the following selections:
‍
Type: photos or videos
Date: last 90 days
Size: > 500 MB
Prototype

Usability Testing Highlights

Over one working week, 5 participants completed 35–55 minute sessions using a detailed test plan, script, and scripted tasks. I managed scheduling (with backup slots for no-shows) on a rapid user-testing platform and conducted brief open-ended interviews.
This led us to the final phase of collecting and organizing the data from usability testing and interviews.
Phase 4: Deliver
Finalizing and Implementing the Solution

UT Analysis & Implementation

Over 1½ weeks, I transcribed and affinity-mapped feedback, uncovering key UI, search, functionality, and pricing/marketing insights. I then presented data-driven recommendations—with responsive breakpoints and dark-mode Figma components—to PMs, POs, developers, marketing, sales, QA, and support teams, securing broad buy-in (with some stakeholders reviewing session recordings) and earning praise for the depth of research.

Results & Impact

After 2+ months, there were over 5 hours of video recordings of user tests,  hundreds of screens for desktop, mobile, and tablets, and 2-3 versions of prototypes for each mobile and desktop.

Below you can see the states before and after.

BEFORE
Only keyword search posible
AFTER
Advanced filtering options

The finished user flow is shown in action below for HiDrive.

For IONOS, you can also see a white label version displayed below.

IMPACT
Adding advanced search options drove search-bar click-through rates up over time.

Reflection & learnings

- Involve developers earlier to address technical constraints proactively.

- User flows before prototyping

- Test low-fidelity wireframes before high-fidelity prototypes to identify issues sooner.

- Users from 22 to 28 years gave more feedback

- Transcription with fewer details will save time

- More attention to the analytics (before & after)

- Allow 3+ months for relevant measurement data

- Position the search field lower in the thumb zone on mobile devices to enhance accessibility and usability.

Future Improvements

- Expand advanced filtering  (metadata, custom date ranges).

- Search for iOS & Android devices, as well as Mac and Windows.

- Assess the feasibility of searching within files.

Conclusion

We gave HiDrive’s search a real tune-up—keeping it simple, doable, and in line with what users actually need. The streamlined design makes finding files a breeze and sets us up nicely for future upgrades.

By leaning on usability feedback and close teamwork, we ended up with a scalable, user-focused solution and a clear roadmap for what’s next.

Privacy policy
Impressum
Copyright © 2025 Vedran Vražalić