lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/12600/1/laporan magang kimoro...

Team project ©2017 Dony Pratidana S. Hum | Bima Agus Setyawan S. IIP

Hak cipta dan penggunaan kembali:

Lisensi ini mengizinkan setiap orang untuk menggubah, memperbaiki, dan membuat ciptaan turunan bukan untuk kepentingan komersial, selama anda mencantumkan nama penulis dan melisensikan ciptaan turunan dengan syarat yang serupa dengan ciptaan asli.

Copyright and reuse:

This license lets you remix, tweak, and build upon work non-commercially, as long as you credit the origin creator and license it on your new creations under the identical terms.

LAPORAN KERJA MAGANG

PEMBUATAN DESAIN UI / UX DAN LOGO

PADA PT INFOMEDIA NUSANTARA

Nama : Kimoro Clavinsky

NIM : 11110310062

Fakultas : Teknik dan Informatika

Program Studi : Sistem Informasi

UNIVERSITAS MULTIMEDIA NUSANTARA

TANGERANG

2017

Pembuatan desain ui..., Kimoro Clavinsky, FTI UMN, 2017

ii

LEMBAR PERNYATAAN TIDAK MELAKUKAN

PLAGIAT

Dengan ini, saya:


NIM :11110310062



menyatakan bahwa saya telah melakukan praktik kerja magang di

Nama Perusahaan : PT. Infomedia Nusantara

Divisi : Mobile Application Development

Alamat : Jl. RS. Fatmawati No 77-81 Jakarta Selatan

Periode Magang : 13 Februari – 13 Juni

Laporan kerja magang ini merupakan hasil karya saya sendiri dan saya tidak

melakukan plagiat. Semua kutipan karya ilmiah orang lain atau lembaga lain yang

dirujuk dalam laporan kerja magang ini telah saya sebutkan sumber kutipannya

serta saya cantumkan di daftar pustaka.

Jika dikemudian hari terbukti ditemukan kecurangan atau penyimpangan, baik

dalam pelaksanaan kerja magang maupun dalam penulisan laporan kerja magang,

saya bersedia menerima konsekuensi dinyatakan tidak lulus untuk mata kuliah

kerja magang yang telah saya tempuh.

Tangerang, 6 Juli 2017

Kimoro Clavinsky


iv

PENGESAHAN LAPORAN KERJA MAGANG

PEMBUATAN DESAIN UI / UX DAN LOGO PADA PT

INFOMEDIA NUSANTARA

Oleh:


NIM : 11110310062



Tangerang, 27 Juli 2017

Pembimbing Penguji

Yustinus Eko Soelistio, S.Kom., M.M. Marcelli Indriana, S.Kom., M.Sc.

Mengetahui

Ketua Program Studi Sistem Informasi

Wira Munggana, S.Si, M.Sc.


v

ABSTRAK

Oleh: Kimoro Clavinsky

Dalam kegiatan kerja magang ini penulis melakukan praktik magang di

PT. Infomedia Nusantara sebagai desainer user interface / user experience dan

logo selama 4 bulan atau lebih tepatnya 18 minggu. Penulis mendapatkan sebuah

pengalaman yang sangat berharga dan mendapatkan ilmu baru yang belum pernah

didapatkan di kampus. Selain mendapat pengalaman dan ilmu, penulis juga

mendapatkan banyak wawasan dan pengetahuan mengenai dunia kerja.

Dalam proses kerja magang ini penulis mengerjakan beberapa tugas

diantaranya melakukan pertemuan dengan klien, membuat desain user interface

dari satu aplikasi, membuat icon aplikasi mobile, merancang logo aplikasi dan

banner, dan membuat suatu poster katalog. Sebagian besar pekerjaan diatas

dilakukan menggunakan software untuk mendesain dan melakukan proses editing

yaitu Adobe Photoshop CS6 64-bit. Aplikasi seperti Photoscape, Microsoft Word,

Microsoft Excel juga digunakan untuk beberapa pekerjaan. Setelah pekerjaan

diselesaikan, lalu diserahkan kepada tim mobile apps development untuk

ditampilkan ke dalam aplikasi mobile yang dibuat

.

Kata kunci: desain, logo, Adobe Photoshop, User Interface


vi

KATA PENGANTAR

Rasa syukur yang dalam penulis sampaikan kepada Tuhan Yang Maha

Esa. Karena berkat limpahan rahmat beliau dan bantuan-Nya penulis mampu

menyelesaikan praktik kerja magang dengan baik dan penyusunan laporan yang

berjudul “Pembuatan Desain UI/UX dan Logo pada PT Infomedia Nusantara”

bisa terselesaikan dengan sempurna. Selesainya penulisan laporan ini juga tidak

lepas dari dukungan berbagai pihak, oleh karena itu penulis mengucapkan banyak

terima kasih kepada:

1. Ibunda tercinta yang selalu mendukung dan menyemangati dalam

keadaan apapun.

2. Dr. Ninok Leksono, selaku rektor Universitas Multimedia Nusantara.

3. Wira Munggana, S.Si., M.Sc selaku ketua program studi Sistem

Informasi.

4. Yustinus Eko selaku dosen pembimbing yang tidak bosan – bosannya

dalam membimbing dan memberikan masukan kepada penulis.

5. Ibu Jaswati selaku manager PT Infomedia Nusantara yang telah

memberikan kesempatan melakukan kerja magang.

6. Haviza Amelia, Syahrullah, dan seluruh staff PT Infomedia Nusantara

yang telah banyak membantu dalam melakukan pekerjaan

7. Aditya Basudewa, Naufal Adi Nugraha, Yanuar Ariya, Dody Tri

Saputro, selaku rekan seperjuangan penulis dan angkatan tua yang

bertarung tiada hentinya.

8. Teman – teman “Saturday Night” yang paling tahu cara menghibur

penulis.

Semoga laporan magang ini dapat bermanfaat sebagai sumber informasi

bagi para pembaca, khususnya mahasiswa di Universitas Multimedia Nusantara.


vii

DAFTAR ISI

LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT .................... II

PENGESAHAN LAPORAN KERJA MAGANG ......................................... IVII

ABSTRAK ........................................................................................................... IV

KATA PENGANTAR ......................................................................................... VI

PENDAHULUAN .................................................................................................. 1

1.1. LATAR BELAKANG ................................................................................... 1

