RANCANG BANGUN FRONT END SISTEM PENILAIAN …

RANCANG BANGUN FRONT END SISTEM PENILAIAN KINERJA

KARYAWAN BERBASIS ANDROID DAN SITUS WEB PADA PT .

MITRA HUTAMA BERSINAR

PROPOSAL KERJA PRAKTIK

Program Studi

S1 Sistem Informasi

Oleh:

ADRIANUS HERNOWO WAHYU PANDITO

18410100009

FAKULTAS TEKNOLOGI DAN INFORMATIKA

UNIVERSITAS DINAMIKA 2021

ii




Diajukan sebagai salah satu syarat untuk menyelesaikan

Program Sarjana

Disusun Oleh:

Nama : Adrianus Hernowo W. P.

NIM : 18410100009

Program : S1 (Strata Satu)

Jurusan : Sistem Informasi

FAKULTAS TEKNOLOGI DAN INFORMATIKA

UNIVERSITAS DINAMIKA SURABAYA

2021

iii




Laporan Kerja Praktik oleh

Adrianus Hernowo W. P.

NIM : 18410100009

Telah diperiksa, diuji dan disetujui

Surabaya, 4 April 2021

Disetujui:

Pembimbing Penyelia

Ayouvi Poerna Wardhanie, S.M.B., M.M. Calvin Young,

NIDN. 0721068904 Direktur PT MHB

Mengetahui,

Ketua Program Studi S1 Sistem Informasi

Dr. Anjik Sukmaaji, S.Kom., M.Eng

NIDN. 0731057301

iv

Pernyataan

Dengan ini saya menyatakan dengan benar, bahwa Laporan Kerja Praktik ini adalah

asli karya saya, bukan plagiat baik sebagian maupun apalagi keseluruhan. Karya

atau pendapat orang lain yang ada dalam laporan kerja praktik ini adalah semata

hanya rujukan yang dicantumkan dalam dalam daftar pustaka saya. Apabila

dikemudian hari ditemukan adanya tindakan plagiat pada laporan kerja praktik ini,

maka saya bersedia untuk dilakukan pencabutan terhadap gelar kesarjanaan yang

telah diberikan pada saya.

Surabaya, April 2021

Adrianus Hernowo W.P.

v

ABSTRAK

Front-end adalah bagian dari pembuatan situs web, android, dan aplikasi

desktop yang langsung berinteraksi dengan pengguna. Dengan adanya front-end,

user akan terbantu untuk memudahkan kinerjanya. Font-end juga memiliki fungsi

untuk menyimpan, mengolah serta menampilkan data pada user. Jadi, bisa

dikatakan pula bahwa front-end merupakan penghubung antara sistem dan user.

Pada PT. Mitra Hutama Bersinar, dibutuhkan rancang bangun front-end untuk

penilaian karyawan sebagai bahan pertimbangan HRD terhadap karyawan yang

bersangkutan, untuk aset serta pedoman pembuatan desain telah disiapkan pihak

perusahaan, sehingga saat melakukan kegiatan kerja praktik sudah tidak dilakukan

dari tahap awal. Bahasa pemrograman yang digunakan yakni Javascript, karena

perusahaan telah melakukan riset yang cocok mengenai program yang akan

diimplementasikan.

Hasil dari kerja praktik ini adalah pembuatan aplikasi yang dapat digunakan

oleh dua user yakni manajer dan admin TI. Manajer perlu melakukan penilaian

melalui aplikasi android dengan durasi yang sudah ditentukan pihak perusahaan,

serta manajer juga dapat mengetahui performa karyawan yang berada pada divisi

manajer tersebut. Agar manajer melakukan penilaian tidak melebihi batas waktu,

maka admin perlu memiliki fitur yang dapat memantau manajer bila belum

melakukan penilaian pada karyawan terkait yang dapat dilihat melalui situs web.

Kata Kunci: Front end, Penilaian Kinerja, Android, Situs Web.

vi

KATA PENGANTAR

Puji Syukur kehadirat Tuhan Yang Maha Esa karena berkat dan rahmat dapat

menyelesaikan Laporan Kerja Praktek yang berjudul “Rancang Bangun Front End

Sistem Penilaian Kinerja Karyawan Berbasis Android dan Situs Web Pada PT .

Mitra Hutama Bersinar” ini dapat diselesaikan.

Laporan Kerja Praktik ini ini disusun dalam rangka penulisan laporan untuk

memperoleh gelar sarjana komputer pada program studi S1 sistem informasi

universitas Dinamika Surabaya.

Melalui kesempatan yang sangat berharga ini penulis menyampaikan ucapan

terima kasih yang sebesar-besarnya kepada semua pihak yang telah membantu

penyelesaian laporan kerja praktik ini terutama kepada yang terhormat:

1. Bapak Prof. Dr. Budi Jatmiko, M.Pd selaku Rektor Universitas

Dinamika yang memberikan kesempatan untuk melaksanakan kerja

praktik.

2. Bapak Dr. Anjik Sukmaaji, S.Kom., M.Eng. selaku Kepala Program

Studi S1 Sistem Informasi Universitas Dinamika.

3. Ibu Ayouvi Poerna Wardhanie, S.M.B., M.M. selaku dosen wali dan

dosen pembimbing yang telah mendukung penulis dalam pelaksanaan

kerja praktik.

