Big hero image with text overlay (header, subheader) and CTA button
Options for 1 image
Options for 2 images side by side
Options for text placement (left, center, right)
Options for changing font and font color
Thin hero image with text overlay (header, subheader)
Shoppable, scrollable product panel
Options for text on the left, and no text on the left
Options for adjusting number of products to display
Modules to feature collections
1 image, with text (header, body copy, ability to link to Collection) on the right or left, option to add CTA button
2 images, with text (header, sub-header, ability to link to Collection) below
3 images, with text (header, sub-header, ability to link to Collection) below
4 images, with text (header, sub-header, ability to link to Collection) below
5 images, with text (header, sub-header, ability to link to Collection) below
6 images, with text (header, sub-header, ability to link to Collection) below
Module to feature editorial content
1 image, with text (header, sub-header, ability to link to page) below
Make it stand out from other modules (eg, by enclosing it in a box or some other design element)
Text blocks
Option for all text (header, sub-header, body copy, ability to link to page)
Options for text (header, sub-header, body copy, ability to link to page) + image
Option to add CTA button
Shoppable product grids
Filter on the left for:
Brand
Category
Color
Material
Price
Options for 2, 3, 4, 5, 6 columns
Options for any number of products to be viewable
Module Architecture by Pages
Homepage:
1(a)
3
4(a)
4(c)
5
Brands landing page:
1(b)
6(b)
4(3)
4(3)
4(1)
Individual brand pages:
2
7
Collections landing page
1(a)
6(b)
4(3)
4(3)
4(1)
Individual collections pages:
1(a)
6(b)
7
Feedback to come for PDP, Sustainability, Become a Seller pages
PRELIMINARY NOTES REVIEWED ON 5/14 CALL
Homepage: Use Net a porter as main reference point
Big hero image with text on top (header and subheader)
Options for 1 image or 2 images
Options for text placement (left, center, right)
Shoppable, scrollable product panel with text on the left
Four different Collections modules, which can also be used for Sustainability call-out: 1 image, 2 images, 3 images, 4 images
Module for Sustainability call-out (1 image + text), same as Collections module, but differentiated in design (eg, in a box or differentiated by color)
Brands landing page:
Hero image
Text block with optionality for 0, 1 or 2 images
Collection pages from modules that you are creating for the homepage
Individual Brand pages: Use Net a porter as main reference point
Thin hero image
Text on top of hero image with header and paragraph text
Shoppable product grid: 2, 3 and 4 image views
Filter on the left
Brand
Category
Color
Material
Price
Collection pages:
Big hero image with text (same modules as hero module on homepage)
Text block with optionality for 0, 1 or 2 images (see Brands landing page)
Shoppable product grid with filters as per Brand pages
Shoppable products throughout: Make sure we can hover over image to see next image
Nav bar:
Less nesting
Enable emphasis on one of the nav bars
Start Selling as box on nav bar?
Please add links here, along with a sentence or two on what you like about the sites
-A good example. Like the way they distribute the content across site (see LL presentation for reference)
On the designers page – I like They have a feature brand on top
The photos are all white background (here is where the similutaions are supposed to be) but if you place the mouse on top then you have a catalog photo
Clean PDP, big main image, with additional images on the right side of the page, allowing the big main image to take up a lot of space on the left side of the page with the additional images still being visible
I like the homepage, clean way to show lots of shoppable product and various Collections. good mix of larger and smaller thumbnails. I like the slider on the first module of shoppable product
Want to print your doc? This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
Website inspo