Anda di halaman 1dari 58

LAPORAN PROGRAM PROFESIONAL

RANCANG BANGUN WEBSITE PROFIL DESA KALINAPU


KECAMATAN PAJU EPAT KABUPATEN BARITO TIMUR PROVINSI
KALIMANTAN TENGAH

DISUSUN OLEH :

RAMADANI

NIM. DBC 118 025

DOSEN PEMBIMBING :

DEDDY RONALDO,ST.,MT

NIP. 198012262008121002

JURUSAN/PROGRAM STUDI TEKNIK INFORMATIKA


FAKULTAS TEKNIK
UNIVERSITAS PALANGKA RAYA
TAHUN 2021
BAB I
PENDAHULUAN

1.1. LATAR BELAKANG


Pada Tahun 1965 sampai dengan Tahun 1999 Desa Kalinapu masih berstatus
dusun yang merupakan bagian dari Desa TampuLangit dengan dipimpin Kepala
Dusun yang pertama Tahun 1999 adalah Yasman S. sampai pada tahun 2008,
kemudian dilanjutkan dengan Kepala Dusun yang kedua Tahun 2008 yaitu
Darkuni sampai pada Tahun 2009.
Selanjutnya pada tahun 2009 Dusun Kalinapu ditetapkan menjadi Desa
Kalinapu dengan dipimpin oleh Pj. Kades Taufikur Rahman selama 11 bulan dan
dilanjutkan oleh M. Rahim selama 8 bulan. Kemudian berdasarkan keputusan
Bupati nomor 206 Tahun 2010 mengenai pengesahan Kepala Desa di wilayah
kecamatan Paju Epat Kabupaten Barito Timur Masa Bhakti 2010-2016 maka
diadakan pemilihan Kepala Desa tangggal 8 Januari 2010. Dan yang terpilih oleh
masyarakat Desa Kalinapu adalah Bapak Yasman S. yang dilantik tanggal 5 Mei
2010 oleh Camat Paju Epat yang pada saat itu menjabat adalah Ina Karuniani,
S.Sos dan atas Nama Bupati Barito Timur Drs. H. Zain Alkim.
Kemudian keadaan geografis desa ini batas wilayah pada sebelah utara
adalah Kecamatan Karau Kuala Kabupaten Barito Selatan, Batas wilayah sebelah
Timur Desa Tampulangit Kecamatan Paju Epat, Batas wilayah sebelah Selatan
Desa Telang Baru Kecamatan Paju Epar, Dan Batas wilayah sebelah Barat Desa
Lehai Kecamatan Dusun Hilir Kabupaten Barito Selatan.
Seiring berkembangnya zaman era informasi dan komunikasi yang semakin
pesat dan di imbangi oleh perkembangan teknologi serta internet yang semakin
canggih, hampir sebagian besar masyarakat mulai membutuhkan dan bergantung
kepada cara informasi dan komunikasi yang canggih. Perkembangan teknologi
dan internet yang sangat pesat membawa keuntungan pula bagi beberapa sektor,
salah satunya sektor media dalam penyampaian informasi. akan tetapi desa
Kalinapu kecamatan Paju Epat Kabupaten Barito Timur Provinsi Kalimantan
Tengah ini belum mempunyai media untuk menyampaikan informasi Profil dari
desanya tersebut.
Berdasarkan latar belakang diatas penulis memutuskan untuk membuat
sebuah Profil Desa Kalinapu berbasis Website dengan judul “Rancang Bangun
Website Desa Kalinapu Kecamatan Paju Epat Kabupaten Barito Timur Provinsi
Kalimantan Tengah”. Dengan adanya pembuatan website ini, penulis berharap
mempermudah masyarakat untuk mendapatkan informasi dan data desa untuk
berbagai macam keperluan.

1.2. RUMUSAN MASALAH


Berdasarkan latar belakang yang telah diuraikan sebelumnya, maka rumusan
masalah yang akan dibahas yaitu bagaimana rancang bangun website Profil Desa
Kalinapu Kecamatan PajuEpat Kabupaten BaritoTimur Provinsi
KalimantanTengah Berbasis Website dan BUMdes.

1.3. BATASAN MASALAH


Berikut merupakan batasan masalah umum pada pembuatan Profil Desa
Kalinapu Kecamatan PajuEpat Kabupaten BaritoTimur Provinsi
KalimantanTengah Berbasis Website , antara lain.
a) Aplikasi ini berisi informasi sejarah desa, visi misi, BUMdes dan lokasi pada
Desa Kalinapu Kecamatan Paju Epat Kabupaten Barito Timur Provinsi
Kalimantan Tengah.
b) Aplikasi ini di buat berbasis website.
c) Applikasi ini dibangun dengan menggunakan PHP sebagai bahasa
pemrongraman dan MySQL sebagai database server.

1.4. TUJUAN
Adapun tujuan dari pembuatan website ini ialah :
a. Merancang dan membangun sebuah Profil Desa Kalinapu berbasis website.
b. Memenuhi persyaratan dalam menyelesaikan Program Profesional Jurusan
Teknik Informatika Fakultas Teknik Universitas Palangka Raya Semester
Genap Tahun 2020/2021.

1.5. MANFAAT
Adapun manfaat dari pembuatan aplikasi website ini adalah :
a. Sumber data yang lengkap
Website digunakan sebagai pemberi informasi segala hal tentang desa
Kalinapu kepada masyarakat luas. Informasi tersebut bisa berupa profil,
potensi desa,. Dengan adanya website ini, maka masyarakat luas tidak perlu
susah-susah untuk mencari informasi yang dibutuhkan.
b. Promosi potensi Desa
Pada Desa Kalinapu Terdapat potensi yang dapat menarik minat
masyarakat luar. Misalnya Kolam pemancingan, Transportasi sungai,
Olahan Pangan dari ikan, peternakan. Dengan adanya website membantu
pemerintah dalam melakukan promosi tersebut sehingga banyak orang
yang mengetahui dan tertarik untuk berkunjung. Hal ini tentu
mendatangkan keuntungan tersendiri bagi masyarakat desa ini.

1.6. SISTEMATIK PENULISAN


Penulisan Laporan Program Profesional ini terdiri dari lima bab dan setiap
bab terdiri dari sub-sub pembahasan dengan sistematika penulisan sebagai
berikut :

BAB I PENDAHAHULUAN
Pada bab ini berisikan uraikan mengenai latar belakang, rumusan masalah,
batasan masalah, tujuan, manfaat, sistematika penulisan, dan jadwal pelaksanaan.

BAB II LANDASAN TEORI


Pada bab ini berisikan paparkan teori-teori yang didapat dari sumber yang
relevan untuk digunakan sebagai panduan dalam penelitian serta penyusunan
laporan pembuatan aplikasi website.

BAB III METODE PENELITIAN