4. Bapak Calvin Young selaku Direktur Utama PT Mitra Utama Bersinar

yang telah mengijinkan saya melakukan kegiatan kerja praktik.

5. Semua pihak yang tidak dapat disebutkan satu persatu dalam

kesempatan ini yang telah memberikan bantuan moral dan materiil

dalam proses penyelesaian laporan ini.

Semoga Tuhan Yang Maha Esa memberikan imbalan yang setimpal atas segala

bantuan yang telah diberikan.

Surabaya, April 2021

Penulis

vii

DAFTAR ISI

ABSTRAK .......................................................................................................... v

KATA PENGANTAR ........................................................................................ vi

DAFTAR ISI ..................................................................................................... vii

DAFTAR TABEL .............................................................................................. ix

DAFTAR GAMBAR ........................................................................................... x

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

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

1.2 RUMUSAN MASALAH ....................................................................... 2

1.3 BATASAN MASALAH ........................................................................ 3

1.4 TUJUAN ............................................................................................... 3

1.5 MANFAAT ........................................................................................... 3

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

2.1 GAMBARAN UMUM .......................................................................... 4

2.2 STRUKTUR ORGANISASI .................................................................. 5

BAB III LANDASAN TEORI ............................................................................. 6

3.1 APLIKASI ............................................................................................. 6

3.2 SITUS WEB .......................................................................................... 7

3.3 ANDROID ............................................................................................ 7

3.4 FRONT END ......................................................................................... 8

3.5 FRONT END DEVELOPER ................................................................. 9

3.6 SYSTEM FLOWCHART .................................................................... 10

BAB IV DESKRIPSI PEKERJAAN .................................................................. 12

4.1 ANALISIS DAN DESAIN SISTEM .................................................... 12

4.1.1 WAWANCARA ........................................................................... 12

4.1.2 ANALISIS KEBUTUHAN FUNGSIONAL ................................. 12

4.2 PERANCANGAN SISTEM ................................................................ 12

4.2.1. SYSFLOW ................................................................................... 13

4.2.2. PERANCANGAN ANTAR MUKA PENGGUNA ....................... 14

BAB V PENUTUP ............................................................................................ 24

5.1 KESIMPULAN ................................................................................... 24

5.2 SARAN ............................................................................................... 25

viii

DAFTAR PUSTAKA ........................................................................................ 26

ix

DAFTAR TABEL

Tabel 1 Penjelasan Simbol Sysflow.................................................................... 10

x

DAFTAR GAMBAR

Gambar 1. Struktur Organisasi ............................................................................. 5

Gambar 2 Login Manajer ................................................................................... 14

Gambar 3 Dashboard Manajer............................................................................ 14

Gambar 4 Form Penialain Manajer ..................................................................... 15

Gambar 5 Performa Karyawan Manajer ............................................................. 15

Gambar 6 Login Manajer ................................................................................... 16

Gambar 7 Dashboard Admin .............................................................................. 16

Gambar 8 Sidebar Admin ................................................................................... 17

Gambar 9 Tabel Kriteria Dan Bobot ................................................................... 17

Gambar 10 Tabel Penilaian ................................................................................ 18

Gambar 11 Tabel Series ..................................................................................... 19

Gambar 12 Tabel Karyawan............................................................................... 19

Gambar 13 Tabel Pekerjaan ............................................................................... 20

Gambar 14 Tabel Departemen............................................................................ 21

Gambar 15 Detil Laporan Tabel Departemen ..................................................... 21

Gambar 16 Form Ubah Dan Tambah Tabel Departemen .................................... 22

Gambar 17 Tabel Perusahaan ............................................................................. 22

1

BAB I PENDAHULUAN

1.1 LATAR BELAKANG MASALAH

Pada era 4.0 ini, banyak sekali perusahaan yang berusaha mengefisienkan

pekerjaan menggunakan teknologi. Hal tersebut berdampak positif pada

produktivitas perusahaan yang semakin cepat, mengurangi kecacatan produk serta

pengendalian masalah yang lebih mudah. Tak menutup kemungkinan perusahaan

bergerak dalam bidang barang maupun jasa pasti dapat memanfaatkan teknologi.

Teknologi juga memiliki fungsi planning dan decision, yang menjadi landasan

knowledge generator dan alasan yang kuat bagi para pemimpin perusahaan untuk

mengambil suatu keputusan (Nagitec, 2020).

PT. Mitra Hutama Bersinar adalah perusahaan dari Indonesia yang sudah

berdiri sejak 29 Augstus 2020. Perusahaan ini bergerak dibidang penjualan barang

sanitasi seperti gayung, shower, dan lain sebagainya. PT. Mitra Hutama Bersinar

memiliki kantor yang berada di Pantai Mentari, Blok. W No.34, Kenjeran,

Kecamatan Bulak, Surabaya 60123 yang terdiri dari satu direktur utama, satu

direktur, dan dua staff untuk mengelola teknologi informasi perusahaan. Jam kerja

di perusahaan tersebut seperti perusahaan pada umumnya yakni delapan jam kerja,

tapi yang membedakan yakni jam kerja tersebut sangat fleksibel. Jika karyawan

mempunyai keperluan lain, maka jam kerjanya bisa diganti pada hari lain atau dapat

lembur hingga malam.

PT. Mitra Hutama Bersinar memiliki empat departemen yang harus dilakukan

