LAPORAN PRAKTIK INDUSTRI

PENGEMBANGAN DESIGN UI/UX PADA STARTUP

DIGITAL KIPAPOS (POINT OF SALE)
PT KIPA TEKNOLOGI INDONESIA
Ruko De Castello, Jl Simpang Sulfat Selatan Kav 1 No 4,
Pandanwangi, Kec. Blimbing, Kota Malang 65124
( 2 Januari 2020 – 2 Februari 2020 )

Disusun Oleh :
Nungky Reza Al Fatih
NIM : 17050974019

PRODI S1 PENDIDIKAN TEKNOLOGI INFORMASI

JURUSAN TEKNIK INFORMATIKA
FAKULTAS TEKNIK
UNIVERSITAS NEGERI SURABAYA
2020
 LEMBAR PENGESAHAN
Laporan Praktik Industri/Praktik Kerja Lapangan :
Judul : Pengembangan Design UI/UX pada Startup
Digital KipaPOS (Point of Sale)
Nama Industri : PT Kipa Teknologi Indonesia
Alamat Industri : Ruko De Castello, Jl Simpang Sulfat Selatan
Kav 1 No 4, Pandanwangi, Kec. Blimbing,
Kota Malang 65124
No.Telepon : 08557042809
Yang dilaksanakan oleh mahasiswa Fakultas Teknik (FT)
Universitas Negeri Surabaya :
Nama : Nungky Reza Al Fatih
NIM : 17050974019
Program Studi : S1 Pendidikan Teknologi Informasi
Jurusan : Teknik Informatika
Telah diseminarkan/diuji dan dinyatakan lulus.

Surabaya, 30 Januari 2020

Menyetujui Mengetahui/Menyetujui
Penguji Pembimbing Industri

I Kadek Dwi Nuryana, S.T., M.Kom Surya Rakhmat Fadhillah

NIDN. 0014048107 Pembimbing Industri

Mengesahkan Menyetujui
Wakil Dekan I Pembimbing/Penguji,
Fakultas Teknik Unesa,

Drs. Edy Sulistiyo, M.Pd. Dodik Arwin D, S.ST., S.T., M.T.

NIP. 196404201991031005 NIP. 197801082000121001

ii
 KATA PENGANTAR
Puji syukur kehadirat Allah SWT atas hidayahnya sehingga
penulis dapat menyelesaikan Laporan Praktik Industri yang
berjudul “Pengembangan Design UI/UX pada Startup Digital
KipaPOS” tepat pada waktunya dan dilakukan dengan baik.
Maksud dari penyusunan Laporan Praktik Industri ini yaitu
untuk memenuhi mata kuliah Praktik Industri yang dilaksanakan
di PT Kipa Teknologi Indonesia. Keberhasilan Praktik Industri ini
tidak lepas dari bimbingan dan bantuan dari beberapa pihak.
Untuk itu tidak lupa ucapkan terima kasih ditujukan kepada :
1. Bapak Drs. Edy Sulistyo,M.Pd. selaku Pembantu Dekan I
Fakultas Teknik Universitas Negeri Surabaya.
2. Bapak I Kadek Dwi Nuryana, S.T., M.Kom. selaku Ketua
Jurusan Teknik Informatika.
3. Bapak Bambang Sudjatmiko, S.Pd., M.T. selaku
Koordinator Praktik Industri.
4. Bapak Dodik Arwin Dermawan, S.ST., S.T., M.T. selaku
Pembimbing Praktik Industri.
5. Mas Surya Rakhmat Fadhillah selaku Pembimbing
Praktik Industri di PT Kipa Teknologi Indonesia.
Penulis menyadari bahwa penyusunan Laporan Praktik Industri
ini masih jauh dari kesempurnaan, oleh karena itu penulis
mengharapkan saran dan kritik yang membangun dari
Bapak/Ibu Dosen dan pembaca sekalian. Semoga laporan ini
mendatangkan manfaat bagi pembaca. Terima Kasih.
Surabaya, 03 Maret 2020

Penulis

iii
 DAFTAR ISI

LEMBAR PENGESAHAN...................................................................ii
KATA PENGANTAR..........................................................................iii
DAFTAR GAMBAR.............................................................................vi
DAFTAR TABEL.................................................................................vii
DAFTAR LAMPIRAN......................................................................viii
BAB I PENDAHULUAN..................................................................1
A. Latar Belakang......................................................................1
B. Tujuan PI...............................................................................2
C. Manfaat PI.............................................................................2
BAB II KAJIAN PUSTAKA..............................................................4
A. UMKM...................................................................................4
B. Point of Sale..........................................................................5
C. User experience....................................................................6
D. Design Thinking...................................................................8
E. User flow.............................................................................12
F. Visual Hierarchy................................................................14
BAB III PELAKSANAAN PI DAN PEMBAHASAN.....................15
A. Profil Perusahaan.....................................................................15
1. Organisasi dan Manajemen Industri...............................15
2. Deskripsi Pelaksanaan Kegiatan PI.................................17
3. Faktor – Faktor Pendukung dan Penghambat...............21
B. Pembahasan..............................................................................23

iv
 1. Analisis Sistem...................................................................23
2. Alur Kerja Divisi UI/UX...................................................28
BAB IV KESIMPULAN DAN SARAN.............................................30
A. Kesimpulan...............................................................................30
B. Saran...........................................................................................30
DAFTAR PUSTAKA...........................................................................31
LAMPIRAN..........................................................................................32

v
 DAFTAR GAMBAR

Gambar 2 1Proses Design Thinking (interactiondesign.org)..........8

Gambar 2 2 Userflow program (careerfoundry.com)..................12Y
Gambar 3 1 Logo PT Kipa Teknologi Indonesia…………………. 15
Gambar 3 2 Organization Chart PT Kipa Teknologi Indonesia…16
Gambar 3 3 Profile Jira. ( kipapos.atlassian.net )………………… 24
Gambar 3 4 Assignment Task. ( kipapos.atlassian.net )………… 24
Gambar 3 5 Detail Task. ( kipapos.atlassian.net )………………... 25
Gambar 3 6 Koordinasi Task. ( kipapos.atlassian.net )………….. 26
Gambar 3 7 Alur Kerja Divisi UI/UX (Kipa Design Team)…….. 28

