Perancangan Tampilan Perancangan Antarmuka

2. Pengkodean dan pengurutan data, dengan menggunakan suatu kunci primer. 3. Dialog untuk membuat user dalam menyediakan input, berupa keterangan agar user tidak salah dalam melakukan input data validasi pemeriksaan kesalahan, berupa untuk pemeriksaan apakah data yang di input sudah sesuai dengan kebutuhan sistem. 4. Metode untuk menampilkan validasi input jika kesalahan dalam input data.

3.7.4 Perancangan Tampilan

1. Tampilan Halaman Utama Rancangan tampilan halaman utama dibagi menjadi Lima bagian, dibagian atas terdapat header yang didalam nya terdapat area menu utama diantaranya Halaman utama, data penduduk, KTP, KK, visi dan misi serta komentar. Di bagian kiri dari header tersebut terdapat logo kota medan, dibawah header terdapat jquery slider berfungsi sebagai slide yang menampilkan foto dari kelurahan tersebut, dibagian bawah terdapat footer. Universitas Sumatera Utara Gambar 3.6 Rancangan Tampilan Halaman Utama 2. Tampilan Halaman Visi dan Misi Pada halaman ini juga terdapat header yang berisi menu dan logo,dibawah header terdapat content isi dan visi misi yang akan menampilkan visi dan misi kelurahan Titi Rantai, selanjutnya dibawahnya terdapat footer yang hanya berisikan informasi kontak dari kelurahan Titi Rantai. Gambar 3.7 Rancangan Tampilan Halaman Visi dan Misi MENU PROFIL KELURAHAN FOOTER LOGO SLIDE MENU VISI DAN MISI FOOTER lOGO Universitas Sumatera Utara 3. Tampilan Halaman Data Penduduk Rancangan tampilan halaman data penduduk hanya berisikan penduduk yang terdaftar dalam kelurahan Titi Rantai, kemudian diatasnya terdapat header yang berisikan menu dan logo kota medan. Gambar 3.8 Rancangan Tampilan Halaman Data Penduduk 4.Tampilan Halaman KTP dan KK Rancangan halaman KTP dan KK akan sama dikarenakan pembuatan KTP dan KK memiliki kemiripan, dibagian konten terdapat dua bagian tabel diantaranya tabel untuk persyaratan dan tabel sebuah link untuk menuju ke halaman pembuatan KTP dan KK, hal tersebut akan menjadi efektif untuk user menginputkan permohonan KTP dan KK. MENU DATA PENDUDUK FOOTER LOGO Universitas Sumatera Utara Gambar 3.9 Rancangan Tampilan Pertama Halaman KTP dan KK Gambar 3.9.1 Rancangan Tampilan Kedua Halaman KTP dan KK FORM PENDAFTARAN PEMBUATAN KTP DAN KK KIRIM RESET MENU LINK HALAMAN FORM INPUT KTP DAN KK FOOTER LOGO PERSYARATAN KTP DAN KK Universitas Sumatera Utara 5.Tampilan Menu Kontak Menu kontak ini berisikan halaman untuk mengirimkan pesan kepada kelurahan atau admin. Gambar 4.0 Tampilan Halaman Kontak 6. Tampilan Menu Admin Rancangan tampilan menu admin terdiri dari dua bagian diantaranya header dan konten, pada bagian header terdapat logo, konten hanya berisikan menu-menu yang dapat dipilih admin diantaranya menu untuk mengedit, menghapus dan menambah data. Gambar 5.0 Tampilan Menu Admin MENU FOOTER LOGO FORM PESAN MENU PROFIL ADMIN FOOTER LOGO Universitas Sumatera Utara BAB 4 IMPLEMENTASI SISTEM

4.1 Implementasi Sistem