penilaian pada masing-masing karyawannya, yang berjumlah antara sepuluh hingga

dua belas karyawan. Departemen tersebut yakni administrasi, pengiriman, gudang,

dan marketing. Menurut standar operasional prosedur, manajer tiap departemen

wajib melakukan penilaian dalam beberapa periode yang terbagi menjadi periode

mingguan, bulanan, tiga bulanan, enam bulanan, dan tiap tahun. Pada periode

mingguan, manajer wajib melakukan penilaian sebanyak dua kali dan pengisian

dilakukan pada hari yang berbeda. Untuk pengisian periode selain mingguan, akan

diberitahukan dikemudian hari oleh komisaris.

2

Selama ini, PT. Mitra Hutama Bersinar melakukan penilaian karyawan

menggunakan excel. Diawal, perusahaan memiliki pandangan walau hanya dengan

menggunakan excel, data bisa tetap terorganisir dengan mudah dan tak perlu repot-

repot membuat aplikasi. Tapi, setelah dilakukan evaluasi, dirasa penggunaan excel

tidak menghasilkan keputusan yang tepat karena manajer sering lupa melakukan

kegiatan penilaian karyawannya yang dilakukan diakhir minggu pada hari yang

sama. Hal tersebut termasuk pelanggaran standar operasional karena pengisian nilai

dihari yang sama dianggap tidak objektif. Hal tersebut juga menjadi bahan evaluasi

komisaris yang menghasilkan keputusan bahwa diperlukannya aplikasi yang dapat

mengingatkan manajer untuk melakukan penilaian dengan penginputan nilai sesuai

standar operasional.

Oleh sebab itu, pada kerja praktik ini penulis membantu perusahaan dalam

dua hal. Pertama, penulis membantu departemen teknologi informasi perusahaan

untuk melakukan rancang bangun front-end berbasis situs web yang berguna untuk

melihat data pengisian form yang telah dilakukan manajer, ubah data jika terdapat

salah input, informasi keputusan penunjang untuk penilaian karyawan, penambahan

karyawan, penambahan manajer, penambahan perusahaan, dan mengetahui hasil

penilaian karyawan ditiap departemennya. Kedua, penulis juga membantu

membuat rancang bangun front-end berbasis android ditiap manajer departemen

untuk mengingatkan agar melakukan penilaian sesuai standar operasional dan juga

sebagai form pengisian nilai sesuai periode. Beberapa syarat dan kriteria front-end

yang penulis buat sudah disesuaikan dengan pedoman perusahaan seperti warna,

font, logo, dan sebagainya agar tetap konsisten pada budaya perusahaan. Pemilihan

bahasa pemrograman juga disesuaikan dengan keinginan perusahaan yakni

javascript yang diyakini memiliki tingkat kecepatan membaca basis data serta

responsive bila dibuka pada beberapa device.

1.2 RUMUSAN MASALAH

Berdasarkan latar belakang diatas, maka diperoleh rumusan masalah yaitu

bagaimana merancang dan membangun front-end sistem penilaian kinerja

karyawan berbasis android dan situs web pada PT . Mitra Hutama Bersinar.

3

1.3 BATASAN MASALAH

Batasan masalah dari perancangan front-end sistem penilaian kinerja

karyawan berbasis android dan situs web pada PT . Mitra Hutama Bersinar:

Aplikasi berbasis situs web untuk admin teknologi informasi yang dapat

melakukan create, update, delete (CRUD) data manajer, dan mengetahui

hasil penilaian karyawan tiap departemen;

Aplikasi berbasis android untuk manajer departemen administrasi,

pengiriman, gudang, dan marketing yang dapat melakukan pengisian form

nilai karyawan dan sebagai pengingat untuk mengisikan nilai pada periode

tertentu sesuai standar operasional;

Pembuatan front-end aplikasi tidak keluar dari budaya perusahan seperti

halnya font, warna, logo, dan lain sebagainya yang sudah ditetapkan

perusahaan.

1.4 TUJUAN

Tujuan dari pembuatan front-end sistem penilaian kinerja karyawan berbasis

android dan situs web pada PT . Mitra Hutama Bersinar, yaitu memudahkan

komisaris mendapatkan hasil penilaian tiap karyawan ditiap departemen sesuai

standar operasional prosedur.

1.5 MANFAAT

Meningkatkan kreativitas dan kepedulian terhadap dunia industri dan TI

sehingga mampu menciptakan aplikasi yang dapat memenuhi kebutuhan

industri di bidang TI;

Memanfaatkan moment kegiatan kerja praktik untuk mengimplementasikan

hasil pembelajaran selama kuliah.

4

BAB II GAMBARAN UMUM PERUSAHAAN

2.1 GAMBARAN UMUM

Nama perusahaan : PT. Mitra Hutama Bersinar

Alamat : Pantai Mentari, Blok. W No.34, Kenjeran, Kecamatan

Bulak, Kota Surabaya, Jawa Timur.

Kontak : +62 851-5782-9294 / Bapak Owen

Kode post : 60123

Tanggal berdiri : 29 Augstus 2020

Visi : Menjadi perusahaan digital modern, besar, terpercaya &

profesional di indonesia.

Misi : 1. Kami bertujuan untuk memberikan pelayanan terbaik

dengan menciptakan produk yang berkualitas.