vi
 DAFTAR TABEL

Y
Tabel 3 1 Jadwal Kegiatan Praktik Industri.....................................18

vii
 DAFTAR LAMPIRAN

YLampiran 1 Rekapitulasi Kegiatan PI................................................

Lampiran 2 Format NPI (Nilai Praktik Industri)............................35
Lampiran 3 Surat Permohonan Izin Praktik Industri....................36
Lampiran 4 Surat Balasan...................................................................37
Lampiran 5 Lembar Konsultasi Bimbingan PI................................38
Lampiran 6 Dokumentasi Kegiatan PI.............................................39
Lampiran 7 Hasil Design....................................................................40

viii
ix
Halaman ini sengaja dikosongkan
0
 1

BAB I
PENDAHULUAN
A. Latar Belakang
Teknologi informasi adalah suatu teknologi yang
dapat digunakan untuk mengolah suatu data atau informasi,
yang didalamnya dapat memproses menyusun, menyimpan,
bahkan memanipulasi data. Teknologi informasi saat ini
berkembang dengan pesat. Sistem – sistem yang dijalankan di
perusahaan secara manual mulai berubah dan dilakukan
secara terkomputerisasi. Peranan informasi yang semakin
mempengaruhi terhadap perkembangan kinerja manusia
khususnya dalam bidang penganalisaan data, lebih-lebih
komputer pada saat ini sudah bukan lagi hal yang asing di
tengah-tengah masyarakat. Komputer dan Mobile merupakan
sarana untuk mengelola data atau informasi yang lebih
akurat, dan daya tahannya untuk melakukan pemerosesan
data dalam jumlah besar dan bisa dipertanggungjawabkan.

Indonesia hingga akhir tahun 2018 lalu, jumlah usaha

mikro di Indonesia mencapai 58,91 juta dan usaha kecil 59,260.
Adapun jumlah usaha menengah mencapai 4,987 [ CITATION
Can19 \l 1033 ] dan semakin banyak generasi baru yang ingin
menjadi wirausaha. Namun tantangan wirausaha selain
pengembangan produk, juga dalam pengelolaan penjualan,
keuangan, karyawan, permodalan, dan lainnya. Teknologi
dapat membantu wirausaha mempermudah mengelola bisnis
seperti pengelolaan penjualan, laporan laba rugi, laporan
neraca keuangan, pengelolaan hak akses pegawai, pencatatan
biaya pengeluaran ataupun pemasukan, hingga peringatan
stok barang.

Tujuan dibuatnya Aplikasi Point of Sale (KipaPOS)

berbasis Web API yang nantinya akan di Implementasikan
pada Mobile App adalah untuk mengatasi masalah yang ada
pada UMKM saat ini. Aplikasi yang dihasilkan diharapkan
mampu memudahkan wirausaha mulai dari pengelolaan
penjualan, pelanggan, pembayaran, inventori, keuangan,
karyawan, sampai dengan pembiayaan usaha. Aplikasi ini
 2

diharapkan dapat membuat bisnis jadi lebih mudah, semakin

rendah biaya, penjualan dan pelayanan meningkat, dan
pengelolaan bisnis dapat dilakukan secara online darimana
saja.

B. Tujuan PI
Tujuan dari kegiatan PI (Praktik Industri) di PT Kipa
Teknologi Indonesia ini adalah sebagai berikut.

1. Tujuan Umum
Adapun tujuan umum yang ingin dicapai, antara lain:
a. Untuk memenuhi syarat kelulusan mata kuliah Praktik
Industri.
b. Untuk membiasakan diri terhadap situasi dan kondisi
di dunia kerja yang sebenarnya terutama berkenaan
dengan sikap disiplin kerja dan profesionalitas.

2. Tujuan Khusus
Adapun tujuan khusus yang ingin dicapai, yaitu
untuk membuat Design Aplikasi Point of Sale dengan
Metode User Centered Design di PT Kipa Teknologi
Indonesia.

C. Manfaat PI
Manfaat kegiatan PI (Praktik Industri) di PT Kipa
Teknologi Indonesia ini adalah sebagai berikut.

1. Bagi Mahasiswa
a. Mahasiswa memahami struktur organisasi di
perusahaan dan dapat menerapkannya secara
profesional sesuai dengan kebutuhan di perusahaan.
b. Memiliki pembelajaran tentang bagaimana sistem
berkerja di perusahaan sehingga dapat menerapkannya
ketika berkerja setelah lulus kuliah.
c. Mendapatkan pengetahuan yang baru mengenai
software point of sale.
 3

d. Mendapatkan pengalaman berkerja di suatu

perusahaan sehingga dapat menambah portofolio yang
dibutuhkan saat melamar pekerjaan.

2. Bagi Perusahaan
a. Perusahan akan terbantu dengan adanya tenaga dari
mahasiswa – mahasiswa yang melakukan praktik
industri
b. Meningkatkan kinerja Perusahaan dalam
mengembangkan startup.

3. Bagi Universitas
Berfungsi sebagai pengenalan antara mahasiswa
dengan PT Kipa Teknologi Indonesia dalam meningkatkan
kreatifitas pribadi pada khusunya dan kualitas sumber
daya manusia pada umumnya. Serta dapat membina
kemitraan antara pihak Universitas dan Instansi terkait.
 4

BAB II
KAJIAN PUSTAKA
A. UMKM
Pengertian tentang UMKM sebenarnya sudah
dijelaskan secara jelas dalam UU No. 20/2008. Pada undang-
undang tersebut, disebutkan bahwa UMKM adalah
perusahaan kecil yang dimiliki dan dikelola oleh seseorang
atau dimiliki oleh sekelompok kecil orang dengan jumlah
kekayaan dan pendapatan tertentu.

UU tersebut juga menjelaskan tentang kriteria UMKM

dan usaha besar, yang dibagi berdasarkan aset dan omzet dari
tahun ke tahun, sektor UMKM di Indonesia terus mengalami
perkembangan. Kembali ke sepuluh tahun lalu, yakni pada
2009, jumlah UMKM adalah 52.764.750 unit dengan pangsa
99,99%. Memasuki tahun 2014-2016, jumlah tersebut
meningkat menjadi lebih dari 57,9 juta unit.