1.2. MAKSUD DAN TUJUAN KERJA MAGANG .................................................. 2

1.3. WAKTU DAN PROSEDUR PELAKSANAAN KERJA MAGANG ....................... 3

1.3.1. Waktu Pelaksanaan Kerja Magang ..................................................... 3

1.3.2. Prosedur Pelaksanaan Kerja Magang .................................................. 4

1.3.2.1. Tahap Pengajuan ............................................................................. 4

1.3.2.2. Tahap Pelaksanaan .......................................................................... 5

GAMBARAN UMUM PERUSAHAAN .............................................................. 7

2.1. LATAR BELAKANG PERUSAHAAN ............................................................ 7

2.1.1. Sejarah Perusahaan.............................................................................. 7

2.2. VISI DAN MISI PERUSAHAAN .................................................................... 9

2.2.1. Visi Perusahaan ................................................................................... 9

2.2.2. Misi Perusahaan .................................................................................. 9

2.3. STRUKTUR ORGANISASI PERUSHAAN ..................................................... 10


viii

2.4. LAYANAN INFOMEDIA ............................................................................ 12

2.5. CORPORATE BRAND ............................................................................... 14

PELAKSANAAN KERJA MAGANG .............................................................. 16

3.1. KEDUDUKAN DAN POSISI ....................................................................... 16

3.2. TUGAS YANG DILAKUKAN ..................................................................... 16

3.2.1. Pembuatan UI / UX ........................................................................... 17

a. Pembuatan UI / UX pada Aplikasi Polda Bali ...................................... 17

b. Pembuatan Mockup UI Aplikasi DAMRI............................................. 19

3.2.2. Pembuatan Desain Logo ................................................................... 24

A. Pembuatan Desain Logo pada Aplikasi CTB Indihome ....................... 24

a. Logo CTB Flashscreen .......................................................................... 25

b. Logo CTB Indihome 2 .......................................................................... 28

c. Logo CTB Indihome 3 .......................................................................... 29

d. Banner CTB Indihome .......................................................................... 31

B. Pembuatan desain Logo T - Money ..................................................... 33

3.2.3. Pembuatan Desain Icon ..................................................................... 36

a. Pembuatan Icon Aplikasi Polda Bali..................................................... 36

3.2.4. Pekerjaan Lain – Lain ....................................................................... 38

a. Pengambilan Gambar pada PT Jasa Marga ........................................... 38

b. Pembuatan Poster Catalog I – Wifi ....................................................... 41

3.3. KENDALA YANG DIHADAPI .................................................................... 42

3.4. SOLUSI ATAS KENDALA YANG DIHADAPI .............................................. 42

KESIMPULAN DAN SARAN ........................................................................... 43


ix

4.1. KESIMPULAN .......................................................................................... 43

4.2. SARAN.................................................................................................... 43

DAFTAR PUSTAKA .......................................................................................... 45


1

BAB I

PENDAHULUAN

Latar Belakang

Smartphone merupakan perangkat yang tidak dapat dipisahkan lagi dalam

kehidupan. Dalam perkembangannya yang sangat pesat, telepon genggam sudah

berkembang menjadi suatu perangkat yang serba bisa yang kemudian dinamakan

smartphone, dan smartphone sekarang sudah menjadi kebutuhan primer untuk

kebanyakan orang karena fungsinya yang serba bisa. Tidak hanya untuk telepon

saja, fitur seperti internet, e-mail, social media, instant messaging, game, hingga

transportasi seperti GO-JEK bisa dilakukan dengan mudah dan dimana saja.

Namun sebuah ponsel tidak bisa dikatakan sebagai smartphone apabila tidak

dilengkapi dengan aplikasi pendukungnya yang disebut mobile application, atau

singkatnya mobile apps.

Mobile Apps adalah suatu tipe dari aplikasi perangkat lunak, yang didesain

khusus untuk dijalankan di perangkat mobile, seperti smartphone, atau tablet

computer. Tujuan dibuatnya Mobile Apps adalah untuk menyajikan pengguna

dengan aplikasi yang biasa digunakan pada komputer desktop, namun di

optimasikan untuk perangkat mobile. Sedangkan logo, diartikan sebagai tulisan

nama entitas yang didesain secara khusus dengan menggunakan teknik lettering

atau memakai jenis huruf tertentu. (Rustan, 2009: 12). Fungsi dari sebuah logo

tidak hanya untuk membedakan citra, produk, atau layanan perusahaan dari

pesaingnya ke khalayak namun juga membantu membangun ekuitas, nilai atau

merek, atau kelompok. (Landa, 2009, p.241)

Salah satu perusahaan penyedia layanan bisnis, PT. Infomedia Nusantara

yang merupakan anak perusahaan PT. Telekomunikasi Indonesia Tbk. memiliki

fokus pada pembangunan web dan aplikasi. Perancangan dan pengembangan


2

aplikasi mobile merupakan salah satu layanan yang disediakan oleh PT. Infomedia

Nusantara.

Penulis mendapatkan kesempatan untuk melakukan kerja magang pada

divisi Mobile Application Development yang bertanggung jawab dalam membuat

aplikasi mobile untuk client – client nya. Pada divisi tersebut, penulis bekerja

dalam tim, yang bertugas untuk merancang desain logo, dan desain UI / UX.

Pekerjaan yang dilakukan meliputi pembuatan desain UI / UX, desain sebuah

logo, dan desain icon pada aplikasi mobile. Gantt chart pada gambar 1.1 ini

menguraikan pekerjaan apa saja yang telah dilakukan oleh penulis.

Gambar 1.1 Gantt Chart

Maksud dan Tujuan Kerja Magang

Maksud dan tujuan melakukan praktek untuk mahasiswa dan perusahaan

adalah sebagai berikut.

Tujuan bagi Mahasiswa:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

Pengenalan dengan Tim

UI Polda Bali

Icon Polda Bali

UI DAMRI

Aplikasi Jasamarga

Flashscreen CTB Indihome

CTB Indihome 2

CTB Indihome 3

Banner CTB Indihome

Logo T - Money

Catalog i-Wifi

Gantt Chart


3

Mengetahui dunia kerja serta memiliki pengalaman dan ilmu baru

untuk dunia kerja.

Memperbanyak dan memperluas relasi.

Melakukan perancangan user interface dan logo untuk mobile

application.

Membuat laporan dari hasil kerja magang.

