Overview

2024

Databin is a smart waste management solution that uses IoT sensors to track bin capacity, temperature, and other conditions in real time.   By providing predictive insights and optimized collection routes, it helps cities and companies save money, improve efficiency, and create cleaner, more sustainable environments.

The product unites three platforms: web, mobile, and tablet.  Each platform has its own unique user base.

Databin is a smart waste management solution that uses IoT sensors to track bin capacity, temperature, and other conditions in real time.   
By providing predictive insights and optimized collection routes, it helps cities and companies save money, improve efficiency, and create cleaner, more sustainable environments.

The product unites three platforms: web, mobile, and tablet.  Each platform has its own unique user base.

Context

The project began as a request to add breadcrumbs, but during discovery Eti and I identified serious UX issues and aligned with stakeholders to redesign the entire end‑to‑end flow.
A major gap was that users could access bin data from multiple entry points across the platform including table and map layouts without a consistent experience.
The new design therefore needed to unify behavior across these structures and maintain consistent usability regardless of where users started.

Skip to impact

Role

Designed one of the key features in the platform a live data about each bin.  
Enhancing the brand visual style in each new task I was giving to.     

Kido  
Design - Eti Laifer Sharvit

Databin
Developer - Nadal Nakhleh
VP R&D and Co-founder - Eyal Ron
PM - Ravit Sela

Designed one of the key features in the platform - A live data about each bin.  
Enhancing the brand visual style in each new task I was giving to.     

The team included:   
Kido  
Design - Eti Laifer Sharvit.

Databin
Developer - Nadal Nakhleh
VP R&D and Co-founder - Eyal Ron
PM - Ravit Sela

Overview

Responsive everywhere

The solution needed to remain layout‑agnostic, ensuring consistency across different table and map layouts.

Clear live info

Enhance the clarity and arrangement of the live bin information already available.

Multi-bin compare

Users should be able to select multiple bins and be able to navigate and easily compare between them.

Brand refresh

Enhancing the brand visual style.

The Goals

Challenges

Solutions

Limited user research available

Partnered with the PM’s and the Co-founder's user‑proximate insights to define core pain points, prioritizing the lack of comparison as the primary problem to solve.

Framed lean hypotheses and validated flows with rapid internal reviews to keep momentum while minimizing research debt.

Tight project timeline with limited resources.

Operated on a ~30‑hours/month cadence, focusing on highest‑impact decisions and pausing non‑essential explorations.
Reused proven patterns (tabs and dropdown pagination) to accelerate delivery while preserving usability.

Users with low technology proficiency.

Chose a clear, low‑complexity UX: obvious entry points, plain labeling, and a single, guided path for multi‑bin comparison.

Reduced cognitive load with tidy hierarchy and generous spacing in the side panel, improving readability and scanability

Lack of a polished brand identity to reflect in the design.

Incrementally refreshed visuals during feature work: Add more colors tint , refined pins, and added UI components to the system.

Maintained a lightweight design system and ran regular VQA to ensure consistent implementation across platforms.

🧗🏻‍♂️ Challenge

Limited user research available

✅ Solution

Partnered with the PM’s and the Co-founder's user‑proximate insights to define core pain points, prioritizing the lack of comparison as the primary problem to solve.

Framed lean hypotheses and validated flows with rapid internal reviews to keep momentum while minimizing research debt.

🧗🏻‍♂️ Challenge

Tight project timeline with limited resources.

✅ Solution

Operated on a ~30‑hours/month cadence, focusing on highest‑impact decisions and pausing non‑essential explorations.

Reused proven patterns (tabs and dropdown pagination) to accelerate delivery while preserving usability.

🧗🏻‍♂️ Challenge

Users with low technology proficiency.

✅ Solution

Chose a clear, low‑complexity UX: obvious entry points, plain labeling, and a single, guided path for multi‑bin comparison.

Reduced cognitive load with tidy hierarchy and generous spacing in the side panel, improving readability and scanability

🧗🏻‍♂️ Challenge

Lack of a polished brand identity to reflect in the design.

✅ Solution

Incrementally refreshed visuals during feature work: Add more colors tint , refined pins, and added UI components to the system.

Maintained a lightweight design system and ran regular VQA to ensure consistent implementation across platforms.

Challenges & Solutions

We explored multiple directions and ended up with Two best options to focus on.

Given the constraints and user needs, we agreed that an overlay side panel is the best fit for this feature,
it preserves the original entry point (table or map) in view while letting users inspect and compare bins without losing context.

Comparing patterns

Option 1

Dropdown List

