shopping.com shoes segment redesign

12
Information Architect: Abi Jones Client: Shopping.com Project: Shoes Segment Redesign Deliverables: On-site Working Sessions, Wireframes, and Interaction Concepts

Post on 18-Oct-2014

1.312 views

Category:

Design


0 download

DESCRIPTION

 

TRANSCRIPT

Page 1: Shopping.com Shoes Segment Redesign

Information Architect: Abi Jones

Client: Shopping.com

Project: Shoes Segment Redesign

Deliverables: On-site Working Sessions, Wireframes, and Interaction Concepts

Page 2: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Shoes Main Page Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 1 / 11

NOTES

800 p

x

Editorial Content

Home > Clothing and Accessories > Shoes

Casual Canvas

Boys Athletic Shoes Girls Sandals

Kids Rain Boots

Product Image Product Image

Product ImageProduct Image

Women's Shoes

Boots Mules Pumps Sandals Tennis Shoes

More Women's Shoes:

Women's Shoe Type Women's Shoe StyleWomen's Shoe Type Women's Shoe StyleWomen's Shoe Type Women's Shoe StyleWomen's Shoe Type Women's Shoe StyleWomen's Shoe Type Women's Shoe StyleWomen's Shoe Type See all women's shoes...

BACK TO SCHOOL

1

2 3

4

67

1. BreadcrumbsThese links help users find their way back to broader categories and act as a wayfinding tool within each page.

2. Editorial ContentTaking a cue from the desire for This section of the shoes main page will include seasonal editorial content. The top of this page is divided into approximate thirds, with the main editorial imagery taking 2/3 of the space and the smaller associated editorial content using 1/3 of the row.

3. Related Editorial ContentThis area shows items related to the editorial content. Clicking on one of these boxes takes the user to a styled category page for that item with an editorial header.

4. Scannable TitlesWe recommend that Shopping.com offer sorted shoe categories below the fold, each with a highly visible, left-oriented section title.

5. Page FoldOn each wireframe the fold is shown at 550 pixels to illustrate content visible for a user browsing with Internet Explorer 7 at 1024x768 resolution, with a bookmark bar, but no toolbars.

6. Visual Primary NavigationThe content space here shows product types and invites a users to enter category pages. Or it can be used to highlight featured products and take the user to a product page.

7. Search Engine Optimized LinksFurther selection tools include an index-type list of shoes by type and style, plus a link that will take the user to a gender-based category page.

5

Page 3: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Gender and Brand Known Concept 2 Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 2 / 11

NOTES

800 p

x

Women's Puma Shoes

Product Image

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Bestseller: Puma Moto GP

Compare Prices >>

Shopping.com Suggests

Recently Viewed:

Information about this shoe goes in each bullet point

Information about this shoe goes in each bullet point

Information about this shoe goes in each bullet point

Information about this shoe goes in each bullet point

Lowest Price: $35.98

Product Image

Product Image

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Product Image

Select Color(s):

Select Size(s):

5

289 Items Found Sort results

Select Brand(s):

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

5

1

2

3

6

1. Sorting ToolsThis column appears when a user makes a category selection or arrives at a search results page from internal or external search.

2. Expanding ResultsSelected gender, brand, size, color and so on are shown in the top of the column. Underneath each category is a link that will clear that selected item and reload results based on the new variables.

3. Narrowing ResultsOnce inside a category, users can narrow results via gender, size, color, brand, seller and price range.

4. Brand SelectionWhether users enter these via main page category selection or enter the site from external search engines, sorting by brand helps enlarge or winnow the results pool.

5. Featured ProductSearch results and category pages include 'Bestsellers', pre-selected products that match initial search results.

Upon rollover, the boxes to the left of the main product image reveal multiple product views. Upon rollover, the boxes below the main product image reveal different product colors.

6. Page Sorting ToolsThese drop down menus help the user sort the page by number of results shown (suggested: 30/90/All, with 'All' available for search results below a present number of items). The 'Sort Results' page should allow for sorting by price, style name, brand and best match.

7. Selection TechnologyFor the ideal customer experience, we recommend that selection tools automatically load results using Asynchronous Javascript. Additionally, the URL in the browser bar should update to show choices and allow for easy bookmarking of a sorted page

Department shown: Women's

See all genders

Brand shown: Puma

See all brands

Adidas

Ariat

Asics

Born

Clarks of England

4

Page 4: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Gender and Brand Known Concept 1 Collapsed Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 3 / 11

NOTES

800 p

x

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Bestseller: Puma Moto GP

Shopping.com Suggests

Recently Viewed:Product Image

Product Image

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Product Image

Select Color(s):

Select Size(s):

5

289 Items Found Sort results

Select Price Range:

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

Puma

Name of Shoe

Puma

