BARKERS

SITE UPDATES: PRE-LAUNCH

OBJECTIVE: PREPARE EXISTING SITE FOR LIMITED RELEASE LAUNCH

—
GLOBAL
1. Navigation
a. Decrease size of persistent icons (Heart, shopping cart, and hamburger) by 50%
b. Barkers logo on scroll to shrink 50%
c. Mobile - please make menu items fit within site margins. Ref playcoat module image for guidance.

2. Notification Bar
a. Update Notification BG color to: #def200
b. Update font color to: #747474
c. Make font 8 pt. and “x” to 16pt.
d. Ref and source files HERE
3. Pop_over Notification
a. Make popover notification align with design ref HERE
b. Make popover default email capture when notification bar or pre-launch items are selected.
c. Activate Pop over after 10 secs. Being on the page.
4. Menu
a. Please make “Get Help” closer to “Favorites” align with about. See ref. HERE
b. Make “Gift Cards” Singular to “Gift Card”
c. Shop items should read
i. All, Play Coat, Ruff Romper, Neckwear, Gift Card
d. Are we able to lock scrolling on the site until the menu is closed?
5. Secondary pages
a. Please make page “x” 50% smaller

—
HOME

6. P1 — Play Coat Module

a. Update PLAYCOAT mark use limited release SVG mark HERE
b. Update subhead copy to, “Play Fresh. Engineered for Play and Everyday.”
c. While using the existing spacing relationships in intact update CTA to read “Shop”
d. Ref. Desktop - Please make distance between Mark baseline and subhead 60PX and 60PX between subhead
baseline and CTA
e. Move graphic elements once updated closer to the top of the hero image about 90px from top.

7. P2 — Neckwear Carousel
a. While keeping existing sizing relationships please make the carousel smaller so more fits in view. It’s ok if more
than 3 thumbnails are in view at once.
b. Can you make the Carousel trackpad scrollable?

8. P3 — Ruff Romper
a. Update Ruff Romper mark use limited release SVG mark HERE
b. Update subhead copy to, “Romp On With a Simple and Fresh Flex.”
c. Please make the CTA sizing style the same as how Play Coat CTA currently looks.
d. Update CTA to read “Shop”
e. Ref. Desktop - Please make distance between Mark baseline and subhead 45PX and 45PX between subhead
baseline and CTA
 i. Please cap logo height at 70PX
ii. Please Keep left and bottom margin 45PX

9. P4.1 — Flap Cap

a. Can we have the flap cap module eaze in before the Gift cards module so their staggered REF
b. Please make the CTA sizing style the same as how Play Coat CTA currently looks.
c. Ref. Desktop - Please make distance between Mark baseline and subhead 45PX and 45PX between subhead
baseline and CTA
i. Please cap logo height at 70PX
ii. Please Keep left and bottom margin 45PX
10. P4.2 — Gift Card
a. Can we have the Gift Card module eaze in after the Flap Cap module so their staggered REF
b. Please make the CTA sizing style the same as how Play Coat CTA currently looks.
c. Please update subhead to read, “
d. Ref. Desktop - Please make distance between Mark baseline and subhead 45PX and 45PX between subhead
baseline and CTA
i. Please cap logo height at 70PX
ii. Please Keep left and bottom margin 45PX

11. P5 — Social Module

a. Please update each image and have it link to its corresponding link. Links should open new windows (In order
from left to right).
i. Image 1
1. Asset HERE
2. Link to HERE
ii. Image 2
1. Asset HERE
2. Link to HERE
iii. Image 3
1. Asset HERE
2. Link to HERE

—
RETURN POLICY

1. Copy indent
a. Please indent items below subheads to align with subhead copy.
b. Please make, Returns, FAQ, & Return Exceptions collapsible
.
2. Update to final copy
a. Update copy to most recent version HERE

—
FAQ

1. Copy indent
a. Please indent items below subheads to align with subhead copy.
b. Please make subhead “Status” collapsible
2. Bread Crumbs for sub pages
a. Please create site breadcrumbs at the very top of each subpage so users can navigate back to the FAQ page
easily.
b. Please treat it small. Like legal copy.
3. Update to final copy HERE
—
FAQ / WARRANTY

1. Copy indent
a. Please indent items below subheads to align with subhead copy.
b. Please make subhead “Warranty” collapsible
2. Bread Crumbs for sub pages
a. Please create site breadcrumbs at the very top of each subpage so users can navigate back to the FAQ page
easily.
b. Please treat it small. Like legal copy.
3. Update to final copy HERE

—
FAQ / Returns