Lalu, pada tahun 2017, UMKM di Indonesia

diperkirakan sudah mencapai lebih dari 59 juta unit. Tidak
mengherankan apabila UMKM menjadi salah satu bagian
paling signifikan dalam tulang punggung perekonomian
Indonesia dan ASEAN.

Bahkan sebanyak kurang lebih 88,8-99,9% bentuk usaha

di ASEAN adalah UMKM, dengan penyerapan tenaga kerja
sebanyak 51,7-97,2%.

Positifnya perkembangan sektor UMKM di Indonesia

tidak bisa dilepaskan dari dukungan perbankan terkait
penyaluran kredit kepada para pelaku UMKM.
 5

B. Point of Sale
Point of Sale adalah suatu sistem yang digunakan oleh
berbagai macam usaha ritel untuk menyelesaikan transaksi
jual beli. Point of Sale kini sudah banyak digunakan oleh
banyak jenis usaha, seperti restoran, coffee shop(kedai kopi),
barbershop atau laundry.

Biasanya sebuah Point of Sale terdiri dari seperangkat

mesin kasir, lengkap dengan cash drawer untuk menyimpan
uang dan printer untuk mencetak struk.

Tetapi kini dengan berkembangnya teknologi,

penggunaan mesin kasir konvensional sudah mulai
digantikan oleh Point of Sale dengan sistem dan perangkat
pendukung yang lebih modern.

Untuk perangkatnya saja, kini sudah banyak penyedia

Point of Sale di Indonesia yang menggunakan tablet pintar
berbasis Android atau iOS, ada juga yang menggunakan
perangkat khusus POS yang biasa disebut terminal.

Sementara untuk konektivitas sudah banyak yang

meninggalkan penggunaan kabel, contohnya untuk mencetak
struk saja kini sudah bisa dihubungkan dengan printer
bluetooth secara wireless.

Jika Anda sedang ingin memulai usaha baik itu usaha

kuliner maupun usaha ritel lain yang membutuhkan transaksi
jual beli secara rutin, penting untuk memahami fungsi dan
manfaat dari POS System ini. Anda akan membutuhkan POS
System untuk membantu operasional harian usaha Anda,
mulai dari menerima berbagai macam metode pembayaran,
mencatat dan membuat laporan penjualan, mencetak struk dll.

Dengan inovasi teknologi yang ada saat ini, POS System

kini sudah tidak hanya digunakan untuk memproses transaksi
jual beli saja. Berikut beberapa manfaat POS System untuk
berbagai macam jenis usaha:
 6

1. Mencatat data transaksi secara lengkap dan memprosesnya

menjadi laporan yang mudah dianalisa.
2. Jika sudah terintegrasi dengan sistem stok barang(inventory),
sehingga mengantisipasi kekurangan bahan baku dan
ketersediaan produk.
3. Memberikan laporan penjualan usaha Anda secara langsung
atau online.
4. Segala macam bentuk perubahan terhadap data menu seperti
harga dapat dilakukan dengan cepat.
5. Mencetak struk pembelian bagi pelanggan, sehingga Anda
tidak perlu lagi menggunakan kertas nota/kwitansi secara
manual.
6. Dengan kalkulasi otomatis, kasir tidak perlu repot
menghitung kembalian dan mempercepat proses transaksi,
sehingga dapat mengurangi antrian.
7. Menerima berbagai metode pembayaran baik itu tunai, non
tunai, kartu debit dan kartu kredit, dll.

C. User experience
Desain pengalaman pengguna (UX) adalah proses yang
digunakan tim desain untuk menciptakan produk yang
memberikan pengalaman yang bermakna dan relevan bagi
pengguna. Ini melibatkan desain seluruh proses untuk
memperoleh dan mengintegrasikan produk, termasuk aspek
branding, desain, kegunaan dan fungsi. "Desain Pengalaman
Pengguna" sering digunakan secara bergantian dengan istilah-
istilah seperti "Desain Antarmuka Pengguna" dan "Kegunaan".
Namun, sementara desain usability dan antarmuka pengguna
(UI) adalah aspek penting dari desain UX, mereka adalah
himpunan bagian dari itu - desain UX mencakup beragam bidang
lainnya, juga. Seorang perancang UX memusatkan perhatian
pada seluruh proses memperoleh dan mengintegrasikan suatu
produk, termasuk aspek branding, desain, kegunaan, dan fungsi.
Ini adalah kisah yang dimulai sebelum perangkat ada di tangan
pengguna.

Produk yang memberikan pengalaman pengguna yang

hebat (mis., IPhone) dengan demikian dirancang tidak hanya
dengan mempertimbangkan konsumsi atau penggunaan produk
 7

tetapi juga seluruh proses untuk memperoleh, memiliki, dan

memecahkan masalah itu. Demikian pula, desainer UX tidak
hanya fokus pada menciptakan produk yang dapat digunakan;
kami berkonsentrasi pada aspek lain dari pengalaman pengguna,
seperti kesenangan, efisiensi dan kesenangan juga. Mendukung,
tidak ada resolusi tunggal tentang pengalaman pengguna yang
baik. Alih-alih, pengalaman pengguna yang baik adalah
pengalaman yang memenuhi kebutuhan pengguna tertentu
dalam konteks spesifik tempat ia menggunakan produk.

Desainer UX mempertimbangkan Mengapa, Apa dan

Bagaimana Penggunaan Produk. Mengapa melibatkan motivasi
pengguna untuk mengadopsi suatu produk, apakah mereka
berhubungan dengan tugas yang ingin mereka lakukan
dengannya atau dengan nilai-nilai dan pandangan yang
diasosiasikan pengguna dengan kepemilikan dan penggunaan
produk. Apa yang membahas hal-hal yang dapat dilakukan
orang dengan suatu produk — fungsinya. Akhirnya, Bagaimana
ini berkaitan dengan desain fungsionalitas dengan cara yang
mudah diakses dan estetis. Desainer UX mulai dengan Mengapa
sebelum menentukan Apa dan kemudian, akhirnya, Bagaimana
untuk menciptakan produk yang dapat membentuk pengalaman
yang berarti bagi pengguna. Dalam desain perangkat lunak,
Anda perlu memastikan "substansi" produk datang melalui
perangkat yang ada dan menawarkan pengalaman yang mulus
dan lancar.

