Sakura Filter: Making a 7,000-Product Catalog Easier to Navigate

Client

Selamat Sempurna

Year

2017 - 2018

Sakura Filter: Making a 7,000-Product Catalog Easier to Navigate
Selamat Sempurna

Sakura Filter is the filtration brand of PT Selamat Sempurna Tbk, the flagship company of the group’s Automotive Division. With more than 45 years of experience, the company manufactures filtration products for automotive, commercial, heavy equipment, marine, and industrial applications across American, European, and Asian markets.

That experience gave Sakura Filter strong market credibility. But its digital platform was not yet presenting the business with the same level of clarity.

The website contained information for more than 7,000 filtration part numbers, creating a difficult balance. Customers needed detailed product information, but too much content without a clear structure could make the website feel overwhelming.

Between 2017 and 2018, Selamat Sempurna partnered with Suitmedia to improve Sakura Filter’s website experience. The work focused on clearer information architecture, simpler navigation, stronger search functionality, and a more modern presentation.

The result was a more accessible platform that helped users find product information faster and encouraged deeper engagement with the website.


A Large Product Portfolio Was Becoming a Navigation Problem

1. Sakura Filter had deep expertise but a difficult digital entry point

Sakura Filter’s business was built on scale and specialization. Its products served several industries and application types, each with different requirements.

A customer searching for an automotive filter may approach the website differently from a heavy equipment distributor or an industrial procurement team.

This breadth was a competitive advantage, but it also created a communication challenge. The website needed to represent a large and technical product portfolio without requiring every visitor to understand the company’s internal categories.

Customers should be able to enter with a specific part number, a product category, an application, or a general need and still find a practical route to relevant information.

2. The outdated website risked weakening confidence

Customers often use a company’s website as an early signal of its capability and reliability.

An outdated or difficult-to-use website can create doubt, even when the underlying business is strong. Visitors may question whether the company is current, responsive, or easy to work with.

For Sakura Filter, this risk was especially significant because the brand operated in a technical and operationally important category. Customers rely on filtration products to protect equipment, maintain performance, and support business continuity.

The website needed to reflect the same precision and reliability associated with the products themselves.

3. More than 7,000 part numbers created information overload

Sakura Filter’s product portfolio included more than 7,000 part numbers.

This volume created a practical usability problem. A customer looking for one product could be forced to navigate through multiple categories, review long lists, or manually compare information across pages.

When users cannot find the right product quickly, they may leave the website, contact the company for basic assistance, or search for another supplier.

The problem was not that the website had too much information. The problem was that the information needed a clearer structure and faster paths to discovery.

4. Customers needed different ways to search

A product catalog should support different levels of user knowledge.

Some visitors know the exact part number they need. Others know the vehicle, equipment type, industry, or application but not the correct product code.

A website built around only one search method will serve one group well and leave others struggling.

Sakura Filter needed both a fast entry point for users with a specific query and a more structured catalog experience for users who needed to browse or refine their search.

5. Product information had to support real decisions

Customers were not visiting only to read about Sakura Filter. They needed to determine whether a product matched their application.

That could involve reviewing product details, identifying compatible uses, comparing options, or confirming a part number before contacting a distributor or sales representative.

The website therefore needed to support practical decision-making. Its role was not simply to display a database, but to help users move from uncertainty to a more confident next step.

6. The business needed to learn from search behavior

Search activity could also reveal what customers were trying to find.

The terms entered into the site search could show which products attracted interest, where users struggled with terminology, and which application areas generated demand.

This information could help Sakura Filter improve content, product organization, and future marketing activity.

Search was therefore both a customer service feature and a source of business insight.


Designing a Clearer Route Through a Complex Product Catalog

1. We treated structure as the first design problem

Suitmedia began by reviewing the existing website and mapping the elements that needed improvement.

The first priority was not visual decoration. It was the relationship between content, categories, navigation, and search.

The website needed to help users understand where they were, what they could find, and what action to take next.

This led to a simpler layout and clearer hierarchy. Each section was given a defined function so that users could move through the website without interpreting a confusing collection of pages.

The objective was to reduce the amount of mental effort required to find product information.

2. We simplified the main user flow

A simpler structure made the website easier to navigate.

Instead of presenting too many competing choices at the start, the design created clearer paths into product information and other important sections.

This was especially important for users who arrived with limited knowledge of the catalog. They needed guidance without being forced through unnecessary steps.

The design also helped experienced users move faster. A visitor who already knew what they wanted could access search directly instead of browsing through the full product hierarchy.

3. We placed search prominently on the homepage

A search feature was added directly to the homepage banner.

