UTS MATA KULIAH

INTERAKSI MANUSIA DAN KOMPUTER

Dosen: Sri Winarno Ph.D

Oleh:
Vilantino Fernandion (A11.2019.12360)
Muhammad Irkham Hidayat (A11.2019.12362)
Muhammad Tegar G (A11.2019. 12345)
Rizqullah Ramadhan M (A11.2019.12378)
Krisna Catur Pambudi (A11.2019.12358)
A11.4612

PROGRAM STUDI TEKNIK INFORMATIKA

UNIVERSITAS DIAN NUSWANTORO
2021
 Perbandingan 2 apps GOJEK vs GRAB (materi background dan icon)

1. Membandingkan keseluruhan warna yang dipakai GOJEK dan GRAB

Sebagai suatu komponen fungsional dari penglihatan manusia, warna dapat
menarik perhatian, menyejukkan atau menyakitkan mata, dan berkontribusi pada
kesuksesan suatu produk dalam menarik, perhatian konsumen.Sebelum masuk ke
topik utama, saya akan sedikit menyinggung tentang psikologi dari warna. Apa aitu
psikologi warna? Dilansir dari website Jurnal Entrepreneur dan SehatQ, psikologi
warna adalah teori yang digunakan untuk menjelaskan pengaruh warna terhadap
suasana hati, perasaan, emosi, dan perilaku manusia. Persepsi manusia terhadap
warna umumnya berbeda-beda, namun ada beberapa jenis warna yang memiliki arti
yang universal atau sama bagi kebanyakan orang.
Sementara itu, ada juga psikologi warna terhadap branding, yaitu psikologi
sebuah warna dari brand dapat memengaruhi kesadaran, pengalaman, hingga
keputusan konsumen dalam memiliih brand kita. Tapi benarkah warna menjadi
faktor penting dalam membangun persepsi konsumen terhadap brand/aplikasi yang
sedang kita bangun? Tentu saja! Karena ada sebuah studi pada tahun 2006
mengatakan hubungan warna dan juga brand, sebenarnya bergantung pada persepsi
dan pengalaman masing-masing orang. Misalnya saja, seseorang akan memilih brand
dengan warna hijau karena Ia menyukai warna hijau.
Orang juga biasanya mempersepsikan perilaku mereka dengan warna.
Misalnya, ketika Anda merasa adalah orang yang menyenangkan, mudah bergaul,
dan juga periang, maka Anda biasanya memposisikan diri Anda dengan warna
tertentu. Selain penelitian tsb ada juga penelitian lain yang dilakukan oleh University
of Loyola, Chicago, Amerika menyatakan bahwa warna meningkatkan brand
recognition hingga 80 persen. Oleh karena itu, warna menjadi proses yang penting
dalam mendesign identitas visual sebuah merek. Warna juga menjadi sarana
komunikasi antara produk dengan konsumen.

Oleh karena itu psikologi warna dari sebuah brand/aplikasi menjadi penting karena
beberapa hal berikut:
 1. Warna Memengaruhi keputusan demografis target pasar
Demografis meliputi usia dan jenis kelamin. Anda dapat mengidentifikasi kesesuaian
produk Anda dengan audiens menggunakan warna. Misalnya saja, jika Anda menjual
produk-produk untuk perempuan, tentu Anda perlu menggunakan warna-warna
yang feminim seperti merah muda, cokelat muda, atau turquoise atau Anda ingin
menjual produk Anda pada usia-usia tua, Anda perlu memikirkan warna yang cocok
untuk orang-orang di usia mereka.
2. Warna menjadi identitas brand
Ketika sedang berjalan di tempat umum dan menemukan sebuah brand dengan dua
jenis usaha yang sama, Apakah yang Anda ingat? ya, warna. Anda mungkin kesulitan
mengingat logo, tapi pasti Anda akan mengingat warna dari brand yang Anda lihat.
sebuah warna juga menjadi alat identifikasi produk Anda kepada masyarakat.
Misalnya orang akan lebih mengingat warna merah sebagai warna usaha kuliner,
atau orang akan cenderung mengingat warna hijau sebagai warna usaha yang
bergerak untuk keseimbangan lingkungan.
3. Warna memngaruhi keseluruhan bisnis
Beberapa rekan usaha atau client Anda mungkin memiliki warna hijau dan memiliki
pesaing usaha yang menggunakan warna kuning lalu Anda menawarkan produk
Anda kepada client berwarna hijau. Namun, warna usaha Anda adalah kuning, client
Anda pun akan mempertimbangkan keputusan untuk bekerjasama dengan Anda.

Karena kita akan membahas tentang branding warna dari suatu aplikasi, maka disini akan
dijelaskan sedikit tentang beberapa psikologi dari earna tertentu:
1. Psikologi warna hijau
Warna hijau merupakan warna sekunder hasil kombinasi antara warna biru dan
kuning. Warna hijau adalah warna dingin/sejuk yang sering dikaitkan dengan
lingkungan dan alam. Sehingga warna hijau dapat disimbolkan dengan kesuburan,
pertumbuhan, kesegaran, pembaharuan, dan kestabilian. Penerapan warna hijau ke
dalam sebuah design apliaksi atau website sangat efektif untuk menunjukan sifat
natural/alam, seperti kesehatan, makanan/minuman dan produk/bidang yang
berada di luar ruangan.
 2. Psikologi warna biru