Pada bab ini menjelaskan metode penelitian dalam pembuatan Profil Desa
Kalinapu Kecamatan PajuEpat Kabupaten BaritoTimur Provinsi
KalimantanTengah Berbasis Website.

BAB IV HASIL DAN PEMBAHASAN


Pada bab ini akan menjelaskan hasil dan pembahasan dalam pembuatan
aplikasi website.

BAB V KESIMPULAN DAN SARAN


Bab ini merupakan bab terakhir yang berisikan tentang kesimpulan dari apa
yang telah dibuat mulai dari awl pembuatan sampai selesai, serta saran untuk
aplikasi dan laporan yang telah di buat oleh penulis.
1.7 JADWAL KEGIATAN

Tabel 1.1 Jadwal Kegiatan

Bulan dan Minggu


Rencana Februari Maret April Mei Juni
Kegiatan PP III IV I II III IV I II III IV I II III IV I II
Pengumpulan
Judul
Pengumuman
Pembimbing
Analisis dan
Desain
Implementasi
dan Testing

Pembuatan
Laporan

Pengumpulan
UTS

Pengumpulan
Laporan Akhir

Seminar PP
BAB II
LANDASAN TEORI

2.1. BUMdes
Badan Usaha Milik Desa (BUMDes) adalah lembaga usaha desa yang
dikelola oleh masyarakat dan pemerintahan desa dalam upaya memperkuat
perekonomian desa dan dibentuk berdasarkan kebutuhan dan potensi desa.
BUMDes menurut Undang-undang nomor 32 Tahun 2004 tentang
Pemerintahan Daerah didirikan antara lain dalam rangka peningkatan
Pendapatan Asli Desa (PADesa). Berangkat dari cara pandang ini, jika
pendapatan asli desa dapat diperoleh dari BUMDes, maka kondisi itu akan
mendorong setiap Pemerintah Desa memberikan goodwill dalam merespon
pendirian BUMDes. Sebagai salah satu lembaga ekonomi yang beroperasi
dipedesaan, BUMDes harus memiliki perbedaan dengan lembaga ekonomi pada
umumnya. Ini dimaksudkan agar keberadaan dan kinerja BUMDes mampu
memberikan kontribusi yang signifikan terhadap peningkatan kesejahteraan
warga desa. Disamping itu, supaya tidak berkembang sistem usaha kapitalistis
di pedesaan yang dapat mengakibatkan terganggunya nilai-nilai kehidupan
bermasyarakat.
Terdapat 7 (tujuh) ciri utama yang membedakan BUMDes dengan
lembaga ekonomi komersial pada umumnya yaitu :
a. Badan usaha ini dimiliki oleh desa dan dikelola secara bersama;
b. Modal usaha bersumber dari desa (51%) dan dari masyarakat (49%)
melalui penyertaan modal(saham atau andil);
c. Operasionalisasinya menggunakan falsafah bisnis yang berakar dari budaya
lokal (local wisdom);
d. Bidang usaha yang dijalankan didasarkan pada potensi dan hasil informasi
pasar;
e. Keuntungan yang diperoleh ditujukan untuk meningkatkan kesejahteraan
anggota (penyerta modal) dan masyarakat melalui kebijakan desa (village
policy);
f. Difasilitasi oleh Pemerintah, Pemprov, Pemkab, dan Pemdes;
g. Pelaksanaan operasionalisasi dikontrol secara bersama (pemdes, BPD,
Anggota).

BUMDes sebagai suatu lembaga ekonomi modal usahanya dibangun atas


inisiatif masyarakat dan menganut asas mandiri. Ini berarti pemenuhan modal
usaha BUMDes harus bersumber dari masyarakat. Meskipun demikian, tidak
menutup kemungkinan BUMDes dapat mengajukan pinjaman modal kepada
pihak luar, seperti dari Pemerintah Desa atau pihak lain, bahkan melalui pihak
ketiga. Ini sesuai dengan peraturan per undang-undangan (UU 32 tahun 2004
tentang Pemerintahan Daerah Pasal 213 ayat 3). Penjelasan ini sangat penting
untuk mempersiapkan pendirian BUMDes, karena implikasinya akan
bersentuhan dengan pengaturannya dalam Peraturan Daerah (Perda) maupun
Peraturan Desa (Perdes).

2.2. Website
Website adalah suatu halaman web yang saling berhubungan yang
umumnya berada pada peladen yang sama berisikan kumpulan informasi yang
disediakan secara perorangan, kelompok, atau organisasi. Sebuah situs web
biasanya ditempatkan setidaknya pada sebuah server web yang dapat diakses
melalui jaringan internet. “Website atau disingkat web, dapat diartikan
sekumpulan halaman yang terdiri dari beberapa laman yang berisi informasi
dalam bentuk data digital baik berupa text, gambar, video, audio, dan animasi
lainnyayang disediakan melalui jalur internet. Lebih jelasnya, website
merupakan halaman-halaman yang berisi informasi yang ditampilkan oleh
browser seperti Mozila Firefox, Google Chrome atau yang lainnya.” ( Rohi
Adulloh,2016)

Website merupakan fasilitas internet yang menghubungkan dokumen


dalam lingkup lokak maupun jarak jauh. Dokumen pada website disebut dengan
web page dan link dalam website memungkinkan pengguna bisa bepindah dari
satu halaman ke halaman yang lain, baik diantara halaman yang disimpan
dalam server maupun server diseluruh dunia. (Hakim Lukmanul,2004)

2.2.1. Pengertian Website


Website adalah sebuah kumpulan halaman pada suatu domain di
internet yang dibuat dengan tujuan tertentu dan saling berhubungan serta
dapat diakses secara luas melalui halaman depan (home page)
menggunakan sebuah browser menggunakan URL website. Website ini
dibuka melalui sebuah program penjelajah (browser) yang berada
disebuah komputer. Program penjelajah yang bisa digunakan dalam
komputer diantaranya: IE (Internet Explorer), Mozilla, Firefox,
Netscape, Opera. Website bisa digolongkan menjadi 3 bagian yaitu :
a) Website Statis
Website statis adalah website yang mempunyai halaman tidak
berubah. Artinya adalah untuk melakukan perubahan pada suatu
halaman dilakukan secara manual dengan mengedit code yang menjadi
struktur dari website tersebut.
b) Website Dinamis
Website dinamis merupakan website yang secara struktur
diperuntukkan untuk update sesering mungkin. Biasanya selain utama
yang bisa diakses oleh pengguna pada umumnya, juga disediakan
halaman backend untuk mengedit konten dari website. Biasanya sebuah
website dinamis terhubung ke database sehingga dapat dengan mudah
menyimpan dan menarik informasi dengan cara yang terorganisir dan
terstruktur. Contoh umum mengenai website dinamis adalah website
berita atau website portal yang didalamnya terdapat kebudayaan berita,
polling dan sebagainya.
c) Website Interaktif
Website interaktif adalah website yang saat ini memang sedang
populer. Salah satu contoh website interaktif adalah blog dan forum. Di
website ini pengguna bisa berinteraksi dan beradu argumen mengenai
apa yang menjadi pemikiran mereka. Biasanya website seperti memiliki
moderator untuk mengatur supaya topik yang diperbincangkan tidak
keluar jalur.

