Transcription
Samsung PayIdentity GuidelinesFebruary 2018
Samsung Pay Identity GuidelinesProprietary & ConfidentialSamsung Pay is a mobile payment app youcan use virtually everywhere you swipe ortap your credit card.This document was created to setparameters for using the elements andvisuals that make up our unique brandidentity.OverviewFollow these guidelines to help SamsungPay become instantly recognizable,wherever people see it.2
Samsung Pay Identity GuidelinesProprietary & ConfidentialTable of contentsS01 LogosS03 App iconS06 Assets05 Horizontal & vertical18 App icon32 Assets06 SizingS04 In-app & onlineS07 Contacts07 Logo clear space20 In-app & online button34 Contact08 Black logo2109 White logo22 Button sizing10 Co-branding23 Button clear space11Text24 Partner buttons12What not to do (don’ts)25 Partner button sizingCTA buttons13 Wordmark & text combination26 In-app & online markS02 Colors27 Other button usage15 Palette overview28 What not to do (don’ts)S05 ATM30 ATMLogosColorsApp iconIn-app & onlineATMAssetsContacts3
Samsung Pay Identity GuidelinesProprietary & ConfidentialLogosLogosColorsApp iconIn-app & onlineATMAssetsContacts4
Samsung Pay Identity GuidelinesProprietary & ConfidentialHorizontal& verticalVertical lock-upThe Samsung Pay logo isour core visual asset.When people see it instore windows or nearcheckout terminals, theyknow they can useSamsung Pay. It’s made upof the Samsungmasterbrand logo and thePay service wordmark.Scale ratiosx height of masterbrand logox1.54 xThe logo must appear in alock-up, and “Pay” shouldnever appear on its own.Horizontal lock-upx1.54 xLogosColorsApp iconIn-app & onlineATMAssetsContacts5
Samsung Pay Identity GuidelinesProprietary & ConfidentialSizingVertical lock-up minimum sizeOur sizing guidelines helpensure legibility across printand digital mediums.PrintDigitalVertical lockupFor print, the minimumheight is 15mm.24px24px15mm15mmFor digital, the minimumheight should be 24px.Horizontal lockupFor print, the minimumheight is 8mm.Horizontal lock-up minimum sizeFor digital, the minimumheight is 13px.PrintDigital8mm8mmLogosColorsApp icon13pxIn-app & onlineATMAssetsContacts6
Samsung Pay Identity GuidelinesProprietary & ConfidentialLogoclear spaceVertical lock-upAn area of clear space must beleft around each edge of thelogo. This allows the logo tobreathe and makes it easier torecognize. Don’t place othervisual elements within thisexclusion zone.Scale ratiosx height of masterbrand logo0.5x0.5x0.5x0.5xThe clear space is equal to0.5x, or half the height of themasterbrand.0.5x0.5xHorizontal lock-up0.50x0.50x0.50x0.50x0.45xLogosColorsApp iconIn-app & onlineATMAssetsContacts7
Samsung Pay Identity GuidelinesProprietary & ConfidentialBlack logoFor monotone applications,the black version of thelogo must be used ifpositioned on a whitebackground.Logo placementon photographyWhen placing the logo ontop of a photo, make surethe photo has a lightbackground. Also, choosethe logo that will give thehighest level of contrast.Remember to pay attentionto the clear space rules toavoid placing the logo overcluttered areas of the photo.Logos01. Vertical lock-up02. Vertical lock-up03. Vertical lock-up04. Vertical lock-upBlack logo on white backgroundBlack logo on grey backgroundBlack logo placed over light tonephotographyBlack logo placed over photographysitting on an area of tone no darker than25% black01. Horizontal lock-up02. Horizontal lock-up03. Horizontal lock-up04. Horizontal lock-upBlack logo on white backgroundBlack logo on grey backgroundBlack logo placed over flat area oflight tone photography adhering toclear space rulesBlack logo placed over photographysitting on an area of tone no darker than25% black0303ColorsApp iconIn-app & onlineATMAssetsContacts8
Samsung Pay Identity GuidelinesProprietary & Confidential01White logo01For monotone applications,the white version of thelogo must be used ifpositioned on a black ordark background.05020306080703. Vertical lock-up04. Vertical lock-upWhite logo on black backgroundWhite 06logo on blue backgroundWhite logo placed over dark tonephotographyWhite08logo placed over photographysitting on an area of tone no darkerthan 25% white03040804030101. Horizontal lock-up02. Horizontal lock-up01White logo on black backgroundWhite logo on blue background050503. Horizontal lock-up04. Horizontal lock-up0506White logo placed over flat area ofdark tone photography adhering toclear space rules0206White logo placed over photographysitting on an area of tone no darkerthan25% white0707080402060208070803030403Logos0702. Vertical lock-up07ColorsApp iconIn-app & online04ATMAssetsContacts060501. Vertical lock-up02Logo placementon photographyWhen placing the logo ontop of a photo, make surethe photo has a darkbackground. Also, choosethe logo that will give thehighest level of contrast.Remember to pay attentionto the clear space rules toavoid placing the logo over01cluttered areas of the photo.029
Samsung Pay Identity GuidelinesProprietary & rientationThere are two lock-ups for cobranding situations; horizontaland vertical. You should use thethe horizontal lock-up for mostinstances. The vertical lock-up isonly for tall thin formats, such asonline skyscraper banners.OrientationPrint01. HorizontalPartner logo placed to the left of the Samsung Pay logo at the same height as theSamsung Pay logo or centered above the Samsung Pay logoHorizontal02. VerticalLOGOPartner logo centered above the Samsung Pay logo, and proportionally sizedto the02Samsung Pay logoLOGO0201SizingPartner logos should alwaysappear the same size or smallerthan Samsung sApp iconIn-app & onlineATMAssetsContacts
Samsung Pay Identity GuidelinesProprietary & Confidential11TextCorrect usageSamsung Pay can be writtenusing regular text in body copy orwhen all other payment optionsare in regular text too.01. Title caseSamsung PaySAMSUNG PAYSamsungSamsungPay Pay SAMSUNGSAMSUNGPAY PAYNOTE: Only to be used in UI’s where the type style is alluppercaseText-onlyIn a text-only format, SamsungPay should be the same font andweight as the rest of thedocument. Also, be sure to usetitle-case. In other words, the “S”in Samsung, and the “P” in Payshould be capitalized.NOTE: Only to be used in UIs where the type style is all uppercaseSamsung PayIncorrect usageUppercaseSamsung Pay should only bewritten in uppercase when thetype style of the UI is alluppercase. Samsung Payshouldn’t be written in uppercasein body copy.SamsungSamsungPayPaySamsung PAYNOTE: Only to beNOTE:usedOnlyin UI’stowherebe usedtheintypeUI’s wherestyle istheall type style is alluppercaseuppercaseSAMSUNG PAYNOTE: Only to be used in UI’s where the type style is alluppercase01. Mixed font weights / Pay in bold02. Title case Samsung / uppercase Pay03. Uppercase Samsung / title case PaySamsungSamsungPayPaySamsung PAYSAMSUNG Pay04. Uppercase bold Samsung /mixed case regular PaySAMSUNGSAMSUNGPay PaySamsungSamsungPay Pay SamsungSamsungPAY PAYTranslationsNever translate “Samsung Pay”into other languages.Logos02. All uppercaseColorsApp iconIn-app & onlineATMAssetsContacts
Samsung Pay Identity GuidelinesProprietary & ConfidentialWhat notto do (don’ts)Incorrect usageAlterationsNever recreate or alter theSamsung Pay logo in any way.01. Don’t use other colors apart from Samsung Payprimary colors02. Don’t outline the logo03. Don’t use gradients04. Don’t position the logo at angles05. Don’t add drop shadows or other effects06. Don’t abbreviate07. Don’t use Pay in another font08. Don’t use Pay alone09. Don’t re-size or reposition the lock-upThe following examples showincorrect logo use.payLogosColorsApp iconIn-app & onlineATMAssetsContacts12
Samsung Pay Identity GuidelinesProprietary & ConfidentialWordmark& textcombinationNever recreate the Samsung Paylogo. Don’t try to combine theSamsung masterbrand or Paywordmark with regular text.01. Masterbrand Samsung / Pay text title case02. Masterbrand Samsung / Pay text uppercasePayPAY03. Samsung text uppercase / Pay wordmark04. Samsung text title case / Pay wordmarkSamsungSAMSUNGLogosColorsApp iconIn-app & onlineATMAssetsContacts13
Samsung Pay Identity GuidelinesProprietary & ConfidentialColorsLogosColorsApp iconIn-app & onlineATMAssetsContacts14
Samsung Pay Identity GuidelinesProprietary & ConfidentialPaletteoverviewPrimary colorsSamsung Pay uses astreamlined version of themasterbrand color palette,divided into two colorgroups: primary colors andsecondary colors.Primary colorsOur overall brand look andfeel utilizes a combinationof black and white withSamsung Blue in almostall of our visual elements.WhiteCMYK 0/0/0/100RGB 0/0/0HEX 000000CMYK 0/0/0/0RGB 255/255/255HEX FFFFFFSamsung BluePMS 286 CCMYK 100/80/0/0RGB 20/40/160HEX 1428A0Sky BluePMS 3005 CCMYK - 100/34/2/0RGB - 0/119/200HEX - 0077C8Sea BluePMS 306 CCMYK - 80/0/4/0RGB - 0/179/227HEX - 00B3E3TealPMS 3265 CCMYK - 66/0/39/0RGB - 0/195/178HEX - 00C3B2CloverPMS 2285 CCMYK - 40/0/90/0RGB - 151/214/83HEX - 97D653SaffronPMS 1365 CCMYK - 0/28/73/0RGB - 255/181/70HEX - FFB546CoralPMS Warm Red CCMYK - 0/80/70/0RGB - 255/67/55HEX - FF4337Secondary colorsSecondary colorsSecondary colors should beused to support the primarycolors. They can be usedacross UX and anyillustrations, or othergraphic elements, helping totell the Samsung Pay story.LogosBlackColorsApp iconIn-app & onlineATMAssetsContacts15
Samsung Pay Identity GuidelinesProprietary & ConfidentialPaletteoverviewGrayGrayVarious tones of warm grayprovide a more human feel forour brand. We use highcontrast that never feels tooneutral when using gray tones.LogosColorsGray 1RGB - 46/44/43HEX - 2E2C2BGray 2RGB - 110/106/105HEX - 6E6A69Gray 3RGB - 215/210/203HEX - D7D2CBGray 4RGB - 247/243/240HEX - F7F3F0App iconIn-app & onlineATMAssetsContacts16
Samsung Pay Identity GuidelinesProprietary & ConfidentialApp iconLogosColorsApp iconIn-app & onlineATMAssetsContacts17
Samsung Pay Identity GuidelinesProprietary & ConfidentialApp iconIconThe default app iconshould only be used onlineto represent the app itself.It shouldn’t be used in printmaterials, nor in place of theSamsung Pay logo. For thelatest version of the appicon, please reach out to thecontact on page 34.LogosColorsApp iconIn-app & onlineATMAssetsContacts18
Samsung Pay Identity GuidelinesProprietary & ConfidentialIn-app& onlineLogosColorsApp iconIn-app & onlineATMAssetsContacts19
Samsung Pay Identity GuidelinesProprietary & ConfidentialIn-app &online buttonThe Samsung Pay button is for useon the checkout page or productdetail page of participating thirdparty apps and websites.Samsung Pay black buttonSamsung Pay white buttonSamsung black button on white backgroundSamsung white button on black backgroundThe Samsung Pay button shouldalways appear in your app orwebsite as a directly clickableasset that immediately launchesinto the Samsung Pay experience.The Samsung Pay button shouldnever be used in marketingcommunications.Button visibilityTo ensure best visibility andsufficient contrast, the blackSamsung Pay button should beused on white and light coloredbackgrounds, while thewhite Samsung Pay buttonshould be used on black and darkcolored backgrounds.LogosColorsApp iconIn-app & onlineATMAssetsContacts20
Samsung Pay Identity GuidelinesProprietary & ConfidentialCTA buttonsSamsung Pay black CTA buttonsPay withThe “Pay with Samsung Pay“ buttonis used to notify users that they canpurchase items and servicesin-app with Samsung Pay.“Pay with” CTAAdd toThe "Add to Samsung Pay” buttonis used in banking apps to notifyusers that they can add their creditor debit card information intoSamsung Pay. For additionalinformation on this functionality,please reach out to yourdesignated representative.Add toPay with“Donate with” CTADonate withThe “Donate with Samsung Pay”button is used to notify users thatthey can donate to nonprofitorganizations with Samsung Pay.Logos“Add to” CTADonate withColorsApp iconIn-app & onlineATMAssetsContacts21
Samsung Pay Identity GuidelinesProprietary & ConfidentialButton sizingThe sizing ratios displayed shouldbe followed to ensure clearreadability on the Samsung Paybutton.Samsung Pay black CTA buttonsMinimum sizeScale ratiosX height of masterbrand logoAt minimum the button should have a width of 139ptand a height of 30ptarc is equal to a circle with a diameter of XSamsung Pay payment buttons canbe equal to or larger than similarpayment or checkout buttons. Thebutton should never be smaller thanother buttons.30ptXXFlexible widthThe width of the button can beextended to match otherenvironmental elements. Whenextending, the width should alwaysbe extended evenly on both sides ofthe mark.0.5X3XX139ptarc is equal to a circle with a diameter of XAdjustable widthWidth can be adjusted to match other environmental elementsPay withX0.5XX0.5X3XXcheckoutotherLogosColorsApp iconIn-app & onlineATMAssetsContacts22
Samsung Pay Identity GuidelinesProprietary & ConfidentialButtonclear spaceSamsung Pay black CTA buttonsPaddingAn area of clear space must be leftaround each edge of the button.This allows the button to breatheand makes it easier to recognize.Graphics, typography, or otherbuttons should not be placedwithin this exclusion zone.Minimum paddingY height of buttonY0.1Y0.1YPay withY0.1Y0.1YLogosColorsApp iconIn-app & onlineATMAssetsContacts23
Samsung Pay Identity GuidelinesProprietary & ConfidentialPartnerbuttonsSamsung Pay black partner buttonsThere are two lock-ups for partnerbutton situations: horizontal andvertical. You should use thehorizontal lock-up for mostinstances. The vertical lock-upshould only be used if the partnerlock-up is vertical.Partner logo lock upPartner logoPartner logos should alwaysappear as a 1:1 height ratio toSamsung Pay mark for horizontalplacement and 1:1 height ratio toSamsung Pay logo for verticalplacement.PartnerlogoLogosColorsApp iconIn-app & onlineATMAssetsContacts24
Samsung Pay Identity GuidelinesProprietary & ConfidentialPartnerbutton sizingSamsung Pay black partner buttonsWhen using a partner button,follow the sizing ratios displayed toensure clear readability.Scale ratiosx height of masterbrand logoA divider bar should be used toseparate the Samsung Pay logofrom the partner logo. A white barshould be used on black buttonsand a black bar should be onwhite buttons.Partner logoXXWhen using a horizontal lock-up,the padding between the dividerand each logo should be 0.5x.When using a vertical lock-up, thepadding between the divider andeach logo should be X3X0.5XXLogosColorsApp iconXIn-app & onlineATMAssetsContacts25
Samsung Pay Identity GuidelinesProprietary & Confidential26In-app & onlinemarkUse the Samsung Pay logo toidentify Samsung Pay withinpayment flows when otherpayment brand marks are alsodisplayed by logo.Radial button vertical lock-upRadial button horizontal lock-upPayment methodAlternate radial button horizontal/vertical lock-upPayment methodPayment methodOtherSizeWithin payment flows, match theheight of other lock-ups displayedin this format. The Samsung Paylogo should never appear smallerthan other brand marks.OtherOtherOtherOtherArrow button horizontal lock-upTextSamsung Pay should be displayedin text when other paymentoptions are also displayed in text.Payment methodLogosColorsOtherOtherOtherOtherApp iconIn-app & RText only radial buttonsPayment methodSamsung PayMatch the existing UI font andtypographical style. Don’t imitateSamsung Pay typography.OtherPayment methodArrow button horizontal lock-upPayment methodOtherPayment methodSAMSUNG PAYATMAssetsContacts
Samsung Pay Identity GuidelinesProprietary & ConfidentialRound/SquarebuttonsSecondary shapesIn rare circumstances, a partnermay place the logo on other buttonshapes, as long as the designatedrules are followed.The logo must appear in a lock-up,and “Pay” should never appear onits own. Refer to pages 5 and 22 forlogo and button sizing rules.Clear space must be left aroundeach edge of the logo. Refer topage 7 for clear space rules.Black shapes should be used onwhite and light coloredbackgrounds, and white shapesshould be used on black and darkcolored backgrounds. Refer to page20 for button visibility rules.Reach out to your designatedrepresentative for information onusing round and square buttons.LogosColorsApp iconIn-app & onlineATMAssetsContacts27
Samsung Pay Identity GuidelinesProprietary & ConfidentialWhat notto do (don’ts)Incorrect usageAlterationsNever recreate or alter the SamsungPay button in any way.01. Don’t use Samsung white button on whitebackground or with black stroke02. Don’t use Samsung black button on blackbackground or with white stroke03. Don’t alter the color of the button ormasterbrand/wordmark04. Don’t alter the height ratio of the button to themasterbrand/wordmark05. Don’t add drop shadows or other effects06. Don’t abbreviate07. Don’t use type for the button08. Don’t use the Samsung Pay app icon as a button09. Don’t use lower case for text-only buttonThe following examples showincorrect button use.samsung paySamsung PayLogosColorsApp iconIn-app & onlineATMAssetsContacts28
Samsung Pay Identity GuidelinesProprietary & ConfidentialATMLogosColorsApp iconIn-app & onlineATMAssetsContacts29
Samsung Pay Identity GuidelinesProprietary & ConfidentialATMSample imageThe Samsung Pay logoshould be depicted on ATMscreens of participating banks.For inclusion of Samsung Payin ATMs, or for additionalinformation, please reach out toyour designated representative.OtherLogosColorsApp iconIn-app & onlineATMAssetsOtherContacts30
Samsung Pay Identity GuidelinesProprietary & ConfidentialAssetsLogosColorsApp iconIn-app & onlineATMAssetsContacts31
Samsung Pay Identity GuidelinesProprietary & swww.samsungpay.comColorsApp iconButtonswww.samsungpay.comIn-app & onlineATMAssetsContacts32
Samsung Pay Identity GuidelinesProprietary & ConfidentialContactsLogosColorsApp iconIn-app & onlineATMAssetsContacts33
Samsung Pay Identity GuidelinesProprietary & ConfidentialFor more information, or if you have anyquestions, please contact HQ’s Global brandmarketing team for Samsung Pay below:ContactLogosColorsJenn Song / Directorjh2011.song@samsung.comApp iconIn-app & onlineATMThe information contained herein isproprietary and confidential to Samsung.Any use, copying, retention, or disclosure by anyperson other than the intended recipient, or theintended recipient’s designees, is strictlyprohibited. Samsung Electronics Co. 2018AssetsContacts34
Samsung Pay Identity Guidelines Proprietary & Confidential What not to do (don’ts) Alterations Never recreate or alter the Samsung Pay logo in any way. The following examples show incorrect logo use. 01. Don’t use other colors apart from Samsung Pay primary colors 04. Don’t p
