Perancangan Antarmuka Halaman Login

Proses Identifikasi

3.2.3. Perancangan Struktur Menu

3.2.4.1. Perancangan Antarmuka Halaman Login

56 3.2.4.2. Perancangan Antarmuka Superadmin

1. Perancangan Antarmuka Menu Halaman Utama

Gambar 3.20 Perancangan antarmuka halaman utama superadmin 2. Perancangan Antarmuka Menu User

a. Perancangan Antarmuka Menu Tambah User

57 b. Perancangan Antarmuka Menu Ubah User

Gambar 3.22 Perancangan antarmuka ubah1 user

58 c. Perancangan Antarmuka Menu Tampil User

59 3. Perancangan Antarmuka Menu Pelaksana

a. Perancangan Antarmuka Menu Tambah Pelaksana

60 b. Perancangan Antarmuka Menu Ubah Pelaksana

61 Gambar 3.27 Perancangan antarmuka ubah2 pelaksana

62 c. Perancangan Antarmuka Menu Tampil Pelaksana

63 4. Perancangan Antarmuka Menu Pemohon

a. Perancangan Antarmuka Menu Tambah Pemohon

64 b. Perancangan Antarmuka Menu Ubah Pemohon

65 Gambar 3.31 Perancangan antarmuka menu ubah2 pemohon

66 c. Perancangan Antarmuka Menu Tampil Pemohon

67 5. Perancangan Antarmuka Menu Sumur

a. Perancangan Antarmuka Menu Tambah Sumur

68 b. Perancangan Antarmuka Menu Ubah Sumur

69 Gambar 3.35 Perancangan antarmuka ubah2 sumur

70 c. Perancangan Antarmuka Menu Tampil Sumur

G Gambar 3.36 Perancangan antarmuka menu tampil sumur

6. Perancangan Antarmuka Menu SubSumur

a. Perancangan Antarmuka Menu Tambah SubSumur

71 b. Perancangan Antarmuka Menu Ubah SubSumur

Gambar 3.38 Perancangan antarmuka ubah1 subsumur

72 c. Perancangan Antarmuka Menu Tampil SubSumur

Gambar 3.40 Perancangan antarmuka menu tampil1 subsumur

73

3.2.4.3. Perancangan Antarmuka Admin

1. Perancangan Antarmuka Menu Halaman Utama

Gambar 3.42 Perancangan antarmuk halaman utama admin 2. Perancangan Antarmuka Menu Provinsi

2.1. Perancangan Antarmuka Menu Tambah Provinsi

74 2.2. Perancangan Antarmuka Menu Ubah Provins

Gambar 3.44 Perancangan antarmuka ubah1 provinsi

75 2.3. Perancangan Antarmuka Menu Tampil Provinsi

Gambar 3.46 Perancangan antarmuka menu tampil provinsi 3. Perancangan Antarmuka Menu Kota/Kabupaten

3.1.Perancangan Antarmuka Menu Tambah Kota/Kabupaten

76 3.2.Perancangan Antarmuka Menu Ubah Kota/Kabupaten

Gambar 3.48 Perancangan antarmuka ubah1 kota/kabupaten

77 3.3.Perancangan Antarmuka Menu Tampil Kota/Kabupaten

Gambar 3.50 Perancangan antarmuka menu tampil kota/kabupaten 4. Perancangan Antarmuka Menu Kecamatan

4.1.Perancangan Antarmuka Menu Tambah Kecamatan

78 4.2.Perancangan Antarmuka Menu Ubah Kecamatan

Gambar 3.52 Perancangan antarmuka ubah1 kecamatan

79 4.3.Perancangan Antarmuka Menu Tampil Kecamatan

Gambar 3.54 Perancangan antarmuka tampil kecamatan 5. Perancangan Antarmuka Menu Desa/Kelurahan

5.1. Perancangan Antarmuka Menu Tambah Desa/Kelurahan

80 5.2.Perancangan Antarmuka Menu Ubah Desa/Kelurahan

Gambar 3.56 Perancangan antarmuka ubah1 desa/kelurahan

81 5.3.Perancangan Antarmuka Menu Tampil Desa/Kelurahan

Gambar 3.58 Perancangan antarmuka menu tampil desa/kelurahan 3.2.4.4. Perancangan Antarmuka Operator

1. Perancangan Antarmuka Menu Halaman Utama

82 2. Perancangan Antarmuka Menu SubSumur

a. Perancangan Antarmuka Menu Tambah SubSumur

