2015
alcatel one touch
Identity standards brand Guideline
1
TABLE OF CONTENTS
INTRODUCTION
HiSTORY CURRENT LOGO
04 05
BACKGROUND
BRAND PROMISE BRAND VALUE
06 07
IDENTITY
LOGO LOCKUP CLEAR ZONE LOGOTYPE COLORS Logo misuse
08 14 16 20 22 26
BRAND ELEMENTS
PRIMARY TYPE SECONDARY TYPE COLOR PALLETT PATTERN PHOTOGRAPHY
30 31 34 38 42
STATIONERY
BUSINESS CARDS letterhead envelope
51 54 56
APPLICATION
WEB LAUNCHER ICON interface PACKAGING ENVIRONMENT Promotion poster
59 64 66 78 80 86
Contact
Contact info
90
3
HiSTOrY
IntroductIon
hIstory
Alcatel One Touch is a brand within TCL Communication, an international multicultural company which designs, develops, and markets globally a growing range of mobile and Internet devices. TCL Communication is a public company listed on the Hong Kong Stock Exchange (2618.HK) and part of TCL Corporation one of the largest consumer electronics companies in the world. The history of Alcatel One Touch first began as a small company in Mulhouse, France, originally known as Alcatel Alsthom. In 1998, Alcatel Alsthom shifted its focus to the telecommunications industry, spinning off its Alsthom activities and changing the company’s name to Alcatel. Then after that, April 2004, TCL Corporation and Alcatel announced the creation of a mobile phone manufacturing joint venture: Alcatel Mobile Phones, which would later become known as Alcatel One Touch. In 2005, the venture dissolved, and TCL Corporation became the sole owner of Alcatel One Touch
5
brand promise
BACKGround
BRAND PROMISE
Alcatel One Touch makes access to mobile technology simple, designing smart mobile devices that are easy-to-use with the technology people need most at smart prices they can afford. Alcatel One Touch is simple, unexpected, down to earth, and colourful. It is a global brand which has redefined the mobile mass market by making the latest mobile technologies accessible to everyone. It is the first to recognize the mass market’s needs and has since brought choice, variety and flexibility to customers – from operators to consumers. By combining its understanding of local insights and control of the end-to-end manufacturing process, Alcatel One Touch delivers the best user experience with innovative, feature-rich and high performance mobile devices designed with simplicity.
We believe that what makes technology smart is what you can do with it rather than what it can do
7
identity
Logo
Logo
Identity
LOGO
THE FINAL LOGO With this new identity, Alcatel One Touch shows the quality of people’s brand, with the intention of understanding the need of consumers and better enhancing the capacity of mobile technologies, all at the same time, making them easy to use. The logo is a symbol of human, technology, and connection. With this, Alcatel One Touch is ready to reach out to the public and speaking in their language.
9
Identity
LOGO
THE MARK
10
Logo
Logo
Identity
LOGO
LOGO TYPE
These are variations of the logo that are appropriate for application. Usage of them varies upon situation
11
IDENTITY
LOGO
W/ TAGLINE
12
LOGO
LOGO
IDENTITY
LOGO
13
Identity
Lockup
Lockup
6X
10X
4X
1X
1.5X 1X 2.5X
2X
1X
PRIMARY LOCK UP
14
1.5X
24X
Identity
Lockup
Lockup
2X 1X
5X
PRIMARY LOCK UP W/ TAGLINE
This is the relationship between the mark and logotype. It cannot be rearranged or altered. To maximize the impact of the logo it is essential to keep the surrounding space clear as indicated
15
Identity
Clear Zone
Clear zone
2X
PRIMARY LOGO CLEAR ZONE
16
Clear Zone
Identity
Clear zone
W/ TAGLINE
The reason for having a clear zone is to maximise the impact of the logo. It is consequently a space into which no other element must be inserted. This minimum clear space should be maintained on all sizes of the mark. Try to increase the clear space whenever possible. Clear zone is a space into which no other element must be inserted.The colored area indicates the clear or negative space to be left without content.
17
IDENTITY
CLEARZONE
Clear zone
2X
2X
MARK CLEAR ZONE
18
CLEARZONE
IDENTITY
Clear zone
2X
2X
LOGOTYPE CLEAR ZONE
19
Identity
LOGOTYPE
20
Logotype
LogoType
Identity
LOGOTYPE
The base font that the logotype is worked from is Gotham, developed by the Hoefler & Jones Co. It is a square like sans serif with distinctive geometric shape. However, when combining with the circular style mark, a less sharp font was needed; therefore, modifications were added to the font to make it proprietary and suitable to the mark.
21
Identity
Color
COLOR VARIATIONS
22
Color
Identity
COLOR VARIATIONS
COLOR VARIAITION With this new identity, Alcatel One Touch shows the quality of people’s brand, with the intention of understanding the need of consumers and better enhancing the capacity of mobile technologies, all at the same time, making them easy to use. The logo is a symbol of human, technology, and connection. With this, Alcatel One Touch is ready to reach out to the public and speaking in their language.
23
Identity
Color
WHITE ON BLACK
Use a reverse white logo if the background does not provide sufficient contrast with the two other logo.
24
Color
Identity
GREY SCALE
The Black color version should be used in all grayscale printed appli-cations. Please do not convert color to a pure black version.
25
Identity
Logo misuse
LOGO MISUSE
1.
2.
3.
4.
5.
6.
26
Logo Misuse
Identity
LOGO MISUSE
7.
8.
9.
10.
COLOR VARIAITION 1.
Do not use an all black logo on white
2.
Do not rotate logo
3.
Do not use outline
4.
Do not change mark placement
5.
Do not stretch
6.
Do not turn logo upside down
7.
Do not rearrange color
8.
Do not change type position
9.
Do not rotate logo
10.
Do not overlap mark and type
27
Brand elements
The brand elements include primary and secondary typog-raphy, primary and secondary color palettes and pattern development and treatment. This section includes which typefaces are used throughout the branding system and how they were modified for the logotype. The symbol modification is also included to show how the symbol and mark were developed together to become the final mark. The primary and secondary color palettes are shown at full color and also at different percentages (100%, 75%, 50% and 25%). Patterns were throughout the branding and this section shows the six different patterns made, as well as how they are to be applied throughout the system.
29
Brand elements
Typography
PRIMARY TYPOGRAPHY
FRANKLIN GOTHIC Demi/7pt
ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 01234567890
Book Italic/ 7pt
ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 01234567890
Demi/ 88pt + Book/ 26pt
SIM PLE CONNECTION
BOOK EXTRA CONDENSED DEMI EXTRA CONDENED BOOK COMPRESSED BOOK COMPRESSED ITALIC DEMI COMPRESSED DEMI COMPRESSED ITALIC BOOK CONDENSED BOOK CONDENSED ITALIC MEDIUM CONDENSED MEDIUM CONDENSED ITALIC DEMI CONDENSED DEMI CONDENSED ITALIC BOOK BOOK ITALIC DEMI DEMI ITALIC
Demi Italic/ 23pt Demi Italic/ 7pt
ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 01234567890 30
A symbol of human, technology, and connection.
Typogrpaphy
Brand elements
SECONDARY TYPOGRAPHY
GOTHAM ROUNDED Book/ 15pt
Light/7pt
We believe that what makes technology smart is what you can do with it
ABCDEFGHIJKLMN
LIGHT LIGHT ITALIC BOOK
BOOK ITALIC BOLD BOLD ITALIC
OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 01234567890
Book/7pt
Bold Italic/7pt
ABCDEFGHIJKLMN
like a 7AM morning walk
OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 01234567890
Book Italic/7pt Bold/7pt
ABCDEFGHIJKLMN OPQRSTUVWXYZ abcdefghijklmn opqrstuvwxyz 01234567890 31
BRAND ELEMENTS
TYPOGRAPHY
PRIMARY TYPOGRAPHY FRANKLIN GOTHIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPp QqRrSsTtUuVvWwXxYyZz0123456789,.?!/() FRANKLIN GOTHIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPp QqRrSsTtUuVvWwXxYyZz0123456789,.?!/() FRANKLIN GOTHIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPp QqRrSsTtUuVvWwXxYyZz0123456789,.?!/() FRANKLIN GOTHIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPp QqRrSsTtUuVvWwXxYyZz0123456789,.?!/()
PRIMARY TYPOGRAPHY
SECONDARY TYPOGRAPHY
Franklin Gothic is the chosen font as the
Gotham rounded is the secondary
primary typography. It should be used as
typography in this brand. It is to be used
display typography like headers, etc. It is
as body copies or small informations, etc.
important to note that, only four out of the
Unlike the primary typography, six type
entire font family may be used. This is to
families listed here are available to use
ensure brand unity. The fonts to be used are
depending on situations.
book, book italic, demi, and demi italic.
32
TYPOGRAPHY
BRAND ELEMENTS
SECONDARY TYPOGRAPHY GOTHAM LIGHT AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTt UuVvWwXxYyZz0123456789,.?!/() GOTHAM LIGHT ITALIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTt UuVvWwXxYyZz0123456789,.?!/() GOTHAM BOOK AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTt UuVvWwXxYyZz0123456789,.?!/() GOTHAM BOOK ITALIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTt UuVvWwXxYyZz0123456789,.?!/() GOTHAM BOLD AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTt UuVvWwXxYyZz0123456789,.?!/() GOTHAM BOLD ITALIC AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTt UuVvWwXxYyZz0123456789,.?!/()
33
Y
:0
:3
7 :8
K
B
B
C :5 :6 8 5
:
M
G
:1 26 0 4
R
:1
68
:1
G
4
6
9 :8 3 :7
:3
3
:7 45
K
:4
S
C
M
Y
PM
2
:1 G
R :8 6 : 63 B :1 15
7
:7
:2 5 7
34 :5
K
S
PM
Y
C
:8
42 :2 4 10 8 R : 0 :1 B
G
M
:0
4 :7 9 :4 :0 K Y
68
C
M
:6
84 :1
S
S
PM
PM
34
PM
S
:2
97
C
7 :4 :0 M
Y
G
:0
1 46 :7
27 8 :1 20 3 R : 2 :2 B
K
2 :1
S
PM
C
R
K
:1
5 :7 0 :2 M
Y
B
0 : 1 61 : 1 18 :2 G
:0
S PM
:6
53
C
R
2 K
:1
7 :8 8 :5 M
Y
6
5 40 :7
63 :1
0 B
:1
4 :4
G
:1
S PM
C
:7 M
R
G
B
:1
:2
38 : 2 89
0 :0
0 K
:1
5 :2 Y
8
R
1 :4 1 6
35
Brand elements
Color pallette
COLOR PALLETtE
PRIMARY COLORS
The Standard version of Alcatel One Touch logo is made up of two colors shown above. When using the Standard version of the logo, always adhere to the color specifications given in this manual to maintain visual continuity.
SECONDARY COLORS The secondary colors are based upon the main color scheme but are different tones and shades for design purposes. Different tones are allowed to be use, but only at 25%, 50%, 75%.
PMS :
C : 89
R : 41
534
M : 73
G : 61
Y : 43
B : 87
K : 34 PMS :
C : 58
R : 126
7456
M : 65
G : 104
Y:3
B : 168
K:0 PMS :
C:0
R : 242
184
M : 74
G : 104
Y : 49
B : 108
K:0 PMS :
C:7
R : 238
7405
M : 25
G : 189
Y : 100
B : 28
K:0 PMS :
C : 47
R : 127
297
M:0
G : 208
Y : 12
B : 223
K:0
36
brand elements
Color pallette
COLOR PALLETtE
PRIMARY COLORS
PMS :
C : 75
R : 10
7461
M : 20
G : 161
Y:1
B : 218
K:0
PMS :
C : 87
R : 44
653
M : 58
G : 106
Y : 12
B : 163
K:1
PMS :
C : 77
R : 86
668
M : 85
G : 63
Y : 27
B : 115
K : 12
37
BRAND ELEMENTS
PATTERN
38
PATTERN
PATTERN
BRAND ELEMENTS
PATTERN
LINE ART The pattern of this identity is an array of different line art. Organic in nature, these patterns offer a variety of movement, dynamic, and energy. Patterns can range from a few simple line to a tsunami of colorful lines.
39
BRAND ELEMENTS
PATTERN
40
PATTERN
pattern
brand elements
PATTERN
COLOR LIMITS The pattern may have a variety of colors from the brand color pallette, but avoid using too many different color temperature at once unless under special circumstances.
41
Brand elements
photography
PHOTOGRAPHY
SUBJECT The subject of photography should always reflect the brand direction. The photo must appear friendly, approachable, and realistic. In many ways, the photography should reflect the culture of the users.
42
Photography
Brand elements
Image treatment
COLOR OVERLAY To establish a sense of brand identity, a gradient color overlay is applied to the image. This layer of overlay must not overtake the image and render the photography illegible. It should serve as a subtle and supporting role.
43
brand elements
photography
PEOPLE PHOTOGRAPHY
44
PHOTOGRAPHY
Brand elements
PEOPLE PHOTOGRAPHY
SLICE OF LIFE The tonality of the photography should speak reality. It is something that feels unstaged, and realm. As if it can happen to the viewer anytime and invite them in the situation.
45
BRAND ELEMENTS
PHOTOGRAPHY
PRODUCT PHOTOGRAPHY
46
PHOTOGRAPHY
BRAND ELEMENTS
PRODUCT PHOTOGRAPHY
PLAY ON PATTERN A simple version of the pattern can be apply to product renderings and photography to add motion and dynamic to the picture. The thickness of the lines can change but they should never steal from the product’s spotlight. Although situation may varies, but this will be the preferred mothod of showcasing product including in motion format as well. Colored background may be used as well.
47
Brand eleMents
PHOTOGraPHY
Product PhotoGraPhy
48
PHOTOGRAPHY
BRAND ELEMENTS
PRODUCT IN CONTEXT
49
buSineSS Card
statIonery
BusIness card
0.25”
1.25”
0.25”
0.75”
0.5”
BusIness card Size : 3.5” x 2” The back of the business card uses the company pattern. There is a total of 4 different version abailable for usage.
51
statIonery
varIatIons
52
buSineSS Card
buSineSS Card
statIonery
varIatIons
53
statIonery
leTTerHead
letterhead
0.5”
2”
4.25”
1.25”
0.5”
3”
1.25”
54
1.25”
leTTerHead
statIonery
letterhead
letterhead Size : 8.5� x 11� Tha back of the letter head uses of the logo to promote the essence of the company.
55
statIonery
enVelOPe
enveloPe
1”
3”
1” 1”
TCL Tower Gaoxin Nanyi Road Shenzhen, Guandong 518057 China
color varIaItIon Size : 8.75” x 3.75 Like the rest of the stationeries, the envelope also uses the company patter. It is applied to the inside of the envelope, while the out side is simply One Touch logo and mailing address.
56
enVelOPe
statIonery
enveloPe
57
Web
aPPlIcatIons
WeB
WeB desIGn This is the home page of the website. Here the most recent news, events, new products will be displayed on this page. Viewer can continue to scroll down for even more information.
59
aPPlIcatIons
WeB
60
Web
Web
aPPlIcatIons
WeB
61
aPPlIcatIons
WeB
62
Web
Web
aPPlIcatIons
WeB
Product ProMotIon As the viewer navigate through the specific detail pages for each product, moving line way pass through the background in a calm wave like motion, emitting the brand energy. Until finally arriving at the product detail section.
63
applications
launcher icon
LAUNCHER ICON
FR
64
Launcher icon
applications
MONOCHROME
MONOCHROME A monochrome version of the launcher icons can be used as an alternative choice. This launcher icon is used in the interface for the smart watch devices
65
aPPlIcatIons
inTerfaCe
Phone InterFace
66
inTerfaCe
aPPlIcatIons
Phone InterFace
user InterFace This is the interface design for Alcatel’s mobile phone. All functions and features can be easily accessed through simple finger gesture in the lockscreen. Further on, user can customize the interface to suit their personal taste.
67
aPPlIcatIons
inTerfaCe
Phone InterFace
68
inTerfaCe
aPPlIcatIons
Phone InterFace
69
aPPlIcatIons
inTerfaCe
user center aPP
70
inTerfaCe
aPPlIcatIons
user center aPP
user center OneTouch Care aims to be a portable guide for people who is new to our devices and to provide better customer service for our customers. here are several helpful modules for users to like our devices more such as Hot FAQ, Tutorials, Troubleshooting, Feedback, Repair Center Locator and Hotlines. 71
Applications
WATCH UI
72
interface
interface
applications
WATCH UI
23
FRI
23
FRI
06:30 January
23
FRI
ONE TOUCH CONTROL Enjoy the freedom of getting all of your important updates right on your wrist. With this new interface, user can access all functions with one touch of simple gesture.
73
aPPlIcatIons
Watch uI
74
inTerfaCe
interface
applications
WATCH UI
Inspirations Piano
Inspirations Piano
Inspirations Piano
75
aPPlIcatIons
inTerfaCe
Watch uI
Oct 23
Normal
5.00 KM
SY
KC
AG
SS
AC
JL
AY
BS
FunctIons This watch allow user to access their phone camera, play music, monitor their health condition, organize their day, receive messages, all through the convenience of blue tooth
76
inTerfaCe
aPPlIcatIons
Watch uI
KC
Hey you coming?
Yeah, in five minutes.
SY
SY KC AG AC JL
AY
sPontaneous uPdate This interface design allows user to be able to switch between different functions with ease with a simple gesture
77
aPPlIcatIons
PacKaGInG
78
PaCKaGinG
PaCKaGinG
aPPlIcatIons
PacKaGInG
PacKaGInG This is the packaging for the new identity. The front surface shocases the product with the pattern in the background. The back of the packaging is the detail specific of the functionality of the packaging.
79
APPLICATIONS
POP UP SHOP
80
Environment
ENVIRONMENT
APPLICATIONS
POP UP SHOP
81
APPLICATIONS
STORE FRONT
82
ENVIRONMENT
ENVIRONMENT
APPLICATIONS
INTERIOR
HEADQUR This is the mockup for the headquarter of the company. The line from the outside extends from the outside to the interior, inviting passing pedestrians to take a look inside. Once the line reaches the interior, it becomes more complicated reaching other parts of the store.
83
APPLICATIONS
environment
THE COLOR RUN
84
environment
Applications
THE COLOR RUN
EVENT PROMOTION On January 3, 2015, Alcatel announced partnership with The Color RunAs part of this exclusive partnership, Alcatel One Touch is powering a new layer of experience during The Color Run 2015 Shine Tour™ including the integration of One Touch technology.
85
Applications
promotion poster
Promotion poster
promotion poster
promotion poster
Applications
Applications
Promotion poster
promotion poster
88
Promotion poster
apllications
promotion poster
89
CONTACT Sam Yen Graphic Designer cyen3@inside.artcenter.edu (636) 319-4339