Version 1.

Brand
Guidelines

January 2017
00 2017 Brand Guidelines Ver. 1.0

Brand
Guidelines
Ikuti guideline ini untuk menciptakan
bahan pemasaran komunikasi internal
dan eksternal.
Brand Guidelines Version 1.0 2017 00

Table
01
Introduction 00

of Content

02
Brand Identity Design 01
New Face of PayTren 03
Logo Idea / Philosophy 04
Clear Space 06
Brand Colors 07
Monochromatic Logo 09
Sizes of Logo 10
Tagline on Logo 11
Logo placement 12
Misuses of logo 14
Logo for Apps 15
00 2017 Brand Guidelines Ver. 1.0

03
Typography for PayTren 16
Use in Print 18
Use for Websites 19
Typesetting Guides 20
Web Styles 21

04
Visual Element Design 22
Graphic Element 23
Mood Photo for PayTren 25
Screenshots 26
Icons & Illustrations 27
Design Matters 30
Brand Guidelines Version 1.0 2017 01

Selamat datang di brand guideline terbaru

PayTren. Guideline ini ada untuk membuat Kita
selalu luar biasa.

Ikuti guideline ini untuk menciptakan bahan pemasaran

komunikasi internal dan eksternal.

Introduction Fondasi Desain Kami

Our brand is more than our logo. Skema desain ini terdiri
dari sejumlah inti elemen dan prinsip-prinsip yang
menggabungkan penciptaan tampilan khas dan berbeda
yang akan segera dikenali sebagai PayTren.

Guideline ini akan memudahkan Anda untuk mengetahui

elemen brand inti yang membantu Anda dalam
merancang dan memproduksi komunikasi yang kuat
dinamis dengan tingkat eksibilitas.

Background

Identitas baru dari PayTren bertujuan untuk

memperkenalkan PayTren sebagai produk yang memiliki
banyak manfaat.
02 2017 Brand Guidelines Ver. 1.0

PayTren History

Beranjak dari potensi besar yang digunakan untuk

memanfaatkan teknologi yang mutakhir, Yusuf Mansur
melahirkan sebuah ide yang cemerlang untuk memberi
kemudahan dalam membayar semua kebutuhan
masyarakat dengan kombinasi penggunaan gadget dan
kebiasaan pembayaran kewajiban.

Perusahaan ini menyediakan dan menjual teknologi atau

perangkat yang dikenal sebagai pembayaran PayTren,
yang dapat digunakan untuk melakukan pembayaran
melalui ponsel/smartphone yang terdaftar pada
komunitas Treni.

Dalam menjalankan bisnis ini, PT. Veritra Internasional

Sentosa menawarkan dua kategori transaksi (kontrak) dari
semua mitra Treni (komunitas Treni), yaitu Sebagai
Pengguna yang menggunakan PayTren, Sebagai seorang
pengusaha (pasar Co PayTren dan mengembangkan
komunitas Treni).

Part 01
Brand Guidelines Version 1.0 2017 03

New Face of PayTren

Logo adalah elemen yang paling menonjol dalam

identitas, sebuah tanda universal yang menghubungkan
semua komunikasi PayTren. Ini merupakan sebuah
jaminan kualitas yang menyatukan perbedaan dalam
produk dan jasa.

PayTren menggunakan versi yang sama dalam cetakan,

layar dan di bangunan kami. Simple. Mudah dimengerti.
Tidak ada bayangan (drop shadow), tidak ada kilauan
Brand Identity (glossy), tidak ada efek cahaya (ashy graphic eects).

Design Logo PayTren dibuat tebal, sederhana, graphic statement.

Berikut berhubungan dengan touchpoint dan koneksi.

Logo PayTren terdiri dari dua elemen: Logogram dan

logotype.

Dengan konsep yang sederhana, logo PayTren akan

dipasang dengan baik. Halaman berikutnya merupakan
penggunaan yang benar dalam penggunaan logo dengan
baik.

Logogram Logotype
04 2017 Brand Guidelines Ver. 1.0

Logo Visual Idea

Wajah baru PayTren didesain dengan

mengedepankan kemudahan user.

Ide dasar dari gabungan huruf P