83 b. Perancangan Antarmuka Menu Ubah SubSumur

84 No: F039 Klik Ubah menampilkan M006, M161,menuju F015. Validasi menampilkan M121/M122/M123/ M124/M125/M126/ M127/M128/M129/ M130/M131/M132/ M133/M134/M135/ M136/M137/M138/ M139

Klik Cari menampikan data yang ingin diubah , validasi menampilkan M119, menuju F038

Ukuran 1024x1300, warna latar abu4abu, Font 12, 20 arial warna hitam, Nama Form : F039

LOGO

BADAN GEOLOGI – PUSAT SUMBER DAYA AIR TANAH DAN GEOLOGI LINGKUNGAN (PAG) SISTEM EVALUASI PENGEBORAN AIR TANAH BERBASIS WEB

Minggu, 11 Desember 2011

Copyright © by Meilia R, Turyni N, Chindy VR UNIKOM 2011 Cari Pilih No Rektek P Pilih Tanggal Ubah Kembali ! ! " # #

85 c. Perancangan Antarmuka Menu Tampil SubSumur

Gambar 3.63 Perancangan antarmuka tampil1 subsumur

86 3.2.5. Perancangan Pesan

Tabel 3.12 Perancangan pesan No

Pesan ^{Isi Pesan Terdapat Pada Form}

M007 Provinsi id harus diisi dan berupa angka! F003, F008, F009 M008 Provinsi id … sudah ada! F003

M009 Nama provinsi harus diisi F003 M010 Nama provinsi sudah ada! F003 M011 Luas wilayah harus diisi dan berupa angka! F003 M012 Jumlah penduduk harus diisi dan berupa angka! F003 M015 Data dengan Provinsi id … tidak ditemukan F006

M021 Kota/Kabupaten id harus diisi dan berupa angka! F007, F043, F045 M022 Kota/Kabupaten id … sudah ada! F007

M023 Nama Kota/Kabupaten harus diisi! F007, F008, F009 M024 Nama Kota/Kabupaten sudah ada! F007, F008, F009 M025 Provinsi id ... tidak ada! F007, F008, F009 M028 Data dengan Kota/Kabupaten id … tidak ditemukan F010

M032 Kecamatan id harus diisi dan berupa angka! F043, F011,F013 M033 Kecamatan id … sudah ada! F043

M034 Nama Kecamatan harus diisi! F043, F045 M035 Nama Kecamatan sudah ada! F043, F045 M036 Kota/Kabupaten id ... Tidak ada! F043, F045 M039 Data dengan Kecamatan Id … tidak ditemukan F046 M043 Desa/Kelurahan id harus diisi dan berupa angka! F011, M044 Desa/Kelurahan id … sudah ada! F011 M045 Nama Desa/Keluraha harus diisi! F011 M046 Nama Desa/Kelurahan sudah ada! F011, F013 M047 Desa/Kelurahan id … tidak ada! F011, F013 M050 Data dengan Desa id … tidak ditemukan F014

M054 username harus diisi! F016

M055 Username sudah ada! F016

M056 password harus diisi! F016

M059 password lama harus diisi! F017, F018 M060 Password lama Anda salah! F017, F018 M061 Konfirmasi password baru harus diisi! F017, F018 M062 Konfirmasi password baru Anda tidak sama! F017, F018 M066 Pelaksana id harus diisi dan berupa angka! F020, f024,F026

M067 Pelaksana id sudah ada! F020

87 No

Pesan ^{Isi Pesan Terdapat Pada Form}

M069 Alamat harus diisi! ^{F020, F022, F024, F026,} F028

M070 provinsi harus dipilih! ^{F020, F022, F024, F026,} F028

M071 Kota/Kabupaten harus dipilih! ^{F020, F022, F024, F026,} F028

M072 Kecamatan harus dpilih! ^{F020, F022, F024, F026,} F028

M073 No SIUJK harus diisi dan berupa angka! F020, F022 M074 Tanggal SIUJK harus diisi! F020, F022 M075 Tanggal SIUJK exp harus diisi! F020, F022 M076 No SBU Installasi harus diisi! F020, F022 M077 Tanggal SBU Instalasi Bor harus diisi! F020, F022 M078 Tangggal SBU Exp harus diisi! F020, F022 M079 Nama Juru Bor harus diisi! F020, F022 M080 No ST Juru Bor harus diisi dan berupa angka! F020, F022 M081 Tanggal ST Juru Bor Exp harus diisi! F020, F022 M085 Data dengan Pelaksana Id … tidak ditemukan F023 M088 Pemohon id harus diisi dan berupa angka!! F024, F028 M089 Pemohon id … sudah ada!! F024, F028 M090 Nama Pemohon harus diisi! F024, F026 M091 No Telepon harus diisi dan berupa angka! F024 M092 No faksimili harus diisi dan berupa angka! F024 M093 Jenis Usaha Id harus diisi dan berupa angka! F024 M094 Jenis Usaha harus diisi! F024 M095 No Surat Permohonan harus diisi! F024 M096 Tanggal Surat Permohonan harus diisi! F024 M097 Sumur ke harus diisi dan berupa angka! F024

