• Tidak ada hasil yang ditemukan

Perancangan Antarmuka

Dalam dokumen SINTEM INFORMASI KEPEGAWAIAN di DINAS PE (Halaman 42-61)

PELAKSANAAN PRAKTEK KERJA INDUSTRI

4.3 Cara Pelaksanaan Praktek Kerja Industri

4.4.2.5 Perancangan Antarmuka

Perancangan antarmuka perangkat lunak merupakan proses pembuatan rancang bangun dari interaksi pengguna sistem dengan komputer. Interaksi ini dapat berupa proses menambah data, mengubah data, menghapus data, mencari data maupun proses menjalankan sistem. Dalam pengimplementasian sistem informasi Kepegawaian Dinas Pendidikan Pemuda dan Olahraga Kab. Gianyar ini, penulis menggunakan satu layar utama yang tampil di awal ketika pengguna membuka sistem ini, dimana layar utama berisi layanan untuk melakukan validasi pengguna atau login untuk menuju ke layar berikutnya. Adapun layar-layar yang dimaksud dapat digambarkan sebagai berikut :

1. Form Login

Ganbar 4.1 Rancangan form login Keterangan rancangan form login

30 b. Edit b : digunakan untuk memasukan data password.

c. Tombol login : digunakan untuk proses masuk ke sistem.

d. Kotak di pojok kiri atas : akan diisi dengan logo Pemkab Gianyar.

2. Form menu utama

Gambar 4.2. Rancangan form menu utama

Form menu utama merupakan form inti yang menyediakan navigasi

fitur-fitur dari sistem informasi kepegawaian ini. Adapun penjelasan rancangannya sebagai berikut:

a. Kotak a : digunakan untuk menampilkan status pengguan berupa

username dan status pengguna (admin atau user) .

b. Kotak b : digunakan untuk menampilkan kalender. c. Kotak c : digunakan untuk menamilkan waktu.

d. Kotak d : diisikan foto lingkungan Disdikpora Gianyar. e. Data Master:

• Unit Kerja : Di gunakan untuk menampilkan antarmuka unit kerja.

• Pangkat : Di gunakan untuk menampilkan antarmuka pangkat.

• Jabatan : Di gunakan untuk menampilkan antarmuka Jabatan.

31 • Jenis Pegawai : Di gunakan untuk menampilkan antarmuka

jenis pegawai.

• Agama : Di gunakan untuk menampilkan antarmuka agama f. Pegawai

• Data pegawai : digunakan untuk menampilkan antarmuka pegawai.

• Mutasi : digunakan untuk menampilkan antarmuka Mutasi. • Pensiun : digunakan untuk menampilkan antarmuka Pensiun. • Cuti : digunakan untuk menampilkan antarmuka cuti. g. Riwayat

• Seminar : digunakan untuk menampilkan antarmuka riwayat Seminar.

• Pelatihan : digunakan untuk menampilkan antarmuka riwayat pelatihan.

h. Akun

• Tambah : digunakan untuk menampilkan antarmuka tambah akun

• Pengaturan: digunakan untuk menampilkan antarmuka Pengaturan akun baik password maupun username. i. Tentang : digunakan untuk menampilkan anatar muka tentang. j. Logout : digunakan untuk keluar dari menu utama dan kembali

menampilkan antarmuka login. 3. Form data

32

Form data merupakan form yang dibuat untuk menangani empat proses

pengolahan data. Kempat proses tersebut adalah Unit, Jenis Pegawai, Jabatan, Agama. Keempat proses tersebut dapat kami jadikan satu form dikarenakan kemiripan dari struktur table dalam data base yang hanya terdiri dari 2 field. Ketika form dimunculkan, akan terjadi proses seleksi tampilan sesuai pilihan user pada form menu utama. Adapun penjelasan komponen dari form data sebagi berikut:

a. Edit A : digunakan untuk mengetikan data yang ingin dicari.

b. Dbgrid b : digunakan untuk menampilkan data dalam bentuk tabel.

c. Edit c: digunakan untuk id data, id akan disesuaikan dengan

antarmuka yang ditampilkan contoh : jika user menampilkan antarmuka agama maka edit c adalah id_agama.

d. Edit d: digunakan untuk nama data, nama akan disesuaikan dengan antarmuka yang ditampilkan contoh : jika user menampilkan antarmuka agama maka edit c adalah nama_agama. e. Tombol batal : digunakan untuk membatalkan proses ubah data dan

tambah data.