This decision responded to the behavior of users who arrived with a specific need. If someone knew a part number or keyword, they could begin searching immediately rather than navigate through the website first.

The search box was visually simple, but its business value was significant. It shortened the path between arrival and product discovery.

A visible search function also communicated that the website was designed around the customer’s task. Users did not have to understand the site before they could ask it for help.

4. We developed more advanced search within the catalog

The catalog section included more sophisticated search features to support efficient product discovery.

This allowed users to refine their search and reach more accurate results when a simple keyword was not enough.

A large catalog requires more than a basic search field. Users may need to narrow results by product information, application, or other relevant distinctions.

The search experience was therefore designed to reduce the number of irrelevant results and make the product-selection process faster.

5. We used clear hierarchy to make dense information readable

A product-heavy website can overwhelm users when every detail receives the same visual emphasis.

Suitmedia used layout, spacing, headings, and content grouping to create a clearer hierarchy. Important information could be recognized quickly, while supporting detail remained available for users who needed it.

This helped the website serve different levels of interest. A first-time visitor could understand the basic product context, while a technical or procurement user could continue into deeper information.

The aim was not to remove complexity from the business. It was to present complexity in a more manageable way.

6. We used imagery to make the experience more engaging

The website incorporated full-width imagery and informative text to create a more engaging presentation.

This helped prevent the catalog experience from feeling like a purely technical database. Visual elements gave the brand more character while supporting the wider message of reliability and capability.

However, imagery was used within a clear structure. It was not allowed to compete with the product search and information tasks users came to complete.

The visual design supported engagement without compromising usability.

7. We designed each section around a clear purpose

Every section of the website needed to answer a user need.

Product areas supported discovery. Search helped users find relevant information. Supporting content could explain Sakura Filter’s capabilities and application range. Navigation connected the different parts of the experience.

This reduced ambiguity. Users were less likely to encounter pages that looked visually different but served the same function or sections whose purpose was unclear.

Clear purpose also helped the website remain maintainable as new products and information were added.

8. We preserved access to detailed product information

Improving usability did not mean hiding technical detail.

Customers in automotive, heavy equipment, marine, and industrial markets often need precise information before they can make a purchasing or replacement decision.

The new structure made it easier to reach that detail without forcing every visitor to encounter it at the beginning.

This layered approach allowed the website to remain useful for both general visitors and technical users.

9. We treated search data as a source of customer insight

The terms entered into the site search could reveal customer priorities and information gaps.

If users repeatedly searched for a product name, part number, or application that was difficult to find through navigation, that behavior could indicate where the website structure needed improvement.

Search data could also inform future content planning and help Sakura Filter understand demand across different product areas.

This created a second-order benefit. The website did not only help customers find information; it also helped the company learn how customers described their needs.

10. We designed for engagement beyond the first page

The goal was to encourage users to continue exploring the site after finding an initial entry point.

A visitor who searched for a product could discover related information, applications, or supporting content. A user who arrived through a general page could move into the catalog when ready.

This helped create a more connected experience. The website could support immediate product discovery while also building a fuller understanding of the Sakura Filter brand.

11. We aligned the digital experience with the brand’s maturity

Sakura Filter had more than four decades of experience, but the website needed to communicate that credibility in a current digital format.

The redesign combined a modern interface with the depth expected from an established manufacturer.

This balance was important. A highly simplified site might appear easy to use but fail to communicate technical authority. A dense technical site might appear credible but discourage users.

The new experience aimed to communicate both precision and accessibility.


From Product Complexity to Faster, More Confident Discovery

1. Users gained a more direct path to product information

The homepage search function allowed customers to begin their product search immediately.

This reduced the need to browse through multiple layers of content before reaching relevant information.

For users with a known part number or keyword, the change created a faster route to the answer they needed.

2. Catalog search improved efficiency

More advanced search features helped users narrow results and find products more accurately.

This was particularly important given the scale of the catalog. Customers could spend less time reviewing irrelevant entries and more time evaluating products that appeared suitable.

The result was a more comfortable research process for both technical and non-technical users.

3. The website became easier to understand despite its content volume

Clear layout and hierarchy made the product portfolio more manageable.

Users could recognize categories, distinguish important information, and continue into deeper detail when required.

The platform did not reduce the breadth of Sakura Filter’s offering. It made that breadth easier to navigate.

4. The modern presentation strengthened brand confidence

The refreshed visual design gave Sakura Filter a more current and professional digital presence.

This helped reinforce the perception that the company was keeping pace with digital expectations and technological change.

The website became a stronger representation of the business behind the products.