Desain UX Berpusat pada Pengguna karena desain UX

mencakup seluruh perjalanan pengguna, ini adalah bidang
multidisiplin - desainer UX berasal dari berbagai latar belakang
seperti desain visual, pemrograman, psikologi, dan desain
interaksi. Merancang untuk pengguna manusia juga berarti Anda
harus bekerja dengan ruang lingkup yang lebih tinggi terkait
aksesibilitas dan mengakomodasi banyak keterbatasan fisik
pengguna potensial, seperti membaca teks kecil. Tugas khas
seorang perancang UX berbeda-beda, tetapi sering kali mencakup
penelitian pengguna, membuat persona, merancang wireframe
dan prototipe interaktif serta desain pengujian. Tugas-tugas ini
dapat sangat bervariasi dari satu organisasi ke yang lain, tetapi
 8

mereka selalu menuntut desainer untuk menjadi advokat

pengguna dan menjaga kebutuhan pengguna di pusat semua
upaya desain dan pengembangan. Itu juga mengapa sebagian
besar desainer UX bekerja dalam beberapa bentuk proses kerja
yang berpusat pada pengguna, dan terus menyalurkan upaya
terbaik mereka hingga mereka mengatasi semua masalah yang
relevan dan kebutuhan pengguna secara optimal. Desain yang
berpusat pada pengguna adalah proses berulang di mana Anda
memahami pengguna dan konteksnya sebagai titik awal untuk
semua desain dan pengembangan.

D. Design Thinking

Gambar 2 1Proses Design Thinking

(interactiondesign.org)

Design thinking adalah metodologi desain yang

menyediakan pendekatan berbasis solusi untuk memecahkan
masalah. Ini sangat berguna dalam mengatasi masalah kompleks
yang tidak jelas atau tidak diketahui, dengan memahami
kebutuhan manusia yang terlibat, dengan menyusun ulang
masalah dengan cara yang berpusat pada manusia, dengan
menciptakan banyak ide dalam sesi brainstorming, dan dengan
mengadopsi pendekatan langsung dalam pembuatan prototipe dan
pengujian. Memahami lima tahap Berpikir Desain ini akan
 9

memberdayakan siapa pun untuk menerapkan metode Berpikir

Desain untuk menyelesaikan masalah kompleks yang terjadi di
sekitar, di perusahaan, maupun di negara.

Metode Design thinking terdapat lima tahap yang diusulkan

oleh Hasso-Plattner Institute of Design di Stanford (d.school).
d.school adalah universitas terkemuka dalam bidang pengajaran
Design thinking. Lima tahap Design thinking, menurut d.school,
adalah sebagai berikut: Berempati, Tentukan (masalah),
Menemukan Ide, Prototipe, dan Tes. Mari kita melihat lebih dekat
pada lima tahap Berpikir Desain yang berbeda.

1. Berempati (Empatise)
Tahap pertama dari proses Design thinking adalah untuk
mendapatkan pemahaman empatik tentang masalah yang coba di
selesaikan. Ini melibatkan para ahli konsultasi untuk mencari tahu
lebih banyak tentang bidang yang menjadi perhatian melalui
pengamatan, keterlibatan dan empati dengan orang-orang untuk
memahami pengalaman dan motivasi mereka, serta
membenamkan diri dalam lingkungan fisik sehingga dapat
memperoleh pemahaman pribadi yang lebih dalam tentang
masalah yang terlibat. Empati sangat penting untuk proses desain
yang berpusat pada manusia seperti Design thinking, dan empati
memungkinkan designer untuk mengesampingkan asumsi mereka
sendiri tentang dunia untuk mendapatkan wawasan tentang
pengguna dan kebutuhan mereka.

Bergantung pada batasan waktu, sejumlah besar

informasi dikumpulkan pada tahap ini untuk digunakan selama
tahap berikutnya dan untuk mengembangkan pemahaman terbaik
dari pengguna, kebutuhan mereka, dan masalah yang mendasari
pengembangan produk tertentu.

2. Menentukan Masalah (Define)

Selama tahap Define, informasi yang di dapat dari tahap
sebelumnya dianalisis berdasarkan pengamatan dan
mensintesisnya untuk menentukan masalah inti. Designer harus
 10

berusaha mendefinisikan masalah sebagai pernyataan masalah

dengan cara yang berpusat pada manusia.

Sebagai ilustrasi, alih-alih mendefinisikan masalah

sebagai keinginan sendiri atau kebutuhan perusahaan seperti, "Kita
perlu meningkatkan pangsa pasar produk makanan di antara
remaja perempuan sebesar 5%," cara yang lebih baik untuk
mendefinisikan masalah adalah jadilah, "Gadis remaja perlu makan
makanan bergizi agar dapat berkembang, menjadi sehat dan
tumbuh."

Tahap Define akan membantu para desainer di timnya

mengumpulkan ide-ide hebat untuk membangun fitur, fungsi, dan
elemen lain yang akan memungkinkan mereka untuk
menyelesaikan masalah atau, paling tidak, memungkinkan
pengguna untuk menyelesaikan masalah sendiri dengan tingkat
kesulitan minimal. Pada tahap Define, akan maju ke tahap ketiga
yaitu Ideate, dengan mengajukan pertanyaan yang dapat
membantu dalam mencari ide untuk solusi dengan bertanya:
"Bagaimana kami ... mendorong gadis-gadis remaja untuk
melakukan tindakan yang bermanfaat bagi mereka dan juga
melibatkan produk atau layanan makanan perusahaan? ".

3. Menemukan Ide (Ideate)

Selama tahap ketiga dari proses Design thinking, desainer
siap untuk mulai menghasilkan ide. Dengan segala informasi yang
telah di dapat untuk memahami pengguna dan kebutuhan mereka
di tahap Empathise, dan telah menganalisis dan mensintesis
pengamatan di tahap Define, dan berakhir dengan pernyataan
masalah yang berpusat pada manusia. Dengan latar belakang yang
kuat ini, designer dan anggota tim Anda dapat mulai "Out Of The
Box" untuk mengidentifikasi solusi baru untuk pernyataan masalah
yang telah ditemukan, dan dapat mulai mencari cara alternatif
untuk melihat masalah. Kemungkinan Idea biasanya digunakan
untuk merangsang pemikiran bebas dan untuk memperluas ruang
masalah. Penting untuk mendapatkan sebanyak mungkin ide atau
solusi masalah di awal fase Ideation. Designer harus memilih
beberapa teknik Ideation pada akhir fase Ideation untuk
 11