Bekerja sama dengan tim PT Infomedia Nusantara dalam melakukan

penerapan dan pelaksanaan kerja.

Tujuan bagi Perusahaan:

Mendapat bantuan tenaga kerja dari mahasiswa magang.

Terjalin kerjasama dengan universitas sehingga perusahaan tersebut

lebih dikenal oleh kalangan akademis.

Adanya kritikan – kritikan yang membangun dari mahasiswa untuk

perusahaan.

Waktu dan Prosedur Pelaksanaan Kerja Magang

Dalam subbab ini akan dijelaskan mengenai waktu kerja dan prosedur

pelaksanaan kerja magang.

Waktu Pelaksanaan Kerja Magang

Kerja magang dilakukan pada tanggal 13 Februari sampai dengan 13 Juni

2017. Penulis melakukan praktek kerja pada pukul 08.00 – 17.00 WIB, dana pada

bulan Ramadhan pukul 07.30 – 15.30. Dalam pelaksanaan magang, penulis

bekerja secara Full Time. PT. Infomedia Nusantara berlokasi di Jl. RS. Fatmawati

77-81 Jakarta Selatan.


4

Prosedur Pelaksanaan Kerja Magang

Program kerja magang dilakukan dengan mengikuti prosedur dari

Universitas Multimedia Nusantara yang wajib diikuti oleh mahasiswa. Beberapa

prosedur yang wajib dilakukan yakni:

1.3.2.1. Tahap Pengajuan

1. Peserta magang melakukan bimbingan kepada dosen pembimbing

2. Melakukan pengisian KRS magang berdasarkan prosedur yang sudah

ditentukan oleh Universitas Multimedia Nusantara

3. Mengirimkan CV (Curriculum Vitae) kepada PT Infmedia Nusantara

sebagai syarat pelasanaan magang periode Februari – Juni.

4. Memenuhi panggilan interview dari bagian HRD / bagian penerimaan

pegawai PT. Infomedia Nusantara. Dari hasil interview tersebut, HRD

menyatakan penulis diterima program magang dan dapat melaksanakan

kerja pada tanggal 13 Februari 2017.

5. Mengurus surat permohonanan magang dari administrasi fakultas ICT

(Information Communication Technology) UMN yang selanjutnya akan

diberikan ke PT Infomedia Nusantara.

6. Bagian HRD memberikan surat balasan atas surat permohonan magang

sebelumnya untuk diberikan kepada BAAK (Biro administrasi

Akademik dan Kemahasiswaan). Setelah surat diberikan maka penulis

dinyatakan resmi bekerja magang untuk PT Infomedia Nusantara.


5

7. Berdasarkan surat penerimaan yang diberikan kepada pihak BAAK,

penulis menerima beberapa lembar kertas yang harus diisi dahulu

seperti:

- Kartu kerja magang (KM03)

- Kehadiran kerja magang (KM04)

- Laporan realisasi kerja magang (KM05)

- Penilaian kerja magang (KM06)

- Tanda terima penyerahan laporan kerja magang (KM07)

8. Dokumen tersebut akan dijadikan sebagai panduan dalam melakukan

kerja magang selama 4 bulan yang akan datang.

1.3.2.2. Tahap Pelaksanaan

1. Mahasiswa melakukan magang dengan ketentuan dan peraturan yang

telah ditetapkan. Selama pelaksanaan kerja magang, penulis dibimbing

oleh Bapak Alfarisi selaku Manajer, dan dibantu oleh Haviza Amelia

sebagai user interface dan mock-up designer pada divisi Mobile Apps

Development yang membantu dan membimbing pekerjaan magang dan

pembuatan laporan.

2. Selama proses magang, penulis melakukan pembuatan desain user

interface dan mock-up dari aplikasi mobile Android dalam beberapa

proyek.

3. Penulis melakukan pertemuan dan membahas proyek yang akan

dikerjakan beserta requirement dan alur prosesnya.

4. Dokumen yang akan dikerjakan adalah pembuatan user interface,

mock-up, desain logo, dan icon pada mobile apps.


6

5. Setelah desain selesai dikerjakan, maka hasil pekerjaan tersebut

diberikan kepada pembimbing untuk diperiksa dan direvisi jika ada

yang kurang sesuai.

6. Selanjutnya desain tersebut diberikan kepada programmer untuk dibuat

aplikasi mobile-nya sesuai dengan rancangan yang telah diberikan.


7

BAB II

GAMBARAN UMUM PERUSAHAAN

Latar Belakang Perusahaan

PT. Infomedia Nusantara adalah sebuah perusahaan pada Telkom Group

yang mengkhususkan pada bidang media penerbitan dan iklan sebagai jembatan

komunikasi antara pelaku bisnis dan juga saluran informasi bagi pelanggan

telepon Telkom. Saham Infomedia dimiliki langsung oleh Telkom sebesar 51%,

sedangkan sisanya dimiliki oleh anak perusahaan Telkom lainnya seperti

Multimedia Nusantara.

Sejarah Perusahaan

Pada tahun 1975 PT. Infomedia Nusantara menjadi perusahaan pertama

penyedia layanan informasi telepon Indonesia. Di bawah sub divisi Elnusa GTDI

dari anak perusahaan Pertamina, Infomedia telah menerbitkan Buku Petunjuk

Telepon Telkom Yellow Page. Perkembangan yang tercatat selanjutnya adalah

berdirnya PT Elnusa Yellow Pages pada tanggal 20 Juni 1984 dan berubah nama

di tahun 1995 menjadi PT Infomedia Nusantara pada saat PT Telkom Tbk

menanamkan investasi.

Untuk mendukung implementasi Good Corporate Governance dalam

setiap aspek kegiatan perusahaan. Infomedia telah mengeluarkan kebijakan

pedoman tata kelola perusahaan di tahun 2008 dan pada tanggal 30 Juni 2009 PT

Telekomunikasi Indonesia (Telkom) melalui PT Multimedia Nusantara (Metra),


8

anak perusahaan yang 99,99% milik Telkom telah menandatangani Share Sales &

Purchase Agreement (SPA) untuk membeli saham PT Infomedia Nusantara milik

PT Elnusa Tbk (Elnusa), sehingga 100% saham PT Infomedia Nusantara secara

resmi dimiliki oleh Telkom Group. Dengan komposisi saham kepemilikan

Infomedia menjadi 49% Metra dan 51% Telkom.