When users click a bin name, the live bin data side panel opens.
The panel includes pagination‑based navigation, letting users add more bins from a dropdown and view them as a paginated list above the details panel.
Users can add bins relevant to their current context (for example, from the Inventory page), then apply their selection to navigate and compare metrics across multiple bins effortlessly.

When users click a bin name, the live bin data side panel opens.
The panel includes pagination‑based navigation, letting users add more bins from a dropdown and view them as a paginated list above the details panel.
Users can add bins relevant to their current context (for example, from the Inventory page), then apply their selection to navigate and compare metrics across multiple bins effortlessly.

When users click a bin name, the live bin data side panel opens.
The panel includes pagination‑based navigation, letting users add more bins from a dropdown and view them as a paginated list above the details panel.
Users can add bins relevant to their current context (for example, from the Inventory page), then apply their selection to navigate and compare metrics across multiple bins effortlessly.

The detailed bin data remains scrollable and is organized into well-defined sections with generous white space to enhance readability and help users quickly locate vital information.

Option 2

Tab based navigation

This version features tab-based navigation allowing users to switch between selected bins within the side panel.   

Users can add more bins by clicking a plus button, which presents bins relevant to the current page, such as Inventory bins when on the Inventory page.

This version features tab-based navigation allowing users to switch between selected bins within the side panel.   

Users can add more bins by clicking a plus button, which presents bins relevant to the current page, such as Inventory bins when on the Inventory page.

Alongside this, a second row of tabs enables users to access different live data views about each selected bin, including 'Live Metrics', 'Bin location', 'Bin events', 'Capacity over time', 'Collection history', and 'Ticket management'.
This design keeps bin navigation clear, while organizing all relevant bin information in one accessible interface within the user's current workflow context.

The outcome

Our final design keeps tab‑based navigation, adds refinements from the dropdown approach, removes duplicate bin labels for clarity, and applies tabs to the data itself so users stay focused and can
scan metrics quickly.

Users can compare multiple bins in two ways:

1. Select bins directly in the table by checking their boxes to activate the Compare button.

2. Open the live bin info side panel for a single bin and add more bins by pressing the plus button.
From the side panel, a table appears with bins from the user’s original entry point, making it easy to pick additional bins to compare.

The same comparison table listing bins from the user’s entry context is also available when users arrive from map layouts, ensuring a consistent flow across pages.

Enhancing the brand

We also created new components that were later added to the design system,
and refreshed the existing design of the pins.

Battery status widget

Good

Normal

Low

Critical

Tabs secondary

States

Idle

Hover

Pressed

The bin icon was replaced by a number indicating the pick-up order for each bin.
The color scheme was unified, removing the previous mix of tones for a cleaner visual hierarchy.
Pins were reduced in size, as the larger version was unnecessary and outdated.

The bin icon was replaced by a number indicating the pick-up order for each bin.

The color scheme was unified, removing the previous mix of tones for a cleaner visual hierarchy.
Pins were reduced in size, as the larger version was unnecessary and outdated.

New

Old

Results & Next steps

Adoption and engagement

Increase in users engaging with the live bin side panel across table and map pages after launch.

↑ 30%

Consistency across layouts

Nubmer of pages updated to the new pattern post‑launch.

4#

Following the initial launch of this feature, we plan to gather detailed insights into user behavior to better understand their needs and improve the experience.   

Key questions include:

Since launching the feature, have users been comparing multiple bins more frequently?
Is the current limit of comparing 8 bins meets requirements, or should it be increased or decreased?
Are there particular metrics or bin data users want prioritized for quick comparison?
Is there sufficient demand to justify developing a mobile-friendly version of this feature?
How important is real-time versus historical data for users in managing bins?
Do users want notifications or alerts integrated into the bin info feature?

Since launching the feature, have users been comparing multiple bins more frequently?
Is the current limit of comparing 8 bins meets requirements, or should it be increased or decreased?
Are there particular metrics or bin data users want prioritized for quick comparison?
Is there sufficient demand to justify developing a mobile-friendly version of this feature?
How important is real-time versus historical data for users in managing bins?
Do users want notifications or alerts integrated into the bin info feature?

Since launching the feature, have users been comparing multiple bins more frequently?
Is the current limit of comparing 8 bins meets requirements, or should it be increased or decreased?
Are there particular metrics or bin data users want prioritized for quick comparison?
Is there sufficient demand to justify developing a mobile-friendly version of this feature?
How important is real-time versus historical data for users in managing bins?
Do users want notifications or alerts integrated into the bin info feature?

Addressing these questions will guide the roadmap and ensure the solution continues to meet user expectations while supporting efficient decision‑making.