Warna biru merupakan salah satu warna primer yang menjadi warna favorit di
seluruh dunia. Hal ini dapat kita lihat dari banyaknya aplikasi biru di setiap
perusahaan. Penggunaan warna biru dalam website, simbol perusahaan (logo),
brand identity, seragam, bangunan, dan lain-lain. Sifat warna biru adalah damai dan
tenang, loyalitas, kebijaksanaan, intelektual, serta kebesaran/kekuasaan. Warna biru
merupakan warna yang menenangkan, seperti warna lautan, langit, pegunungan, dll.
Sehingga banyak perusahaan yang mengadopsinya. Penerapan warna biru ke dalam
aplikasi atau website untuk menunjukan sifat ketenangan, intelektual, serta
bijaksana. Cocok untuk perusahaan yang bergerak di bidang teknologi,
kepemerintahan, pendidikan, organisasi sosial, dan lain-lain.
3. Psikologi warna merah
Warna yang paling emosional dan cenderung ekstrem, merah akan lebih tampak
menonjol dibandingkan warna lain pada pengaplikasian pekerjaan design. Warna ini
dapat meningkatkan perhatian dan emosi orang oleh karena itu banyak marketer
menggunakan warna merah sebagai warna promosi seperti diskon. Warna juga
menjadi warna yang sangat riskan untuk digunakan dalam brand karena kesan yang
terlalu berani. Merah adalah warna kuat yang hangat, menarik, seksi, dan mendesak.
Ini adalah warna darah dan asmara, simbol stop dan mawar klasik.
4. Psikologi warna putih
Warna ini dapat menyiratkan sesuatu yang bersifat suci, bersih, murni, kedamaian,
kekosongan, dan kepolosan. Pemakaian warna putih dalam logo branding
perusahaan juga akan memberi kesan santun. Warna putih akan terlihat kontras dan
tegas jika dipadukan dengan warna hitam. Warna putih juga melambangkan
modernitas dan juga pengetahuan. Selain itu, putih juga dapat melambangkan awal
yang baru, serta memberikan efek yang membuat ruang terasa lebih besar dan luas.
Namun, warna netral ini juga dapat menggambarkan perasaan yang dingin, hambar,
dan steril. Ini juga bisa terasa membosankan.

Setelah sedikit membahas tentang psikologi warna, pembahsan selanjutnya akan masuk ke
bagian kategori temperature warna, ada dua jenis temperature warna dalam branding dan
pemaknaan psikologi yaitu warna panas dan dingin:
 1. Warna dingin terdiri dari warna hijau, biru, dan ungu. Warna dingin memberikan
kesan lebih menenangkan, ketentraman dan santai, karena sering diibaratkan
dengan sesuatu yang bersifat dingin seperti air, samudera, es, hujan, mendung, dan
lain-lain. Kombinasikan warna-warna dingin untuk menciptakan tampilan design
yang lebih tenang dan profesional.
2. Warna panas/hangat tersusun dari warna merah, oranye dan kuning. Warna ini
sering dikaitkan dengan sesuatu yang memiliki tensi tinggi, semangat membara, dan
lain-lain. Ketika diaplikasikan dalam design, penggunaannya memberikan cukup
kontras sehingga cocok dijadikan pusat perhatian. Pada praktiknya, informasi
penting, button call to action, pop up, dan headline sering memanfaatkan warna ini.

Kemudian pengklasifikasian warna menurut Teori Brewster (teori warna yang

disederhanakn menjadi 4 klasifikasi (1831)):
1. Warna primer, Merupakan warna dasar yang tidak merupakan campuran dari warna-
warna lain. Warna yang termasuk dalam golongan warna primer adalah merah, biru,
dan kuning.
2. Warna sekunder, merupakan warna turunan yang dihasilkan dari campuran dua
warna primer dengan proporsi yang sama. Misalnya warna merah dan kuning
menghasilkan warna oranye, kuning dan biru menghasilkan warna hijau, serta merah
dan biru menghasilkan warna ungu.
3. Warna tersier, merupakan warna turunan yang dihasilkan dari percampuran antara
satu warna primer dan satu warna sekunder. Misalnya warna primer merah
ditambah warna sekunder ungu, akan menghasilkan warna tersier ungu merah.
4. Warna netral, adalah warna yang biasa digunakan sebagai penyeimbang dan
membantu warna lain agar terlihat lebih fokus. Hitam dan putih merupakan warna
netral yang secara umum banyak digunakan. Namun, dalam banyak kesempatan bisa
juga dikombinasikan menjadi berbagai warna netral yang lebih bervariasi, misalnya
cokelat, krem, dan abu-abu.

Analisis background warna dan warna keseluruhan apps:

 Loading page Gojek Landing page Gojek Andro Poster Gojek Andro
Andro

Loading page1. GOJEK

Gojek IOS Landing page Gojek IOS Poster Gojek IOS
Pada loading page saat akan masuk ke aplikasi, kombinasi warna yang dipakai
adalah background putih dengan logo GOJEK yang berwarna hijau tua dengan
kemungkinan prosenstase warna nya (RGB (22, 176, 19), CMYK (88%, 0%, 89%,
31%), HSV (119°, 89%, 69%), dan HSL (119°, 81%, 38%)), dengan tulisan ‘gojek’
yang berwarna hitam. Menurut analisis saya, kombinasi seluruh background
putih dengan warna hijau pada logo dan tulisan hitam yang kontras dari
background pada ‘gojek’ akan memberikan kesan yang sangat jelas untuk
menonjolkan bahwa apliaksi yang sedang diapakai atau sekedar dibuka adalah
gojek, dan hal itu tentunya sangat bagus untuk branding aplikasi agar mudah
diingat. Selain itu, kombinasi warna tadi membuat loading page aplikasi menjadi
simple dan menarik.

Setelah selesai loading, aplikasi akan lanjut masuk kebagaian landing page.
Saat berada pada landing page warna yang digunakan adalah dominan putih
(kemungkinan white smoke) background tools dan hijau tentunya sebagai ciri
khas warna dari brand gojek. Warna putih sangat sering digunakan untuk
background berbagai jenis aplikasi maupun website karena sifatnya yang netral,
tidak membuat mata Lelah, dan membuat objek disekitarnya menjdi lebih hidup,
mudah dikenali, serta dominan. Selain itu alasan psikologi warna putih yaitu
melambangkan modernitas dan memberikan efek yang membuat ruang terasa
lebih besar juga luas, mebuat warna ini memang tepat digunakan sebagai
background untuk Sesuatu. Pada tools tertentu gojek menggunakan hijau sebagai
warnanya. Karena menurut psikologi, warna hijau menyampaikan perasaan
tenang, damai, dan menyampaikan gagasan pertumbuhan. Produk yang
menggunakan design warna hijau akan terkesan menawarkan kesegaran dan
bersifat natural dari alam. Selain dominan warna hijau dan putih, pada landing
page GOJEK terdapat warna lain, yaitu warna biru yang digunakan untuk
membalut tools gopay.