2.2.2. Pengertian Website Profil


Website Profil adalah sebuah website yang hanya menampilkan
informasi tentang visi, misi, sejarah perkembangan, organisasi, jasa
atau produk yang ditawarkan tetapi tidak secara langsung menjual
produl hanya sebatas informasi (Jasmadi,2004)
Website merupakan kumpulan dari halamanhalaman yang
berhubungan dengan file-file lain yang saling terkait. Dalam sebuah
website terdapat satu halaman yang dikenal dengan sebutan home-
page. Homepage adalah sebuah halaman yang pertama kali dilihat
ketika seseorang mengunjungi sebuah website. (Jhonsen, 2004 : 2)

2.2.3. Sejarah Website


Website pertama kali ditemukan oleh Sir Timothy John, Tim
Berners-Lee. Pada tahun 1991 website terhubung dengan jaringan.
Tujuan dari dibuatnya website pada saat itu yakni untuk
mempermudah tukar menukar dan memperbaharui informasi kepada
sesama peneliti ditempat mereka bekerja. Dengan demikian pengertian
website saat itu masih sebatas tukar menukar informasi, bukan
pengertian website secara terminologi. Website dipublikasikan ke
publik setelah adanya pengumuman dari CERN pada tanggal 30 april
1993. CERN menyatakan bahwa website dapat digunakan secara gratis
oleh semua orang. Web sekarang ini berkembang dari ide dan konsep
yang dicetuskan oleh Tim Berners-Lee, seorang peneliti pada CERN
Particle Physics Lab di Jenewa, Swiss. Pada tahun 1989 Berners-Lee
merumuskan suatu proposal tentang sebuah system hypertext yang
memiliki tiga komponen sebagai berikut :
a) Antarmuka yang konsisten untuk semua platform. Antarmuka ini
harus menyediakan akses yang dapat digunakan oleh berbagai
jenis komputer.
b) Akses informasi yang universal. Setiap pengguna harus
dapat mengakses setiap informasi yang tersedia.
c) Antarmuka yang menyediakan akses terhadap berbagai jenis
dokumen dan protokol.
Perkembangan selanjutnya dari konsep Berners-Lee ini
melahirkan Mosaic, sebuah web browser grafis yang pertama. Web
memiliki banyak kemungkinan hubungan antar dokumen tanpa awal
dan akhir. Dokumen web harus ditulis dalam suatu format khusus yang
memungkinkan hypertext saling terjalin untuk bekerja. Format ini
adalah hypertext Markup Language (HTML). HTML merupakan
bagian dari Stpenggunard Generalized Markup Language (SGML).
SGML merupakan standar penggunaan dari International
Stpenggunard Organization (ISO), untuk mendefinisikan format pada
dokumen teks.

2.3. Database
Database adalah sekumpulan file data yang satu sama lainnya saling
berhubungan yang diorganisasi sedemikian rupa sehingga memudahkan untuk
mendapatkan dan memproses data tersebut. Lingkungan sistem database
menekankan pada data yang tidak tergantung(independent) pada aplikasi yang
akan menggunakan data tersebut. (Mukhamad Masrur,2015)
Database ( Basis Data ) merupakan kumpulan dari data – data yang
tersusun. Data – data tersebut dapat berupa skema, tabel, query, laporan dan
objek – objek lainnya. Cara untuk mengakses data – data ini biasanya disebut
dengan Database Management System ( Sistem Manajemen Basis Data ) yang
berbentuk sebuah perangkat lunak komputer yang dimana pengguna ( user )
dapat berinteraksi dan mengakses terhadap semua data yang ada pada database
tersebut.
Berikut merupakan pengetian database menurut para ahli :
1. Menurut Gordon C. Everest Database ialah koleksi atau kumpulan data yang
mekanis, terbagi(shared), terdefinisi secara formal dan juga dikontrol
terpusat pada suatu organisasi.
2. Menurut C.J. Date Database ialah koleksi “data operasional” yang tersimpan
dan juga dipakai oleh sistem aplikasi dari suatu organisasi.
3. Menurut Toni Fabbri Database ialah sebuah sistem file-file yang terintegrasi
yang mempunyai minimal primary key untuk pengulangan data.
4. Menurut S. Attre Database ialah koleksi data-data yang saling berinteraksi
mengenai suatu organisasi atau enterprise dengan macam-macam
pemakaiannya.
5. Menurut Chou database ialah kumpulan informasi yang bermanfaat yang
diorganisasikan ke dalam tatacara yang khusus.
6. Menurut fabbri dan Schwab, database ialah system berkas terpadu yang
dirancang terutama untuk dapat meminimalkan pengulangan (redundancy)
data.
7. Menurut Date, database dapat dianggap ialah sebagai tempat sekumpulan
berkas dan juga terkomputerisasi, jadi system database menurut Date pada
dasarnya ialah sistem terkomputersisai yang mempunyai tujuan utamanya
ialah untuk melakukan pemeliharaan terhadap informasi dan juga membuat
informasi tersebut tersedia saat dibutuhkan. Jadi sistem database ialah sistem
penyimpanan data memakai sistem komputer.
2.3.1 manfaat database
Adapun manfaat database ini ialah menghindari adanya data rangkap
atau double, bisa tersusun dengan suatu format yang standar dari sebuah
data, dapat mengamankan data, dapat menentukan kualitas dari sebuah
informasi, juga dapat mengatasi masalah data yang sulit untuk diakses.

2.4. Metode Pengembangan Perangkat Lunak