f. Tombol simpan : digunakan untuk menyimpan hasil proses ubah data dan tambah data.

g. Menu tambah : digunakan untuk melakukan penambahan data h. Menu hapus : digunkan untuk mengurangii data.

i. Menu ubah : digunakan untuk mengubahdata. 4. Form Pangkat

33 Form pangkat merupakan antarmuka dari proses pengolahan data

pangkat. Adapun proses yang terjadi pada antarmuka ini adalah tambah data , ubah data , dan hapus data. Adapun penjelasan dari form pangkat sebagai berikut :

a. Edit a : digunkan untuk melakukan pencarian data

b. Dbgrid b : digunakan untuk menampilkandata dalam bentuk

tabel.

c. Edit c : digunakan untuk menampilkan kode pangkat, pada saat

penambahan data user tidak perlu untuk mengetikan kode pangkat , karena sistem akan menampilkan kode pangkat secara otomatis. d. Edit d : digunakan untuk mengetikkan golongan

e. Edit e : digunakan untuk memasukan nama pangkat.

f. Tombol batal : Tombol batal : digunakan untuk membatalkan proses ubah data dan tambah data.

g. Tombol simpan : digunakan untuk menyimpan hasil proses ubah data dan tambah data.

h. Menu tambah : digunakan untuk melakukan penambahan data i. Menu hapus : digunkan untuk mengurangii data.

j. Menu ubah : digunakan untuk mengubahdata.

5. Form pegawai.

34

Form pegawai merupkan antarmuka yang digunakan untuk pengolahan

data pengawai. Fom pegawai ini juga di gunakan dalam beberapa proses pengolahan data lain seperti cuti, mutasi , dan pensiun. Pada pengolahan tersebut, form pegawai digunakan untuk mendapatkan data pegawai yang dibutuh kan dalam proses tersebut. Adapun penjelasan masing masing komponen sebagai berikut:

a. Combobox a : digunakan untuk pemilihan kategori pada saat

pencarian.

b. Edit b : digunakan untuk memasukan kata yang ingin di cari

sesuai dengan kategori.

c. Dbgrid c : digunkan untuk menampilkan data dalam bentuk

tabel.

d. Kotak d : diisikan logo pemkab Gianyar. e. Kotak e: diisi logo tutwury.

f. Tombol tambahkan: tombol ini merupakan tombol yang digunakan untuk mengambil salah satu data untuk dibawa ke proses cuti, mutasi , dan pensiun. Tombol ini akan di sembunyikan pada saat pengolahan data pegawai.

g. Tombol Kembali : tombol ini merupakan tombol yang digunakan untuk membatalkan pengambilan data dan kembali ke antarmuka cuti atau mutasi atau pensiun. Tombol ini akan di sembunyikan pada saat pengolahan data pegawai.

h. Tombol cetak : digunakan untuk melakukan proses cetak

i. Tombol tambah : digunakan untuk memunculkan antarmuka tambah pegawai.

j. Tombol ubah : digunakan untuk memunculkan antarmuka tambah pegawai.

k. Tombol hapus : digunakan untuk mengurangi data.

l. Tombol detail : digunakan untuk menampilkan antarmuka detail pegawai.

35 6. Form Tambah pegawai

Gambar 4.6 Rancangan form tambah pegawai

Form tambah pegawai merupakan foem yang digunakan untuk

melakukan manipulasi penambahan dan pengubahan data pegawai. Adapun komponen dari foem ini adalah sebagai berikut :

a. Edit a : merupakan tempat untuk menampilkan alamat direktori

foto.

b. Edit b : merupakan tempat untuk menampilkan id pegawai. Id

pegawai akan di proses secara otomatis.

c. Edit c : digunakan untuk memasukan data nama.

d. Edit d : digunakan untuk memasukan data NIP.

e. Edit e : digunakan untuk memasukan data tempat lahir.

f. Date edit f : digunakan untuk memasukan data tanggal lahir.

g. Combobox g : digunakan untuk memilih masukan untuk data

agama.

h. Combobox h : digunakan untuk memilih masukan jenis kelamin.

36 j. Combobox j : digunakan untuk memilih masukan golongan.

k. Combobox k : digunakan untuk memilih masukan jabatan

l. Combobox l : digunakan untuk memilih masukan unit kerja.

m. Combobox m : digunakan untuk memilih status pegawai / jenis

pegawai.

n. Combobox n : digunakan untuk memilih status perkawinan.