M007 Provinsi id harus diisi dan berupa angka! F003, F008, F010 M008 Provinsi id … sudah ada! F003

M009 Nama provinsi harus diisi F003 M010 Nama provinsi sudah ada! F003 M011 Luas wilayah harus diisi dan berupa angka! F003 M012 Jumlah penduduk harus diisi dan berupa angka! F003 M015 Data dengan Provinsi id … tidak ditemukan F006

M021 Kota/Kabupaten id harus diisi dan berupa angka! F007, F043, F046 M022 Kota/Kabupaten id … sudah ada! F008

M023 Nama Kota/Kabupaten harus diisi! F007, F008, F009 M024 Nama Kota/Kabupaten sudah ada! F007, F008, F009 M025 Provinsi id ... tidak ada! F007, F008, F009

88 No

Pesan ^{Isi Pesan Terdapat Pada Form}

M028 Data dengan Kota/Kabupaten id … tidak ditemukan F011

M032 Kecamatan id harus diisi dan berupa angka! F043, F011,F014 M033 Kecamatan id … sudah ada! F044

M034 Nama Kecamatan harus diisi! F043, F045 M035 Nama Kecamatan sudah ada! F043, F045 M036 Kota/Kabupaten id ... Tidak ada! F043, F045 M039 Data dengan Kecamatan Id … tidak ditemukan F047 M043 Desa/Kelurahan id harus diisi dan berupa angka! F011, M044 Desa/Kelurahan id … sudah ada! F011 M045 Nama Desa/Keluraha harus diisi! F011 M046 Nama Desa/Kelurahan sudah ada! F011, F013 M047 Desa/Kelurahan id … tidak ada! F011, F013 M050 Data dengan Desa id … tidak ditemukan F014

M054 username harus diisi! F016

M055 Username sudah ada! F016

M056 password harus diisi! F016

M059 password lama harus diisi! F017, F018 M060 Password lama Anda salah! F017, F018 M061 Konfirmasi password baru harus diisi! F017, F018 M062 Konfirmasi password baru Anda tidak sama! F017, F018 M066 Pelaksana id harus diisi dan berupa angka! F020, f024,F027

M067 Pelaksana id sudah ada! F021

M068 Nama Pelaksana harus diisi! F020, F023

M069 Alamat harus diisi! ^{F020, F022, F024, F026,} F028

M070 provinsi harus dipilih! ^{F020, F022, F024, F026,} F028

M071 Kota/Kabupaten harus dipilih! ^{F020, F022, F024, F026,} F028

M072 Kecamatan harus dpilih! ^{F020, F022, F024, F026,} F028

M073 No SIUJK harus diisi dan berupa angka! F020, F022 M074 Tanggal SIUJK harus diisi! F020, F022

89 Gambar 3.65 Perancangan Pesan1

90

!

Peringatan

Kota/Kabupaten Id yang ingin dihapus belum diisi M029

!

Peringatan

kecamatan id yang ingin dicari belum diisi

M037

i

Informasi

data dengan Kecamatan id D telah dihapus M042

desa/kelurahan Id yang ingin dihapus belum diisi M051

i

Informasi

M052

data dengan desa/kelurahan id D telah dihapus M053

$

Username yang ingin dicari belum diisi

M057

!

Peringatan

i

Informasi

Username D tidak ditemukan M058

i

Informasi

data dengan Kota/Kabupaten id D yang ingin dihapus tidak

ditemukan M030

i

Informasi

data dengan Kota/Kabupaten id .. telah dihapus M031

i

Informasi kecamatan id ... tidak ditemukan M038

!

Peringatan

kecamatan id yang ingin dicari belum diisi M040

i

Informasi desa/kelurahan id ... tidak ditemukan M049

i

Informasi

data dengan Kecamatan id ... yang ingin dihapus tidak

ditemukan M041

!

Peringatan