yang mewakili dari inisial PayTren.

Ditambah dengan Stilasi bentuk uang

kertas yang mewakili tur utama
PayTren sebagai aplikasi berbasis
mobile.

Dan tanda panah kedepan ini

Orange Dark-grey mewakili sifat selalu maju dan
berinovasi.

Dengan begitu logogram PayTren

memiliki bentuk yang simple, modern
dan inovatif. Pesan ini yang ingin
disampaikan PayTren kepada semua
user dan membernya.

Warna dari logogram paytren yaitu

Orange mempunyai kesan hangat
bersahabat dan pengertian, dipadu
dengan Dark Grey yang memiliki
kesan mendasar dan modern.

Part 02
Brand Guidelines Version 1.0 2017 05

The Golden Ratio

Untuk membuat proposi dan kualitas

logo, kami menggunakan golden ratio.

The grid system

Untuk memfasilitasi
penggunaan graphic guide
06 2017 Brand Guidelines Ver. 1.0

Clear Space
100%

Everyone needs a little

personal space

50% Untuk memastikan versi signature

PayTren dapat terlihat baik dalam
setiap aplikasinya, gunakan su cient
clear space- free of type, graphics, dan
elemen lainnya yang membuat
tampilan jadi berantakan - Untuk
memaksimalkan tampilan dan impact
dari identitas PayTren.
50% Clear
Space Untuk memastikan intergrity dan
legibility dari logo lock-ups, area
sekitarnya harus langsung dilindungi.
Apabila logotype atau full name
digunakan pada clear space sekitar
50%, simbol ketinggiannya harus
diatur. Dalam keadaan khusus,
apabila 50% clear zone tidak tersedia
atau memungkinkan.
Brand Guidelines Version 1.0 2017 07

Brand Coated Paper

Colors PANTONE 165 C Coated Paper
R:255 G:103 B:27 PANTONE Black 70%
#671b
Orange merupakan
warna primary dalam
penggunaan identity.
Pantone, CMYK, dan
warna RGB akan
diberikan sebagai opsi.
Gunakan pilihan ini dan Shades of Orange Shades of Grey
jangan dibuat ulang.

100% 80% 60% 70% 50% 30%

Orange / PANTONE 165 C White PANTONE Black 70%

PayTren Style Guide

Dengan memilih PayTren Orange sebagai warna utama

dari produk. Dan PayTren Black 70% sebagai warna
netralnya untuk keseimbangan komposisi kontras.

8
08 2017 Brand Guidelines Ver. 1.0

Secondary Color Palette

Warna inti yang digunakan,

Coated Paper Coated Paper Coated Paper
merupakan pencerminan dari
PANTONE 285 C PANTONE 305 C PANTONE WARM RED C
kepribadian PayTren, cerah, tebal
Uncoated Paper Uncoated Paper Uncoated Paper
PANTONE 285 U PANTONE 305 U PANTONE WARM RED U dan colorful.
R 35 R 85 R 239
G 31
B 32
G 195
B 216
G 68
B 61 Apabila menggunakan warna dalam
#231f20 #55c3d8 #ef443d
cetak, penting untuk selalu
Coated Uncoated Coated Uncoated Coated Uncoated
C 90
M 48
C 70
M 30
C 60
M0
C 60
M0
C0
M 88
C0
M 70
menggunakan tinta Solid Pantone.
Y0
K0
Y0
K0
Y7
K0
Y 10
K0
Y 80
K0
Y 66
K0 Dengan cara ini, semua material
akan konsisten, dan warnanya akan
terlihat cerah. Warna-warna cerah
ini tidak dapat diaplikasikan
menggunakan cetakan CMYK
standar. Gunakan hanya warna
Coated Paper
PANTONE 116 C
Coated Paper
PANTONE 7479 C
Coated Paper
PANTONE 382 C
CMYK apabila benar-benar perlu.
Uncoated Paper Uncoated Paper Uncoated Paper
PANTONE 115 U PANTONE 7479 U PANTONE 381 U

R 249 R 94 R 186
G 206 G 187 G 212
B 50 B 114 B 49
#f9ce32 #5ebb72 #bad431