Tabel 2.1 Timeline Infomedia Nusantara

Tahun Perkembangan Infomedia Nusantara

2009 Transformasi konsep bisnis menjadi Digital Media Rich

Content (DMRC) dan Contact Center dan Outsourcing Service

(CC & OS)

2011 Pengembangan pilar bisnis DMRC dan CC & OS menjadi

Business Process Outsorcing / Knowledge Process Outsorcing

(BPO & KPO), Directory & Advertising dan Printing &

Publishing. 3 bisnis tersebut mencakup 7 portofolio yaitu:

Customer Relationship Management Service, Human Resources

Services, Operation Services, Data Analytics, Directory &

Advertising, Digital Rich Content dan Printing Publishing.

2012 TelkomMetra menambah kepemilikan saham atas Infomedia

sehingga komposisi kepemilikan menjadi 51% TelkomMetra

dan 49% Telkom.

2014 Infomedia kembali menata portofolionya supaya konsisten


9

dalam mencapai visi menjadi leader dalam Business Process

Management (BPM) sesuai dengan arahan dari Business

Strategic Scenario 2014 – 2018 yakni: Customer Relationship

Management, Business Process Outsourcing, Information

Technology Outsourcing, dan Knowledge Process

Outsourcing.keseluruhan layanan Infomedia merupakan

komitmen perusahaan dalam memberikan solusi layanan

Business Process Management.

Visi dan Misi Perusahaan

Visi dapat diartikan sebagai tujuan jangka panjang perusahaan untuk

dicapai. Visi digunakan untuk mencapai tujuan yang akan datang, dan

penulisannya tidak secara detail karena lebih menerangkan gambaran umum

mengenai apa yang ingin dicapai.

Sedangkan misi, bisa diartikan sebagai hal yang harus dilakukan untuk

mewujudkan sebuah visi. Maka misi diciptakan untuk memberikan arahan dan

batasan dalam proses pencapaian tujuan perusahan.

Visi dan Misi PT Infomedia Nusantara adalah:

Visi Perusahaan

To be the Leading Player in Business Process Management Service in The

Region

Misi Perusahaan


10

1. To create values for our stakeholders by providing excellent and

competitive BPM Services

2. To be the Role model BPM company

Struktur Organisasi Perushaan

Struktur organisasi PT Infomedia Nusantara dapat digambarkan seperti

pada gambar di bawah ini:

Gambar 2.1 Struktur Organisasi Perusahaan

PT Infomedia Nusantara memiliki struktur organisasi yang meliputi

beberapa departemen dan divisi yang ada pada perusahaan tersebut, salah satunya

adalah departemen Mobile Application Development, tempat penulis bekerja.

Pada setiap departemen dan setiap divisi memiliki manager sendiri, dan

setiap manager memiliki bawahan yang membantu untuk mengerjakan project dan

terjun langsung ke lapangan untuk mengerjakan project tersebut. Peran manager

di sini adalah sebagai monitoring project dan membantu para staf yang

Directorat Corporate

Directorat Marketing & Sales

Directorat Solution & Business

Development

Divisi Application Development

Departement Contact Center Development

Departement Mobile

Application Development

Departement Service Aplication

Development

Directorat Operation

Directorat Corporate Finance &

Business Support


11

mengerjakan project jika mengalami kendala dan kesulitan dalam pengerjaannya.

Dalam struktur organisasi PT Infomedia Nusantara memiliki beberapa bagian

diantaranya:

1. Direktorat Corporate

Pada bagian ini memiliki 2 cabang yaitu group of expert dan juga memiliki

corporate affair dan divisi corporate strategy. Pada bagian corporate affair ini

memiliki beberapa departemen seperti departemen corporate communication,

departemen legal dan regulator, dan departemen compliace. Dan pada bagian

corporate strategy memiliki departemen corp planning, departemen strategic

investment dan departemen strategy evaluation & control.

2. Direktorat Marketing & Sales

Bagian Marketing & Sales memiliki satu departemen yaitu departemen

business assurance yang menangani penjualan produk yang dijual. Dalam

departemen ini terdapat beberapa bagian seperti bagian sales government and

wholesale, bagian sales dan bagian marketing.

3. Direktorat Solution & Business Development

Di bagian ini memiliki beberapa bagian lagi yaitu:

1. Divisi Project Management

Pada bagian ini ada beberapa departemen seperti depatemen

Production Planning dan Controlling dan departemen Partnership

dan provisioning.

2. Divisi Infrastructure Development

Di dalam bagian ini memiliki beberapa departemen seperti

departemen Platform Development, departemen System

Development dan departemen Site & Facilities Development.

3. Divisi Application Development


12

Ada beberapa departemen di dalam divisi applocation

development meliputi departemen Contact Center Development,

departemen Mobile Application Development, dan Service

Application Development.

4. Divisi BPO & TO Business

Di dalam bagian ini ada beberapa departemen yang meliputi

departemen BPO Business, departemen TO Business, dan

departmen Service Operation Business.

5. Divisi Digital CRM & Global Business

Departemen yang terdapat di bagian ini adalah departemen

Multichannel CRM Business, departemen Global Business dan

departemen Media & Online Business.

4. Direktorat Operation

Di bagian ini hanya memiliki satu kepala departemen yaitu departemen

Planning & Controlling, tetapi memiliki beberapa bagian lagi dibawahnya yaitu

bagian operation Telkom, operation Telkomsel, dan bagian Service operation.

Direktorat ini menangani wilayah – wilayah yang dicakup oleh Telkom dan

Telkomsel.

Layanan Infomedia

Layanan Business Process Management Infomedia terdiri dari 4 pilar

bisnis, yaitu:

1. Customer Relationship Management

Dengan lebih dari 12 tahun pengalaman dalam mengelola contact center di

berbagai segmen industri, layanan CRM Infomedia saat ini didukung lebih dari


13

20.000 frontliners di 16 kantor layanan yang tersebar di seluruh Indonesia untuk

melayani 120 pelanggan lokal dan global enterprise.

2. Business Process Outsourcing

BPO Merupakan bisnis penyedia jasa alih daya dan proses bisnis yang

memfokuskan untuk mendukung perusahaan dalam meningkatkan perforasinya.

Tujuannya yaitu supaya pelanggan dapat lebih fokus terhadap core business yang