2. Menjalin hubungan kerjasama dengan mitra usaha yang

saling menguntungkan dan berkelanjutan.

3. Serta terus mengembangkan potensi sumber daya yang

kami miliki untuk dapat memberikan nilai tambah yang

tinggi.

5

2.2 STRUKTUR ORGANISASI

Gambar 1. Struktur Organisasi

Pada gambar 1 merupakan struktur organisasi PT. Mitra Hutama Bersinar

memiliki komisaris sebagai pemimpin puncak yang mengepalai laju produktivitas

dan pelayanan tingkat nasional. Sedangkan untuk direktur utama, memiliki peran

untuk mengawasi dan menyiapkan strategi terkhusus di area Surabaya. Sedangkan

direktur yang mengepalai staff memiliki peran untuk mengawasi pekerjaan serta

menjadi penilai untuk karyawannya.

6

BAB III LANDASAN TEORI

Landasan teori merupakan dasar pendapat penelitian atau penemuan dengan

didukung oleh data dan argumentasi. Landasan teori ini digunakan untuk

menjelaskan teori-teori yang mendukung penyusunan laporan Kerja Praktik ini,

antara lain:

3.1 APLIKASI

Aplikasi dalam kehidupan manusia sangat mendukung dalam berbagai

bidang mulai dari hal mendasar seperti alarm bangun pagi hingga hal penting

seperti berbagi informasi politik dan ekonomi. Sebuah perangkat lunak atau

program yang diciptakan dan dikembangkan untuk melakukan tugas-tugas tertentu

pada perangkat komputer, laptop ataupun smartphone disebut aplikasi (Putra,

2020).

Aplikasi memiliki beberapa tipe yang dapat disesuikan dengan kebutuhan.

Berikut beberapa tipe aplikasi:

Real-time software

Berguna untuk menganalisa dan mendapatkan informasi secara cepat.

Aplikasi tipe ini biasanya digunakan untuk komunikasi antar

pengguna.

System software

Aplikasi ini berguna untuk mengontrol perangkat keras yang biasa

digunakan pada pabrik.

Personal computer software

Aplikasi yang khusus digunakan untuk seseorang saja. Pengguna

aplikasi ini hanya diberikan beberapa akses khusus atau memiliki

otoritas mengatur sistem aplikai lain.

7

3.2 SITUS WEB

Situs web adalah halaman yang berisikan informasi berupa gambar, tulisan,

dan video yang dapat diakses khalayak umum melalui browser. Situs web memiliki

protokol keamanan dengan menggunakan protokol Hypertext Transfer Protokol

(HTTP). Halaman-halaman dalam sebuah situs web biasanya merupakan campuran

teks dan media lainnya (Mardatila, 2021).

Dengan adanya situs web, pengguna dapat mudah mengakses suatu

informasi. Situs web menjadi salah satu hal terpenting untuk kamu miliki, website

bukan hanya digunakan untuk keperluan bisnis, namun juga dapat menjadi sarana

komunikasi untuk berinteraksi dengan banyak orang (Nuresa, 2021). Berikut

beberapa ciri situs web yang baik:

1. Desain yang mudah dimengerti

Desain tentu saja berdampak besar pada pengguna yang nyaman dan

memudahkan pengguna untuk mencari informasi yang diperlukan.

2. Tidak memerlukan waktu tunggu akses yang lama

Situs web baik memiliki waktu tunggu kurang dari tiga detik. Jika

sebuah situs memiliki waktu tunggu lebih dari tiga detik, maka akan

lebih baik untuk diperbaiki terlebih dahulu.

3. Mempunyai informasi jelas

Penggunanya tentu memiliki tujuan untuk dapat menemukan

informasi yang jelas dan tidak merepotkan. Situs yang baik akan

menampilkan pengguna untuk membaca informasi dengan mudah.

3.3 ANDROID

Android merupakan sebuah sistem operasi yang dijalankan pada ponsel pintar

atau smartphone. Saat ini, pengguna android di Indonesia sudah mencapai 95,53%

dari hasil perhitungan grafik pengguna selama 12 bulan terakhir (StatCounter,

2021). Google sebagai pembuat operasi sistem android menggratiskan

penggunaannya untuk dapat melakukan berbagai kebutuhan. Pada dasarnya,

Google sendiri mendapatkan keuntungan apabila ada perusahaan atau pengembang

aplikasi mereka sendiri ke Google Play Store (BootUp, 2019).

8

Pengguna android tentu perlu mengunduh dan menginstal aplikasi melalui

aplikasi khusus unduh aplikasi yakni Google Play-store. Banyaknya aplikasi di

Google Play Store, tidak semuanya berasal dari sumber yang terpercaya atau bisa

dikatakan palsu dan berbahaya (Nugroho, 2019). Berikut beberapa ciri aplikasi

yang aman dan layak untuk digunakan:

1. Nama Aplikasi

Pengguna yang ingin mengunduh aplikasi diharap dapat lebih teliti dan

peka mengenai nama aplikasi serta nama pengembang aplikasi.

Pemberian nama yang aneh bisa menjadi indikasi bahwa aplikasi tersebut

tidak aman dan baik untuk diunduh.

2. Ulasan dan Penilaian Pengguna

Melihat ulasan yang tertera pada kolom komentar Google Play-store

dapat menjadi bantuan pengguna sebelum mengunduh. Dikolom