o. Date edit o digunakan untuk memasukkan data tanggal mulai.

p. Tombol buka file : digunakan untuk memilih direktori tempat penyimpanan foto.

q. Tombol simpan : digunakan untuk menyimpan hasi tambah atau

edit dalam data pegawai.

r. Tombol kembali : digunakan untuk membatalkan proses penambahan ataupun pengubahan terhadap data pegawai dan memunculkan kembali antarmuka pegawai.

s. Tombol menu utama : digunakan untuk memunculkan antarmuka menu utama.

7. Form Mutasi.

Gambar 4.7 Rancangan form mutasi

Form mutasi merupakan antarmuka yang digukan dalam peroses

37 tambah, hapus , dan ubah. Pada saat pengguna menambahkan data maka akan dimunculkan form pegawai untuk diambil salah satu data yang akan di olah datanya pada antarmuka mutasi. Adapun komponen dari form mutasi sebagai berikut :

a. Edit a : digunakan untuk menampilkan id mutasi. Pengguna tidak

bisa memasukan input pada kolom tersebut karena sudah otomatis b. DbEdit b : digunakan untuk menampilkan data nama, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

c. DbEdit c : digunakan untuk menampilkan data NIP, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

d. Dbedit d : digunakan untuk menampilkan data Pangkat, untuk

data ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

e. Dbedit e : digunakan untuk menampilkan data Golongan, untuk

data ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

f. Dbedit f : digunakan untuk menampilkan data Jabatan, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

g. Dbedit g : digunakan untuk menampilkan data Jabatan, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

h. Combobox h : digunakan untuk pemilihan data unit kerja baru

38 i. Combobox i : digunakan untuk pemilihan data jabatan baru oleh

pengguna.

j. Date edit j : digunakan untuk memasukan data tanggal mutasi

ditetapkan.

k. Combobox k : digunakan untuk memilihh kategori pada sat

pencarian.

l. Edit l : digunakan untuk memasukan kata yang akan dicari sesuai

dengan kategori.

m. Dbgrid m : digunakan untuk menampilkan data dalam bentuk

tabel.

n. Menu tambah : digunakan untuk menambahkan data. o. Menu hapus : digunakan untuk mengurangi data. p. Menu Ubah : digunakan untuk mengubah data. q. Tombol cetak : digunakan untuk mencetak data

r. Tombol batal : digunakan untuk mebatalkan proses penambahan atau pengubahan data.

s. Tombol : simpan digunakan untuk menyimpan hasil penambahan data atau pengubahan data.

39 Gambar 4.8 Rancangan form pensiun

Fom pensiun merupakan antarmuka yang digunakan untuk pengolahan data pensiun. Proses pengolahan data yang terjadi antara lain tambah, hapus , dan ubah. Pada saat pengguna menambahkan data maka akan dimunculkan

form pegawai untuk diambil salah satu data yang akan di olah datanya pada

antarmuka pensiun. Adapun komponen dari form pensiun sebagai berikut : a. Dbgrid a :digunakan untuk menampilkan data dalam bentuk tabel.

b. Edit b: digunakan untuk menampilkan id pensiun. Pengguna tidak

bisa memasukan input pada kolom tersebut karena sudah otomatis. c. DbEdit c : digunakan untuk menampilkan data nama, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. d. DbEdit e : digunakan untuk menampilkan data NIP, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. e. Dbedit f : digunakan untuk menampilkan data Pangkat, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. f. Dbedit g : digunakan untuk menampilkan data Golongan, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. g. Dbedit h : digunakan untuk menampilkan data Jabatan, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. h. Date edit j : digunakan untuk memasukan data Tanggal mulai

mutasi.

i. Combobox k : digunakan untuk memilihh kategori pada sat

pencarian.

j. Edit l : digunakan untuk memasukan kata yang akan dicari sesuai

dengan kategori.

k. Menu tambah : digunakan untuk menambahkan data. l. Menu hapus : digunakan untuk mengurangi data.

40 m. Menu Ubah : digunakan untuk mengubah data.

n. Tombol cetak : digunakan untuk mencetak data

o. Tombol batal : digunakan untuk mebatalkan proses penambahan atau pengubahan data.

p. Tombol : simpan digunakan untuk menyimpan hasil penambahan data atau pengubahan data.

9. Form cuti

Gambar 4.9. Rancangan form cuti

Form cuti merupakan antarmuka yang digukan dalam peroses