membantu menyelidiki dan menguji ide-ide Anda sehingga Anda

dapat menemukan cara terbaik untuk memecahkan masalah atau
menyediakan elemen-elemen yang diperlukan untuk
menghindarinya.

4. Prototipe (Prototype)
Tim desain akan menghasilkan sejumlah versi produk
yang murah dan diperkecil atau fitur spesifik yang ditemukan
dalam produk, sehingga mereka dapat menyelidiki solusi masalah
yang dihasilkan pada tahap sebelumnya. Prototipe dapat
dibagikan dan diuji dalam tim itu sendiri, di departemen lain, atau
pada sekelompok kecil orang di luar tim desain. Ini adalah fase
eksperimental, dan tujuannya adalah untuk mengidentifikasi
solusi terbaik untuk setiap masalah yang diidentifikasi selama tiga
tahap pertama. Solusi diimplementasikan dalam prototipe, dan,
satu per satu, mereka diselidiki dan diterima, diperbaiki dan
diperiksa ulang, atau ditolak berdasarkan pengalaman pengguna.
Pada akhir tahap ini, tim desain akan memiliki gagasan yang lebih
baik tentang kendala yang melekat pada produk dan masalah yang
ada, dan memiliki pandangan yang lebih jelas tentang bagaimana
pengguna yang sebenarnya akan berperilaku, berpikir, dan
rasakan ketika berinteraksi dengan bagian akhir produk.

5. Tes
Desainer atau evaluator dengan ketat menguji produk
lengkap menggunakan solusi terbaik yang diidentifikasi selama
fase prototyping. Ini adalah tahap akhir dari model-5 tahap, tetapi
dalam proses berulang, hasil yang dihasilkan selama fase
pengujian sering digunakan untuk mendefinisikan kembali satu
atau lebih masalah dan menginformasikan pemahaman pengguna,
kondisi penggunaan, bagaimana orang berpikir , berperilaku, dan
merasakan, dan berempati. Bahkan selama fase ini, perubahan dan
penyempurnaan dilakukan untuk menyingkirkan solusi masalah
dan memperoleh pemahaman sedalam mungkin terhadap produk
dan penggunanya.
 12

E. User flow

Gambar 2 2 Userflow program (careerfoundry.com)

User flow adalah representasi visual, baik yang ditulis

atau dibuat secara digital, dari banyak jalan yang dapat diambil
saat menggunakan aplikasi atau situs web. Diagram alir dimulai
dengan titik masuk konsumen pada produk, seperti layar
onboarding atau beranda, dan berakhir dengan tindakan atau
hasil akhir, seperti membeli produk atau mendaftar untuk sebuah
akun. Menggambarkan proses ini memungkinkan desainer untuk
mengevaluasi dan mengoptimalkan pengalaman pengguna.

Setiap titik kontak dalam perjalanan pengguna diwakili

oleh sebuah simpul dalam diagram alur. Node ini ditandai
dengan bentuk, dan setiap bentuk menunjukkan proses tertentu.
Misalnya, decision berarti keputusan sedang dibuat dan
karenanya diikuti oleh panah "Ya" dan "Tidak". Persegi panjang
menunjukkan tugas atau tindakan yang perlu diambil, seperti
"Masuk" atau "Beli". Ada beberapa manfaat mengapa User flow
dibutuhkan untuk ux design.

1. Buat antarmuka yang intuitif

 13

Manfaat utama mendesain produk di mana pengguna

bisa mendapatkan "in the zone" dengan cepat adalah
kemampuan untuk meningkatkan kemungkinan pembelian atau
mendaftar pengguna untuk produk klien. Manfaat lain adalah
meningkatkan kemudahan bergerak melalui platform Anda,
memastikan waktu pengguna tidak terbuang mencari apa yang
harus dilakukan selanjutnya. Tentu saja, seringkali ada lebih dari
satu rute yang bisa diikuti pengguna untuk menyelesaikan tugas.
Alur pengguna menggambarkan pola-pola yang mungkin ini
dengan cara yang memudahkan para desainer untuk menilai
efisiensi antarmuka yang mereka buat.

2. Mengevaluasi antarmuka yang ada

Untuk produk yang sudah digunakan, diagram alir
pengguna membantu menentukan apa yang berfungsi, apa yang
tidak, dan area apa yang perlu ditingkatkan. Ini membantu untuk
mengidentifikasi mengapa pengguna mungkin berhenti pada
titik tertentu dan apa yang dapat Anda lakukan untuk
memperbaikinya. Apakah satu layar mengalir ke layar
berikutnya? Apakah pola layar masuk akal? Memetakan
pergerakan dalam antarmuka dalam mode jenis cetak biru
membantu Anda melihat opsi apa yang dimiliki pengguna di
setiap halaman dan jika rute yang tersedia membantu pengguna
menyelesaikan tugas secara bawaan dan tanpa membuang
waktu.

F. Visual Hierarchy

Hirarki visual adalah urutan di mana pengguna

memproses informasi pada halaman; fungsinya dalam desain
antarmuka pengguna (UI) adalah untuk memungkinkan
pengguna untuk memahami informasi dengan mudah.
Karakteristik visual yang dapat digunakan perancang untuk
memengaruhi persepsi pengguna terhadap informasi adalah:
 14

 Ukuran: semakin besar elemen, semakin banyak perhatian yang

akan didapatkan.

 Warna: warna-warna cerah lebih cenderung menarik perhatian

dibandingkan yang diredam.

 Kontras: warna yang sangat kontras akandapat dibaca dengan

mudah.

 Alignment: elemen yang memisahkan diri dari alignment elemen

yang lain akan menarik lebih banyak perhatian.

 Pengulangan: gaya berulang dapat memberi kesan bahwa

konten berhubungan.

 Kedekatan: elemen yang ditempatkan dekat juga akan terkesan

berhubungan.

 Ruang putih: lebih banyak ruang di sekitar elemen akan menarik