Coated Uncoated Coated Uncoated Coated Uncoated

C0 C0 C 80 C 58 C 28 C 25
M 12 M 12 M0 M0 M0 M0
Y 100 Y 95 Y 65 Y 58 Y 92 Y 84
K0 K0 K0 K0 K0 K0
Brand Guidelines Version 1.0 2017 09

Monochromatic Logo Logo on orange

Dapat juga menggunakan logo

dengan background dari primary
palette. Hanya perpaduan 2 warna.

Logo on grey
10 2017 Brand Guidelines Ver. 1.0

Logo Sizes of Logo

Good things
come in small sizes.

Minimum size 1.38 / 100px

Tidak ada ukuran yang ditentukan

untuk Demand Media Logo PayTren.
Skala dan proporsi ditentukan oleh
ruang yang tersedia, estetik, fungsi
Logogram
dan visibility. Tidak ada ukuran
maksimal yang ditetapkan untuk logo.
Ukuran minimum dalam cetak adalah
0,8. Untuk keperluan digital, ukuran
minimum yang digunakan adalah 100
Minimum size 0.4 / 30px pixels. 100 pixels adalah ukuran
terkecil apabila menggunakan ICO.
There is a speci c le for ICOs which is
16px tall le.

Favicon - ICO le

16px
Brand Guidelines Version 1.0 2017 11

Tagline on Logo Tagline on right

Salah satu fungsi dari tagline adalah

menyampaikan value tentang brand
tersebut. Apabila tagline teman setia
bersebelahan dengan logo, akan bayar-bayar
menyampaikan manfaat atau value
tambahan.

Tagline on bottom

teman setia bayar-bayar

12 2017 Brand Guidelines Ver. 1.0

Logo Placement
Corner

Everything in its
right place

Selalu hindari penempatan logo

smack dab di tengah-tengah area.
Center
Pada setiap format landscape atau
vertikal- logo yang dipilih ditempatkan
di setiap sudut posisi atau pusat
selaras pada kanan atau kiri.

Corner

Preview position

Centering the logo Much better Much better

looks generic and
predictable
Brand Guidelines Version 1.0 2017 13

On Grayscale 50% Black logo on white background White logo on 50% black background

Warna pilihan untuk logo kami adalah

warna-warna cerah. Di beberapa case,
logo colorful mungkin tidak dapat
digunakan karena keterbatasan dalam
cetak. Contohnya, kita dapat
White logo on black background
menggunakan versi abu-abu (dibuat
75% tinta hitam) atau satu warna
hitam atau putih.

On Background Light-colored, uncluttered imagery Dark-colored, uncluttered imagery

Logo kami juga dapat digunakan pada

background image dengan kontras
yang cukup. Gunakan logo full
abu-abu dalam background terang,
dan versi full warna putih untuk
background yang gelap. Apabila
menempatkan logo ke dalam imagery,
pastikan untuk ditempatkan dengan
rapi dalam bidang gambar untuk Do not use a color logo on
a photographic image.
memungkinkan maksimum legibility
dan visibilitas.
14
www.paytren.co.id
DONT create a logo lockup with text
DONT change the proportions
between the symbol and logotype
DONT stretch the logo
DONT mix colors from the palette
DONT outline the logo
2017
DONT rearrange the logo elements.
DONT rotate the logo
DONT create a gradient logo
DONT use non-approved colors
DONT add a drop shadow to the logo
Brand Guidelines Ver. 1.0
Logo Misuses
Please dont!
Untuk mengatur integrity dari Logo
PayTren, dan juga mempromosikan
konsistensi brandnya, penting untuk
mempergunakan logo yang sudah
digambarkan pada guidelines.
Contoh berikut menunjukkan
gambaran misuses (yang tidak boleh
digunakan) pada Demand Media logo
yang harus dihindari.
Brand Guidelines Version 1.0 2017 15

Apps Icon

Android app icon

IOS app icon

16 2017 Brand Guidelines Ver. 1.0

Typography for
PayTren

Part 03
Brand Guidelines Version 1.0 2017 17

Modern
Open Sans

Open Sans font yang digunakan,

