NET-A-PORTER AMP Hackathon

15
1

Transcript of NET-A-PORTER AMP Hackathon

Page 1: NET-A-PORTER AMP Hackathon

1

Page 2: NET-A-PORTER AMP Hackathon

22

THE TEAM

Page 3: NET-A-PORTER AMP Hackathon

3

A M P U P YO U R L I F E

AMP PAGE AND PRODUCTION TOOLING

Page 4: NET-A-PORTER AMP Hackathon

44

DESIGNER PAGES:PRIORITY #1

Page 5: NET-A-PORTER AMP Hackathon

5

LU X U RY FA S H I O N I S D E S I G N E R F O C U S E D

Source: Google Search Console

16 out of 25 of the top impressions-driving terms are simply designer names.

This is a great entry point to capture new visitors who may not already have a product in mind. Giving these users the best initial impressions and letting them quickly start exploring the product selection is critical.

Page 6: NET-A-PORTER AMP Hackathon

6

W H Y F O C U S O N D E S I G N E R PAG E S ?

* Business goal of becoming #1 second-party source for designer searches* Designer pages are the most reliable, sources of traffic* Current template one of few that allows customisable text* Filters more controllable than other category-level pages

While Product pages have more immediate commercial value there are 923 designer pages and 218,826 product pages (2016 data).

By optimising this highest value page type, we will most effectively engage site visitors.

Page 7: NET-A-PORTER AMP Hackathon

7

M O B I L E S I T E S P E E D S E V E R E LY I M PAC T S E N G AG E M E N T

Unsurprisingly, longer waits to access to page content are particularly impactful on designer pages, hurting:

• Conversions• Bounce rate• Engagement

£0.00

£5.00

£10.00

£15.00

£20.00

£25.00

£30.00

£35.00

£40.00

<1 secs 1-2 secs 2-3 secs 3-5 secs 5-10 secs 10-20 secs20-30 secs

Revenue per Unique Visitor

Time Conversion Rate

Bounce Rate

Average Page Depth

<1 secs 4.29% 29.51% 30

1-2 secs 3.65% 34.68% 30

2-3 secs 3.14% 33.71% 31

3-5 secs 2.91% 33.34% 28

5-10 secs 1.96% 36.26% 24

10-20 secs

1.96% 41.54% 21

20-30 secs

1.71% 42.37% 31

Page 8: NET-A-PORTER AMP Hackathon

88

HOW WAS THIS DONE?

Page 9: NET-A-PORTER AMP Hackathon

H O W WA S T H I S D O N E ?

SITE FURNITURE

Page 10: NET-A-PORTER AMP Hackathon

H O W WA S T H I S D O N E ?

SITE FURNITURE- WEBPACK LOADER CUSTOM STYLE ATTRIBUTE

BUG: https://github.com/webpack-contrib/style-loader/pull/119/files

Page 11: NET-A-PORTER AMP Hackathon

H O W WA S T H I S D O N E ?

LISTING PAGE

Page 12: NET-A-PORTER AMP Hackathon

H O W WA S T H I S D O N E ?

LISTING PAGEDLP API : https://goo.gl/75xSdK

Page 13: NET-A-PORTER AMP Hackathon

H O W WA S T H I S D O N E ?

CI AMP VALIDATOR: https://goo.gl/rN0Z7i

Page 14: NET-A-PORTER AMP Hackathon

H O W WA S T H I S D O N E ?

AMP CACHE INVALIDATOR: https://goo.gl/Utg0yv

Page 15: NET-A-PORTER AMP Hackathon

1515

DEMO- DOCKERIZED MICROSTACK