mata ke arah mereka.

 Tekstur dan gaya: tekstur yang lebih kaya akan menarik lebih
banyak perhatian daripada yang rata.

BAB III
PELAKSANAAN PI DAN PEMBAHASAN
 15

A. Profil Perusahaan
1. Organisasi dan Manajemen Industri
a. Gambaran Umum Perusahaan
PT Kipa Teknologi Indonesia adalah Startup
Digital yang terbentuk pada Kuartal ke 3 pada tahun
2019 sebagai anak perusahaan dari Software House PT
Dedayu Opus Maxima. PT Kipa Teknologi Indonesia
diresmikan pada tanggal 14 Februari 2020.
PT Kipa Teknologi Indonesia memiliki produk
utamanya yakni KipaPOS. KipaPOS adalah sebuah
aplikasi Point of Sale berbasis Web dan Mobile yang
ditujukan untuk mengatasi masalah yang ada pada
UMKM di Indonesia.
PT Kipa Teknologi Indonesia termasuk Startup
Digital yang masih baru lahir dengan hanya memiliki
karyawan sejumlah 13 pada masa pengembangan.
Masa pengembangan KipaPOS sendiri dimulai sejak
bulan Oktober pada tahun 2019 hingga awal Februari
2020 sebagai MVP (Minimum Viable Product) dari
KipaPOS.

b. Logo PT Kipa Teknologi Indonesia

Berikut adalah logo dari PT Kipa Teknologi
Indonesia.

Gambar 3 1 Logo PT Kipa Teknologi Indonesia.

c. Visi dan Misi PT Kipa Teknologi Indonesia

1) Visi
 16

Visi dari PT Teknologi Indonesia adalah

“Membantu UMKM di indonesia untuk naik
level dalam mengembangkan usahanya”
2) Misi
a. Mengembangkan startup point of sale untuk
membantu UMKM bertahan di era digital.
b. Memberikan edukasi kepada UMKM tentang
teknologi point of sale dalam mengelola
usaha.
c. Memberikan solusi atas permasalahan yang
terjadi di UMKM dengan teknologi terbaru..

d. Struktur Organisasi Perusahaan

Struktur organisasi menunjukkan suatu
hubungan yang saling terkait antara satu dengan yang
lain, dalam setiap bagian mempunyai wewenang dan
tanggung jawab masing – masing. Berikut adalah
struktur organisasi dalam PT Kipa Teknologi
Indonesia.

CEO
Rama
Zeta

COO CFO CMO CTO

Tritus Hebnu Hendry Moch
Julan Yayan Yongkie Fadillah

Lead UI/UX Lead Graphic

Rakhmat Design
Fadilah Naqib Auliya
Gambar 3 2 Organization Chart PT Kipa Teknologi Indonesia

2. Deskripsi Pelaksanaan Kegiatan PI

a. Tempat dan Waktu Pelaksanaan
Dalam pelaksanaan PI mahasiswa ditempatkan
di bagian Pengembangan Produk Startup Digital.
 17

Adapun deskripsi pelaksanaan kegiatan PI adalah

sebagai berikut.
 Nama Instansi :
PT Kipa Teknologi Indonesia

 Alamat Instansi:
Jl. Simpang Sulfat Selatan Kav 1 No 4 Malang,
Jawa Timur Indonesia

 Kontak Instansi:
Telp. : 082268888859
Web : kipa.id
E-mail : hai@kipaid.com 

Sedangkan, waktu pelaksanaan kegiatan praktik

industrinya adalah sebagai berikut.
 Hari Kerja : Senin - Jumat
 Jam Kerja : Pukul 09:00 - 19:00 WIB
Kegiatan PI ini berlangsung selama kurang lebih 1
bulan.

b. Kegiatan Praktik Industri

Tabel 3 1 Jadwal Kegiatan Praktik Industri

No Tanggal
 18

Uraian Kegiatan
Kamis, 2 - Perkenalan lingkungan kerja
1
Januari 2020 - Pembagian Bidang Pekerjaan

- Pemberian Akses Figma dan Zeplin

Jumat, 3
2 - Penjelasan Penggunaan Tools dan Standart
Januari 2020
Operasional Pekerjaan

Sabtu, 4
3 LIBUR
Januari 2020

Minggu, 5
4 LIBUR
Januari 2020

- Mempelajari Konsep dan Algoritma POS

- Mempelajari Konsep MVP yang sudah
Senin, 6
5 ditetapkan oleh KipaPOS
Januari 2020
- Mencari referensi dari software POS yang ada di
Indonesia

- Mencari Informasi tentang UI / UX secara

mendalam
Selasa, 7
6 - Membuat Design Login Register beserta
Januari 2020
implementasi UX dalam Design
- Evaluasi Design

- Mencari Inspirasi dan Referensi Design

Rabu, 8
7 - Membuat Dashboard dan Halaman Awal Kasir
Januari 2020
- Evaluasi Design

- Diskusi tentang Product bersama Engineer

Kamis, 9
8 - Membuat Design List Produk di Kasir
Januari 2020
- Evaluasi Design
- Membuat Design Halaman Checkout Penjualan
Jumat, 10
9 beserta Implementasi UX
Januari 2020
- Evaluasi Design
 19

Sabtu, 11
10 LIBUR
Januari 2020

Minggu, 12
11 LIBUR
Januari 2020

- Membuat Design Halaman Success Payment

Senin, 13
12 - Membuat Design Halaman Struk
Januari 2020
- Evaluasi Design

- Membuat Design List Produk Digital

Selasa, 14
13 - Membuat Design Penjualan Produk Digital
Januari 2020
- Evaluasi Design

- Diskusi Penambahan Fitur

Rabu, 15
14 - Revisi Design Sidebar
Januari 2020
- Evaluasi Design

- Membuat Design Contact yang berisi List

Kamis, 16
15 Karyawan dan Supplier
Januari 2020
- Evaluasi Design

Jumat, 17 - Diskusi Flow dengan Engineer

16
Januari 2020 - Design Halaman Tambah Supplier dan Pelanggan

Sabtu, 18
17 Januari 2020 LIBUR

Minggu, 19
18 Januari 2020 LIBUR

- Design Halaman Profile

Senin, 20
19 - Design Halaman Pengaturan Usaha
Januari 2020
- Evaluasi Design
 20