dijalankan dengan tetap dapat mengontrol biaya, standarisasi, rasionalisasi,

pemasok, transparasi data, timeline, skalabilitas, dan peningkatan layanan.

Infomedia menawarkan ruang lingkup layanan BPO antara lain: Document

Management System, Asset Management Solution, Human Resource Shared

Service, Financial and Accounting Shared Service and Value Added Shared

Service.

3. Knowledge Process Outsourcing

KPO merupakan layanan yang menyediakan analisa bereputasi dan

konsultasi statistik di segmen industri yang didukung oleh software analisa

statistik yang up to date, pengalaman keahlian, dan berbagai jaringan. Hal ini

dilakukan untuk melakukan analisa proses bisnis perusahaan customer agar lebih

baik dari sebelumnya dan dapat berkembang maju.


14

Corporate Brand

Peresmian identitas korporat dilaksanakan pada 23 Januari 2014. Filosofi

identitas baru Infomedia berbentuk sembilan kelopak bunga, yang terinspirasi dari

angka 9 yang merupakan angka tertinggi, dimana angka tersebut melambangkan

kesempurnaan, sesuai dengan fokus Infomedia untuk menjadi perusahaan BPM

terbaik di regional.

Benih – benih dandelion yang menyebar kuas dan tumbuh

menggambarkan replikasi kesuksesan yang juga berdampak poitif pada

lingkungan di mana dia tumbun.

Setelah jatuh ke tanah, tumbuhnya dandelion baru adalah simbolisasi dari

usaha Infomedia untuk selalu berinovasi dan memperbaharui kinerjanya. Warna

merah yang juga merupakan warna kebangsaan Indonesia ini melambangkan

keberanian, di mana Infomedia senantiasa berani dalam melakukan inovasi dan

membuat perubahan yang bermakna untuk mitra kerja, Infomedia, dan juga

masyarakat.

Platinum yang merupakan salah satu perak mulia melambangkan

komitmen Infomedia untuk selalu memberikan kontribusi serta solusi dan layanan


15

terbaik untuk selruh mitra kerja Infomedia sehingga menghantarkan mereka

kepada kesuksesan yang gemilang.


16

BAB III

PELAKSANAAN KERJA MAGANG

Kedudukan dan Posisi

Dalam kegiatan kerja magang selama 4 bulan atau tepatnya 18 minggu di

PT Infomedia Nusantara, penulis mendapat kedudukan sebagai desainer logo, dan

desainer UI / UX di pada divisi Mobile Application Development yang bertugas

untuk membuat logo, dan desain User Interface pada sebuah aplikasi mobile.

Kerjasama dan koordinasi dilakukan dengan melakukan meeting di kantor

ataupun melalui email dan aplikasi Whatsapp Messenger untuk mempermudah

komunikasi jarak jauh. Dalam proses pengerjaam, Tiap progress dilaporkan setiap

hari kepada pembimbing lapangan, dan apabila ada yang perlu untuk direvisi

maka akan diinformasikan langsung.

Tugas yang Dilakukan

Selama pelaksanaan kerja magang yang berlangsung 18 minggu, tugas

yang diberikan adalah membuat desain logo dari aplikasi mobile CTB Indihome,

logo aplikasi T-Money, logo, icon, dan user interface aplikasi Polda Bali, desain

user interface aplikasi DAMRI, dan katalog brosur i-Wifi. Software yang

digunakan dalam pembuatan logo tersebut adalah Adobe Photoshop CS6.

Pada minggu awal pelaksanaan magang pada PT Infomedia Nusantara,

penulis diperkenalkan dengan tim Mobile Apps Development dan para manajer.

Setelah itu diberikan sosialisasi tentang peraturan yang berlaku di dalam

perusahaan, dan mempelajari layanan dan produk - produk yang disediakan oleh

PT Infomedia Nusantara.

Setelah tahap pengenalan, Pak Alfarisi, selaku manajer, dan Pak

Syahrullah selaku koordinator tim mulai memberikan briefing mengenai


17

pekerjaan yang akan dilakukan, seperti membuat desain User Interface, desain

logo, dan memberikan gambaran besar proses bisnisnya.

Pembuatan UI / UX

a. Pembuatan UI / UX pada Aplikasi Polda Bali

Aplikasi Polda Bali adalah aplikasi berbasis Android yang digunakan oleh

penduduk di Bali untuk melihat map dan lokasi polisi yang sedang berpatroli, dan

ada tombol Call untuk memanggil polisi terdekat dalam keadaan darurat. Setelah

tombol ditekan, maka polisi yang terdekat akan menghampiri ke lokasi orang

tersebut untuk memberikan bantuan, beserta estimasi waktunya. Sesudah bantuan

diberikan, maka akan muncul halaman review dengan cara memberikan bintang

untuk polisi tersebut.

Pada pembuatan UI aplikasi ini, penulis bertugas membuat UI untuk

menampilkan map dan lokasi polisi, dan halaman review saja. Setelah itu, UI ini

diberikan ke pembimbing lapangan dan dimasukkan ke aplikasi Polda Bali.

Gambar yang dipakai diambil dari internet dan dari web flaticon.com, sedangkan

program yang digunakan adalah Adobe Photoshop CS6.


18

Gambar 3.1 Halaman Call Officer

Gambar 3.2 Halaman Review


19

b. Pembuatan Mockup UI Aplikasi DAMRI

DAMRI, atau yang merupakan singkatan dari Djawatan Angkoetan Motor

Repoeblik Indonesia adalah transportasi umum milik BUMN yang melayani

transportasi dari berbagai wilayah ke Bandara Soekarno Hatta. Di minggu ke-

lima, penulis diminta bantuan untuk membuat mockup atau rancangan awal UI

aplikasi DAMRI. Dalam tahap awal pengembangannya, aplikasi ini berfungsi

untuk melihat jadwal keberangkatan bus, melakukan pembelian tiket, memilih

tempat duduk, dan melihat history transaksi. Pembayaran dapat dilakukan

menggunakan kartu kredit, BCA Klikpay, dan T-Cash. Pembuatan mockup ini

menggunakan program Adobe Photoshop CS6.

Gambar 3.3 Mockup Halaman Login Aplikasi DAMRI

Halaman login ini adalah halaman awal dari aplikasi DAMRI. Pengguna

diminta memasukkan email dan password untuk dapat menggunakan aplikasi ini.


20