pengolahan data cuti. Proses pengolahan data yang terjadi antara lain tambah, hapus , dan ubah. Pada saat pengguna menambahkan data maka akan dimunculkan form pegawai untuk diambil salah satu data yang akan di olah datanya pada antarmuka cuti. Adapun komponen dari form cuti sebagai berikut :

a. Combobox a : digunakan untuk memilihh kategori pada sat

pencarian.

b. Edit b : digunakan untuk memasukan kata yang akan dicari sesuai

dengan kategori.

41 d. Edit d: digunakan untuk menampilkan id cuti. Pengguna tidak bisa

memasukan input pada kolom tersebut karena sudah otomatis.

e. DbEdit e : digunakan untuk menampilkan data nama, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. f. DbEdit f : digunakan untuk menampilkan data NIP, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. g. Dbedit g : digunakan untuk menampilkan data Pangkat, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. h. Dbedit h : digunakan untuk menampilkan data Golongan, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. i. Dbedit i : digunakan untuk menampilkan data Jabatan, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. j. Edit j : digunakan untuk memasukan data jenis cuti.

k. Date edit k : digunakan untuk memasukkan data tanggal mulai.

l. Date edit l : digunkan untuk memasukan data tanggal selesai.

m. Menu tambah : digunakan untuk menambahkan data. n. Menu hapus : digunakan untuk mengurangi data. o. Menu Ubah : digunakan untuk mengubah data. p. Tombol cetak : digunakan untuk mencetak data

q. Tombol batal : digunakan untuk mebatalkan proses penambahan atau pengubahan data.

r. Tombol : simpan digunakan untuk menyimpan hasil penambahan data atau pengubahan data.

42 10. From riwayat seminar

Gambar 4.10 Rancangan form riwayat seminar

Form riwayat merupakan antarmuka yang digukan dalam peroses

pengolahan data riwayat seminar. Proses pengolahan data yang terjadi antara lain tambah, hapus , dan ubah. Pada saat pengguna menambahkan data maka akan dimunculkan form pegawai untuk diambil salah satu data yang akan di olah datanya pada antarmuka riwayat semina. Adapun komponen dari form riwayat seminar sebagai berikut :

a. DbEdit a : digunakan untuk menampilkan data nama, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. b. DbEdit b : digunakan untuk menampilkan data NIP, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. c. Dbedit c : digunakan untuk menampilkan data Golongan, untuk data

ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri. d. Edit d : digunakan untuk memasukan data nama seminar.

e. Edit e : digunakan untuk memasukan nama peranan.

43 g. Edit g : digunakan untuk memasuka data penyelenggara

h. Edit h : digunakan untuk memasukan data tempat.

i. Edit i : digunakan untuk memasukan data keterangan.

j. Dbgrid k : digunakan untuk menampilkan data riwayat seminar yang

diikuti dalam bentuk tabel.

k. Dbgrid l : digunakan untuk menampilkan data pegawai dalam bentuk tabel.

l. Combobox m : digunakan untuk memilih kategori pencarian.

m. Edit n : digunakan untuk mencari data yang diinginkan.

n. Menu tambah : digunakan untuk menambahkan data. o. Menu hapus : digunakan untuk mengurangi data. p. Menu Ubah : digunakan untuk mengubah data. q. Tombol cetak : digunakan untuk mencetak data

r. Tombol batal : digunakan untuk mebatalkan proses penambahan atau pengubahan data.

s. Tombol : simpan digunakan untuk menyimpan hasil penambahan data atau pengubahan data.

11. Form riwayat pelatihan

44

Form riwayat merupakan antarmuka yang digukan dalam peroses

pengolahan data riwayat pelatihan. Proses pengolahan data yang terjadi antara lain tambah, hapus , dan ubah. Pada saat pengguna menambahkan data maka akan dimunculkan form pegawai untuk diambil salah satu data yang akan di olah datanya pada antarmuka riwayat pelatihan. Adapun komponen dari form riwayat pelatihan sebagai berikut :

a. DbEdit a : digunakan untuk menampilkan data nama, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

b. DbEdit b : digunakan untuk menampilkan data NIP, untuk data ini

pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

c. Dbedit c : digunakan untuk menampilkan data Golongan, untuk data ini pengguna tidak bisa mengubahnya karena data ini sudah diambil langsung dari data pegawai ataupun dari data mutasi itu sendiri.

d. Edit d : digunakan untuk memasukan data nama pelatihan yang

diikuti.

e. Date edit e : digunakan untuk memasukkan data tanggal mulai

pelatihan.