menggunakannya dalam tiga fungsi
yaitu; Bold, Regular, & Italic.

Simple
Friendly
Clear
Elegant.
18 2017 Brand Guidelines Ver. 1.0

Open Sans Bold Use in Print

ABCDEFGHIJKLMNOPQRSTUVWXYZ Open Sans Bold digunakan untuk

semua headlines dan judul.
abcdefghijklmnopqrstuvwxyz
0123456789 &*#@?!/+(.,:;)

Open Sans Regular

ABCDEFGHIJKLMNOPQRSTUVWXYZ
Open Sans Regular digunakan untuk
abcdefghijklmnopqrstuvwxyz semua standard body-copy.

0123456789 &*#@?!/+(.,:;)

Open Sans Italic

ABCDEFGHIJKLMNOPQRSTUVWXYZ
Open Sans Italic digunakan untuk
abcdefghijklmnopqrstuvwxyz menggaris bawahi kata.

0123456789 &*#@?!/+(.,:;)
Brand Guidelines Version 1.0 2017 19

Use for Websites Roboto Bold

ABCDEFGHIJKLMNOPQRSTUVWXYZ
Roboto
abcdefghijklmnopqrstuvwxyz
Open Sans tidak tersedia sebagai font
web, digunakan sebuah cadangan
0123456789 &*#@?!/+(.,:;)
sebagai alternatif disebut Roboto.

Roboto Medium
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 &*#@?!/+(.,:;)

Roboto Italic
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 &*#@?!/+(.,:;)
20 2017 Brand Guidelines Ver. 1.0

PAYTREN
TEMAN SETIA BAYAR BAYAR 10/11.5 Typesetting Guides
As dollestiatum con pratem dolupta dolor sint molessendam,
idus minctas sunteni mpores et voluptiant quat hiliquam non Tipogra selalu dipasang di kiri. Ini
pel minctisite oditas adis ent eicimpo riteces equisitibus arumend
ererchitem quidero reperum quiatur sequias etum ni re est
que endi cuptat. 10/12.5
untuk memberikan kesan titik awal
yang konstan untuk setiap baris,
PAYTREN membuat teks lebih mudah untuk
TEMAN SETIA BAYAR BAYAR 15/17.25 membaca.
As dollestiatum con pratem dolupta dolor sint molessendam,
idus minctas sunteni mpores et voluptiant quat hiliquam non
Typesetting headlines, harus 15%
pel minctisite oditas adis ent eicimpo riteces equisitibus arumend lebih besar dari ukuran jenisnya.
ererchitem quidero reperum quiatur sequias etum ni re est
que endi cuptat. 15/18.75
Untuk dijumlahkan, kalikan ukuran
jenis sebesar 0,15 dan menambahkan
hasilnya ke typesize tersebut.
PAYTREN
TEMAN SETIA BAYAR BAYAR 20/23 Saat menetapkan body copy, harus
25% lebih besar dari ukuran jenis.
As dollestiatum con pratem dolupta dolor sint molessendam, Untuk menghitung ini, kalikan ukuran
idus minctas sunteni mpores et voluptiant quat hiliquam non
jenis oleh 0,25 dan menambahkan
pel minctisite oditas adis ent eicimpo riteces equisitibus arumend
ererchitem quidero reperum quiatur sequias etum ni re est hasilnya ke typesize tersebut.
que endi cuptat. 20/25
Lebar kolom tubuh idealnya harus
antara 7-9 kata-kata panjang
Brand Guidelines Version 1.0 2017 21

Web Styles Text Color

Heading 1 Text Color #f16639
Background #
For development, see the production Font Open Sans Bold Background Color
Size 60px
ready frontend pattern called Weight Bold
Headings

Text Color
Text Color #444444
Heading 2
Background #
Font Open Sans Bold Background Color
Size 40px
Weight Bold

Text Color
Heading 3 Text Color #444444
Background #
Font Open Sans Bold Background Color
Size 22px
Weight Bold

Text Color
Body text Text Color #444444
Background #
Font Open Sans Bold Background Color
Size 20px
Weight Regular
22 2017 Brand Guidelines Ver. 1.0

Visual Element
Design