Gambar 3.4 Mockup Halaman utama Aplikasi DAMRI

Pada halaman utama aplikasi DAMRI, pengguna dapat memesan tiket,

yang akan di-generate menggunakan QR, melihat jadwal bus, dan melihat history

transaksi.

Gambar 3.5 Mockup Halaman Pesan Tiket


21

Setelah penumpang memilih untuk pesan tiket, maka akan berlanjut ke

halaman pesan tiket, yang berisi tanggal dan waktu pemberangkatan, stasiun asal

dan tujuan, serta jumlah penumpang yang akan dipesan.

Gambar 3.6 Mockup Halaman Pemilihan Kursi

Halaman selanjutnya adalah halaman untuk melihat dan memilih tempat

duduk yang diinginkan sesuai jumlah penumpang yang sudah kita tentukan. Kita

bisa pilih tempat duduk yang kita kehendaki selama kursi tersebut tersedia.

Ditandai dengan warna krem apabila kursi dapat dipesan, dan warna oranye

apabila kursi sudah terisi.


22

Gambar 3.7 Mockup Halaman Pembayaran

Setelah memilih tempat duduk, maka selanjutnya masuk ke proses

pembayaran. Metode pembayaran yang dipakai sementara ada tiga pilihan, yaitu

kartu kredit atua visa, BCA Klikpay, dan t-cash.

Gambar 3.8 Mockup Halaman Konfirmasi


23

Jika sudah melakukan pembayaran, maka akan berlanjut ke halaman

invoce atau konfirmasi pembayaran. Disitu tertulis rute perjalanan, yaitu berasal

dari stasiun gambir pukul 18.00 menuju Bandara Soekarno Hatta pukul 18.45

dengan nomor order 958461471. Harga tiket Rp. 40.00 dan jumlah penumpang 2

orang, total yang harus dibayar adalah Rp. 80.000. Tiket hanya berlaku pada hari

yang sama sampai dengan jam 12 malam.

Gambar 3.9 Mockup Halaman QR Code

Halaman Tiket akan ter-generate secara otomatis yaitu berupa QR Code

(Quick Response Code). Barcode ini adalah tiket yang berisi informasi yang telah

penumpang isi pada halaman sebelumnya seperti jam keberangkatan, asal, tujuan,

hingga jumlah penumpang. Nantinya barcode ini akan di scan menggunakan QR

Code Scanner dan penumpang diperbolehkan masuk ke bis.


24

Gambar 3.10 Mockup Halaman History

Halaman history ini berisi tentang riwayat transaksi penumpang pada

aplikasi DAMRI. Transaksi diurutkan berdasarkan tanggal, dibawah tanggal

tertera nomor order dan jam pemberangkatan beserta rute perjalanan.

Pembuatan Desain Logo

A. Pembuatan Desain Logo pada Aplikasi CTB Indihome

Aplikasi CTB Indihome adalah aplikasi berbasis mobile dengan sistem

operasi android yang dapat digunakan oleh level pengguna yaitu agent untuk

menangani penagihan pembayaran pada pelanggan Indihome. Proses yang

terdapat di aplikasi ini yaitu memantau work order yang masuk, memantau posisi

customer yang harus dikunjungi, memantau performance agent dan meng-input

data pada form VOC pada saat kunjungan ke customer. Pembuatan logo ini


25

memakai prinsip yang meliputi tipografi, warna, bentuk, keseimbangan, selera,

riset, dan opini (Safanayong, 2006)

Gambar 3.11 Logo Indihome

a. Logo CTB Flashscreen

Logo CTB berikut ini merupakan logo yang muncul pada halaman awal

aplikasi (flashscreen) dan login. Program yang digunakan untuk membuat logo

adalah Adobe Photoshop CS6. Logo tersebut diminta untuk dibuat dalam 3 versi,

dan gambar yang dipilih akan dimasukkan ke halaman flashscreen CTB

Indihome.

Gambar 3.12 Logo CTB Flashscreen Versi 1

33

Logo CTB versi pertama ini adalah tulisan sederhana CTB dengan tanda

panah pada sisi kanan. Warna yang digunakan adalah warna merah yang

merupakan warna utama indihome dan diberikan gradasi merah tua pada bagian

bawah logo.


26


Logo CTB versi kedua adalah pengembangan logo dari versi yang

pertama, yaitu menghilangkan tanda panah di samping dan menambahkan tulisan

indihome pada bagian bawah logo CTB.


Logo ketiga ini dipilih sebagai logo flashscreen pada aplikasi CTB

Indihome. Logo dibuat dalam bentuk lingkaran, yang di dalamnya terdapay

gambar rumah yang diambil dari logo Indihome, dan tulisan CTB pada bagian

bawahnya. Pemilihan warna tetap menggunakan warna merah.


27

Gambar 3.15 Halaman Flashscreen CTB Indihome

Halaman Flashscreen adalah halaman pertama pada saat aplikasi CTB

Indihome di buka.

Gambar 3.16 Logo CTB Indihome Pada Halaman Login

Halaman Login yaitu halaman saat agent diminta memasukkan data

username dan password untuk masuk ke dalam sistem.


28

b. Logo CTB Indihome 2

Logo Indihome yang kedua ini dipakai pada halaman reset password.

Namun logo ini mengalami revisi karena requirement dari Indihome yang berubah

- ubah.

Gambar 3.17 Logo CTB Versi 1

Logo versi pertama hanya berisi tulisan CTB berwarna merah dengan

underline dan gradasi pada tulisan CTB. Namun logo pertama ini mengalami

revisi, karena yang diinginkan oleh pihak Indihome yaitu ada logo Indihome

didalamnya, seperti versi 2 dan 3 dibawah ini.


Indihome CTB versi kedua menampilkan logo indihome dan tulisan CTB

di kanan bawah yang berwarna merah.


29


Versi ketiga dari logo CTB ini masih sama dengan versi sebelumnya,

namun ditambahkan tiga tanda panah warna abu – abu disamping tulisan CTB.

Referensi logo tersebut diambil dari logo Indihome Fiber. Logo ini dipakai dalam

beberapa halaman, contohnya halaman reset password.

Gambar 3.20 Halaman Reset Password

c. Logo CTB Indihome 3

Logo bagian yang ketiga ini adalah logo sederhana dari CTB Indihome

yang terdiri dari tulisan CTB dan logo Indihome.


30