Menurut analisis saya, jika didasarkan pada psikologi warna sendiri, biru
merepresentasikan loyalitas, kebijaksanaan, intelektual, maka bisa diasumsikan
bahwa perancangan menggunakan warna ini ingin menunjukan bahwa gopay
adalah alat bayar yang bisa dipercaya untuk membantu segala kebutuhan
pembayaran aplikasi ini, gopay juga melambangkan/ merepresentasikan kepada
intelektualitas modern yang mana teknologi uang konvensional bisa digantikan
oleh uang digital, serta yang terakhir yaitu kebijaksanaan dalam pemantfaatan
uang dan teknologi yangdigunakan. untuk menunjang kemudahan hidup manusi
tanpa merusak alam sekitar.

Satu lagi warna yang ada pada landing page gojek yaitu warna merah,
menurut psikologi warna, merah merepresentasikan peringatan, penunjuk
bahaya, dan kewaspadaan. Tapi karena itu, psikologis seseorang akan selalu
tertarik untuk memperhatikan sesuatu yang berwarna merah selain itu, dalam
dunia perdagangan dan teknologi, warna merah dapat meningkatkan perhatian
dan emosi orang oleh karena itu banyak marketer yang menggunakan warna
merah sebagai warna promosi seperti diskon. Jadi menurut analisis saya,
perancang warna pada aplikasi GOJEK, menyematkan warna merah (contoh:
GoFood) pada tools untuk membeli barang atau sesuatu yang berbentuk fisik
seperti makanan adalah karena warna merah yang menarik perhatian, karena
sifat warna yang juga berarti panas/menggebu-gebu mungkin juga menjadi
pertimbangan untuk membuat semua tools belanja aplikasi diberi warna merah.

Untuk keseluruhan tampilan saya akan memberikan nilai 8 pada kombinasi

warna pada aplikasi ini, karena warna apliaksi ini yang tidak terlalu terang dan
memiliki kombinasi antara warna yang masuk kategori warna dingin (biru dan
hijau) dan warna panas (merah) sehingga memberikan seimbang dan tidak
membosankan. Juga 3 warna tersebut merupakan warna dasar.

Satu lagi hal yang membuat saya suka dengan landing page apliaksi Gojek ini
adalah detail poster yang menggambarkan tentang keadaan yang dihadapi
manusia saat ini dan juga sebagai peringatan untuk tetap menjaga Kesehatan
serta keamanan diri. Walaupun tidak begitu penting hingga perlu membuat
poster seperti itu, tapi detail kecil ini patut diapresiasi dan bisa membuat landing
page lebih menarik/hidup.
 Loading page Grab Andro Landing page Grab Andro

2. GRAB Landing page Grab IOS

 Sama seperti aplikasi gojek, saya akan menganalisis aplikasi ini mulai dari
loading page. Saat loading page, tampilan aplikasi didominasi oleh warna hijau,
mulai dari background hingga ke posternya, tentu saja warna merupakan
branding warna dari aplikasi grab. Tapi disini saya sedikit merasa aneh dengan
logo grab yang menggunakan warna putih, padahal branding warnanya adalah
hijau, serta logo grab pada aplikasi saat berada pada tampilan hp adalah hijau.
Walaupun saya paham hal itu dilakukan karena perbedaan background pada
aplikasi, tapi hal itu mengahsilkan inskonsistensi dan membuat bingung
sebenarnya warna yang mana yang dgunakan sebagai warna logo. Lanjut ke hal
yang lain.

Berbeda dengan gojek, grab menaruh poster yang menggambarkan keadaan

dunia saat ini pada loading page. Hal itu juga patut diapresiasi karena tentu saja
detail itu membuat tampilan lebih menarik dan menjadi hidup. Tentu saja, poster
itu didominasi warna hijau sebagai branding dari grab juga.

Lanjut ke bagian landing page, pada landing page apliaksi grab hanya terdiri
dari jenis warna yaitu hijau dan putih. Background dari aplikasi grab juga
memakai warna putih, menurut analisis saya, alasan pemilihan warna putih
adalah tentu saja karena sifatnya yang netral, tidak membuat mata Lelah, dan
membuat objek disekitarnya menjdi lebih hidup, mudah dikenali, serta dominan.
Selain itu alasan psikologi warna putih yaitu melambangkan modernitas dan
memberikan efek yang membuat ruang terasa lebih besar juga luas.

Selanjutnya warna hijau, dominasi warna dikaeranakan branding grab yang

memang warna hijau serta menurut psikologi, warna hijau menyampaikan
perasaan tenang, damai, dan menyampaikan gagasan pertumbuhan. Produk
yang menggunakan design warna hijau akan terkesan menawarkan kesegaran
dan bersifat natural dari alam.

Membandingkan icon yang dipakai GOJEK dan GRAB:

A. GOJEK (flat design)
Sangat jelas konsep yang ingin diangkat gojek adalah modernisasi dan
minimalis terlihat dari psikologi warna (putih) yang sudah dibahas dibagian atas
dan design icon-nya yang menggunakan flat design (flat design adalah design
dengan pendekatan minimalis yang menekankan kegunaan, dengan design yang
bersih tanpa ada bevel, bayangan, tekstur, berfokus pada tipografi, warna-warna
cerah dan ilustrasi dua dimensi). Sedikit menyinggung sejarah dan bagaimana
design ini bisa popular, flat design terinspirasi dari kombinasi tiga gaya design,
yaitu The Swiss Style (atau International Typographic Style), Bauhaus dan
Modernism. Namun, dari ketiga gaya design tersebut, flat design paling banyak
terinspirasi dari design The Swiss Style dan diperkenalkan sekitar tahun 1940-
1950an. Design ini memfokuskan diri dari beberapa aspek yaitu grid, tipografi
sans-serif, dan tata letak (layout) yang tidak terlalu padat. Sampai pada 2014,
mulai berkembang lebih pesat dan terkenal serta banyak digunakan dalam
design website, poster, karakter, UI mobile, aplikasi, dan lainnya.

Microsoft merupakan yang pertama menerapkan gaya design seperti ini

untuk interface-nya, dipandang oleh sebagian reaksi terhadap ke populeran vs
design skeuomorphic (definisi alternatif serupa dari skeuomorphic adalah
"ornamen atau design fisik pada suatu benda yang dibuat menyerupai bahan
atau teknik lain". Definisi ini lebih luas cakupannya, karena dapat diterapkan
pada elemen design yang masih memiliki fungsi yang sama seperti pada design
sebelumnya), kemudian digunakan oleh apple menggebrak antarmuka iOS-nya
dengan gaya design ini. Alih-alih untuk mengubah benda dalam kehidupan nyata,
seperti kalender, menjadi ilustrasi realistis kecil, tapi para pendukung flat design
mengidentifikasi aplikasi dengan sederhana, seperti gambar icon.

Flat design memiliki keunggulan yang menurut analisis saya memang

dimanfaatkan oleh designer apps gojek:
 A. Minimalis Bukan Berarti Membosankan
Dalam Flat Design, elemen hias yang lain akan dipandang sebagai
kekacauan yang tidak perlu. Jika sebuah aspek tidak menyajikan tujuan
yang fungsional, itu akan menjadi gangguan untuk pengalaman
pengguna. Inilah merupakan alasan untuk sifat minimalis pada flat design.
Namun, karena gaya ini tidak memiliki design yang mencolok bukan
berarti gaya ini akan membosankan. Cerah, warna-warna kontras
membuat ilustrasi dan memunculkan tombol dari background, akan
dengan mudah menarik perhatian dan memandu mata pengguna. Tujuan
dari citra minimalis juga berkontribusi terhadap karakter fungsional pada
flat design.
B. Cepat untuk dipahami
Gambar sederhana menyampaikan pesan lebih cepat daripada ilustrasi
sangat detail. Gambar seperti ikon dapat menunjukkan tindakan yang
universal atau tujuan agar semua orang dapat dengan mudah
memahaminya. Sangat mudah untuk melihat perbedaan langsung antara
skeuomorphic dan flat design. Perhatikan gambar dibawah betapa
besarnya, blok warna solid yang lebih menarik perhatian dan arti dari ikon
dapat dengan cepat dirasakan.

B. GRAB (flat design)

Tidak jauh berbeda dengan design GOJEK, aplikasi GRAB dengan flat design
bisa dipastikan, bahwa perancang aplikasi ini juga ingin mengirimkan pesan yang
sama yaitu modern dan minimalis. Pola penggunaan flat design ini sangat
popular pada masa sekarang ini. Hampir segala jenis teknologi yang berbasis
internet menggunakan jenis design ini. Hanya saja, varian design dan modelnya
yang sedikit berbeda, tapi hal itu tidak akan berpengaruh terahadap tujuan awal
dari pembuat aplikasi.

Membandingkan landing page Gojek dan GRAB

A. Landing Page GOJEK
Dapat dilihat pada Landing page Gojek. Ada beberapa kategori yang sangat
membantu user saat pertama membuka aplikasi gojek. Pada landing page gojek
ada 6 section yaitu main menu, fitur search, menu untuk gopaym, history order,
top pics, dan layanan gojek itu sendiri. Gak salah kalau GOJEK lebih popular
dibandingkan dengan yang lain.
(+) Konten yang beragam dan cukup menggoda pengguna;
(+) Menggunakan tata letak grid;
(-) Terkadang ada iklan yang mengganggu.
B. Landing Page GRAB
Pada landing page GRAB juga menampilkan 6 section yaitu pay, use ovo/points,
Fitur top up dompet, layanan pada grab lebih banyak , rekomendasi diskon,dan
main menu.
(+) Tampilan awal yang sederhana namun tetap informatif untuk pengguna;
(+) Kesederhaan itu penting, dan kemudahan juga penting;
(-) Terlalu banyak rekomendasi, membuat pengguna bingung untuk memilih.

Membandingkan Typography 2 aplikasi GOJEK dan GRAB

Gojek

Landing page Gojek IOS (1) Landing Page Gojek IOS (2)

Font yang digunakan pada Gojek adalah menggunakan Font Sans Serif. Gojek
memberi nama desain baru ini dengan nama “Solv” yang diambil dari kata bahasa inggris
“Solve” yang artinya memecahkan masalah. Gojek menggunakan nama ini juga tidak asal,
harapannya dengan logo yang baru ini Gojek bisa menjadi berbagai solusi dari layanan ride-
hailing. Pada landing page 1 terdapat tulisan “Protokol Gojek” yang memiliki ukuran teks
dan bold bermaksud untuk memberikan judul dari landing page tersebut lalu ada jarak
antara penulisan “Selalu ikuti protokol J3K ya,Kak” dengan “Saling menjaga yuk, supaya
kamu dan driver bisa ketemu keluarga dengan aman. #PesanDariRumah” yang mana
menggunakan jarak 5px disini pihak Gojek ingin memberikan kenyamanan user dalam
membaca dan pada tampilan “Selalu ikuti protokol J3K ya,Kak” menggunakan bold serta
memiliki ukuran teks yang lebih besar dari yang lain dimaksud untuk jadi pusat perhatian
dari user untuk menaati protok J3K.