komentar pula dapat diidentifikasi mengenai pihak pengembang yang

menerima saran dengan menanggapi para komentator atau tidak

menanggapi.

3. Periksa Izin

Jika dua hal diatas tidak terindikasi ada masalah, hal selanjutnya yakni

setelah pengguna mengunduh aplikasi. Beberapa aplikasi membutuhkan

akses ijin untuk dapat menjalankan aplikasinya. Jika aplikasi meminta ijin

untuk mengakses hal yang tidak wajar, maka lebih baik ditolak dan segera

melakukan hapus instalasi.

3.4 FRONT END

Data perlu diolah agar dapat menjadi informasi. Pengguna tentunya

menginginkan melihat informasi yang ringkas dan mudah walau memiliki data

yang cukup banyak. Dari permasalahan tersebut, front-end dapat membantu

pengguna untuk mengelola data dan mengubahnya menjadi tampilan aplikasi

maupun situs web yang menarik. Front-End adalah sebuah bagian dari website yang

menyuguhkan tampilan kepada user (Putri, 2019).Tampilan yang efisien dan efektif

menjadi prioritas front-end yang harus terpenuhi.

9

Indikator tampilan yang menarik sangat subjektif. Hal tersebut karena tiap

orang memiliki cita rasa dan cara tersendiri dalam menikmati sesuatu, untuk dapat

menghasilkan tampilan aplikasi atau situs web yang baik, maka pihak front-end

perlu melakukan diskusi dengan pihak User Interface/User Experience (UI/UX)

agar dapat mendefinisikan tampilan seperti apa yang diinginkan serta kebutuhan

apa saja yang dibutuhkan mulai dari primer hingga tersier. Front-end bertugas

untuk mewujudkan desain yang sudah dibuat oleh UI/UX designer (Nashiruddin,

2020).

3.5 FRONT END DEVELOPER

Front-end developer adalah orang yang berperan membuat tampilan situs

atau aplikasi melalui HTML, CSS, dan JavaScript (Firdiansyah, 2020). Ketiga

bahasa tersebut merupakan dasar dari pengetahuan yang harus dimiliki front-end

developer hal tersebut dikarenakan HTML merupakan tumpuan dasar atau struktur

utama dari pembuatan situs web. CSS juga menjadi bagian penting karena dapat

digunakan sebagai pengontrol halaman pada tampilan HTML seperti menentukan

font, warna, gambar latar belakang, dan lainnya. Pada JavaScript, bahasa tersebut

berguna untuk dapat menciptakan situs web yang lebih interaktif, memberikan

animasi, serta meningkatkan performa dari fitur yang ingin ditambahkan. Front-

end juga memiliki peran mengetahui kebutuhan dan tingkat prioritas pengguna dari

tampilan situs web atau android yang akan dibuat. Selain itu, front-end juga

berperan mengambil dan mengelola data dari basis data.

Front-end developer bertugas membuat situs atau aplikasi berdasarkan hasil

prototype dari pihak UI/UX. Seorang front-end developer bertugas untuk

menerapkan interface dan experience yang telah diberikan oleh seorang desainer

Website atau UI/UX Designer (Kopidev, 2020). Selain tiga bahasa pemrograman

diatas, terdapat beberapa kemampuan lain yang harus dimiliki front-end developer

yakni:

1. Version Control/Git

Version control adalah sebuah proses melacak dan mengontrol

perubahan-perubahan kode sehingga tidak perlu mengulangi

semuanya dari awal.

10

2. Desain responsif

Agar aplikasi atau situs web dapat digunakan pada perangkat apapun,

maka diperlukan Bootstrap untuk dapat dapat mengimplementasikan

desain yang responsif.

3. Testing

Jika situs web atau aplikasi telah rampung dibuat, maka pada tahap ini

aplikasi atau situs web akan dicek bila mendapati adanya bug atau eror

pada fitur tertentu.

3.6 SYSTEM FLOWCHART

System flowchart merupakan bagan yang berguna untuk menunjukkan aliran

penggunaan data serta operasi yang oleh pengguna maupun sistem aplikasi. Bagan

ini juga menjelaskan prosedur yang wajib dilakukan oleh pengguna dari awal

hingga akhir saat menggunakan sistem aplikasi. Bagan alir (flowchart) digunakan

terutama untuk alat bantu komunikasi dan untuk dokumentasi (Rizky, 2019).

Berikut beberapa simbol beserta penjelasan dapat dilihat pada tabel 1 dibawah ini:

Tabel 1 Penjelasan Simbol Sysflow

Simbol Nama

simbol

Penjelasan

Terminal Simbol ini digunakan sebagai awal dan akhir

pada alur penggunaan sistem.

Proses Simbol ini digunakan sebagai informasi proses

yang sedang dijalankan sistem.

Pilihan Simbol ini digunakan sebagai pilihan untuk

beberapa kondisi.

Inputan Simbol ini digunakan sebagai inputan pada

sistem.

11

Basis data Simbol ini digunakan sebagai pengambilan atau

penambahan data pada basis data.

Garis alur Simbol ini digunakan sebagai informasi alur

sistem.

Tampilan Simbol ini digunakan sebagai tampilan pada

pengguna atau respon sistem.

12

BAB IV DESKRIPSI PEKERJAAN

4.1 ANALISIS DAN DESAIN SISTEM