Metode Pengembangan web yang digunakan adalah metode
Waterfall. Menurut Sommerville (2011:29-30) waterfall model adalah sebuah
contoh dari proses perencanaan, dimana semua proses kegiatan harus terlebih
dahulu direncanakan dan dijadwalkan sebelum dikerjakan.
a) Requitments Definition (Definisi Kebutuhan)
Langkah ini merupakan analisa terhadap kebutuhan yang
diperlukan dalam pembuatan untuk mendapatkan pilihan dan solusi fitur
apa yang akan dirancang. Sehingga kebutuhan tersebut yang akan
menjadi acuan sistem analisis untuk menterjemahkan kedalam bahasa
pemrograman, di mana menetapkan fitur-fitur, kendala dan tujuan sistem.
b) System dan Software Design (Desain Sistem dan Software)
Pada tahap ini dilakukan desain aplikasi yang meliputi desain
interface atau tampilan website dengan menterjemahkan sesuai dengan
syarat atau kebutuhan ke dalam sebuah representasi aplikasi yang dapat
diperkirakan demi kualitas sebelum dimulai pengkodean.
c) Implementation and Unit Testing (Implementasi dan pengujian unit)
Tahapan inilah merupakan mengerjakan suatu sistem. Dimana
desain sistem dan desain interface aplikasi yang dirancang sebelumnya
diimplementasikan dengan melakukan pembangunan aplikasi yang
diterjemahkan ke kode-kode dalam satu set program atau unit program.
Setelah pengkodean selesai maka akan dilakukan testing terhadap sistem
yang telah dibuat tadi secara unit. Tujuan testing untuk menemukan
kesalahan-kesalahan terhadap sistem tersebut dan kemudian bisa
diperbaiki.
d) Integration and System Testing (Integrasi dan Pengujian Sistem)
Dalam tahapan ini, setiap unit program akan diintegrasikan satu
sama lain atau menyatukan semua unit program untuk diuji secara
keseluruhan untuk mendeteksi apakah ada bug atau error didalam website
ini agar terjamin bahwa persyaratan sistem telah dipenuhi atau sudah
memenuhi spesifikasi aplikasinya. Setelah pengujian sistem, perangkat
lunak dikirim ke pengguna.
e) Operation and Maintenance (Operasi dan Pemeliharaan)
Pada tahapan ini sistem diinstal atau mulai digunakan. Melakukan
juga pemeliharaan yang mencakup koreksi dan berbagai kesalahan yang
tidak ditemukan pada tahap-tahap sebelumnya, perbaikan atas
implementasi unit sistem dan pengembangan sistem sebagai penemuan
kebutuhan baru, penambahan fitur dan fungsi baru.

2.5. Perangkat Lunak Pendukung


2.5.1. XAMPP
Pengertian XAMPP adalah perangkat lunak (free software)
bebas, yang mendukung untuk banyak sistem operasi dan merupakan
kompilasi dari beberapa proerdTEXTgram. Fungsi XAMPP sendiri
adalah sebagai server berdiri sendiri (localhost) yang terdiri dari
beberapa program antara lain : Apache HTTP, Server, MySQL
database dan penerjemah bahasa yang ditulis dengan bahasa
pemrograman PHP dan Perl.

2.5.2. SQLYog – 64 Bit


Pengertian SQL (Structured Query Language) adalah salah satu
DBMS (database management system) yang saat ini banyak digunakan
untuk operasi basis data dan embedded (ditempelkan) dihampir semua
bahasa pemrograman yang mendukung basis data relasional. Bahasa
ini secara de facto merupakan bahasa standar yang digunakan dalam
manajemen basis data relasional. Perintah SQL digunakan untuk
melakukan tugas-tugas seperti update data atau mengambil data dari
database. SQLyog adalah aplikasi alternatif untuk melakukan proses
administrasi database MySQL. Banyak fitur yang disediakan oleh
SQLyog yang tidak disediakan oleh PhpMyAdmin maupun tool
administrasi database lainnya seperti MySQLQueryBrowser. Dengan
SQLyog kita dapat membuat Store Prosedure, Function maupun
Trigger dengan mudah.

2.5.3. Visual Studio Code


Visual Studio Code (VS Code) ini adalah sebuah teks editor
ringan dan handal yang dibuat oleh microsoft untuk sistem operasi
multiplatform, artinya tersedia juga untuk versi Linux, Mac dan
Windows. Teks editor ini secara langsung mendukung bahasa
pemrograman JavaScript, Typescript dan Node.js, serta bahasa
pemrograman lainnya dengan bantuan plugin yang dapat dipasang via
market place Visual Studio Code (seperti C++, C#, Python, Go, Java
dan seterusnya). Banyak sekali fitur-fitur yang disediakan oleh Visual
Studio Code, diantaranya Intellisense, Git Integration, Debugging dan
fitur ekstensi yang menambah kemampuan teks editor. Fitur-fitur
tersebut akan terus bertambah seiring dengan bertambahnya versi
Visual Studio Code. Pembaruan versi Visual Studio Code ini juga
dilakukan berkala setiap bulan dan inilah yang membedakan VS Code
dengan teks editor yang lain.
2.5.4. Edraw Max
Edraw Max adalah software diagram yang dapat membuat bagan
organisasi, presentase bisnis, diagram jaringan, rencana pembangunan,
peta pikiran, ilmu ilustrasi, desain fashion, UML diagram, workflow,
struktur Program, diagram desain web dan masih banyak lainnya yang
berhubungan dengan diagram. Dengan software ini akan lebih mudah
membuat berbagai macam diagram apa saja dengan menggunakan
template, struktur dan bentuk serta alat-alat menggambar lainnya serta
dapat mengekspornya ke format lain seperti; PDF, Word, Excel, file
PowerPoint, SVG atau EPS. Software ini sudah mendukung semua
jenis Operating System yang digunakan.

2.6. Bahasa Pemprograman


2.6.1. Hypertext Markup Language (HTML)
HTML ialah singkatan dari HyperText Markup Language
merupakan bahasa web atau markup internet yang berasal dari
kombinasi antara teks dan informasi berupa simbol atau kode yang
akan dimasukan kedalam suatu file guna membuat suatu halaman situs.
Secara singkat HTML adalah bahasa markup internet yang beguna
untuk membuat suatu website melalui aplikasi browser atau penjelajah
internet seperti Google Chrome, Internet Explorer dan Mozilla Firefox.
Website yang sudah dibuat lewat HTML akan dapat dilihat oleh siapa
saja yang terkoneksi dengan jaringan internet. Dalam mengenal HTML
dapat menampilkan bermacam informasi pada software di website
browser dan juga formating hypertext yang tertulis dalam ASCII atau
American Standard Code for Information Interchange.

2.6.2. Cascading Style Sheet (CSS)


CSS adalah kode-kode yang dipakai untuk mendesain sebuah
laman HTML. Jika HTML diibaratkan sebagai seorang manusia, maka
CSS adalah pakaian yang membuat penampilan menjadi semakin
menarik. CSS akan memudahkan para web designer untuk mengubah
tampilan teks (baik dari bentuk dan ukuran font maupun warnanya),
menambahkan gambar hingga mengubah latar belakang sebuah
halaman HTML. Keberadaan CSS bisa terlihat dengan adanya atribut
warna teks. Di sini CSS memberi perintah berupa teks berwarna biru
melalui tag <span> dengan atribut class=”warna”. Jadi setiap tag
<span> muncul, teks yang mengikutinya akan berwarna biru. Jika
ingin mengganti warnanya maka harus mengganti CSS pada tag
<style> dari “blue” ke warna lain sehingga teks yang awalnya
berwarna biru akan berubah warna. Dengan adanya CSS
memungkinkan pengguna untuk menampilkan halaman yang sama
dengan format yang berbeda.