Lalu pada bagian shape berwarna grey diberi jarak 20px untuk memberi konsistensi
dalam membaca dan didalam shape tersebut terdapat isi dari J3K itu sendiri, dalam isi
tersebut diberikan jarak juga antara 20px dimaksud disini agar pembaca mudah memahami
karena tulisan memiliki jarak yang enak untuk dibaca. Pada bagian shape berwarna green di
buat berbeda karena disini sebagai tanda syarat bahwa pengguna aplikasi akan menaati J3K
menurut kami penataan tempat pada shape ini sangat menarik karena adanya perpaduan
color antara satu dengan yang lain. Lalu pada Landing Page IOS 2 terdapat tulisan
“Terdapat” yang dimana itu adalah menu dari landing page yang ditampilkan dan disana
Gojek bermain dengan menggunakan ukuran font yang medium dan bold untuk
memberitahu bahwa user berada di menu Terdekat dan disamping nya terdapat icon panah
yang mana digunakan untuk kembali ke menu home dan icon itu menggunakan 36px yang
mana itu di gunakan untuk user agar mudah mengkliknya. Lalu pada bagian “Filter” terdapat
jarak dengan “Terdekat” yaitu 10px hal ini untuk membuat tampilan lebih konsisten namun
dari kami para user disini kami jarak antara satu dengan yang lain masih berdekatan yang
mana para user dapat salah mengklik, lalu disamping “Filter” terdapat “Urutan” yang
memiliki jarak 5px dan ini dapat membedakan antara shape satu dengan yang lain begitu
juga kesampingnya dan pada penggunaan icon menggunakan 24px karena itu adalah ukuran
minimal agar jempol nyaman saat mengkliknya. Pada bagian bawah nya juga ada beberapa
tulisan judul makanan dimana menggunakan type bold dan ukuran font medium untuk
memberi tahu user dan menjadi perhatian dari user lalu dibawah nya terdapat jarak yang
small untuk memberikan efek keterangan dan menggunakan color grey, disini saya suka
terdapat pemisah antara keterangan dengan jarak antar yang membuat dimensi dari
tampilan lebih bervariasi.

Filosofi dari tipografi pada User Interface Gojek menggunakan huruf San Serif.
Menurut Surianto Rustan dalam bukunya Font & Tipografi, Jenis huruf berciri San Serif (yang
artinya: tanpa Serif) mulai muncul tahun 1816 sebagai display type dan sangat tidak populer
dimasyarakat karena pada saat itu dianggap tidak trendi sehingga dinamakan Grotesque,
yang artinya lucu atau aneh. Namun huruf san-serif akan memperlihatkan pada user
interface design lebih tegas, bersifat fungsional dan lebih modern. Tujuan dalam
penggunaan tipografi pada user interface adalah untuk memudahkan pengunjung dalam
membaca informasi yang ada didalamnya. Pada gojek menggunakan hierarki dalam
mengorganisasikan user interface-nya. Huruf tebal dan tidak tebal dapat memiliki hierarki
yang berbeda. Terlihat pada bagian kolom pembayaran GoPay ukuran text lebih besar dan
pada text pay, paylater, top up, dan more terlihat lebih kecil. Selain itu juga pada kolom
informasi tambahan terdapat text Top Picks for you menggunakan huruf tebal dan besar, hal
tersebut untuk menjelaskan header dari kolom tersebut. Dan pada text isian menggunakan
huruf lebih kecil untuk memperlihatkan keseimbangan dalam kolom informasi tambahan.
Selain itu, kami mempersepsikan tipografi user interface gojek terbagi dalam beberapa
aspek, seperti elemen desain dan faktor perceptual defense yang dijelaskan oleh Shiffman
dan Kanuk (2000) dalam Alizamar & Couto (2016), konsumen secara bawah sadar menyaring
rangsangan yang mengandung ancaman psikologis yang mereka temukan. Dengan
membaca tulisan atau deskripsi yang ada pada user interface aplikasi gojek dapat membuat
mereka merasa aman. Sehingga dapat dipersepsi bahwa tulisan sebagai penanda yang
utama dalam kemudahan menggunakan aplikasi.

- Desain Ikon, pada saat melihat desain ikon sering kurangnya pemahaman terhadap makna
dari gambar ikon sehingga untuk memastikan kembali, mereka membaca tulisan deskripsi
yang tersedia pada ikon. Hal ini dipersepsi bahwa deskripsi tulisan pada ikon sebagai
informasi yang penting.

- Kontrol Menu dan Navigasi, Rasa penasaran yang tinggi juga membuat informan tersebut
ingin mengetahui informasi yang belum lengkap, sehingga memunculkan keinginan untuk
melihat informasi tersebut dengan cara menggeser pada layar. Dalam hal ini konsumen
mempersepsikan tulisan sebagai tanda yang dapat digeser untuk mendapatkan informasi
yang lengkap. Penggunaan Teks dan Bahasa, penambahan kata “go” terdistribusi pada
semua kata layanan yang ada seperti goride, gocar, gofood, gomed, dan sebagainya.
Sehingga konsumen dapat memahami arti dari kata layanan tersebut meskipun adanya
penambahan kata asing “go”. Maka konsumen mempersepsikan kata “go” sebagai kata
branding kata gojek dan nama layanan yang merupakan kata asing yang umum sebagai
deskripsi penjelas. Hal ini dapat dipersepsi konsumen bahwa konsumn mampu memaknai
penanda pada ikon sebagai branding.

Dapat disimpulkan bahwa keterkaitan elemen tipografi pada User Interface yang
paling berpengaruh adalah elemen desain & penggunaan teks dan bahasa. Dimana elemen
desain tulisan sebagai poin utama untuk menghindari berbagai kesalahan dalam melihat
user interface dan juga fungsi deskripsi tulisan sebagai informasi penting. Secara
keseluruhan persepsi konsumen terhadap tipografi user interface dapat diperhatikan
dengan jelas dan digunakan sebagai alat bantu dalam melihat tampilan pada aplikasi karena
mereka paham untuk menghindari kekhawatiran yang akan terjadi maka mereka
mengutamakan tulisan untuk memahami segala bentuk elemen desain. Mereka memahami
adanya “go” sebagai branding dari aplikasi gojek.