desa/kelurahan id yang ingin dicari belum diisi M048

!

Peringatan

i

Informasi

91

!

Peringatan

username D tidak ada M063

!

Peringatan

Pelaksana Id yang ingin dicari belum diisi

M082

i

Informasi

Pemohon Id yang ingin dicari belum diisi

M098

Data dengan Pemohon Id D telah dihapus M102

i

Informasi

M112

No Registrasi Sumur yang ingin dhapus belum diisi M113

$

Data dengan No Registrasi Sumur … telah dihapus

M115

!

Peringatan

i

Informasi

No Rektek P yang ingin dicari belum diisi

M119

i

Informasi

Username yang ingin dihapus belum diisi

M064

i

Informasi

Data dengan username D telah dihapus M065

i

Informasi Pelaksana Id D tidak ditemukan M083

!

Peringatan

Pelaksana id yang ingin dhapus belum diisi

M084

i

Informasi

Pemohon id yang ingin dhapus belum dii

M100

i

Informasi

Data dengan Pelaksana Id D telah dihapus M086

!

Peringatan

Pemohon Id D tidak ditemukan M099

!

Peringatan

!

Peringatan

92

!

Peringatan

Tidak ada data yang dipilih M141

Data kota/kabupaten berhasil ditambahkan M145

i

Informasi

Data kota/kabupaten berhasil diubah

M149

Data user berhasil ditambahkan M152

i

Informasi

M153

Data pemohon berhasil ditambahkan M154

$

Data sumur berhasil ditambahkan

M155

i

Informasi

Data subsumur berhasil ditambahkan M156

i

Informasi

D data telah dihapus M142

i

Informasi

Data provinsi berhasil ditambahkan M144

i

Informasi

Data kecamatan berhasil ditambahkan M146

Data desa/kelurahan berhasil ditambahkan M147

i

Informasi

Data desa/kelurahan berhasil diubah

M151

i

Informasi

Data provinsi berhasil diubah M148

Data kecamatan berhasil diubah M150

i

Informasi

i

Informasi

i

Informasi

i

Informasi

i

Informasi

i

Informasi

93 Gambar 3.69 Perancangan Pesan5

94 3.2.6. Jaringan Sematik

Jaringan semantik adalah gambaran pengetahuan yang menunjukkan hubungan antar objek yang berupa form, terdiri dari lingkaran-lingkaran yang dihubungkan dengan anak panah yang menunjukkan objek dan informasi tentang objek-objek tersebut. Jaringan sematik implementasi dari menu-menu pada Sistem Evaluasi Pengeboran Air Tanah Berbasis Web ini terdiri dari 3 jaringan semantik yaitu jaringan semantik admin, jaringan semantik superadmin dan jaringan semantik operator.

1. Jaringan Sematik Admin

F001 F002 F003 M006,M007,M008,M009, M010,M011,M012,M144 F004 M013, M004 F005 M006,M009,M010,M011,M012. M013, M014,M148 F006 M013,M015,M016,M017,M018,M019 F007 M006,M07,M021,M022,M023,M024,M025,M145 F008 M026, M027 F009 M006,M007,M023,M024,M025,M026,M027,M149 F010 M016,M026,M028,M029,M030,M031 F043 M006,M021,M032,M033,M034,M035,M036,M146 F044 M0037, M038 F045 M006,M021,M034,M035,M036,M037,M038,M150 F046 M016,M037,M039,M040,M041,M042 F011 M006,M032,M043,M044,M045,M046,M047,M147 F012 M048, M049 F013 M006.M032,M045,M046,M047,M048,M49,M151 F014 M016, M048, M050, M051,M052, M053

95 2. Jaringan Sematik Superadmin

F001 F015 F016 M006,M032,M054,M055,M056,M152 F017 M057, M058 F018 M006, M057, M058, M059, M060, M061, M062,M157 F019 M016, M057, M063, M064, M065,M162 F020 M006,M066,M067,M068,M069,M070,M071,M072, M073,M074,M075,M076,M077,M078,M079,M080,M081,M153 F021 M082,M083 F022 M006,M068,M069,M070, M071,M072,M073,M074, M075,M076,M077,M078,M079 ,M080,M081,M082,M083,M158 F023 M016,M082,M083,M084,M085,M086 F028 M006,M069,M070,M071,M072,M088,M089,M103, M104,M105,M106,M107,M108,M109,M110,M111,M155 F029 M112 F030 M006,M088,M105,M107,M108,M109,M110,M111,M112,M160 F031 M016,M112,M013,M014,M015,M163 F032 M006,M103,M116,M117,M118,M156 F033 M119,M164 F034 M006,M0118,M119,M120,M161 F035 M119,M140 F024 M006,M066,M069,M070,M071,M072,M087,M088,M089, M090,M091,M092,M093,M094,M095,M096,M097,M154 F025 M098,M099 F026 M006,M066,M069,M070, M071,M072,M090,M091,M092, M093,M094,M095,M096, M097,M098,M099,M159 F027 M016,M099,M098,M100,M101,M102 F036 M016,M119,M140,M141,M142