2.6.3. Javascript
JavaScript adalah bahasa pemrograman web yang bersifat Client
Side Programming Language. Client Side Programming Language
adalah tipe bahasa pemrograman yang pemprosesannya dilakukan oleh
client. Aplikasi client yang dimaksud merujuk kepada web browser
seperti Google Chrome dan Mozilla Firefox. Bahasa pemrograman
Client Side berbeda dengan bahasa pemrograman Server Side seperti
PHP, dimana untuk server side seluruh kode program dijalankan di sisi
server. Untuk menjalankan JavaScript, yang dibutuhkan hanya aplikasi
text editor dan web browser. JavaScript memiliki fitur: high-level
programming language, client-side, loosely tiped dan berorientasi
objek.
Javascript adalah sebuah bahasa komputer atau kode
pemrograman yang digunakan pada website agar website tersebut
menjadi lebih interaktif dan dinamis. Javascript adalah jenis bahasa
pemrograman client side. Penggunaan kode javascript pada sebuah
website bersifat opsional, artinya tidak harus selalu ada. Namun,
website-website maupun blog modern saat ini hampir semuanya
menggunakan kode javascript walaupun sedikit

2.6.4. Hypertext Preprocessor (PHP)


Menurut Arief (2011:43) PHP adalah Bahasa server side
scripting yang menyatu dengan HTML untuk membuat halaman web
yang dinamis. Karena PHP merupakan server-side-scripting maka
sintaks dan perintah-perintah PHP akan diesksekusi diserver kemudian
hasilnya akan dikirimkan ke browser dengan format HTML.
Dengan demikian kode program yang ditulis dalam PHP tidak
akan terlihat oleh user sehingga keamanan halaman web lebih terjamin.
PHP dirancang untuk membuat halaman web yang dinamis, yaitu
halaman web yang dapat membentuk suatu tampilan berdasarkan
permintaan terkini, seperti menampilkan isi basis data ke halaman web.
Sedangkan menurut Nugroho (2006:61) “PHP atau singkatan
dari Personal Home Page merupakan bahasa skrip yang tertanam
dalam HTML untuk dieksekusi bersifat server side”. PHP termasuk
dalam open source product, sehingga source code PHP dapat diubah
dan didistribusikan secara bebas..
Salah satu keunggulan yang dimiliki PHP adalah kemampuannya
untuk melakukan koneksi ke berbagai macam software sistem
manajemen basis data atau Database Management Sistem (DBMS),
sehingga dapat menciptakan suatu halaman web dinamis. PHP
mempunyai koneksitas yang baik dengan beberapa DBMS seperti
Oracle, Sybase, mSQL, MySQL, Microsoft SQL Server, Solid,
PostgreSQL, Adabas, FilePro, Velocis, dBase, Unix dbm, dan tidak
terkecuali semua database ber-interface ODBC.
Hampir seluruh aplikasi berbasis web dapat dibuat dengan PHP.
Namun kekuatan utama adalah konektivitas basis data dengan web.
Dengan kemampuan ini kita akan mempunyai suatu sistem basis data
yang dapat diakses. PHP merupakan bahasa pemrograman untuk web
yang awalnya didesain untuk dieksekusi pada server tidak pada client
tetapi kini juga digunakan untuk bahasa pemrograman secara umum
seperti bahasa pemrograman yang lainnya

2.7. Flowchart
Flowchart adalah adalah suatu bagan dengan simbol-simbol tertentu yang
menggambarkan urutan proses secara mendetail dan hubungan antara suatu
proses (instruksi) dengan proses lainnya dalam suatu program. Dalam
perancangan flowchart sebenarnya tidak ada rumus atau patokan yang bersifat
mutlak (pasti). Hal ini didasari oleh flowchart (bagan alir) adalah sebuah
gambaran dari hasil pemikiran dalam menganalisa suatu permasalahan dalam
komputer. Karena setiap analisa akan menghasilkan hasil yang bervariasi antara
satu dan lainnya. Kendati begitu secara garis besar setiap perancangan flowchart
selalu terdiri dari tiga bagian, yaitu input, proses dan output. Flowchart ini
merupakan langkah awal pembuatan program. Dengan adanya flowchart urutan
poses kegiatan menjadi lebih jelas. Jika ada penambahan proses maka dapat
dilakukan lebih mudah. Setelah flowchart selesai disusun, selanjutnya
pemrogram (programmer) menerjemahkannya ke bentuk program dengan
bahasa pemrograman. Dalam pembuatan flowchart tidak ada rumus atau
patokan yang bersifat mutlak. Karena flowchart merupakan gambaran hasil
pemikiran dalam menganalisa suatu masalah dengan komputer. Sehingga
flowchart yang dihasilkan dapat bervariasi antara satu pemrogram dengan
pemrogram lainnya. Simbol-simbol yang di pakai dalam flowchart dibagi
menjadi 3 kelompok:
a) Flow direction simbols, digunakan untuk menghubungkan simbol satu
dengan yang lain. Simbol ini disebut juga connecting line. Simbol-simbol
tersebut adalah sebagai berikut :

Tabel 2.1. Flow Directions Symbols


Simbol Keterangan

Simbol arus atau flow, yaitu menyatakan


jalannya arus suatu proses.

Simbol communication link, yaitu menyatakan


transmisi data atau informasi dari satu lokasi ke
lokasi lain.

Simbol connector, berfungsi menyatakan


sambungan dari proses ke proses lainnya dalam
halaman atau lembar yang sama.
Simbol offline connector, menyatakan
sambungan dari proses ke proses lainnya dalam
halaman atau lembar yang berbeda.

b) Processing Symbols, menunjukan jenis operasi pengolahan dalam suatu


proses atau prosedur.

Tabel 2.2. Processing Symbols


Simbol Keterangan
Simbol process, yaitu menyatakan suatu
tindakan (proses) yang dilakukan oleh
komputer.
Simbol manual, yaitu menyatakan suatu
tindakan (proses) yang tidak dilakukan oleh
komputer (manual).

Simbol decision, yaitu menujukkan suatu


kondisi tertentu yang akan menghasilkan dua
kemungkinan jawaban : ya atau tidak.

Simbol predefined process, yaitu menyatakan


penyediaan tempat penyimpanan suatu
pengolahan untuk memberi harga awal.

Simbol terminal, yaitu menyatakan permulaan


atau akhir suatu program.

Simbol keying operation, menyatakan segala


jenis operasi yang diproses dengan
menggunakan suatu mesin yang mempunyai
keyboard.
Simbol offline-storage, menunjukkan bahwa
data dalam simbol ini akan disimpan ke suatu
media tertentu.
Simbol manual input, memasukkan data secara
manual dengan menggunakan online keyboard.

c) Input Output Symbols, menunjukkan jenis peralatan yang digunakan


sebagai media input atau output.
Tabel 2.3. Input Output Symbols
Simbol Keterangan

Simbol input/output, menyatakan proses input


atau output tanpa tergantung jenis peralatannya.