Tahap analisis dan desain sistem berguna untuk mengumpulkan data dan

memetakan periode pekerjaan selama masa kerja praktik. Untuk dapat melakukan

pemetaan kerangka kerja, penulis sering berkonsultasi dengan pihak terkait agar

dapat menyesuaikan waktu bersama. Setelah menyesuaikan jadwal dengan pihak

perusahaan, hal yang dilakukan selanjutnya yakni menganalisa. Analisa yang

dilakukan dimulai dari wawancara, analisis kebutuhan pengguna, analisis

kebutuhan fungsional, analisis kebutuhan non fungsional, analisis kebutuhan

sistem.

4.1.1 WAWANCARA

Wawancara yang penulis lakukan dilangsungkan selama satu hari kerja.

Orang yang penulis wawancarai yakni Bapak Owen selaku orang kepercayaan dari

direktur PT Mitra Utama Bersinar yang akan mengawasi dan membimbing penulis.

Bapak Owen memberitahukan bahwa untuk desain UI/UX memang belom tersedia,

dan berharap agar penulis bisa membuatkan pula UI/UX nya hingga pembuatan

aplikasi android maupun situs web.

4.1.2 ANALISIS KEBUTUHAN FUNGSIONAL

Analisa kebutuhan fungsional berguna untuk memberitahukan diagram alir

yang dikonsep atau dikemas dalam bentuk deskripsi. Analisis pada tahap ini dibagi

menjadi dua, yakni manager pengguna android dan admin pengguna situs web.

Meskipun terdapat 2 pengguna, namun analisis kebutuhan fungsional

berpandangan pada tahap-tahap yang akan dilakukan oleh pengguna dalam

melakukan suatu keputusan bukan pada penggunaannya yang android maupun situs

web. Keputusan yang dimaksud dapat berupa melihat data, penambahan data,

pengubahan data, maupun penghapusan data. Adapun detil analisis kebutuhan

fungsional berupa tabel yang terdapat pada lampiran tabel 4 hingga tabel 12.

4.2 PERANCANGAN SISTEM

Tahap perancangan sistem merupakan tahap lanjutan setelah analisis dan

desain sistem selesai. Perancangan sistem terbagi menjadi dua hal, yakni

13

pembuatan system flow (sysflow) dan perancangan antar muka. Sysflow berguna

untuk memudahkan pembaca melihat serta mengimplementasikan bahkan dapat

mengembangkan program yang akan dibuat dari hasil analisis kebutuhan fungsional

yang telah dilakukan. Selain itu, kegunaan sysflow dapat menjadi tolak ukur

seberapa besar program akan dijalankan. Desain antar muka merupakan bagian dari

pengimplementasian awal pembuatan program. Dengan desain antar muka

programmer memiliki pedoman desain yang harus diimplementasikan ke dalam

coding.

4.2.1. SYSFLOW

Untuk memudahkan pengembangan aplikasi android maupun situs web

pada masa mendatang, developer memiliki cara untuk memetakan hal-hal apa saja

yang dapat dilakukan pengguna dan tanggapan yang harusnya dilakukan oleh

sistem. Pada kondisi ini, sysflow dibagi menjadi dua, yakni manager sebagai

pengguna android, dan admin sebagai pengguna situs web. Adapun sysflow berupa

gambar yang berisi alur sistem yang terdapat pada lampiran gambar 19 hingga

gambar 26.

14

4.2.2. PERANCANGAN ANTAR MUKA PENGGUNA

Berikut adalah tampilan dari sudut pandang manajer yang menggunakan

android:

Gambar 2 Login Manajer

Gambar 3 Dashboard Manajer

Gambar 2 menunjukkan saat manajer

akan login ke aplikasi penilaian

karyawan.

Gambar 3 menunjukkan saat pertama

kali berada di aplikasi. Terdapat

penjelasan batas waktu, serta banyaknya

penilaian yang sudah dilakukan.

15

Gambar 4 Form Penialain Manajer

Gambar 5 Performa Karyawan

Manajer

Gambar 4 menunjukkan form penilaian

yang akan dilakukan oleh manajer.

Gambar diatas juga sama halnya jika

manajer melakukan ubah nilai.

Gambar 5 menunjukkan performa

karyawan terbaik yang telah dinilai.

16

Berikut adalah tampilan dari sudut pandang admin yang menggunakan situs web:

Gambar 6 Login Manajer

Gambar 6 adalah halaman login untuk admin. Pada halaman admin tertera email

dan password yang dapat di atur oleh admin, sehingga adanya halaman login

tersebut untuk mengamankan dan memastikan hanya pihak admin yang bisa

masuk.

Gambar 7 Dashboard Admin

Gambar 7 merupakan grafik performa departemen serta manajer. Grafik

departemen dibuat dalam bentuk grafik lingkaran karena departemen

perusahaan tidak banyak. Untuk grafik performa manajer dibuat dalam bentuk

17

persentase karena manajer yang harus dinilai cukup banyak serta informasi yang

ingin dilihat berupa persentase, sehingga akan lebih baik menggunakan grafik

bar.

Gambar 8 Sidebar Admin

Gambar 8 menjelaskan side bar dari situs web admin. Pada sidebar tersebut dapat

disembunyikan atau ditampilkan, sehingga tidak banyak menghabiskan ruang