Gambar 3.21 Logo CTB Indihome versi 1

Gambar 3.22 Logo CTB Indihome versi 2

Ini adalah desain awal logo CTB ketiga, tetapi dilakukan revisi karena

pihak Indihome ingin tulisan CTB menggunakan font yang bernama Roboto.

.

Gambar 3.23 Logo CTB Indihome Revisi

Logo yang sudah direvisi ini terlihat lebih sederhana dengan menggunakan

font Roboto.


31

d. Banner CTB Indihome

Banner CTB ini merupakan pengembangan dari logo sebelumnya yaitu

logo CTB Indihome 3 dan logo ini muncul di setiap page pada bagian atas

aplikasi. Tidak ada requirement khusus dari logo ini, yang terpenting harus simpel

dan elegan.

Gambar 3.24 Banner CTB Indihome

Ini adalah versi pertama dari Banner CTB dengan font CTB yang

merupakan tulisan sambung di dalam lingkaran berwarna putih disamping logo

Indihome. Namun versi yang pertama ini mengalami revisi pada tulisan CTB-nya,

font script tersebut sudah bagus tetapi diminta diganti dengan yang lebih elegan.

Gambar 3.25 Banner CTB Indihome Revisi

Banner ini adalah versi revisi dari yang sebelumnya, dan merupakan versi

final. Font CTB pada logo ini hampir mirip dengan versi sebelumnya, masih


32

menggunakan font tipe script atau tulisan sambung, namun diganti dengan font

yang lebih elegan yaitu font Breeze.

Gambar 3.26 Banner CTB pada halaman View Work Order

Gambar 3.27 Banner CTB pada halaman View Profile


33

B. Pembuatan desain Logo T - Money

Aplikasi T- Money adalah sebuah layanan yang memungkinkan pengguna

untuk melakukan transaksi keuangan secara online dengan menggunakan

smartphone atau desktop. Beberapa contohnya adalah melakukan pembelian pulsa

dan voucher, membayar tagihan, pembayaran dengan menggunan QR, transfer

antar T – Money, transfer ke bank, dll.

Untuk aplikasi ini, penulis ditugaskan untuk membuat logo T – Money

yang baru untuk aplikasi mobile-nya.

Gambar 3.28 Logo T – Money Saat Ini

Kriteria dalam membuat logo ini sekreatif mungkin namun harus identik

dengan Infomedia, dan dibuat dalam 3 versi. Referensi yang diambil adalah dari

tiga logo, yaitu logo Infomedia, logo Telkom Indonesia, dan logo Nabila CRM,

yang merupakan salah satu produk CRM dari divisi Contact Center infomedia.


34

Gambar 3.29 Logo Infomedia

Gambar 3.30 Logo Telkom Indonesia

Gambar 3.31 Logo Nabila CRM


35

Dari ketiga referensi diatas, penulis membuat logo untuk aplikasi T –

Money dalam 3 versi.

Gambar 3.32 Logo T – Money Versi 1

Versi pertama ini terdiri dari tulisan T – Money sederhana berwarna abu –

abu dengan logo Infomedia di sebelah kanannya.


Logo versi yang kedua ini memiliki elemen yang sama dengan versi

pertama yaitu tulisan dan logo Infomedia pada bagian atas, namun logo tersebut

hanya setengah bagian saja dengan tidak melupakan komposisi warna yang

menjadi filosofi Infomedia yaitu merah, yang berarti keberanian dan platinum,

yang melambangkan komitmen Infomedia untuk selalu memberikan kontribusi

serta solusi dan layanan terbaik. Font yang digunakan bernama Harabara Mais,


36


Pada versi terakhir, logo T – Money ini masih menggunakan font yang

sama dengan versi kedua, perbedaannya terletak pada huruf O, yang berwarna

putih dan terdapat kelopak bunga seperti logo Nabila CRM. Dan di huruf T bagian

atas juga diberi empat kelopak bunga sebagai identitas Infomedia.

Pembuatan Desain Icon

a. Pembuatan Icon Aplikasi Polda Bali

Pada aplikasi Polda Bali, penulis juga diminta untuk membuat icon untuk

aplikasi di android. Icon terdiri dari logo Tribrata Polri yang berbunyi “Rastra

Sewakottama”, yang artinya “POLRI Adalah Abdi Utama Rakyat” dan

menggunakan tema Bali. Warna juga disesuaikan dengan warna polisi yaitu

coklat, hitam, dan merah. Logo untuk icon pada Android berukuran 300 x 300

pixel


37

Gambar 3.35 Logo Tribrata Polri

Gambar 3.36 Icon Aplikasi Polda Bali

Icon Polda Bali ini berisi logo Tribrata dengan gambar pura di

belakangnya yang melambangkan ciri khas pulau Bali dan diberikan shading

supaya gambar terlihat dinamis. Latar belakang warna coklat dan lingkaran biru

mewakili warna polisi.

Di minggu ke-empat, penulis diminta membuat satu icon lagi untuk Polda

Bali sebagai pilihan alternatif.


38

Gambar 3.37 Icon Aplikasi Polda Bali Versi 2

Masih menggunakan konsep yang sama, icon versi 2 ini berisi Logo

Tribrata dan Pura dengan bentuk yang berbeda. Dan warna merah dan oranye para

latar belakang melambangkan polisi Bali yang selalu melindungi masyarakat Bali.

Pekerjaan Lain – Lain

a. Pengambilan Gambar pada PT Jasa Marga

Gambar 3.38 Logo PT Jasa Marga

Aplikasi Jasa Marga ini adalah aplikasi untuk melihat rute dan gerbang

jalan tol serta mengetahui tarif pembayaran pada jalan tol berdasarkan gerbang

masuk dan gerbang keluar. Cakupan informasi aplikasi Jasamarga ini adalah


39

rincian jumlah gardu tol (gardu masuk, gardu keluar, dan gardu e-toll) yang

disertai gambar di seluruh jalan tol di Indonesia.

Tugas penulis pada aplikasi ini yaitu penulis diminta bantuan untuk

mengambil gambar pintu tol pada tol Jagorawi (Jakarta – Bogor - Ciawi), Japek

(Jakarta - Cikampek), dan Purbaleunyi (Purwakarta – Cileunyi) yang akan

digunakan untuk memperlihatkan gambar pintu tol yang asli. Sesuai instruksi

