80 likes | 214 Views
Mobile Refinements. User click on the Filter. Expand all the refinements when Filter is clicked. Filter displays color, Price Range, Height, … depends on category selection. Show the selected refinements after the heading. Ex: Color (gray, yellow) Button functionality
E N D
Expand all the refinements when Filter is clicked. Filter displays color, Price Range, Height, … depends on category selection. Show the selected refinements after the heading. Ex: Color (gray, yellow) Button functionality “Apply” is enable mode “Clear All” is disable mode When applying filters first time.
After click on apply, collapse all refinements. Display only headings with refinements. Button functionality “Apply” is disable mode “Clear All” is enable mode
If user wants to edit the filter, See the example in mockup: Click on “+” sign, add one more color green in Color refinement. Ex: Color (green, gray, yellow). If refinements are too many, display with ellipsis like below. Button Functionality “Apply” is enable mode “Clear All” is enable mode In this case both buttons are enable. User can Clear the filters or Add more filters.
User Click on Sort By, it shows the best matches
For editing the refinements click on “+” sign to expand & edit the refinements. (Same as 5th step). If user click on Filter again, it shows only selected refinements. (Same as 4th step)