f. Date edit f : digunakan untuk memasukkan data tanggal selesai

pelatihan.

g. Edit g : digunakan untuk memasukan data tempat pelaksanaan.

h. Edit h di gunakan untuk memasukan keterangan kegiantan.

i. Dbgrid i : digunakan untuk menampilkan data riwayat seminar yang

diikuti dalam bentuk tabel.

j. Dbgrid j : digunakan untuk menampilkan data pegawai dalam bentuk tabel.

k. Combobox k : digunakan untuk memilih kategori pencarian.

l. Edit l : digunakan untuk mencari data yang diinginkan.

m. Menu tambah : digunakan untuk menambahkan data. n. Menu hapus : digunakan untuk mengurangi data. o. Menu Ubah : digunakan untuk mengubah data.

45 p. Tombol cetak : digunakan untuk mencetak data

q. Tombol batal : digunakan untuk mebatalkan proses penambahan atau pengubahan data.

r. Tombol : simpan digunakan untuk menyimpan hasil penambahan data atau pengubahan data.

12. Form detail

Gambar 4.12 Rancangan form detail

Form detail merupakan form yang digunakan untuk menampilkan

identitas lengkap dari pegawai. Adapun komponen dari form deatil ini sebagi berikut :

a. Dbedit a: digunakan untuk menampilkan nama.

b. Dbedit b: digunakan untuk menampilkan NIP.

c. Dbedit c: digunakan untuk menampilkan tempat lahir.

d. Dbedit d: digunakan untuk menampilkan tanggal lahir.

e. Dbedit e: digunakan untuk menampilkan pangkat.

f. Dbedit f: digunakan untuk menampilkan golongan.

g. Dbedit g: digunakan untuk menampilkan jabatan.

h. Dbedit h: digunakan untuk menampilkan status pegawai.

46 j. Dbedit j: digunakan untuk menampilkan jenis kelamin.

k. Dbedit a: digunakan untuk menampilkan status perkawinan.

l. Dbmemo l : digunakan untuk menampilkan alamat.

m. Dbedit m : digunakan untuk menampilkan unit kerja

n. Dbedit n : digunakan untuk menampilkan tanggal mulai

o. Tombol edit : digunakan untuk membuka antarmuka tambah pegawai (edit).

p. Tombol menu : digunakan untuk kembali ke menu utama.

13. Form tambah akun

Gambar 4.13 Rancangan form tambah akun

Form tambah akun merupakan antarmuka yang digunakan untuk

melakuka proses pengolahan data penambahan akun. Adapun komponen dari form ini adalah:

a. Edit a: digunakan untuk memasukan data username.

b. Edit b : digunakan untuk memasukan data password.

c. Edit c : digunakan untuk memasukan data password untuk di

47 d. Combobox d : digunakan untuk memilih masukan data status.

e. Tombol batal : digunakan untuk membatalkan proses penambahan dan memunculkan kembali menu utama.

f. Tombol simpan : digunkan untuk menyimpan penambahan data.

14. Form Pengaturan akun

Gambar 4.14 Rancangan form pengaturan akun

Form pengaturan akun merupakan antarmuka yang digunakan untuk

proses mengolah data pengaturan akun. Proses ini merupakan proses merubah username atau password dari pengguna. Adapun komponen yang terdaapat pada form ini adalah sebagai berikut :

a. Edit a : digunakan untuk memasukan data username

b. Edit b : digunakan untuk memasukan data password.

c. Edit c : edit c digunakan untuk memasukkan username baru atau

password baru dari pengguna tergantung dari pilihan user saat di menu utama.

d. Edit d : digunakan untuk memasukan validasi password dari

pengguna. Edit ini akan di munculkan apabila proses yang terjadi adalah perubahan password. Jika proses yang terjadi adalah perubahan username maka edit ini akan di sembunyikan.

e. Tombol batal : digunakan untuk membatalkan proses pengaturan akun dan akan memunculkan menu utama.

f. Tombol simpan : digunakan untuk menyimpan hasil proses pengaturan akun.

48 15. Form tentang

Gambar 4.15 Rancangan form tentang

Form tentang meupakan antarmuka yang akan memberikan informasi

tentang SI kepagegawaian ini. Tidak ada komponan yang kusus dalam antarmuka ini hanya label yang digunakan untuk memberikan informasi.

Dalam dokumen SINTEM INFORMASI KEPEGAWAIAN di DINAS PE (Halaman 42-61)

Dokumen terkait