pembimbing, pengambilan gambar dilakukan dengan menggunakan Google

Streetview yang diakses melalui desktop. Berikut ini adalah beberapa contoh dari

gambar gerbang tol yang sudah diambil.

Gambar 3.39 Pintu Tol Cimanggis (Jagorawi)


40

Gambar 3.40 Pintu Tol Tambun (Japek)

Gambar 3.41 Pintu Tol Cikamuning (Purbaleunyi)


41

b. Pembuatan Poster Catalog I – Wifi

I–Wifi adalah software yang memungkinkan perusahaan untuk

mengontrol pemakaian jaringan WiFi mereka. Software ini digunakan admin

untuk membatasi penggunaan dan kecepatan internet dari user supaya bandwidth

dapat terbagi rata.

Untuk membantu meningkatkan penjualan software I-Wifi ini, penulis

ditugaskan untuk membuat suatu brosur katalog yang menarik. Di dalam brosur

tersebut, disebutkan apa saja keuntungan memakai I-Wifi, dan institusi apa saja

yang cocok menggunakannya. Mudah digunakan, memiliki jaringan yang aman,

dan menguntungkan merupakan beberapa keuntungannya. Sedangkan yang cocok

menggunakan I-Wifi diantaranya ialah lembaga keuangan, perusahaan besar,

restoran, dan perusahaan asuransi.

Gambar 3.42 Catalog I – Wifi


42

Kendala yang Dihadapi

Beberapa kendala yang ditemukan saat melakukan praktek kerja magang

di PT. Infomedia Nusantara antara lain:

1. Requirement yang berubah – ubah dari pihak client, sehingga

dilakukan revisi berulang kali.

2. Kurangnya peengalaman penulis mengenai User Experience / UX.

3. Menerjemahkan sebuah ide yang didapat dari permintaan atau

kebutuhan client ke dalam sebuah logo.

Solusi Atas Kendala yang Dihadapi

Adapun solusi atas kendala yang dihadapi pada saat praktik kerja magang

adalah sebagai berikut:

1. Mendiskusikan dan menganalisa requirement supaya tidak terjadi

perubahan lagi, karena akan menambah panjang waktu yang

diperlukan.

2. Mempelajari lebih lanjut mengenai konsep – konsep User Experience,

seperti penempatan tombol dan gambar – gambar yang sering dilihat

atau di highlight oleh pengguna, dan lain sebagainya.

3. Menuangkan suatu ide kedalam sebuah logo bukanlah hal yang mudah,

dibutuhkan pemikiran dan diskusi dari pihak client dan pihak tim

mobile apps supaya hasil logo sesuai dengan keinginan client.


43

BAB IV

KESIMPULAN DAN SARAN

Kesimpulan

Dalam melakukan kerja magang, penulis berkesempatan untuk melakukan

pembuatan desain UI/UX pada aplikasi POLDA Bali dan aplikasi DAMRI. Dan

desain logo pada aplikasi CTB Indihome dan aplikasi T-Money. Pada pekerjaan

CTB Indihome, logo yang dibuat sudah digunakan pada aplikasi mobile CTB

Indihome. Dalam melaksanakan pekerjaan, penulis melakukan pembuatan desain

sesuai dengan requirement yang diberikan oleh pihak client. Jika ada requirement

yang berubah maka akan dilakukan revisi terhadap pekerjaan tersebut.

Kegiatan kerja magang di PT. Infomedia Nusantara selama 4 bulan telah

terselesaikan, dan telah berhasil melakukan perancangan logo, user interface, dan

icon yang telah sesuai dengan permintaan pihak client dan user dengan tepat

waktu.

Semua rancangan yang telah dibuat sudah disetujui oleh pembimbing

lapangan dan sudah sesuai requirement dari client, sehingga hasil dari pekerjaan

dapat di tampilkan ke dalam aplikasi yang dibuat.

Saran

Beberapa saran yang dapat digunakan dalam pembuatan desain logo dan

user interface supaya lebih bagus dan menarik adalah sebagai berikut:

1. Menyempurnakan tampilan agar lebih menarik dari segala segi elemen,

seperti bentuk, warna, dan tulisan semuanya harus sepadan.


44

2. Menguasai berbagai software untuk mendesain logo dan membuat

mockup seperti Adobe Illustrator, Adobe InDesign, Balsamiq Mockup,

Justinmind, dan sebagainya.

3. Menguasai konsep typography atau teknik dalam menata atau

menyusun huruf – huruf sehingga membuat satu kata. Karena dengan

menguasai konsep typography, sangat mempengaruhi bagus atau

tidaknya suatu logo


45

DAFTAR PUSTAKA

1. Rustan, Surianto. Mendesain Logo, Jakarta: PT Gramedia Pustaka Utama,

2009

2. Safanayong, Yongky. (2006). Desain Komunikasi Visual Terpadu. Jakarta:

ARTE INTERMEDIA

3. Landa, Robin. Designing Brand Experiences, Boston: Wadsworth,

Cengage Learning, 2006


46

LAMPIRAN

Beberapa dokumen dan form yang dibutuhkan terlampir di bawah ini seperti

a. CV

b. Form KM 03 ( Kartu Kerja Magang)

c. Form KM 04 ( Kehadiran Kerja Magang)

d. Form KM 05 ( Laporan Realisasi Kerja Magang)

e. Surat selesai magang

f. Form bimbingan magang


SKILLS & ABILITY

Basic Database and PHP

SAP Easy Acess

Microsoft Office

Adobe Photoshop

Good in Interpersonal & Communication skill

Able to Work in a Team

English Language Skills

ACTIVITIES

+ Designing System for Photo Studio

+ Developing Website using HTML and PHP

+ Creating Design for Web Layout

+ Attending Public Speaking and E-Business Seminar

EDUCATIONAL BACKGROUND

SDI Cikal Harapan (1999 –2005)

SMPI Al-Azhar BSD (2005 - 2008)

SMAI Al-Azhar BSD (2008 - 2011)

Universitas Multimedia Nusantara, Majoring in Information System

(2011 - Present)

Kimoro Clavinsky

BSD, Nusa Loka, Sektor

XIV - 6 Jalan Banda 2 No. 30,

Tangerang Selatan, Banten

0898 524 1192

[email protected]


lisensi ini mengizinkan setiap orang untuk menggubah ...kc.umn.ac.id/12600/1/laporan magang kimoro...

Documents