Simbol punched card, menyatakan input berasal


dari kartu atau output ditulis ke kartu.

Simbol magnetic tape, menyatakan input


berasal dari pita magnetis atau output disimpan
ke pita magnetis.
Simbol magnetic disk, menyatakan input berasal
dari disk magnetis atau output disimpan ke disk
magnetis.

Simbol document, mencetak output dalam


bentuk dokumen (melalui printer).

Simbol disk storage, menyatakan input berasal


dari disk atau output disimpan ke disk.

Simbol display, mencetak output dalam layar


monitor.

2.8. Data Flow Diagram (DFD)


Data Flow Diagram (DFD) merupakan diagram yang digunakan untuk
menggambarkan proses – proses yang terjadi pada sistem yang akan
dikembangkan. Pengembangan DFD biasanya menggunakan cara berjenjang
yang dimulai dari context diagram, DFD level 0, DFD level 1, DFD level 2 dan
seterusnya sesuai dengan kompleksitas dari sistem yang akan dikembangkan.
(Al Fatta, 2007).
DFD menggambarkan apa yang terjadi dalam sebuah sistem. Lebih
mudah untuk melihat gambar dan memahami isinya dibandingkan dengan
membaca banyak dokumen yang menerangkan sebuah sistem. DFD sangat
simple karena hanya ada empat simbol yang digunakan dalam pembuatannya :

Tabel 2.4. Simbol DFD

Langkah pertama dalam perancangan DFD adalah membuat context


model. Context model merepresentasikan sistem dengan sebuah proses tunggal
serta interaksinya dengan beberapa entitas. Context diagram sering diberi nama
sama dengan nama sistem dan tidak diawali dengan kata kerja seperti proses-
proses yang lain. Setelah context model terbentuk, proses dikembangkan ke level
selanjutnya yang menggambarkan proses utama dalam sistem. Tergantung pada
kompleksitas sistem, setiap proses dapat pula dikembangkan menjadi model
proses sendiri. Langkah ini terus berlanjut sampai tujuan setiap proses
menyelesaikan fungsi tunggal tercapai. Berdasarkan kedekatannya dengan
context model, proses dapat di beri nama level 0 DFD, level 1 DFD dan
seterusnya. DFD memiliki 3 level, yaitu :
a) Diagram Konteks
Menggambarkan satu lingkaran besar yang dapat mewakili seluruh
proses yang terdapat di dalam suatu sistem.

b) Diagram Nol
Merupakan satu lingkaran besar yang mewakili lingkaran-lingkaran
kecil yang ada di dalamnya.

c) Diagram Rinci.
Merupakan diagram yang menguraikan proses apa yang ada dalam
diagram Nol.
Gambar 2.2. Hierarki perancangan DFD
Gambar 2.3. Contoh sebuah perancangan DFD

2.9. Entity Relationship Diagram (ERD)


ERD adalah salah satu model yang digunakan untuk mendesain database
dengan tujuan menggambarkan data yang berelasi pada sebuah database.
Umumnya setelah perancangan ERD selesai berikutnya adalah mendesain
database secara fisik yaitu pembuatan tabel, index dengan tetap
mempertimbangkan performance. Kemudian setelah database selesai dilanjutkan
dengan merancang aplikasi yang melibatkan database. Simbol ERD adalah
sebagai berikut :

Tabel 2.5. Simbol ERD


Simbol Keterangan
Simbol Entitas, berfungsi untuk memberikan identitas
pada entitas yang meiliki label dan nama.

Simbol Relasi, berfungsi untuk mengetahui jenis


hubungan yang ada antara dua file.

Simbol Atribut, Karakteristik dari entitas atau relasi yang


menyediakan penjelasan detail tentang entitas atau relasi
tersebut.

Simbol Alur, memiliki fungsi untuk


menghubugkan atribut dengan entitas dan entitas
dengan relasi.
BAB III

METODOLOGI PENELITIAN

3.1 Requirements Definition (Definisi Kebutuhan)


Analisis pada sistem akan dilakukan meliputi analisis sistem yang lama
dan sistem baru yang di rekomendasikan. Dalam sistem yang ada akan
dilakukan analisis kelemahan dari pada sistem tersebut dan kemudian dilakukan
analisisi untuk memberikan rekomendasi pada sistem yang baru.

3.1.1 Analisis Sistem Lama


1. Deskripsi Bisnis Proses Mendapatkan Informasi
1) Kepala desa mendatangi kantor kepala desa
2) Kepala desa mencetak informasi profil desa kali napu
3) Masyarakat mendatangi kantor kepala desa kalinapu untuk
mendapatkan informasi profil desa kalinapu.
4) masyarakat mencari informasi profil desa kalinapu
5) Masyarakat mendapatkan informasi profil desa Kali Napu
6) Masyarakat melihat sejarah desa kalinapu
7) Masyarakat melihat keadaan geografis desa kalinapu
8) Masyarakat melihat visi misi desa kalinapu
9) Masyarakat melihat struktur organisai desa kalinapu
10) Masyarakat melihat BUMdes desa kalinapu
11) Masyarakat pulang mendapatkan informasi

\
2. Flowchart Sistem Lama

Gambar 3.1 Flowchart Sistem Lama


3. Kesimpulan Sistem Lama
Kelemahan Sistem Lama :
1) Masyarakat Menghubungi Kepala Desa
2) Masyarakat datang ke Kantor Desa Untuk Mendapatkan
Informasi

4. Rekomendasi Sistem Baru


Dari Kesimpulan diatas maka dibuatlah Rekomendasi pada system
baru untuk menyikapi kelemahan pada sistem lama, yaitu :
1) Masyarakat membuka Website Profil Desa Kalinapu
Kecamatan Paju Epat Kabupaten Barito Timur Provinsi
Kalimantan tengah
2) Secara otomatis sistem web memberikan informasi data Desa
kepada Masyrakat yang memerlukannya
3) Data dan informasi dapat diambil Oleh pengunjung
4) Masyarakat dapat membaca informasi tentang profil desa
Kalinapu Kecamatan Paju Epat Kabupaten Barito Timur
Provinsi Kalimantan tengah
5) Data dan informasi dikelola oleh admin

3.1.2 Analisis Sistem Baru


1. Deskripsi Bisnis Proses Sistem Baru
1) Admin Mengakses ke halaman website.
2) Admin Melakukan login pada Website.
3) Admin Mengelola website.
4) Admin menyimpan perubahan di dalam website
5) Admin logout dan selesai
6) Masyarakat Mengakses website
7) Masyarakat ke halaman utama website
8) Masyarakat melihat profil desa
9) Masyarakat melihat BUMdes Kalinapu
10) Masyarakat mendapatkan berita terbaru desa Kalinapu
11) Masyarakat Keluar dari website dan selesai
12)
2. Flowchart Sistem Baru

Gambar 3.2 Flowchart Sistem Baru Pelanggan