Grab

Landing Page Grab IOS (1) Landing Page Grab IOS (2)

Font yang digunakan oleh Grab adalah sans serif dimana ingin menunjukan sisi
modern dan menarik serta aman untuk mengaet konsumen dan tetap dalam visi mereka
“Maju Bersama” dan font ini sama dengan gojek. Pada bagian Landing Page 1 di Grab
menggunakan type yang minimalis dan simple, pada penulisan “Ikuti standar kesehatan dan
kebersihan kami untuk perjalanan” menggunakan type bold dan memiliki font yang medium
hal ini untuk memberikan judul pada landing page tersebut. Lalu dibawah nya terdapat
keterangan dari judul dan antara judul dengan sub isi memiliki jarak 10px dan pada sub isi
menggunakan ukuran teks yang lebih kecil untuk membedakan komposisi antara judul
dengan sub-sub. Dibagian bawah terdapat juga syarat syarat yang harus ditaati oleh user,
disini Grab memberikan ukuran font yang sama dengan sub-isi namun menggunakan bold
yang bertujuan untuk memberikan kesan dan pesan yang penting untuk dibaca oleh
pengguna atau user dan pada bagian ini jarak antara kalimat dengan kalimat lain adalah
10px yang membuat dari landing page ini konsisten dalam menggunakan jarak dan pada
bagian akhir sama dengan Gojek , Grab juga menggunakan shape green yang dimana user
harus menyetujui persyaratan yang telah diberitahukan. Menurut kami dari segi komposisi
yang menjadi juara adalah Grab namun dari segi variasi kami lebih suka ke Gojek dimana
memberikan kesan yang berbeda dan lebih modern. Selanjutnya pada Landing Page 2
terdapat icon pada bagian atas yang mana memiliki ukuran 36px disini Grab memberikan
ukuran tersebut agar user dapat mudah mengkliknya. Lalu pada bagian bawah terdapat juga
icon centang yang menunjukan bahwa makanan tersebut adalah rekomendasi untuk user,
disini kami menyukai konsep ini untuk memberikan rekomendasi kepada user. Dibawah nya
terdapat judul dari restoran yang direkomendasikan, pada bagian ini memiliki ukuran font
yang besar dan menggunakan bold untuk memberikan kesan kuat dan dominan dibawah
nya terdapat tulisan “Bakmi” menurut kami jarak antara judul dengan tulisan bakmi terlalu
dekat yang mana membuat tulisan tersebut tidak dibaca oleh user. Lalu pada bawah tulisan
bakmi ada rating, jarak, harga ongkos kirim dan icon yang digunakan 24px disini membuat
tampilan lebih transparant dalam memberikan informasi. Pada penulisan “Pengataran tanpa
kontak” disitu diberi bold untuk membedakan tulisan “Anter sekarang” dan membuat
komposisi tulisan lebih bervariasi dan disamping nya terdapat tulisan “Ganti Opsi” menurut
kami disini masih kurang yang lebih baik di beri dengan beberapa icon agar memudahkan
user dan memberikan kesan UI yang lebih baik, pada bagian bawah nya menggunakan
ukuran font dan icon yang sama yaitu ukuran font berupa 12 cm dan 24px untuk
penggunaan icon. Dan bagian bawah terdapat shape berwarna grey untuk memberikan
komposisi pada layout dan terdapat penulisan yang berukuran small dan ada icon serta
dibagian bawah nya ditekankan lagi pada landing page ini adalah “Rekomendasi untukmu”
dimana memberi pesan aman dan terpercaya.

Lalu pada filosofi, Grab mengusung pengalaman pengguna sesuai dengan visi mereka
yaitu “Maju Bersama”. Demi mewujudkan user experience ini, Grab membuat faktor
usability pada aplikasinya menjadi mudah dipahami dan dipelajari, singkat ketika diakses
(efisiensi waktu), bisa digunakan oleh siapa saja (kemudahan akses, dan aman), dan minim
tingkat kesalahan (errors). Untuk mendukung hal tersebut Grab menaruh utility yang
membantu kegunaan (usability) dari aplikasi Grab, hal ini tercermin pada 3 kategori utama
yang Grab miliki sebagai bentuk utama layanan mereka, peta, ketersediaan kendaraan
disekitar area user, dan beragam pilihan/variasi transportasi (roda dua dan empat) yang
disuguhkan untuk user ditunjang juga pembentukan arsitektur informasi yang berbicara
langsung (straight to the point) kepada user pada halaman utama aplikasi (landing page)
sehingga dari semua fitur layanan Grab yang berikan, dapat membuat efek usefullness pada
benak user. User tidak merasakan kesulitan ketika mengakses informasi pada aplikasi,
mudah mencari kendaraan yang layak untuk karateristik user serta sesuai dengan kondisi
dan waktu yang diinginkan user. Kekurangan pada aplikasi ini hanya terleteak pada tampilan
halaman yang muka yang mengakibatkan user membutuhkan waktu atau usaha lebih dalam
mencerna informasi yang disediakan ketika mereka pertama kali mengakses aplikasi
tersebut, Sedangkan User interface Grab menekankan informasi yang selaras dengan
pengalaman pengguna Grab yaitu “Maju Bersama”. Grab ingin menekankan bahwa user
layak untuk mendapatkan transportasi untuk segala kebutuhan user, transporatasi layak,
aman, dan mudah diakses untuk siapa saja. Hal ini diwujudkan pada desain interface
halaman muka Grab yang diberi penekanan pada tombol kategori fitur layanan Grab
(transport, document, dan food), gambar peta, dan ketersediaan kendaraan yang ada
disekitar area user, yang tersedia melalui aplikasi yang mudah diakses kapan saja oleh user
serta dengan adanya gambar, peta serta fitur lainnya dengan penataan yang tepat
memudahkan user untuk menjalankan aplikasi . Lalu penggunaan tipografi sans serif juga
sama seperti Gojek disesuaikan dengan karakteristik pengguna Grab (masyarakat urban)
yang dinamis yang membutuhkan informasi yang cepat dan mudah dipahami. Dimana Font
sans serif memiliki variasi garis yang sedikit lebar daripada serif, contohnya adalah Helvetica,
Arial, Century Gothic. Jenis sans serif terlihat lebih bersih, modern, dan menarik. Sering
digunakan oleh merek-merek yang ingin menunjukkan sifat jujur, sederhana, dan tanpa
basa-basi. Ketika ditempatkan ke tipografi dalam desain logo, sans serif dapat mewakili
perasaan kepekaan terhadap suatu hal. Seringkali, logo ini ditemukan pada merek pakaian,
perusahaan teknologi, dan bisnis yang berfokus pada gagasan masa depan oleh karena itu
Grab menggunakan font yang berupa sans serif dimana ingin menunjukan sisi modern dan
menarik serta aman untuk mengaet konsumen dan tetap dalam visi mereka “Maju
Bersama”.