Name of Shoe

Puma

Name of Shoe

Product Image

Product Image

Product Image

Product Image

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Select Sellers:

1

Amazon.com

Shoes.com

Department shown: Women's

See all genders

2

3

1. Featured Item CollapsedWhen a user chooses to collapse the featured item it remains in the collapsed state until site cookies are cleared or updated.

2. Related Item SuggestionsThe top of the left column featured items related by brand, color, price and gender. Rolling over the arrow will move the image carousel.

3. Recently Viewed ItemsActing as a passive 'Save for later' tool, the 'Recently Viewed' portion of the right-hand column shows the last six items viewed at the product level. These images do not show data (brand/name/price) until rolled over. Upon rollover, the Quick View option appears and the user can see more information about each previously viewed product. At the bottom of the column a link allows the user to see all products viewed during a session.

Page 5: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Gender and Brand Known Concept 2 Wireframe 1

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 4 / 11

NOTES

800 p

x

Product Image

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Bestseller: Puma Moto GP

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Select Color(s):

Select Size(s):

5

289 Items Found

Sort results

Select Price Range:

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Puma

Name of Shoe

From $45.99

Product Image

Puma

Name of Shoe

From $45.99

Product Image

From $35.99 >>

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Select Sellers:

Amazon.com

Shoes.com

1

Department shown: Women's

See all genders

1. Featuring Item AlternateThis version of the featured item page brings more product images above the fold. No 'recently viewed' or 'Shopping.com Suggests' items are included in this view.

Page 6: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Gender and Brand Known Concept 2 Post-Winnowing Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 5 / 11

NOTES

800 p

x

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Department shown: Women's

Select Color(s):

Select Size(s):

5

289 Items Found Price: Low to High

Select Price Range:

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Puma

Name of Shoe

From $45.99

Product Image

Puma

Name of Shoe

From $45.99

Product Image

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Colors selected: Red Green Blue

See all genders

See all colors

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

1

2

1. Alternate Featured Item RemovedWhen a user makes sorting selections that do not include the featured item (in this example, colors), the featured item is removed from the page and old sorted results are shown.

2. Selected ColorsSorting tools are shown as active in two ways:a. Listed at the top of the left column with the option for removal and results expansion.b. Shown as selected via background color or heaver outline in the bottom portion of the left column.

Page 7: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Product Results Concept 2 Post-Winnowing Wireframe with Left Column

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 6 / 11

NOTES

800 p

x

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Department shown: Women's

Select Color(s):

Select Size(s):

5

289 Items Found

Price: Low to High

Select Price Range:

30 per page

Showing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Colors selected: Red Green Blue

See all genders

See all colors

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Shopping.com Suggests

Recently Viewed:

Product Image

Product Image

Product Image

This wireframe shows how the 'Shopping.com Suggests' and 'Recently Viewed' items fit into the Alternate layout wireframe.

Product Image

Bestseller: Puma Moto GP

From $35.99 >>

Page 8: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Product Results Concept 2 Post-Winnowing Wireframe - No Featured Product

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 7 / 11

NOTES

800 p

x

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Department shown: Women's

Select Color(s):

Select Size(s):

5

289 Items Found Price: Low to High

Select Price Range:

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Product Image

Product Image

Colors selected: Red Green Blue

See all genders

See all colors

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Shopping.com Suggests

Recently Viewed:

Product Image

Product Image

Product Image

This wireframe illustrates the layout changes that occur when a featured product is not included in the refined results list.

Page 9: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Quick View Button Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 8 / 11

NOTES

800 p

x

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Bestseller: Puma Moto GP

Shopping.com Suggests

Recently Viewed:Product Image

Product Image

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Product Image

Select Color(s):

Select Size(s):

5

289 Items Found Sort results

Select Price Range:

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

Puma

Name of Shoe

Puma

Name of Shoe

Puma

Name of Shoe

Product Image

Product Image

Product Image

Product Image

Select Sellers:

Amazon.com

Shoes.com

Quick View

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Department shown: Women's

See all genders

1. Quick View FunctionUpon rollover a button reading 'Quick View' appears. If a user clicks on the product, then he or she will go to the product page. If a user clicks on the 'Quick View' button, then he or she will see the new interface overlaid on the current screen.

1

Page 10: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Quick View Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 9 / 11

NOTES

800 p

x

Women's Puma Shoes

Puma > Women's > Shoes

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Puma

Name of Shoe

From $45.99

Bestseller: Puma Moto GP

Shopping.com Suggests

Recently Viewed:Product Image

Product Image

Product Image

Product Image

Product Image

Product Image

See Fewer Results:

See More Results:

Product Image

Select Color(s):

Select Size(s):

5

289 Items Found Sort results

Select Price Range:

