TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. ·...

13
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.

Transcript of TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. ·...

Page 1: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

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.

Page 2: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

PERAN DESAINER DALAM MERANCANG

ILUSTRASI ONBOARDING APLIKASI SISTERNET,

BLANK SLATE DAN UI/UX DI PT. METEOR INOVASI

DIGITAL Laporan Magang

Ditulis sebagai syarat untuk memperoleh gelar Sarjana Desain (S.Ds)

Nama : Lintang Sekarjati

NIM : 13120210431

Program Studi : Desain Komunikasi Visual

Fakultas : Seni & Desain

UNIVERSITAS MULTIMEDIA NUSANTARA

TANGERANG

2017

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 3: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

ii

PENGESAHAN LAPORAN KERJA MAGANG

PERAN DESAINER DALAM MERANCANG

ILUSTRASI ONBOARDING APLIKASI SISTERNET,

BLANK SLATE, DAN UI/UX DI PT. METEOR INOVASI

DIGITAL

Oleh

Nama : Lintang Sekarjati

NIM : 13120210431

Program Studi : Desain Komunikasi Visual

Fakultas : Seni & Desain

Tangerang, 7 Juli 2017

Mengetahui,

Ketua Program Studi

Yusup Sigit Martyastiadi, S.T., M.Inf.Tech.

Pembimbing

Darfi Rizkavirwan, S.Sn., M.Ds.

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 4: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

iii

LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT

DALAM PENYUSUNAN LAPORAN KERJA MAGANG

Dengan ini saya:

Nama : Lintang Sekarjati

NIM : 13120210431

Program Studi : Desain Komunikasi Visual

Menyatakan bahwa saya telah melakukan kerja magang:

Nama Perusahaan : PT. Meteor Inovasi Digital

Divisi : UI/UX

Alamat : Jl. Horizon Broadway M3/7, The Icon.

Periode Magang : 16 Januari 2017 – 17 Maret 2017

Pembimbing Lapangan : Rianty Tara Pratita

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 di kemudian hari terbukti melakukan kecurangan/penyimpangan baik

dalam pelaksanaan kerja magang maupun penulisan laporan kerja magang, maka

saya bersedia menerima sanksi dinyatakan tidak lulus untuk mata kuliah magang

yang telah saya tempuh.

Tangerang, 4 Juli 2017

Lintang Sekarjati

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 5: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

iv

KATA PENGANTAR

Puji syukur kepada Tuhan yang Maha Esa atas segala rahmat dan berkah-Nya

sehingga penulis dapat menyelesaikan Laporan Magang ini dengan baik dan tepat

waktu. Laporan Magang ini dibuat untuk memenuhi persyaratan kelulusan mata

kuliah Magang dalam Program Studi Desain Komunikasi Visual, fakultas Seni

dan Desain Universitas Multimedia Nusantara. Laporan ini disusun sebagai

pelengkap kerja magang yang dilakukan penulis di PT. Meteor Inovasi Digital

selama kurang lebih 320 jam. Dengan perkembangan dunia digital peran desain

UI/UX menjadi penting. Desainer dapat menggali kreatifitas dan menciptakan

sebuah karya desain yang baik. Selama kerja praktik magang penulis

mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu

proyek serta membuat produk dengan UI/UX yang baik dan sesuai dengan

kebutuhan masyarakat.  

Ucapan terima kasih saya ucapkan kepada segala pihak yang membantu

terselesaikannya laporan magang ini. Pihak-pihak tersebut antara lain:

1. PT. Meteor Inovasi Digital, yang telah memberikan kesempatan

kepada penulis untuk melaksanakan magang.

2. Yanuar Triwibowo sebagai Chief Experience Officer.

3. Rianty Tara Pratita, S.Ds., sebagai Pembimbing Lapangan yang sudah

membantu dan membimbing penulis selama magang.

4. Elyfas Frodicia Mayagi, S.Sn., dan Lourechyus Alfredo, S.Sn. sebagai

UI/UX desainer di PT. Meteor Inovasi Digital yang telah memberikan

bimbingan, masukan dan dukungan selama magang.

5. Henri Wijaya sebagai Operational Officer.

6. Yusup Sigit Martyastiadi, S.T., M.Inf.Tech. sebagai Ketua Program

Studi Desain Komunikasi Visual yang telah menyetujui pengajuan

magang dan pengesahan laporan magang.

7. Darfi Rizkavirwan, S.Sn., M.Ds. sebagai Dosen Pembimbing Magang