5. Engagement improved across multiple user behaviors

Within 30 days of launch:

  • Sessions per user increased by 17.67%.
  • Average session duration increased by 3.32%.
  • Bounce rate decreased by 14.72%.

Together, these results indicate that users were returning more often, spending slightly more time on the site, and leaving less frequently after their initial visit.

The figures do not by themselves prove product conversion. They do provide evidence that the redesigned experience was more effective at encouraging continued exploration.

6. The website created more opportunities for repeat use

A clearer product catalog and more useful search experience gave users practical reasons to return.

Customers could revisit the platform when they needed product information, checked a part number, explored another application, or prepared for a procurement discussion.

This strengthened the website’s role as an ongoing reference rather than a one-time brand introduction.

7. Search behavior created future improvement opportunities

The search terms used by visitors could help Sakura Filter identify the language customers used, the products they cared about, and the areas where navigation needed improvement.

This created an ongoing feedback loop:

  1. Users search for products.
  2. Search behavior reveals their needs.
  3. Sakura Filter reviews the data.
  4. Content and navigation are improved.
  5. Future users find information more easily.

The website could therefore become more useful over time.

8. The platform supported different customer journeys

A customer with a known part number could use search. A visitor with a general application need could browse the catalog. A new user could explore supporting information before moving toward a product.

This flexibility made the platform more inclusive and reduced the risk that one type of visitor would dominate the design.

9. The project improved operational efficiency indirectly

When customers can find basic product information independently, sales and support teams may spend less time answering routine questions.

That allows conversations to focus on more complex needs, compatibility questions, procurement requirements, and commercial opportunities.

The website did not replace human support. It helped make human support more focused and valuable.

10. The catalog became an asset for customer retention

A useful product website can encourage customers to return when they need information.

If users remember that Sakura Filter’s website is easy to search and provides reliable product details, the platform becomes part of their research routine.

This can strengthen retention even before a direct purchase or service interaction occurs.


What Sakura Filter Reveals About Content-Heavy Websites

1. More content requires better structure, not less content

Large product portfolios are not inherently a problem.

The problem appears when users cannot distinguish categories, search effectively, or understand where to begin.

Good information architecture allows an organization to preserve depth without creating confusion.

2. Search is a primary customer experience feature

For websites with thousands of products, search is not a secondary convenience.

It is one of the main ways customers access value. Search should be visible, accurate, and connected to a catalog structure that supports refinement.

3. Simple interface design can support complex businesses

A clean layout does not mean the business itself is simple.

It means the interface is doing more of the work to organize information and guide the user.

The best content-heavy websites hide unnecessary complexity while preserving the detail expert users need.

4. Visual design influences trust in technical markets

Customers use digital presentation as an early signal of business quality.

A modern, organized, and readable website can reinforce confidence in a manufacturer’s precision and reliability.

5. Search data can improve the wider business

Search terms reveal how customers describe their needs.

This information can influence content planning, product naming, navigation, marketing campaigns, and customer support.

The search box can therefore become a source of strategic insight.

6. Engagement metrics are useful leading indicators

The increase in sessions per user, session duration, and the decrease in bounce rate indicated that the experience had become more useful.

These measures should eventually be connected to product inquiries, distributor engagement, and sales outcomes, but they provide an early view of whether the digital experience is improving.

7. Website usability can reduce service friction

When customers find information independently, support teams can focus on more complex issues.

This improves efficiency for both sides and creates a better foundation for commercial conversations.

8. A product catalog should support multiple levels of knowledge

Some users know exactly what they need. Others need guidance.

A strong platform supports both through direct search, category browsing, clear explanations, and detailed product content.


Strategic Insights for the C-Suite

  1. Treat product complexity as an information design problem.
    A large portfolio does not need to be reduced to become usable. It needs a structure that helps customers search, compare, and understand products according to their own level of knowledge.
  2. Make search a central part of the customer experience.
    For businesses with thousands of products or documents, prominent and accurate search can reduce friction more effectively than adding more navigation layers.
  3. Use digital behavior as a source of business insight.
    Search terms, repeat visits, session depth, and exit points reveal what customers need and where the experience fails. Use these signals to improve products, content, and support.
  4. Design for both self-service and human assistance.
    A good website answers routine questions while directing more complex needs toward the right people. This improves operational efficiency without eliminating the value of expert support.
  5. Measure whether users can continue their journey.
    Sessions per user, time spent, and bounce rate indicate whether visitors are finding enough value to explore. Connect these signals to inquiries, product engagement, and conversion to understand the full impact.

How We Transform Ideas into Reality