Part 04
Brand Guidelines Version 1.0 2017 23

Graphic Elements

PayTren mempunyai basic element

visual graphic yang diambil dari logo
basic shape.

Element 1 for masking Element 2 for footer

24 2017 Brand Guidelines Ver. 1.0

Graphic Element 1

Element ini digunakan untuk masking

foto yang biasa dipakai untuk cover
dan visual post

Graphic Element 2

Element ini digunakan sebagai footer,

yang bisa digunakan untuk keperluan
layouting dan design.
Brand Guidelines Version 1.0 2017 25

Mood Photo for PayTren

Konsep fotogra digunakan untuk

mengabadikan aktivitas sehari-hari
yang berhubungan dengan gadget
dan teknologi. Konsepnya untuk
membuat Anda berada di dalam
ruang tersebut. Tentang menceritakan
cerita melalui kepribadian, interaksi
dan pengalaman Anda. Untuk
membuatnya terasa nyata, jujur dan
terbuka.
26 2017 Brand Guidelines Ver. 1.0

Screenshots

PayTren adalah sebuah perusahaan

yang mengembangkan aplikasi
mobile. Gunakan tampilan PayTren
browser yang keren untuk
mengimplikasikan aplikasi kami
bekerja di setiap browser.
Brand Guidelines Version 1.0 2017 27

Icons & Illustrations PayTren Icons

PayTren Icons

Icon-icon berikut digunakan untuk

website kami, bukan hanya di
aplikasinya saja. Icon aplikasinya akan
dicover dengan Product Design
Guidelines.

PayTren Illustrations

Untuk mencerminkan perusahaan

secara keseluruhan dan untuk
menggambarkan kepribadian brand,
serangkaian icon telah dirancang PayTren Illustrations

untuk melakukan hal itu.

Gaya baru harus diluncurkan di

semua komunikasi sehingga nada
semua pemasaran literatur konsisten.

Icon harus menggambarkan main

focus dari tur yang mereka wakili.
Icon harus dirancang menggunakan
warna dari inti palet dan duduk di atas
bentuk geometris gratis yang
mencerminkan sifat bulat simbol
Frontify. Penggunaan warna dan
bentuk latar belakang harus
dipertimbangkan sehingga tidak ada
pengulangan muncul.
28 2017 Brand Guidelines Ver. 1.0

X DONT squeeze text Please Dont!

inside of the icons
Perhatikan dan ikuti guidelines untuk
CLICK hasil yang terbaik.
HERE

X DONT place icons

within other icons

X DONT overlap icons

X DONT add drop

shadows

X DONT rotate icons

unless 90 or 45
as part of a group
Brand Guidelines Version 1.0 2017 29

Please Do... V DO group icons together

into compositions, but please
Berikut beberapa contoh icon yang keep to 90 or 45 rotation
digunakan dengan baik. of icons.

V DO use them next to text

or call-to-action. View
Slideshow

Event
Schedule
30 2017 Brand Guidelines Ver. 1.0

Design Matters
Jika Anda sudah membaca panduan ini, kami
mengapresiasi Anda. Anda telah berbagi keyakinan dalam
detail dan kualitas kami. Kami menerapkan prinsip-prinsip
ini dengan waktu dan eort, namun cerita yang kami
paparkan dalam semua PayTren communications akan
lebih kuat untuk itu.

Jika Anda memiliki pertanyaan tambahan tentang identitas

visual dan aplikasinya dalam desain, jangan ragu untuk
menghubungi PayTren.

Terima kasih
HEAD OFFICE
PT. Veritra Sentosa Internasional
The Suites Metro Blok E5 - E7
Jln. Soekarno Hatta No. 693
RT.006 / RW.06 Kelurahan Jatisari
Kecamatan Buah Batu Bandung 40286

P. +62 22 7351 5100 (Oce Hour)

E. care@paytren.co.id

Layanan Pengaduan 24 Jam

(Complaint Services 24 Hours)
+62 811 2107 888

PayTren Ocial PayTren Ocial

paytren_ocial @PaytrenOcial

www.paytren.co.id www.treni.co.id
www.treni.co.id

www.paytren.co.id