yang telah meluangkan waktu untuk membimbing penulis dalam

penyusunan laporan hingga sidang.

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 6: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

v

8. Diana Rury, Dwi Setyo Irawanto, dan Melati Samataaji sebagai

keluarga yang terus mendukung penulis untuk melaksanakan proses

magang sampai penyelasaian Laporan Magang ini.

9. Edvyn Tanu, dan Erando Putra sebagai rekan magang di PT. Meteor

Inovasi Digital.

10. Citra Nathania Zega, Tari Puteri, Maya Kirana, Merphilina Valencia,

Masita Khanza, Septatiana Adeningsih, Stephanie, Yohanes Austin,

Hendie Jordan, dan Rahadian Dwi Baskoro sebagai teman yang selalu

mendukung penulis hingga sekarang.

Tangerang, 4 Juli 2017

Lintang Sekarjati

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 7: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

vi

ABSTRAKSI

Seiring dengan perkembangan teknologi dan desain pada saat ini, bukan hanya berbasis menggunakan media cetak tetapi juga merambah ke dunia digital salah satunya adalah aplikasi. Melihat aplikasi sudah menjadi produk teknologi yang dibangun sebagai solusi dalam kehidupan sehari-hari, maka dalam membangun sebuah aplikasi fungsionalitas adalah hal penting untuk diperhatikan. Desain tampilan sangat penting karena merupakan hal yang menentukan berhasilnya sebuah aplikasi adalah dari banyak tidaknya para pengguna. Peran desainer dalam UI/UX sangat penting untuk merancang aplikasi agar terlihat menarik dan juga nyaman ketika digunakan. Oleh karena itu penulis tertarik untuk melakukan praktik kerja magang di perusahaan yang berfokus pada media digital khususnya. Selama praktik kerja magang kendala penulis adalah kurangnya pengetahuan penulis dalam UI/UX dan menjadi pembelajaran baru bagi penulis. Melalui praktik kerja magang ini, desainer grafis dapat mengenal dan belajar tentang desain terutama bidang UI/UX yang juga dapat memberi dampak yang besar bagi masyarakat.

Kata kunci : digital, media, UI/UX, magang

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 8: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

vii

DAFTAR ISI

PENGESAHAN LAPORAN KERJA MAGANG ............................................. II  

LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT DALAM

PENYUSUNAN LAPORAN KERJA MAGANG ............................................ III  

KATA PENGANTAR ......................................................................................... IV  

ABSTRAKSI ........................................................................................................ VI  

DAFTAR ISI ...................................................................................................... VII  

DAFTAR GAMBAR ........................................................................................... IX  

DAFTAR TABEL ................................................................................................ XI  

DAFTAR LAMPIRAN ..................................................................................... XII  

BAB I PENDAHULUAN ...................................................................................... 1  

1.1.   Latar Belakang .......................................................................................... 1  

1.2.   Maksud dan Tujuan Kerja Magang ........................................................... 2  

1.3.   Waktu dan Prosedur Pelaksanaan Kerja Magang ..................................... 2  

BAB II GAMBARAN UMUM PERUSAHAAN ................................................ 4  

2.1.   Deskripsi Perusahaan ................................................................................ 4  

2.2.   Layanan Perusahaan .................................................................................. 5  

2.3.   Klien Perusahaan ....................................................................................... 6  

2.4.   Struktur Organisasi Perusahaan ................................................................ 6  

BAB III PELAKSANAAN KERJA MAGANG ................................................ 9  

3.1.   Kedudukan dan Koordinasi ....................................................................... 9  

3.2.   Tugas yang Dilakukan ............................................................................. 13  

3.3.   Uraian Pelaksanaan Kerja Magang ......................................................... 16  

3.3.1.   Proses Pelaksanaan ....................................................................... 17  

3.3.2.   Kendala yang Ditemukan ............................................................. 42  

3.3.3.   Solusi Atas Kendala yang Ditemukan .......................................... 43  

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 9: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

viii

BAB IV PENUTUP ............................................................................................ 44  

4.1.   Kesimpulan ............................................................................................. 44  

4.2.   Saran ........................................................................................................ 45  

DAFTAR PUSTAKA .......................................................................................... XI  

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 10: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

ix

DAFTAR GAMBAR

Gambar 2.1. Logo PT. Meteor Inovasi Digital ....................................................... 4  

Gambar 2.2. Struktur Organisasi PT. Meteor Inovasi Digital ................................. 6