3. Kesimpulan Sistem Baru
Pengguna Sistem :
1) Masyarakat : user yang ingin mendapatkan informasi berita
terbaru yang ada pada desa Kali Napu Kecamatan Paju epat
Kabupaten Barito timur Provinsi Kalimantan Tengah dengan
mengunjungi website.
2) Admin : user yang mengelola situs website Profil desa
Kalinapu Kecamatan Paju Epat Kabupaten Barito Timur
Provinsi Kalimantan Tengah

3.2 Analisis Teknologi dan Pengguna


3.2.1 Alat dan Bahan
1. Analisis Perangkat Keras (Hardware) yang digunakan dalam
pembuatan Aplikasi berbasis Website ini adalah Laptop Lenovo
V110 yang memiliki Spesifikasi sebagai berikut:
1) CPU : Intel Celeron N3350 @ 1.10GHz Apollo Lake
14nm Technology
2) RAM : 4,00GB
3) Motherboard : LENOVO LNVNB161216 (U3EI)
4) Graphics : Generic PnP Monitor (1366x768@60Hz)
Intel HD Graphics 500 (Lenovo)
5) Storage : 931GB Seagate ST1000LM035-1RK172
(SATA)
2. Analisis Perangkat Lunak (Software) yang digunakan dalam
pembuatan Aplikasi berbasis Website ini adalah sebagai berikut:
1) Sistem Operasi : Microsoft Windows 10
2) Text editor : Visual Studio Code
3) Web server : XAMPP
4) Browser : Mozila Firefox
5) Desain Database : Edraw Max 7.9.
6) Database Editor : SQLyog.
3.2.2 Analisis Pengguna
Didalam website Profil Desa Kali Napu Kecamatan Paju Epat
Kabupaten Barito Timur Provinsi Kalimantan Tengah ada 2 pengguna
yang memiliki hak akses berbeda-beda, yaitu sebagai berikut:
1) Admin, mempunyai hak akses untuk mengelola dirinya sendiri
sebagai Admin, lalu admin memiliki hak akses untuk mengelola
beranda, Berita Terbaru desa ,profil sub sejarah, visi dan misi, profil
struktur organisasi, BUMdes.
2) Pengunjung/Masyarakat, merupakan pengguna yang memiliki hak
akses untuk dapat membaca informasi yang terdapat pada website.

3.3 Desain sistem


3.3.1 Diagram Konteks
Konteks diagram di bawah ini menggambarkan seluruh input ke sistem
atau output dari sistem.

Gambar 3.3 Diagram Konteks (Level 0)


Untuk gambar 3.3 di atas menjelaskan tentang sistem yang akan
digunakan dalam website Profil Desa Kali Napu Kecamatan Paju Epat
Kabupaten Barito Timur. dalam sistem ada 2 pengguna yaitu admin dan
pengunjung.
Tabel 3.1 Definisi Konteks Diagram
No. Entitas Luar Keterangan
1. Pengunjung Masyarakat yang ingin mencari
informasi tentang Desa Kalinapu
Kecamatan Paju Epat Kabupaten
Barito Timur Provinsi Kalimantan
Tengah.
Output :
1. Informasi Data Profil Desa
2. Informasi Data Berita Desa
3. Informasi Data BUMdes
2. Admin Petugas atau operator yang
mengelola Website
Input :
1. Data Login
2. Data Admin
3. Data Profil Desa
4. Data Berita Desa
5. Data BUMdes
Output :
1. Informasi Data Login
2. Informasi Data Admin
3. Informasi Data Profil
4. Informasi Data Berita Desa
5. Informasi BUMdes
3.3.2 Data Flow Diagram (DFD) Level 1

Gambar 3.4 Data Flow Diagram (Level 1)

a. Definisi Storage
Tempat penyimpanan (storage) yang digunakan pada perancangan
DFD level 1:

Tabel 3.2 Defisini Storage DFD (Level 1)


No. Nama Penyimpanan Keterangan
1. Tbl_admin Merupakan table dalam basis
data untuk menyimpan data
akun dari admin
2. Tbl_profil Merupakan table dalam basis
data untuk menyimpan data
profil Desa
3. Tbl_berita Merupakan table dalam basis
data untuk menyimpan data
berita Desa
4. Tbl_BUMdes Merupakan table dalam basis
data untuk menyimpan data
dari BUMdes Kali Napu

b. Definisi Proses
Proses yang dilakukan dalam Data Flow Diagram Level 1 :
Tabel 3.3 Definisi Proses DFD level 1
Nama Aliran Data Aliran Data
No. Keterangan
Proses Input Output
1. Login Data Login : Informasi Merupakan
1. Username data login : data admin
2. Password 1. Tampilan untuk masuk
informasi ke dalam
data login system untuk
pengolahan
data di dalam
website Profil
Desa KaliNapu
Kecamatan
Paju Epat
Kabupaten
Barito Timur
2. Kelola Data admin Informasi Merupakan
Admin data admin data untuk
menampilkan
informasi
tentang admin
3. Kelola Data profil Informasi Merupakan
Profil data profil data untuk
menampilkan
informasi
tentang profil
Desa
4. Kelola Data Informasi Merupakan
Berita Pengumuman Data data untuk
Desa Desa atau Pengumuman menampilkan
Berita Desa atau Berita pengumuman
Terbaru atau berita
update dari
desa KaliNapu
5. Kelola Data Informasi Merupakan
BUMdes BUMdes Data data untuk
BUMdes Menampilkan
Informasi
tentang
Potensi-
Potensi desa
atau BUMdes
Kali Napu
6. Melihat Informasi Informasi Merupakan
Informasi Profil Desa Profil Desa informasi
Profil untuk
Desa menampilkan
Profil Desa
Kalinapu
7. Melihat Informasi Informasi Merupakan
Informasi Berita Desa Berita Desa informasi
Berita untuk
Desa menampilkan
berita desa
8. Melihat Informasi Informasi Merupakan
Informasi BUMdes BUMdes informasi
BUMdes untuk
menampilkan
Potensi-
Potensi desa
atau BUMdes
KaliNapu
3.3.3 Entity Realitionship Diagram (ERD)

Gambar 3.5 Entity Realitionship Diagram

3.3.4 Desain Tabel Basis Data


Dalam perancangan Website Profil Desa Kali Napu Kecamatan Paju
Epat Kabupaten Barito Timur Provinsi Kalimantan Tengah memerlukan
database dalam pembuatannya. Website ini dirancang menggunakan
program PHP dan MySQL sebagai databasenya. Desain Tabel adalah
model data yang menggunakan sejumlah tabel untuk menggambarkan
data serta hubungan antara datadata tersebut dengan penyimpanan
(dalam DFD). Setiap tabel mempunyai sejumlah kolom dimana setiap
kolom memiliki nama yang unik. Adapun penjelasan dan keterangan
dari masing-masing field dan table yang ada di database Website Profil
Desa Kali Napu Kecamatan Paju Epat Kabupaten Barito Timur Provinsi
Kalimantan Tengah adalah sebagai berikut :
1. Tabel admin
Tabel admin merupakan table yang digunakan untuk menyimpan data
admin.
Tabel 3.4 Tabel admin
No nama field tipe_data lebar Keterangan
1 id_admin int 10 Primary key
2 Username varchar 50 Not null
3 Password varchar 100 Not null
4 nama_lengkap varchar 100 Not null
5 email varchar 100 Not null
6 Updated timestamp Current_timestamp