pada tampilan. Jika admin membutuhkan informasi, dapat ditekan tampil agar

mengetahui isi side bar.

Gambar 9 Tabel Kriteria Dan Bobot

Gambar 9 menjelaskan mengenai tabel kriteria dan bobot. Terdapat pula tambah

dan ubah dan hapus serta laporan yang terdapat pada tabel. Tabel tersebut akan

memberikan informasi mengenai departemen apa saja yang terkait pada kriteria

dan bobot yang telah ditentukan.

18

Gambar 10 Tabel Penilaian

Gambar 10 menjelaskan mengenai tabel penilaian. Terdapat pula tambah dan

ubah dan hapus serta laporan yang terdapat pada tabel. Tabel tersebut ditujukan

untuk tiap karyawan yang berada didepartemen tertentu yang dapat disesuaikan

dengan keadaan bila ingin diubah. Tabel penilaian juga dapat dilakukan tambah

nilai jika manajer belum mengisi data penilaian karyawan walau sudah

diingatkan.

19

Gambar 11 Tabel Series

Gambar 11 menjelaskan mengenai tabel series. Terdapat pula tambah dan ubah

yang terdapat pada tabel. Tombol tambah diatas menjadi inactive karena hanya

bisa ditambah minimal 6 bulan sekali. Tabel series berguna untuk menentukan

periode pengisian nilai yang dapat dilakukan manajer.

Gambar 12 Tabel Karyawan

Gambar 12 adalah tabel karyawan yang memiliki tambah, ubah dan hapus pada

tabelnya. Tabel karyawan berguna untuk melihat daftar dan biodata karyawan.

Admin dapat melakukan tambah karyawan, ubah karyawan dan hapus karyawan.

Untuk fitur foto masih belum tersedia karena pada saat itu perusahaan hanya

20

meminta untuk dibuatkan kolomnya saja, tapi untuk tambah foto maupun edit

foto masih belum tersedia.

Gambar 13 Tabel Pekerjaan

Gambar 13 adalah tabel pekerjaan yang memiliki tambah, ubah dan hapus pada

tabelnya. Tabel pekerjaan berguna untuk melihat daftar pekerjaan yang dimiliki

perusahaan. Tabel tersebut hanya menginformasikan seputar pekerjaan saja.

21

Gambar 14 Tabel Departemen

Gambar 14 adalah tabel departemen yang memiliki tambah, ubah dan hapus serta

laporan pada tabelnya. Tabel departemen berguna untuk melihat daftar

departemen yang dimiliki perusahaan. Tabel tersebut hanya menginformasikan

seputar departemen saja.

Gambar 15 Detil Laporan Tabel Departemen

Gambar 15 menjelaskan pada halaman departemen dan memilih tombol laporan.

Laporan yang ditampilkan dalam bentuk pop-up berupa informasi nama

karyawan serta nilai karyawan dari departemen yang dipilih.

22

Gambar 16 Form Ubah Dan Tambah Tabel Departemen

Gambar 16 menjelaskan pada halaman departemen bila memilih tombol ubah

maupun tambah yang berada pada gambar 14 tabel departemen maka akan

muncul form. Untuk melakukan tambah atau ubah departemen, form yang

ditampilkan dalam bentuk pop-up yang dapat diisi nama departemen serta note

jika memiliki catatan khusus departemen tersebut. Pada kolom ID Departemen

berwarna abu-abu karena kolom tersebut akan diisi automatis dari sistem.

Gambar 17 Tabel Perusahaan

Gambar 17 menjelaskan tabel pada halaman perusahaan. Tabel pekerjaan berguna

untuk melihat daftar perusahaan yang menjadi rekan kerja PT. Mitra Hutama

Bersinar yang dapat dilakukan tambah, ubah, maupun hapus data. Tabel tersebut

hanya menginformasikan seputar rekan kerja perusahaan saja

23

Beberapa gambar diatas memiliki pagination table yang berarti dapat diaturnya

banyak halaman serta menyeleksi tampilan tabel. Untuk informasi tabel yang tidak

ada karena data yang dimiliki masih kosong sehingga tombol tambah, ubah, dan

hapus masih belum tersedia.

24

BAB V PENUTUP

5.1 KESIMPULAN

Berdasarkan pelaksanaan kerja praktik yang dilakukan di PT. Mitra Hutama

Bersinar, dapat disimpulkan bahwa dalam pembuatan rancang bangun front end

sistem penilaian kinerja karyawan berbasis android dan situs web dapat

disimpulkan sebagai berikut:

1. Aplikasi android yang digunakan oleh manajer untuk melakukan

penilaian karyawan, sudah dapat dilakukan dengan memiliki ketentuan

pembaruan nilai kurang dari 24 jam. Manajer juga dapat mengetahui

berapa kali manajer telah melakukan penilaian pada masing-masing

karyawan, dan manajer juga mengetahui berapa banyak karyawannya

yang belum dinilai. Selain itu, manajer juga dapat mengetahui performa

karyawan melalui grafik bar. Performa tersebut diperoleh dari hasil

penilaian yang dilakukan oleh manajer.

2. Situs web pada admin memiliki beberapa tabel yang sudah dilengkapi

dengan table pagination untuk memudahkan pengguna. Pada tiap tabel

terdiri dari informasi detil tabel tersebut, serta fitur untuk menambah,

