A.

Desain input output

Desain Input output pada sistem ini terdapat dua bagian, yaitu desain untuk admin dan
desain pengguna. Desain untuk admin adalah sebagai berikut :

1. Desain Halaman Login

Halaman ini digunakan untuk masuk ke dalam sistem, maka admin harus login
dengan memasukkan username dan password, desain di tunjukkan pada gambar

2. Desain Halaman Home

Halaman Home adalah halaman yang terbuka setelah admin berhasil melakukan
login. Halaman ini digunakan untuk memberikan informasi letak dan titik dari
rumah sakit dan puskesmas, juga terdapat informasi mengenai jenis rumah sakit
bertype A.
3. Perancangan Halaman Pemetaan
Halaman Pemetaan ini digunakan admin untuk mengelola informasi data rumah
sakit dan puskesmas. Admin dapat menambahkan, melihat, mengedit, dan
menghapus data rumah sakit pada sistem melalui halaman ini. Admin juga dapat
pelakukan rumah sakit berdasarkan kecamatan melalui form pencarian.
4. Perancangan Halaman Rute

Pada Halaman Rute ini digunakan untuk melakukan proses pencarian jarak
terdekat dengan memasukkan lokasi awal dan lokasi tujuan.

5. Perancangan Halaman Pengguna

Halaman pengguna digunakan untuk mengelola data pengguna dari sistem,
dimana di dalam prosesnya admin bisa menambahkan, mengubah, dan
menghapus pengguna dari database.
 6. Perancangan Halaman Logout
Menu Logout merupakan menu yang digunakan oleh admin untuk keluar dari
sistem pemetaan rumah sakit dan puskesmas serta pencarian jarak terdekat.

Desain input output untuk pengguna adalah sebagai berikut :

1. Perancangan Halaman Home

Halaman Home merupakan halaman pertama saat pengguna mulai mengakses sistem ini.
Halaman ini berisikan informasi mengenai titik dan lokasi dari rumah sakit dan
puskesmas. Pengguna tidak perlu login supaya mempermudah siapapun untuk melakukan
pencarian.
2. Perancangan Halaman Pemetaan
Pada halaman pemetaan digunakan untuk melakukan pemetaan rumah sakit dan
puskesmas berdasarkan kecamatan. Pada halaman ini juga merupakan halaman yang
berisi informasi dan daftar rumah sakit dan puskesmas yang ada si Surakarta.

3. Perancangan Halaman Rute

Pada halaman rute ini pengguna melakukan proses pencarian jarak terdekat. Pengguna
harus memasukkan lokasi awal dan lokasi tujuan yang merupakan lokasi rumah sakit dan
puskesmas. Adapun nanti hasil dari prosesnya akan ditampilkan yang meliputi jarak
tempuh waktu tempuh , nama jalan yang dilalui dan juga rute perjalanan.
B. Desain Antarmuka
Implementasi pembuatan sistem pemetaan dan pencarian jarak terdekat rumah sakit dan
puskesmas menggunakan algoritma Djikstra adalah berbentuk sebuah web application
dengan menggunakan bahasa pemrograman PHP. Adapun implementasi dari sistem
adalah sebagai berikut :
1. Tampilan Halaman Login
User diminta memasukkan username dan password, setelah berhasil maka halaman
akan dialihkan pada halaman utama admin, jika belum berhasil maka tetap berada
pada halaman login tersebut. Tampilan halaman login terdapat pada gambar

2. Tampilan Halaman Home Admin