1. Copy indent
a. Please indent items below subheads to align with subhead copy.
b. Please make subhead “Returns, FAQ, Return Exceptions, ” collapsible
2. Bread Crumbs for sub pages
a. Please create site breadcrumbs at the very top of each subpage so users can navigate back to the FAQ page
easily.
b. Please treat it small. Like legal copy.
3. Update to final copy HERE

—
FAQ / Refunds

1. Copy indent
a. Please indent items below subheads to align with subhead copy.
b. Please make subhead “FAQ” collapsible
2. Bread Crumbs for sub pages
a. Please create site breadcrumbs at the very top of each subpage so users can navigate back to the FAQ page
easily.
b. Please treat it small. Like legal copy.
3. Update to final copy HERE

—
FAQ / Mission

1. Spacing
a. Please make spacing between segments smaller and equal. 70-90PX
2. Update to final copy HERE

—
Contact Us

1. Spacing
a. Please make spacing between drop down menu, Investor relations, and Media Relations equidistant. 70-90px.
2. Link treatments
a. Make all links #0070c9
 b. Remove underlines from all links
c. Please have all links go to “Customersupport@barkersand.co”
i. Prefill subject lines with topic of selected - this may already be working.
3. Subheadlines
a. Please make Media Relations the same font and size as Investor Relations
4. Eyebrow font
a. Please make, “Send us a message, Barkers, Inc. Press, and Barkers, Inc” the same font and size as “Quick Links”
on the FAQ page
5. Change Invest@thebarkers.co to Invest@barkersand.co
6. Change pr@thebarkers.co to Media@barkersand.co
7. Change media@thebarkers.co to Media@barkersand.co

—
Cookie Policy
Privacy Policy
Terms & Conditions
Accessibility Statement

1. Update copy
a. Please use most recent copy HERE

—
PDP > Play Coat
1. Swap Play coat for this Limited release one HERE
2. See copy deck for copy needed across page HERE
3. Update size available to just 20 with 17, 15, 10 Greyed out.
a. Ref yellow color size 4 in current build to see what the size and cta should look like for out of stock items.
b. Update info. Associated with the following sizes,
i. 20
1. Length also fits: 17” - 20”
2. E.g. Breed 1, Breed 2, Breed 3
ii. 17
1. Length also fits: 15” - 17”
2. E.g. Breed 1, Breed 2, Breed 3
iii. 15
1. Length also fits: 10” - 15”
2. E.g. Breed 1, Breed 2, Breed 3
iv. 10
1. Length also fits: 5” - 10”
2. E.g. Breed 1, Breed 2, Breed 3
4. Will the vertical height of the hero image collapse if we use an short image - we still need the asset to be full width though
5. Indent drawer body copy to align with drawer subheads. Ref HERE
6. New Icon for Fresh fit HERE
7. Please indent “In the wild” and subhead copy to align with product benefit headline, “A coat made to keep your pup
covered”
8. Please update each social image and have it link to its corresponding link. Links should open new windows.
a. Image 1
i. Asset HERE
ii. Link to HERE
b. Image 2
i. Asset HERE
 ii. Link to HERE
c. Image 3
i. Asset HERE
ii. Link to HERE
9. Make the 3rd, “Details on Details,” and 4th module, “Share a life” side by side. Also have them eaze in independently.
Details on details should eaze in first then “share a life” Just like how flap cap and gift card on homepage have been
updated.
—
PDP > Ruff Romper
1. Use the updated Play Coat designs as a template for RR.
a. Use copy doc to fill page with content HERE
2. Fly Ruff Romper logo HERE
3. Please update each social image and have it link to its corresponding link. Links should open new windows.
a. Image 1
i. Asset HERE
ii. Link to HERE
b. Image 2
i. Asset HERE
ii. Link to HERE
c. Image 3
i. Asset HERE
ii. Link to HERE

—
PDP > Gift Card
1. Hero image needs to be full width … take not of top right of screen current images comes up short on desktop.
2. Update page copy HERE

—
PDP > NW_SKU_1
1. This should be the template for other Neckwear pages
a. We need 12-13 (Need to confirm)
2. For size only offer one size and instead of a xs, s,m,l - Just put one set of dimensions. ##”x##”
3. When active state you should resemble active state as shown on Playcoat
4. Please indent “You may also like” and subhead copy to align with product benefit headline, “A coat made to keep your pup
covered”
5. Please indent “In the wild” and subhead copy to align with product benefit headline, “A coat made to keep your pup
covered”
6. Change “You may also like” to “More to explore”
7. Update Page with latest copy HERE
8. More to explore Carousel
a. Just like note on homepage - While keeping existing sizing relationships please make the carousel smaller so
more fits in view. It’s ok if more than 3 thumbnails are in view at once.
i. Can you make the Carousel trackpad scrollable?