2. Tabel sejarah
Tabel sejarah_desa merupakan table yang digunakan untuk
menyimpan data sejarah desa

Tabel 3.5 Tabel sejarah_desa


No nama field tipe_data lebar Keterangan
1 id_sejarah int 10 Primary key
2 Judul_sejarah varchar 100 Not null
3 isi_sejarah text
4 Updated timestamp Current_timestamp

3. Tabel visi_misi
Tabel visi_misi merupakan table yang digunakan untuk menyimpan
data visi misi desa
Tabel 3.6 Tabel visi_misi
No nama field tipe_data lebar Keterangan
1 id_visi_misi Int 10 Primary key
2 Judul_visi_misi Varchar 100 Not null
3 isi_visi_misi Text
4 Updated timestamp Current_timestamp

4. Tabel struktur_organisasi
Tabel struktur_organisasi merupakan table yang digunakan untuk
menyimpan data struktur organisasi desa

Tabel 3.7 Tabel struktur_organisasi


No nama field tipe_data lebar Keterangan

1 id_struktur_organisasi Int 10 Primary key


2 Judul Varchar 100 Not null
3 isi Text Not null
4 gambar varchar Not null
5 Updated Timestam Current_timesta
p mp

5. Table berita
Tabel berita merupakan table yang digunakan untuk menyimpan data
berita dari desa kalinapu
Tabel 3.8 Tabel berita
No nama field tipe_data lebar Keterangan
1 id_berita Int 10 Primary key
2 Judul varchar 100 Not null
3 isi_berita longtext 100 Not null
5 Hari varchar 20 Not null
6 Tanggal Date Not null
8 Jam Time Not null
9 gambar varchar Not null
10 Updated timestamp Current_timestamp

6. Tabel BUMdes
Tabel BUMdes merupakan table yang digunakan untuk menyimpan
data BUMdes Kali Napu
Tabel 3.9 Tabel BUMdes
No nama field tipe_data lebar Keterangan
1 id_bumdes Int 10 Primary key
2 nama_bumdes Varchar 100 Not null
3 isi_bumdes Text Not null
5 Gambar Varchar 100 Not null
7 Updated timestamp Current_timestamp

3.4 Desain Navigasi


Perancangan user interface diperlukan pada aplikasi website Profil desa
Kali Napu Kecamatan Paju Epat Kabupaten Barito Timur Provinsi Kalimantan
Tengah ini dengan tujuan untuk mempermudah pengguna dalam
mengoperasikannya. Dengan adanya user interface, baik pengguna awam,
maupun yang sudah berpengalaman dapat mengoperasikan aplikasi ini tanpa
adanya kesulitan. Dalam merancang user interface seperti mengambarkan
denah dari aplikasi ini nantinya, memuat informasi mengenai setiap jendela
yang ada di dalam aplikasi :
a) Admin
 Login
 Home
 Lihat Web
 Kelola admin
 Kelola Profil Desa
 Kelola Berita Desa
 Kelola BUMdes
 Logout

b) Pengunjung/masyarakat
 Home
 Profil Desa
 Berita Desa
 BUMdes
3.5 Desain Interface
3.5.1 Desain Interface Halaman Login Admin

Gambar 3.6 Design Interface halaman login admin

3.5.2 Desain Interface halaman Beranda Admin

Gambar 3.7 Desain interface halaman beranda Admin


3.5.3 Desain interface Halaman Sejarah

Gambar 3.8 Desain Interface halaman Sejarah

3.5.4 Desain Interface halaman Tambah Data Sejarah

Gambar 3.9 Design Interface halaman Tambah Data Sejarah


3.5.5 Design Interface halaman Edit Data Sejarah

Gambar 3.10 Design Interface halaman Edit Data Sejarah

3.5.6 Design Interface Halaman Visi Misi

Gambar 3.11 Design Interface halaman Visi Misi


3.5.7 Design Interface halaman Tambah Data Visi Misi

Gambar 3.12 Design Interface halaman Tambah Data Visi Misi

3.5.8 Design Interface Halaman Edit Data Visi Misi

Gambar 3.13 Design halaman Edit Data Visi Misi


3.5.9 Design Interface Halaman Struktur Organisasi

Gambar 3.14 Design Interface halaman Struktur Organisasi

3.5.10 Design Interface Halaman Tambah Data Struktur Organisasi

Gambar 3.15 Design Interface halaman Tambah Data Struktur


Organisasi
3.5.11 Design Interface Halaman Edit Data Struktur Organisasi

Gambar 3.16 Design Interface halaman Edit Data Struktur


Organisasi

3.5.12 Design Interface Halaman Berita

Gambar 3.17 Design Interface halaman Berita


3.5.13 Design Interface Halaman Tambah Data Berita

Gambar 3.18 Design Interface halaman Tambah Data Berita

3.5.14 Design Interface Halaman Edit Data Berita

Gambar 3.19 Design Interface halaman Edit Data Berita


3.5.15 Design Interface Halaman BUMdes

Gambar 3.20 Design Interface halaman BUMdes

3.5.16 Design Interface Halaman Tambah Data BUMdes

Gambar 3.21 Design Interface halaman Tambah Data BUMdes


3.5.17 Design Interface Halaman Edit Data BUMdes

Gambar 3.22 Design Interface halaman Edit Data BUMdes

3.5.18 Design Interface Halaman Admin

Gambar 3.23 Design Interface halaman Admin


3.5.19 Design Interface Halaman Tambah Data Admin

Gambar 3.24 Design Interface halaman Tambah Data Admin

3.5.20 Design Interface Halaman Edit Data Admin

Gambar 3.25 Design Interface halaman Edit Data Admin


3.5.21 Desain Interface Halaman Beranda Pengunjung

Gambar 3.26 Design Interface halaman Home Pengunjung


3.5.22 Design Interface Halaman Sejarah

Gambar 3.27 Design Interface halaman Sejarah


3.5.23 Design Interface Halaman Visi Misi

Gambar 3.28 Design Interface halaman Visi Misi


3.5.24 Design Interface Halaman Struktur Organisasi

Gambar 3.29 Design Interface halaman Sejarah


3.5.25 Design Interface Halaman BUMdes

Gambar 3.27 Design Interface halaman BUMdes

Anda mungkin juga menyukai