Logo Gojek

Desain Logo Baru Perusahaan Gojek

Gambar 2 Desain Logo Gojek Baru

Pada tahun 2019, Gojek memutuskan untuk mengubah desain logonya yang lama
mejadi lebih sederhana baik pada logotype maupun logogram seperti yang terlihat pada
Gambar 2. Perubahan visual logo Gojek dianalisis sudah tidak dapat mengakomodasi
fungsi-fungsi Gojek sebagai sebuah aplikasi layanan yang sudah berkembang lebih luas.

Dimulai dengan fungsi layanan aplikasi Gojek yang awalnya memiliki layanan
utama transportasi motor dan mobil, visualisasi logo Gojek mampu menjadi perwakilan
entitas perusahaan karena dapat menangkap konsep entitas dengan konkrit.
Seiring dengan perjalanan waktu, di tahun 2015, aplikasi Gojek berkembang dengan 2
layanan baru yaitu Go Send dan Go Mart. Saat ini, aplikasi Gojek berkembang hamper
mencapai 20 layanan dengan beberapa kategori besar yaitu

1. Go- Ride 11. Go- Food Festival

2. Go- Car 12. Go- Pulsa
3. Go- Send 13. Go- Clean
4. Go- Box 14. Go- Tix
5. Go- Mart 15. Go- Save
6. Go- Med 16. Pay Later
7. Go- Pay 17. Go- Massage
8. Go- Bills 18. Go- Life
9. Go- Points 19. Go- Biz
10. Go- Food 20. Go- Play

Perpaduan warna yang digunakan tetap sama yakni hijau dan juga hitam agar ciri khas
tone warna yang sudah ditetapkan dari awal masih terasa dan meningkatkan daya ingat
penggunanya. Tidak hanya itu, desain dari logo baru Gojek lebih fleksibel dibandingkan logo
sebelumnya. Logo baru Gojek dinamai “Solv” diambil dari kata “Solve” yang berarti
pemecahan masalah. Gojek ingin memberitahukan bahwa layanannya kini dapat membantu
berbagai kebutuhan pengguna dan menyelesaikan permasalahan yang kerap kali terjadi.

1. Logotype
Typeface yang digunakan pada desain baru logo Gojek masih sama yakni berjenis
sans serif atau tanpa kait karena kesannya yang modern sesuai dengan citra
perusahaan. Namun yang berbeda ialah penggunaan huruf kecil pada logotype.
Pada logonya yang dahulu terdapat penggunaan huruf kapital yang terlihat
sangat jelas. Hal ini dirasa terlalu formal dan kurang sesuai dengan citra
perusahaan. Sedangkan typeface Maison Neue yang digunakan oleh Gojek,
ketika diaplikasikan pada logo dengan menggunakan huruf kecil secara
keseluruhan memberikan kesan lebih modern, praktis, dan sesuai dengan target
pasar perusahaan. Walaupun terdiri dari rangkaian huruf kecil, namun dengan
penggunaan warna hitam pada teks logo di latar berwarna putih, serta warna
putih pada teks logo di latar belakang warna hijau Gojek, penekanannya tetap
nampak kokoh dan masih memberikan kesan serius layaknya perusahaan sejenis
lainnya.

2. Logogram
Seperti halnya teori yang dipaparkan oleh Surianto Rustan dalam bukunya, ciriciri
logo yang baik ialah sederhana dan juga unik. Kini logogram pada desain logo
Gojek menggunakan ilustrasi sebuah ikon menyerupai tombol yang sering
ditemukan pada berbagai perangkat digital. Tidak seperti logonya yang lama,
publik hanya bisa menilai bahwa Gojek merupakan aplikasi penyedia jasa
transportasi daring saja.

3. Makna Logo Baru Gojek

Perubahan logo Gojek sangat terlihat pada bagian logogram-nya. Adanya sebuah
ilustrasi lingkaran yang terputus (tidak sempurna) dengan titik atau dot di bagian
 dalamnya. Berdasarkan teori semiotika Peirce, makna logo baru Gojek dapat
dilihat di dalam klasifikasi interpretant, terdapat poin Rheme yang menjelaskan
tentang kemungkinan sebuah visualisasi ditafsirkan dalam pemaknaan yang
berbeda-beda. Begitu pun yang terjadi pada logo Gojek.

Logo Gojek
ketika diputar
180 °

Gambar 3 . Tombol Power

