Back to all cases

Material Bank: Catalog products comparison

Situation

Material Bank helps architects and designers source material samples, but users could only compare samples offline. As the catalog expanded to digital products, users began asking for an online tool to compare product details side by side. Because Material Bank sells on a pay‑per‑lead model, giving users tools to evaluate materials online would also improve lead quality.

Task

Design and launch an intuitive side‑by‑side comparison feature that allows users to evaluate products and seamlessly share results with colleagues.

Actions

  1. Design the comparison flow: comparison mode could be initiated from the catalog page via the “Compare” button. It was also integrated into the bulk-selection flow.
  2. Respect cognitive limits: allowed users to compare up to five items, aligned with human short-term memory capacity (5–7 items). Tooltips guided users, ensuring they understood they could compare from 2 to 5 products.
  3. Highlight differences: on the comparison page, I included a Show differences toggle. When activated, the table hides identical attributes and highlights only the fields where products differ, making variations easy to spot.
  4. Facilitate export and sharing: to support collaboration, the comparison table can be exported to a CSV or PDF file. There’s also a one‑click button to copy a unique link for sharing the comparison view with colleagues or clients.

Results

  1. Within the first 3 months, 14% of catalog users engaged with comparison (≈1 in 7 sessions).
  2. Higher-quality leads: sales reported that projects with comparisons had a 20% higher conversion to sample orders.
  3. Designers frequently used the export and share link features — with over 30% of comparison sessions resulting in exports.

Next case

Back to all cases

Material Bank: Catalog products comparison

Situation

Material Bank helps architects and designers source material samples, but users could only compare samples offline. As the catalog expanded to digital products, users began asking for an online tool to compare product details side by side. Because Material Bank sells on a pay‑per‑lead model, giving users tools to evaluate materials online would also improve lead quality.

Task

Design and launch an intuitive side‑by‑side comparison feature that allows users to evaluate products and seamlessly share results with colleagues.

Actions

  1. Design the comparison flow: comparison mode could be initiated from the catalog page via the “Compare” button. It was also integrated into the bulk-selection flow.
  2. Respect cognitive limits: allowed users to compare up to five items, aligned with human short-term memory capacity (5–7 items). Tooltips guided users, ensuring they understood they could compare from 2 to 5 products.
  3. Highlight differences: on the comparison page, I included a Show differences toggle. When activated, the table hides identical attributes and highlights only the fields where products differ, making variations easy to spot.
  4. Facilitate export and sharing: to support collaboration, the comparison table can be exported to a CSV or PDF file. There’s also a one‑click button to copy a unique link for sharing the comparison view with colleagues or clients.

Results

  1. Within the first 3 months, 14% of catalog users engaged with comparison (≈1 in 7 sessions).
  2. Higher-quality leads: sales reported that projects with comparisons had a 20% higher conversion to sample orders.
  3. Designers frequently used the export and share link features — with over 30% of comparison sessions resulting in exports.

Next case

Back to all cases

Material Bank: Catalog products comparison

Situation

Material Bank helps architects and designers source material samples, but users could only compare samples offline. As the catalog expanded to digital products, users began asking for an online tool to compare product details side by side. Because Material Bank sells on a pay‑per‑lead model, giving users tools to evaluate materials online would also improve lead quality.

Task

Design and launch an intuitive side‑by‑side comparison feature that allows users to evaluate products and seamlessly share results with colleagues.

Actions

  1. Design the comparison flow: comparison mode could be initiated from the catalog page via the “Compare” button. It was also integrated into the bulk-selection flow.
  2. Respect cognitive limits: allowed users to compare up to five items, aligned with human short-term memory capacity (5–7 items). Tooltips guided users, ensuring they understood they could compare from 2 to 5 products.
  3. Highlight differences: on the comparison page, I included a Show differences toggle. When activated, the table hides identical attributes and highlights only the fields where products differ, making variations easy to spot.
  4. Facilitate export and sharing: to support collaboration, the comparison table can be exported to a CSV or PDF file. There’s also a one‑click button to copy a unique link for sharing the comparison view with colleagues or clients.

Results

  1. Within the first 3 months, 14% of catalog users engaged with comparison (≈1 in 7 sessions).
  2. Higher-quality leads: sales reported that projects with comparisons had a 20% higher conversion to sample orders.
  3. Designers frequently used the export and share link features — with over 30% of comparison sessions resulting in exports.

Next case