- Design Halaman List Produk

Selasa, 21
20 - Diskusi dengan Engineer
Januari 2020
- Evaluasi Design

- Mencari Referensi Design

Rabu, 22
21 - Design Tambah Product Single
Januari 2020
- Evaluasi Design

- Diskusi dengan Engineer

Kamis, 23
22 - Design Tambah Product Variabel
Januari 2020
- Evaluasi Design

Jumat, 24 - Revisi Design Product Variabel

23
Januari 2020 - Diskusi dengan Engineer

Sabtu, 25
24 LIBUR
Januari 2020

Minggu, 26
25 LIBUR
Januari 2020

Senin, 27 - Diskusi dengan Marketing

26
Januari 2020 - Design Halaman Web Landing Page

Selasa, 28
27 - Revisi Design Halaman Web Landing Page
Januari 2020

Rabu, 29 - Diskusi dengan Marketing

28
Januari 2020 - Design Halaman Web Bantuan

Kamis, 30
29 - Revisi Halaman Web Bantuan
Januari 2020
 21

- Demo Aplikasi
Jumat, 31 - Usabillity Testing Pelaku Usaha
30
Januari 2020 - Revisi Design berdasarkan hasil Usabillity
Testing

Sabtu, 1 - Pemberian Kenang Kenangan

31 Februari - Permintaan Nilai Praktik
2020 Perpisahan

3. Faktor – Faktor Pendukung dan Penghambat

a. Faktor Pendukung
Selama melaksanakan Praktik Industri di PT Kipa
Teknologi Indonesia, ada beberapa faktor pendukung
yang membantu kelancaran dalam melakukan
kegiatan praktik sebagai berikut:
1) Ruangan yang bersih dan cukup nyaman untuk
melakukan pekerjaan.
2) Terdapat penginapan untuk karyawan
3) Adanya kerjasama yang baik dengan
pembimbing praktik industri
4) Karyawan dan staf di PT Kipa Teknologi
Indonesia sangat ramah dan selalu melatih skill
mahasiswa praktik industri.
5) Selalu ada sharing pengetahuan antar senior dan
junior.
6) Adanya daily meeting penentuan dan penjelasan
fitur yang akan dikerjakan.

b. Faktor Penghambat
Selama melaksanakan Praktik Industri di PT Kipa
Teknologi Indonesia, ada beberapa faktor yang
menghambat pelaksanaan Praktik Industri,
diantaranya adalah sebagai berikut:
1) Terbatasnya waktu yang dipergunakan dalam
menempuh Praktik Industri sehingga
pengetahuan yang diperoleh masih kurang.
 22

2) Kurangnya wawasan tentang Point of Sale yang

mengakibatkan beberapa kendala ketika proses
pengembangan aplikasi
3) Kampus dengan tempat Praktik Industri berbeda
kota sehingga dibutuhkan waktu 2 jam
perjalanan kereta untuk menempuh perjalanan
4) Karena keterbatasan waktu sehingga
membutuhkan ekstra effort untuk menyelesaikan
task yang diberikan oleh pembimbing hingga
terkadang harus lembur.
 23

B. Pembahasan
1. Analisis Sistem
a. Identifikasi Masalah
Berdasarkan latar belakang yang telah diuraikan
sebelumnya maka permasalahan yang dapat
dirumuskan, yaitu bagaimana merancang aplikasi
Web API KipaPOS (Point of Sale) untuk memenuhi
MVP (Most Viable Product) perusahaan dan memenuhi
kebutuhan pasar.

b. Analisa Kebutuhan
Berikut adalah data dan aplikasi yang
dibutuhkan dalam pengembangan design UI/UX
pada startup digital KipaPOS.
1) Target User.
2) Tujuan dan fungsi fitur.
3) Figma.
4) Zeplin.
5) Draw.io.

c. Prosedur Kerja Perusahaan

PT Kipa Teknologi Indonesia memiliki prosedur kerja
yang sudah ditetapkan dari awal masa
pengembangan.
a. Software Management Project
PT Kipa Teknologi Indonesia pada awal
perkembangan menggunakan software
management sendiri lalu ditengah pengembangan
beralih ke Jira Software karena lebih mudah
integrasi pekerjaan antar divisi karena fiturnya.
 24

Gambar 3 3 Profile Jira. ( kipapos.atlassian.net )

Gambar 3 4 Assignment Task. ( kipapos.atlassian.net )

Di tampilan diatas lead akan memberikan tugas beserta orang

yang diberi tugas. Tugas yang diberikan awalnya akan
mempunyai status todo list, ketika sedang mengerjakan tugas
tersebut maka harus dirubah menjadi in progress, supaya para
lead dapat selalu memantau perkembangan tugas yang
diberikan
 25

Gambar 3 5 Detail Task. ( kipapos.atlassian.net )

Pada tampilan diatas berisi detail tugas yang harus dikerjakan.

Ketika tugas tersebut selesai dikerjakan pertama harus
menyimpan pada goole drive yang disediakan perusahaan lalu di
integrasikan ke jira software agar dapat dilihat oleh lead. Lead
akan melihat hasil tugas dan memvalidasi tugas tersebut, apabila
benar maka status tugas menjadi done, ketika masih dirasa
kurang status dirubah menjadi in progress.
 26

Gambar 3 6 Koordinasi Task. ( kipapos.atlassian.net )

b.Alur Koordinasi Tim

PT Kipa Teknologi Indonesia memiliki cara dalam
menyelesaikan sebuah permasalahan untuk dijadikan sebuah
task hingga diimplementasikan pada produk.
1) Permasalahan akan dibahas oleh para Chief
2) CTO akan membuat task untuk diimplementasikan
nantinya dan diserahkan kepada Lead.
3) Lead akan membagikan task kepada masing masing
stakeholder.
4) Team UI/UX akan membuat desain dan alur yang
nantinya akan divalidasi oleh Lead UI/UX
5) Setelah desain valid, Team UI/UX menyerahkan desain ke
team Mobile Developer
6) Mobile Developer akan menentukan data apa saja yang
diperlukan dan memintanya ke bagian Web API Developer
 27

7) Web API Developer akan menyelesaikan tugasnya dan