Halaman home ini merupakan halaman pertama saat admin berhasil melakukan login.
Terdapat empat menu utama yaitu Home, Pemetaan, Rute, dan Pengguna. Pada
halaman home terdapat gambar peta Surakarta yang berisi tanda lokasi rumah sakit
dan puskesmas seperti gambar
3. Tampilan Halaman Pemetaan Admin
Halaman pemetaan ini adalah halaman yang digunakan admin untuk melakukan
pemetaan rumah sakit dan puskesmas berdasarkan kecamatan. Pada halaman ini juga
merupakan menu data rumah sakit dan puskesmas dimana admin bisa mengatur data
rumah sakit dan puskesmas yang ada dengan perintah tambah, ubah, dan hapus.
Tampilan halaman pemetaan admin dijelaskan pada gambar
4. Tampilan Halaman Rute Admin
Halaman rute berguna untuk melakukan pencarian jarak terdekat rumah sakit dan
puskesmas. Pada halaman rute ini terdapat tiga kolom utama, yaitu Peta, Rute, Jarak
dan Waktu terlihat pada Gambar

5. Tampilan Halaman Pengguna

Halaman Pengguna adalah halaman yang digunakan untuk mengatur user admin,
misal admin ingin menambahkan, mengurangi, mengubah atau menghapus data
admin, tampilan terdapat pada gambar
Adapun implementasi dari sistem untuk user atau pengguna biasa adalah sebagai
berikut :
1. Tampilan Halaman Masuk Pengguna
Halaman masuk merupakan halaman yang muncul setelah pengguna mengetikkan
alamat https://localhost/dijekstra pada address bar. Untuk pengguna tidak perlu
memasukkan username dan password, sehingga langsung memilih masuk tanpa
login.

2. Tampilan Halaman Home Pengguna

Halaman home yang diperuntukkan untuk pengguna ini berisi informasi daftar
pelayanan kesehatan type A. Tampilan halaman home terdapat pada gambar
3. Tampilan Halaman Pemetaan Pengguna
Halaman pemetaan merupakan halaman yang diperuntukkan untuk pengguna
melakukan pemetaan atau pencarian rumah sakit dan puskesmas berdasarkan
kecamatan. Pada halaman ini terdapat dua kolom utama yaitu form pencarian dan
pemetaan yang berisi data rumah sakit dan puskesmas yang dapat diakses oleh
pengguna, yang ditunjukkan pada gambar

Kemudian untuk melakukan pemetaan rumah sakit dan puskesmas, pengguna

harus memasukkan nama kecamatan di form pencarian lalu pilih cari. Setelah itu
sistem akan memberi informasi mengenai rumah sakit dan puskesmas mana saja
yang berada di wilayah kecamatan tersebut, dijelaskan pada gambar
 Sedangkan untuk melihat secara detail informasi rumah sakit maupun puskesmas,
pengguna bisa memilih rumah sakit atau puskesmas yang ada di kolom pemetaan,
kemudian pilih tombol lihat. Setelah itu sistem akan melihatkan informasi detail
rumah sakit dan puskesmas serta peta titik lokasi rumah sakit maupun puskesmas,
yang ditunjukkan pada gambar

4. Tampilan Halaman Rute Pengguna

Pada halaman rute terdapat penanda waktu yaitu jam dan tanggal saat sedang
diakses. Jam ini yang menentukan densitas waktu dari sistem yang berpengaruh
juga dengan kecepatan yang digunakan. Pada halaman ini juga terdapat tiga
kolom utama yaitu peta, rute, lalu jarak dan waktu yang ditampilkan pada gambar.
 Kemudian untuk menentukan rute terdekat, pada kolom rute pengguna harus
memasukkan lokasi awal dan memilih lokasi tujuan yakni lokasi rumah sakit atau
puskesmas yang dituju

Setelah melakukan pemilihan lokasi awal dan lokasi tujuan yang akan dikunjungi,
saat itulah ssistem secara otomatis akan melakukan proses algoritma Djikstra
untuk menentukan rute terdekat. Setelah proses selesai, sistem akan menampilkan
informasi – informasi berupa ruteyang akan dilalui dari lokasi awal sampai lokasi
tujuan yang digambarkan dengan garis biru, kemudian jarak tempuh dan waktu
tempuh, dan juga nama jalan yang di lalui untuk sampai ke lokasi tujuan.
Tampilan hasil pencarian rute dijelaskan pada gambar