30 per pageShowing:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Puma

Name of Shoe

Puma

Name of Shoe

Puma

Name of Shoe

Puma

Name of Shoe

Product Image

Product Image

Product Image

Product Image

Product Image

Puma Name of Shoe

Don't see your size? We can tell you when its in stock!

Sizes Available:

Colors Available: Email it to me

Send to a friend

Add to Fitting Room

From $45.99

Call to Action >>

5 5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Select Sellers:

Amazon.com

Shoes.com

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

1

2

3

Department shown: Women's

See all genders

1. Quick View FunctionalityThe 'Quick View' window is opened by clicking on the 'Quick View' button and closed by clicking on the X in the upper-right corner. The user may also leave the quick view by choosing one of the buttons in the quick view window or clicking on the name or image of another product on the page. Clicking on another product on the page will open that product page in the same window.

Ideally, rolling over the product in the 'Quick View' will reveal a magnified version of each area.

2. Call to ActionSelecting this button will take the user to the product page.

3. Size and Color IndicatorsThese lists are not selectors. Instead, they reveal the sizes and colors available for the shown item. Sizes and colors not available are shown grayed out.

Page 11: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Product Page with Deals Wireframe

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 10 / 11

NOTES

800 p

x

Product Image

Puma > Women's > Shoes > Puma Moto GP

Puma Moto GP

Shopping.com Suggests

Recently Viewed:

Product Image

Product Image

Product Image

Sort results

Share this shoe:

Email to a friend

Add to Fitting RoomDon't see your size? We can tell you when its in stock!

$65.95(Includes tax & shipping)

Seller ID

Information about this shoe goes in each bullet

Information about this shoe goes in each bullet

Information about this shoe goes in each bullet

Information about this shoe goes in each bullet

Free Shipping both ways

360 Degree Product Views

Colors Available: Name, Name, Name

Sizes Available: #, #, #, #

$62.95(Includes tax & shipping)

Seller ID Free Shipping both ways

360 Degree Product Views

Colors Available: Name, Name, Name

Sizes Available: #, #, #, #

See Fewer Results:

Select Color(s):

Select Size(s):

5

Select Price Range:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Select Sellers:

Amazon.com

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Shoes.com

Website.com

Website.com

Website.com

Website.com

Website.com

Tax and shipping for ZIP 94101 | Change ZIP

1

5

6

2

3

4

1. Multiple Product ViewsUpon rollover the central product image changes to reveal product images from different angles.

2. Multiple Color ViewsUpon rollover the main product image changes to reveal the different color options.

3. Product DetailsRelevant product details are included once a user has drilled down the product level.

4. Sharing ToolsUsers can add products to a fitting room, request an email when a merchant carries a product in his or her size and send a preferred product to a friend.

5. Seller Information and RatingEach Deal includes the Seller ID, a rating and review tally.

6. Size and Color InformationDeals include color and size information to prevent customer confusion and/or dissatisfaction.

1,543 Reviews

400 Reviews

Page 12: Shopping.com Shoes Segment Redesign

Shopping.com Shoes SegmentVERSION 1 | Product Page with Magnification

Shopping-Shoes-Wireframe-v03 | DOCUMENT CREATION DATE: Mon Jul 28 2008 | MODIFIED: Mon Jul 28 2008 - BY: Abigail Jones PAGE: 11 / 11

NOTES

800 p

x

Product Image

Puma > Women's > Shoes > Puma Moto GP

Puma Moto GP

Shopping.com Suggests

Recently Viewed:

Product Image

Product Image

Product Image

Sort results

Share this shoe:

Email to a friend

Save for laterDon't see your size? We can tell you when its in stock!

$65.95(Includes tax & shipping)

Seller ID

Information about this shoe goes in each bullet

Information about this shoe goes in each bullet

Information about this shoe goes in each bullet

Information about this shoe goes in each bullet

Free Shipping both ways

360 Degree Product Views

Colors Available: Name, Name, Name

Sizes Available: #, #, #, #

$62.95(Includes tax & shipping)

Seller ID Free Shipping both ways

360 Degree Product Views

Colors Available: Name, Name, Name

Sizes Available: #, #, #, #

See Fewer Results:

Select Color(s):

Select Size(s):

5

Select Price Range:

5.5 6 6.5 7

7.5 8 8.5 9 9.5

10 11

Select Sellers:

Amazon.com

Under $25.00$25-$49.99$50-$99.99$100-$199.99Over $200.00

Shoes.com

Website.com

Website.com

Website.com

Website.com

Website.com

Tax and shipping for ZIP 94101 | Change ZIP

1. Close-up ViewsWhen a user rolls over the main product image a box appears to the right of the image, revealing the magnified portion.

The magnification can only be used on the default product image.

Pro Im

1