1

I have an e-commerce site, and my main products page, shows no products, its a starting page to help you find the right categories, or filters, you want to select to start your product search.

I am not that happy with my design though. I have broken up the filters into various categories. Created a box for each category, and labeled the filters in said box. However, I cant think of a nice way to display the filters, whilst still making it obvious they are separated.

This is what I have now

enter image description here

It does the job, but the filters just dont look beautiful, I want them to look attractive for users to click. Any thoughts?

2 Answers 2

2

I think the option you're missing is vertical-ness. Filters, for lots of reasons, work better in vertical stacks. Probably the best use of filters, I know of, is hotel booking sites.

Stars

  • "*****"

  • "****"

  • "***"

  • "**"

  • "*"

Locations

  • Suburb or Region
  • Suburb or Region
  • Suburb or Region
  • Suburb or Region

Popularity

  • more than 1000
  • 750 to 1000
  • 500 to 750
  • less than 500

Features

  • Swimming Pool
  • Free internet
  • Gym
  • Valet parking
  • Restaurants
1
  • i think you are right, but I also didnt want it to make the page too long. So I could have 3 columns in each box: 1. icon and category title 2. a list of filters 3. a list of the other filters
    – Source
    Commented Sep 22, 2016 at 19:16
1

Your filters offer too much contrast

This design would work if you had fewer "filters". The look of a filter offers a high contrast, the problem is that you have too many them, so it is difficult to distinguish them.

It does the job, but the filters just dont look beautiful, I want them to look attractive for users to click. Any thoughts?

  • You can consider your filters as subcategories in which case you can list them as links and find a nice way to present them.

  • Or maybe they can be seen as tags, in which case try to make them look like so.

example of a tag

Be sure that, if you put too much contrast on multiple objects, nothing will strike out of your page.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.