hapus, ubah yang akan memudahkan admin untuk mengelola data. Pada

beberapa tabel memiliki fitur laporan yang berguna untuk melihat detil

laporan berupa pop-up form. Selain tabel, admin juga memiliki fitur

dashboard nilai yang terdiri dari grafik lingkaran untuk melihat

performa semua departemen dan grafik presentase untuk melihat

performa semua manajer.

Perancangan antar muka telah dilakukan revisi sebanyak 4 kali karena adanya

permintaan dan pengurangan kebutuhan dalam aplikasi. Pembuatan situs web dan

android tidak sampai ditahap akhir yakni testing dikarenakan waktu yang tidak

cukup.

25

5.2 SARAN

Berdasarkan kesimpulan di atas dan kerja praktik yang dilakukan, maka

menghasilkan sejumlah saran yang dapat dikembangkan lebih lanjut pada masa

mendatang sebagai bagian dari upaya peningkatan kualitas sistem. Berikut adalah

beberapa saran tersebut:

1. Terdapat beberapa fitur yang belum dilengkapi, seperti fitur jika

pengguna lupa password, fitur notifikasi untuk manajer yang lupa

melakukan penilaian, dan beberapa fitur lain yang sekiranya dapat

memudahkan pengguna. Diharapkan dapat dilakukan pengembangan

lebih lanjut untuk meningkatkan kenyamanan pengguna.

2. Disarankan untuk terus mengikuti perubahan mode tampilan

antarmuka sesuai dengan berjalannya waktu, agar fitur - fitur yang

digunakan dapat membuat pengguna nyaman.

3. Penulis merekomendasikan kepada pengguna yang menggunakan

sistem informasi ini sesuai dengan prosedur yang terdiskripsi pada

sysflow penulis agar aplikasi dan situs web dapat digunakan sesuai

dengan fungsinya.

26

DAFTAR PUSTAKA

BootUp. (2019, Mei 27). Android Adalah? Pengertian, Sejarah, Hingga

Kelebihanya dibanding OS lain. Retrieved from bootup.ai:

https://bootup.ai/blog/apa-itu-android-pengertian-kelebihan/

Digital, D. (2021). Website yang Baik Harus Memenuhi Kriteria Ini. Retrieved

from www.dhadigital.com: https://www.dhadigital.com/syarat-website-

untuk-bisnis/

Firdiansyah, A. (2020, Desember 22). Kerap Beriringan, Apa Perbedaan Antara

Front End dan Back End? Retrieved from glints.com:

https://glints.com/id/lowongan/perbedaan-front-end-dan-back-

end/#.YJPeeLUzZZV

Kopidev, M. (2020, 04 26). Panduan Menjadi Front-End Developer. Retrieved

from kopi.dev: https://kopi.dev/front-end-

developer/#apa_itu_front_end_developer

Mardatila, A. (2021, Januari 21). Mengenal Pengertian Website, Ketahui Jenis

dan Fungsinya. Retrieved from www.merdeka.com:

https://www.merdeka.com/sumut/pengertian-website-fungsi-beserta-jenis-

jenisnya-kln.html

Nagitec. (2020). PENTINGNYA TEKNOLOGI BAGI PERUSAHAAN. Retrieved

from nagitec.com: https://nagitec.com/pentingnya-teknologi-bagi-

perusahaan/

Nashiruddin, T. (2020, 10 01). Mengenal Front-End Programmer, Pelaksana Ide-

Ide UI/UX Designer. Retrieved from www.jagoanhosting.com:

https://www.jagoanhosting.com/blog/front-end-programmer/

Nugroho, R. A. (2019, 04 23). 7 Cara Mengetahui Aplikasi Palsu dan Berbahaya

di Play Store, Agar HP Aman. Retrieved from hot.liputan6.com:

https://hot.liputan6.com/read/3948120/7-cara-mengetahui-aplikasi-palsu-

dan-berbahaya-di-play-store-agar-hp-aman

27

Nuresa, G. (2021). 4 Kriteria Website yang Berkualitas Baik. Retrieved from

whello.id: https://whello.id/tips-digital-marketing/kriteria-website-yang-

berkualitas-baik/#1_Website_Responsive

Putra. (2020, Juni 16). PENGERTIAN APLIKASI: Fungsi, Sejarah, Klasifikasi,

Jenis & Contoh Aplikasi. Retrieved from salamadian.com:

https://salamadian.com/pengertian-aplikasi/

Putri, A. R. (2019, 04 26). Apa Itu Front-End dan Back-End di Dunia Teknologi?

Retrieved from kumparan.com: https://kumparan.com/kumparantech/apa-

itu-front-end-dan-back-end-di-dunia-teknologi-1qxlD60BCjk

Rizky, D. (2019, April 30). Jenis Flowchart dan Simbol-Simbolnya. Retrieved

from medium.com: https://medium.com/dot-intern/jenis-flowchart-dan-

simbol-simbolnya-ef6553c53d73

StatCounter. (2021, April). Mobile & Tablet Android Version Market Share

Indonesia. Retrieved from gs.statcounter.com:

https://gs.statcounter.com/os-version-market-share/android/mobile-

tablet/indonesia

RANCANG BANGUN FRONT END SISTEM PENILAIAN …

Documents

Transcript of RANCANG BANGUN FRONT END SISTEM PENILAIAN …