96 3. Jaringan sematik Operator

97 3.2.7. Perancangan Prosedural

Sebagai langkah terakhir dalam perancangan yaitu merancang prosedural yang akan diimplementasikan ke dalam sistem. Prosedur ini akan digunakan sebagai algoritma dasar dalam mengkodekan prosedur yang ada. Adapun perancangan prosedural untuk pembangunan Sistem Evalusi Pengeboran Air Tanah Berbasis Web yang akan dibangun adalah sebagai berikut :

1. Prosedural Login

Admin, Superadmin dan operator melakukan login terlebuh dahulu untuk dapat memasuki aplikasi ini. Pengguna menginputkan username dan password. Kemudian system memeriksa apakah username dan password valid. Jika valid maka menampilkan halaman utama admin F002, untuk superadmin akan menampilkan F015 dan untuk operator akan menampilkan F042. Jika tidak valid maka akan menampilkan pesan validasi.

Username dan Password

Pemeriksaan data login oleh sistem

Data login valid? tidak Menampilkan Form F002/F015/ F042 ya Mulai Selesai Menampilkan pesan validasi

98 2. Prosedural Tambah Data

Admin, superadmin dan operator melakukan tambah data dengan menginputkan data baru. Data baru disimpan. Jika pengguna tidak yakin untuk disimpan maka akan kembali menginputkan data baru. Jika yakin untuk menyimpan data baru tadi maka sistem memeriksa idnya apakah terdapat id yang sama, kemudian jika tidak dan data lengkap maka data disimpan.

99 3. Prosedural Ubah Data

Admin, superadmin dan operator melakukan ubah data dengan menginputkan id data yang ingin diubah. Kemudian sistem melakukan pencarian id yang diinputkan pengguna. Jika data tidak ditemukan maka pengguna menginputkan kembali id. Jika data ditemukan ,sistem menampilkan data tersebut. Pengguna dapat mengubah data tersebut. Jika data tidak ingin diubah maka kembali pada inputan id. Jika data diubah, maka sistem akan mengupdate data tersebut.

100 4. Prosedural Tampil Data

Admin, superadmin dan operator dapat melihat data yang ada pada proses menampilkan data. Sistem menampilkan data dari database, jika data tidak ada maka akan menampilkan pesan bahwa data tidak ditemukan. Jika data ditemukan maka akan ditampilkan kelayar.

101 5. Prosedural Cari Data

Admin, superadmin dan operator dapat mencari data melalui menu tampil data. Data ditampilkan oleh sistem. Kemudian user menginputkan id data yang dicari. Pencarian dilakukan oleh sistem, jika data tidak ditemukan maka akan menampilkan pesan validasi. Jika data ditemukan maka sistem akan menampilkannya kelayar.

102 6. Prosedural Hapus Data

Admin, superadmin dan operator dapat melakukan proses hapus data. Sistem menampilkan data terlebih dahulu. Kemudian pengguna menginputkan id data yang ingin dihapus. Jika data tidak jadi dihapus maka sistem akan menampilkan seluruh data. Jika data ingin dihapus kemudian dilakukan pencarian data tersebut oleh sistem. Jika data tidak ditemukan maka sistem akan menampilkan pesan bahwa data tidak ditemukan. Jika data ditemukan maka sistem akan langsung menghapus data tersebut.

103 7. Prosedural Unduh Data

Superadmin dan operator dapat melakukan unduh data. Sistem akan menampilkan data terlebih dahulu. Kemudian pengguna mengklik icon unduh data yang berbentuk icon pdf, jika data tidak jadi diunduh maka akan kembali pada form tampil data. Jika data diunduh maka sistem akan mengunduh data tersebut.

104

3.3. Implementasi Sistem

Implementasi sistem menjelaskan pengimplementasian dari sistem yang telah dibuat. Implementasi yang dijelaskan berupa implementasi perangkat keras, implementasi perangkat lunak, implementasi basis data dan implementasi proses.