a. Bentuk logogram pada Gambar 3 menyerupai sebuah tombol daya atau power
apabila diputar 180°. Bentuk logogram menyerupai simbol tombol daya (power
button), dimana tombol power merupakan sebuah simbol yang disepakati
sebagai tombol untuk menyalakan dan mematikan perangkat elektronik. Simbol
ini dulunya merupakan kombinasi dari bilangan biner dimana dalam system
biner, angka 1 berarti hidup dan angka 0 berarti mati. Dan pada tahun 1973,
simbol ini diresmikan oleh International Electrotechnical Commission sebagai
simbol untuk tombol power. Bentuk yang menyerupai tombol daya ini dapat
diartikan tombol pemecah solusi yang disediakan oleh layanan Gojek.

Gambar 4 Mapping Point Icon

Bentuk logogram menyerupai ikon mapping point seperti yang terlihat pada
Gambar 4. Ikon tersebut sering digunakan sebagai penanda koordinat suatu
lokasi baik di peta manual, peta digital, aplikasi penunjuk arah, maupun hanya
sekedar menunjukkan lokasi. Ikon ini sudah akrab diartikan bagi para pengguna
aplikasi sebagai koordinat lokasi suatu tempat. Kemiripan ini sejalan dengan
fungsi aplikasi Gojek yang membantu pengguna untuk menemukan lokasi yang
diinginkan atau dituju dengan akurat.

Logo Gojek
ketika diputar
45 °

Gambar 5 Search Icon

a. Bentuk logogram pada Gambar 5 menyerupai ikon pencarian, dimana ikon ini
diambil dari kaca pembesar yang dapat diartikan sebagai fungsi pencarian.
Sejalan dengan visi dan misi Gojek yang membantu pengguna mencari
berbagai layanan yang diinginkan dalam aplikasi Gojek.

Gambar 1 Interpretasi Logo Gojek menjadi Roda Kemudi

b. Bentuk logogram pada Gambar 6 menyerupai ikon roda kendaraan atau

kemudi mobil. Roda kendaraan atau kemudi mobil ini dapat diasosiasikan
pada logo Gojek sebagai aplikasi yang berbasis pada teknologi dan awalnya
muncul dengan layanan utama menekankan pada layanan transportasi
kepada pengguna.

Logo Gojek
ketika
diputar 180 °

Gambar 2 Interpretasi Logo Gojek menjadi Supir Gojek

 c. Bentuk logogram pada Gambar 7 menyerupai supir motor jika dilihat dari
atas. Persepsi ini dapat diartikan bahwa layanan Gojek pada awalnya
bermula pada layanan transportasi kendaraan beroda dua yaitu motor,
sesuai dengan akronim namanya yaitu Go dan Ojek.

Fleksibel Logo Gojek Yang Baru

Fleksibel disini berarti ketika dipakai dalam ukuran besar maupun kecil logo secara
keseluruhan akan terlihat dengan jelas dan mudah. Sedangkan desain logo yang
sebelumnya lebih sulit untuk dilihat apabila terpasang pada atribut maupun media
iklan yang berukuran kecil. Mengingat Gojek merupakan perusahaan yang cukup
besar dan membutuhkan berbagai media iklan dan juga pembuatan berbagai
stationary dalam kebutuhannya memperkenalkan layanannya kepada publik.
Dengan desain logonya yang baru, hal tersebut tidak menjadi masalah lagi karena
pada dasarnya logogram yang seringkali tidak begitu jelas di media-media tertentu
kini lebih mudah terlihat. Keputusan Gojek meninggalkan logonya yang lama
berkaitan juga dengan tampilan logogram-nya yang terdahulu cenderung sangat
detail.

Logo baru Gojek dapat diterapkan secara portrait maupun landscape seperti berikut:

Gambar 3 Logo Baru Gojek secara Portrait dan Landscape

Sebagai sebuah aplikasi berbasis daring, Gojek membutuhkan tampilan ikon aplikasi
yang seringkali ditemukan pada Playstore dan juga iOS. Saat ini Gojek menggunakan
logogram-nya sebagai tampilan ikon aplikasi.

Gambar 4 Tampilan Ikon Aplikasi Gojek

Tampilan logogram yang dipakai dalam aplikasi Gojek seperti yang terlihat pada
Gambar 9 ini sangat aplikatif. Bentuk dasarnya yang berbentuk lingkaran dengan
warna solid ini menjadi bentuk dasar utama dalam penerapan ke dalam ikon-ikon
layanan gojek lainnya. Seperti yang dapat kita lihat pada Gambar 10, demi
menyampaikan perwakilan visual yang jelas pada setiap layanan, masing-masing
ikon menggunakan gaya Gestalt yang konsisten dengan gambar yang paling mewakili
setiap jenis layanannya. Sedangkan untuk mempermudah kategorisasi dari setiap
layanan, Gojek menggunakan warna sebagai pembeda utama.
Gambar 10 Tampilan Ikon-ikon pada Layanan Aplikasi Gojek
https://medium.com/paperpillar/tentang-ukuran-pada-desain-ui-bagian-1-b15a1edabdce
Typografi Font
https://qwords.com/blog/font-gojek/ Font Gojek
https://www.sehatq.com/artikel/arti-warna-menurut-psikologi-warna psikologi warna
https://www.jurnal.id/id/blog/psikologi-warna-pada-branding/ psikologi warna pada
branding
https://www.niagahoster.co.id/blog/warna-efektif-desain-website/
https://journals.sagepub.com/doi/abs/10.1177/1470593106061263 studi atau jurnal
tentang faktor penting dalam membangun persepsi konsumen terhadap brand/aplikasi
https://health.detik.com/berita-detikhealth/d-5173928/arti-filosofi-dan-psikologi-warna-
yang-harus-diketahui psikologi dasar warna
https://core.ac.uk/download/pdf/35389457.pdf jurnal penelitian warna
https://ejournal.akprind.ac.id/index.php/technoscientia/article/download/2411/1852
sumber penelitian tentang warna yang mempengaruhi psikologi manusia dan keberhasilan
suatu brand/aplikasi
https://www.pindexain.com/apa-itu-flat-design/ flat design
https://idseducation.com/seputar-flat-design-yang-perlu-kamu-tahu/ flat design