divalidasi oleh Lead Software Engineer / CTO lalu akan
diserahkan Kembali ke Mobile Developer
8) Mobile Developer akan menyelesaikan tugasnya dan akan
divalidasi juga oleh Lead Software Engineer / CTO

c. Software Testing Level

1. Unit Testing
Laravel memiliki teknologi untuk melakukan Unit
Testing dan dijalankan oleh developer.

2. Integration Testing
Tahap ini dilakukan oleh developer sendiri dengan
manual.

3. System Testing
Tahap ini dilakukan oleh Lead Software
Engineer/CTO.

4. Acceptance Testing
Tahap ini memiliki 2 tahap lagi, yang pertama dilakukan
oleh karyawan yang tidak campur tangan dengan proses
pengembangan, kedua dilakukan oleh pengguna.
 28

2. Alur Kerja Divisi UI/UX

Dalam divisi UI/UX memiliki alur kerja tersendiri
menggunakan konsep design thinking seperti dibawah ini.

Gambar 3 7 Alur Kerja Divisi UI/UX (Kipa Design Team).

a. Define
Pada tahap ini designer memahami maksud dari fitur
yang akan dibuat, mulai dari target user, fungsi dan
tujuan masing masing komponen yang ada pada fitur.

b. Ideate
Proses ideate adalah proses mencari cari inspirasi,
layouting model dan menuangkan ide idenya dalam
design yang akan dibuat.

c. Prototype
Pada tahap prototype designer membuat sebuah
tampilan dari fitur yang akan dibuat dan membuat
berbagai variasi tampilan untuk divalidasi pada lead
dan divisi lain.

d. Design Critic
Pada tahap ini lead UI/UX akan memvalidasi sebuah
design, memberikan kritik dan saran dari design yang
telah jadi, apabila masih perlu revisi maka proses
design dikembalikan pada tahap ideate.
e. Technical Critic
Pada tahap ini design yang telah divalidasi akan di
tunjukkan ke divisi mobile dev, untuk divalidasi
 29

apakah design memungkinkan untuk di

implementasi, jika tidak maka proses akan kembali
pada tahap ideate.

f. Test
Setelah design selesai divalidasi maka design akan di
implement oleh divisi terkait dan divisi design akan
lanjut mengerjakan tugas yang lain dengan kembali
pada tahap define.
 30

BAB IV
KESIMPULAN DAN SARAN
A. Kesimpulan
Setelah melakukan Praktik Industri di PT Kipa
Teknologi Indonesia yang dilaksanakan pada 2 Januari sampai
2 Februari 2020, mahasiswa mendapatkan banyak ilmu dan
pengetahuan yang sebelumnya tidak pernah didapatkan
waktu perkuliahan.
Di tempat industri mahasiswa mendapatkan tugas
sebagai Junior UI/UX Designer yang berkerja dibawah Leader
UI/UX yang bertugas membuat tampilan aplikasi menarik
secara UI dan efisien secara pengalaman user.

B. Saran
Aplikasi ini telah berhasil dibuat untuk memenuhi
MVP (Minimum Viable Product) dari perusahaan, tentu saja
aplikasi ini masih banyak kekurangan untuk menyelesaikan
masalah yang ada di UMKM Indonesia. Proses
Pengembangan Startup Digital tidak akan pernah berhenti
seiring kebutuhan pasar, tidak menutup kemungkinan setelah
mahasiswa selesai melakukan Praktik Industri aplikasi ini
sudah banyak sekali pengembangan terbaru. Alangkah
baiknya proses pengembangan ini diiringi oleh proses
pemasaran.
1.
 31

DAFTAR PUSTAKA

Anon., 2015. Go Biz. [Online]

Available at: https://gobiz.co.id/pusat-pengetahuan/apa-itu-
point-of-sale-pos/
[Accessed Minggu Mei 2020].

Anon., 2019. Go Biz. [Online]

Available at: https://gobiz.co.id/pusat-pengetahuan/apa-itu-
umkm/
[Accessed Minggu Mei 2020].

Anon., n.d. Interaction Design Foundation. [Online]

Available at: https://www.interaction-
design.org/literature/topics/visual-hierarchy
[Accessed Minggu Mei 2020].

Browne, C., 2019. Career Foundry. [Online]

Available at: https://careerfoundry.com/en/blog/ux-
design/what-are-user-flows/
[Accessed Minggu Mei 2020].

Candra, Y., 2019. Kompas.com. [Online]

Available at:
https://ekonomi.kompas.com/read/2019/02/12/152246426/me
ngapa-masih-banyak-umkm-indonesia-yang-belum-go-digital
[Accessed Minggu Mei 2020].

DAM, R. F., 2020. Interaction Design Foundation. [Online]

Available at: https://www.interaction-
design.org/literature/article/5-stages-in-the-design-thinking-
process
[Accessed Minggu Mei 2020].
 32

LAMPIRAN

Lampiran 1 Rekapitulasi Kegiatan PI

33
34
35
 36

Lampiran 2 Format NPI (Nilai Praktik Industri)

 37

Lampiran 3 Surat Permohonan Izin Praktik Industri

 38

Lampiran 4 Surat Balasan

 39

Lampiran 5 Lembar Konsultasi Bimbingan PI

LEMBAR KONSULTASI BIMBINGAN PRAKTIK

INDUSTRI

Nama : Nungky Reza Al Fatih

NIM : 17050974019
Program Studi : S1 Pend. Teknologi Informasi
Jurusan/Angkatan : Teknik Informatika / 2017
Fakultas : Teknik
Judul Laporan : PENGEMBANGAN DESIGN
UI/UX PADA STARTUP DIGITAL
KIPAPOS (POINT OF SALE)
Pembimbing : Dodik Arwin Dermawan, SST., ST.,
MT.
No. Hari/Tanggal BAB Catatan Bimbingan

Surabaya, 11 April 2020

Pembimbing PI
 40

Lampiran 6 Dokumentasi Kegiatan PI

 41

Lampiran 7 Hasil Design

a. Login Register
 42

b. Dashboard & Kasir

c. List Produk Kasir

 43

d. Checkout

e.Struk
 44

f. Produk Digital

g.Drawer
 45

h. Pegawai

i. Kontak
j. Profile & Pengaturan Usaha

k. Produk