PRODUCT CATEGORY PAGE UI REVIEW

Compare to UI release at:

6. Only show if there are sub-categories.
And only show left-right arrows if there
are enough sub-categories to warrant
these.

Cần 2 option: hiển thị và không hiển thị arrow

Phương án: sẽ cấu hình bằng slick

7. Grid will be a “continuous scroll” sort
of thing. Load 9 products to start. As the
shopper scrolls down the page, show
add’l products in groups of 6 (two rows).

HTML/CSS: Passed

7b. DEV NOTE — it’s probably better to

load the HTML for all products, and then
“lazy load” images as the page scrolls.
This would also allow us to use the filters
more efficiently or speedily, without a
page refresh. Instead, filters trigger
javascript that shows / hides products in
the grid.

HTML/CSS: Passed

8. Filters for type, brand, price, as

appropriate to each category and/or subcategory — filters are based on the
category being displayed

HTML/CSS: Passed
9. Display “add to cart” button here, if
that’s possible (product has no options to
select).

HTML/CSS: Passed

10. Or display “Choose options” button if

the product needs to be configured
before adding to cart.

HTML/CSS: Pending

11. Optional layout of the “short

description” data field. After the product
title vs above the product photo in the
first row of products.

HTML/CSS: Passed

12. Optional — add a “reviewed” tag to

those products that have a “Diglo Digs
In”.

HTML/CSS: Passed

Evidence:

13. Filters (on left) can collapse. TBD:

should some filters be collapsed by
default (those infrequently used)? If so,
then need an admin tool to flag which
are shown by default, and which are
collapsed by

HTML/CSS: Passed

14. Link back to top of the products grid.

HTML/CSS: Passed

15. “Can’t find? / Need help? Call or

contact us (repeat from masthead).
NOTE: this may be unnecessary, as this
contact info will likely get repeated in the
footer, too (not yet wireframed).

HTML/CSS: Passed

Wireframe Requirement

Document Requirement

UI Review