Gambar 3.1. Bagan Alur Koordinasi Keseluruhan ............................................... 10

Gambar 3.2. Bagan Alur Koordinasi Klien - Business Process ............................ 11

Gambar 3.3. Bagan Alur Koordinasi Business Process - LIVE ............................ 13

Gambar 3.4. Sketsa blank slate no e-mail dan empty chatroom ........................... 18

Gambar 3.5. Blank slate no e-mail final ............................................................... 19

Gambar 3.6. Blank Slate empty chatroom final .................................................... 20

Gambar 3.7. Sketsa blank slate no flights dan no hotel ........................................ 20

Gambar 3.8. Blank slate no flights final ................................................................ 21

Gambar 3.9. Blank slate no hotels final ................................................................ 21

Gambar 3.10. Sketsa blank slate no destination dan no signal ............................. 22

Gambar 3.11. Blank slate no destination final ...................................................... 23  

Gambar 3.12. Blank slate no signal final .............................................................. 23  

Gambar 3.13. Sketsa blank slate no route dan no driver ...................................... 24  

Gambar 3.14. Blank slate no route final ............................................................... 25  

Gambar 3.15. Blank slate no driver final .............................................................. 25  

Gambar 3.16. Sketsa blank slate no restaurant dan no notifications .................... 26  

Gambar 3.17. Blank slate no restaurant final ....................................................... 27  

Gambar 3.18. Blank slate no flights final .............................................................. 27  

Gambar 3.19. Blank slate no hotels final .............................................................. 28  

Gambar 3.20. Sketsa blank slate no destination dan no signal ............................. 29  

Gambar 3.21. Blank slate no destination final ...................................................... 29  

Gambar 3.22. Blank slate no notifications final .................................................... 30  

Gambar 3.23. Sketsa blank slate no transactions final ......................................... 31  

Gambar 3.24. Blank slate no transactions final .................................................... 31  

Gambar 3.25. Blank slate no events final .............................................................. 32  

Gambar 3.26. Sketsa blank slate browser not supported dan no results found .... 33  

Gambar 3.27. Blank slate browser not supported final ........................................ 33  

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 11: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

x

Gambar 3.28. Logo Sisternet ................................................................................ 34  

Gambar 3.29. Sketsa Filter onboarding ................................................................ 35  

Gambar 3.30. Sketsa onboarding Point of Interest ............................................... 36  

Gambar 3.31. Alternatif warna onboarding Point of Interest ............................... 37  

Gambar 3.32. Sketsa onboarding Voucher ........................................................... 37  

Gambar 3.33. Alternatif warna onboarding Voucher ........................................... 38  

Gambar 3.34. Sketsa onboarding Gadget ............................................................. 39  

Gambar 3.35. Alternatif warna onboarding Gadget ............................................. 39  

Gambar 3.36. Sketsa onboarding Beauty Product ................................................ 40  

Gambar 3.37. Beauty Product Onboarding .......................................................... 41  

Gambar 3.38. Alternatif warna onboarding Beauty Product ................................ 41  

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 12: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

xi

DAFTAR TABEL

Tabel 3.1. Detail Pekerjaan Yang Dilakukan Selama Magang ............................. 16  

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017

Page 13: TATA CARA PENULISAN DAN TEMPLATEkc.umn.ac.id/12442/4/Halaman Awal.pdf · 2020. 2. 27. · mendapatkan banyak pengalaman mulai dari kerja sama dalam mengerjakan suatu ... Sketsa blank

xii

DAFTAR LAMPIRAN

LAMPIRAN A: SURAT PENGANTAR MAGANG ..................................... XII  

LAMPIRAN B: SURAT PERSETUJUAN KERJA PRAKTEK ................. XIII  

LAMPIRAN C: KARTU KERJA MAGANG ............................................... XIV  

LAMPIRAN D: KEHADIRAN KERJA MAGANG ...................................... XV  

LAMPIRAN E: LAPORAN REALISASI KERJA MAGANG ................ XVIII  

LAMPIRAN F: KM 07 ...................................................................................... XX  

LAMPIRAN G: SURAT SELESAI KERJA PRAKTIK .............................. XXI  

LAMPIRAN H: SURAT PEMBEKALAN MAGANG .............................. XXII  

LAMPIRAN I: FORMULIR BIMBINGAN MAGANG ........................... XXIII  

LAMPIRAN J: DOKUMENTASI LAPANGAN ....................................... XXIV  

Peran desainer dalam..., Lintang Sekarjati, FSD UMN, 2017