Upload
others
View
2
Download
0
Embed Size (px)
Citation preview
1920 x 540
There is 1 mobile hero export:
768 x 716
2844 x 800
T I E R 3 / M D C P 2 . 0 V E R S I O N 1 . 1 - M A R 2 1
H O M E PA G EH E R O G U I D E L I N E S
T I E R 3
There are only 2 designed hero assets for Tier 3
homepage, desktop and mobile. Simple.
Depending on your software application, your primary creative asset may vary. Designing within Sketch and Adobe XD,
your main design will be 1920 x 540 and you will export @2x / retina at 3840 x 1080. If using Adobe Photoshop, you’ll
want to create your primary asset at 3840 x 1080 and export this original size, as well as the 1x version, 1920 x 540.
Placing your headlines, copy and CTAs within the SAFE AREA will ensure your content does not overlap with code-
based pagination, scroll arrows and other various interactive elements. This SAFE AREA is universal and applies to all
hero sizing.
The mobile homepage hero is even simpler. One creative file, one asset export, 768 x 716.
Placing your headlines, copy and CTAs within the SAFE AREA will ensure your content does not overlap with code-
based pagination, scroll arrows and other various interactive elements. This SAFE AREA is universal and applies to all
hero sizing.
Questions + comments? Please reach out to the Wunderman Thompson Creative Team.
SCHEDULE A TEST DRIVE
F I N D Y O U R N E X T M A Z D AI N D E E R W O O D , M D
A N E W WAY F O R WA R D H A S A R R I V E D
6 0 P X
6 0 P X
For platforms that cannot accommodate mixed media (video+static) in the main hero, we are permitting the use of a
SUB HERO, posit ioned lower down on the homepage. There is no new asset needed. It will use the same creative and
will be scaled down in code by approximately 75% – any body copy or disclaimers will like scale by 1px size (in the
event copy falls too small, individual creation guides are provided).
Depending on your software application and starting point, these are your 4 desktop hero exports:
3840 x 1080 / 1920 x 540 / 2844 x 800 / 1422 x 400
3840 x 1080
1920 x 540
2844 x 800
1422 x 400
768 x 716
Similarly to the main hero, if you choose to design individual assets for the subhero, you will also export the original
1422 x 400 as well as the @2x retina version, 2844 x 800.
SCHEDULE A TEST DRIVE
F I N D Y O U R N E X T M A Z D AI N D E E R W O O D , M D
A N E W WAY F O R WA R D H A S A R R I V E D
4 0 P X
7 8 P X
DESKTOP HERO 1920 x 540
MOBILE HERO 768 x 716
DESKTOP SUB HERO 1422 x 400
DESKTOP EXPORT x4
MOBILE EXPORT x1
1920 x 540
768 x 716
768 x 716
3840 x 1080
1422 x 400
SAFE AREA 1202 x 422 | TOP MARGIN 40PX | BOTTOM MARGIN 78PX
SAFE AREA 648 x 596 | ALLḋAROUND MARGIN 60PX
MAIN HERO @2x 3840 x 1080
SUB HERO @2x 2844 x 800
MAIN HERO @1x 1920 x 540
MAIN HERO @1x 1422 x 400
SAFE AREA 2404 x 844 | TOP MARGIN 80PX | BOTTOM MARGIN 156PX
SAFE AREA 1780 x 625 | TOP MARGIN 60PX | BOTTOM MARGIN 120PX
SAFE AREA 1202 x 422 | TOP MARGIN 40PX | BOTTOM MARGIN 78PX
SAFE AREA 890 x 310 | TOP MARGIN 30PX | BOTTOM MARGIN 60PX
SAFE AREA 890 x 310 | TOP MARGIN 30PX | BOTTOM MARGIN 60PX
SCHEDULE A TEST DRIVE
F I N D Y O U R N E X T M A Z D AI N D E E R W O O D , M D
A N E W WAY F O R WA R D H A S A R R I V E D
3 0 P X
6 0 P X
MAIN ASSET
MAIN ASSET
EXPORT 1RETINA HERO
EXPORT 1
EXPORT 3NONRETINA HERO
EXPORT 2RETINA SUB HERO
EXPORT 4NONRETINA SUB HERO
MAIN HERO 768 x 716
FINAL DESKTOP EXPORTS FINAL MOBILE EXPORTS
SAFE AREA 648 x 596 | ALLḋAROUND MARGIN 60PX