RANCANG BANGUN WEBSITE KANTOR DESA PADANG

KALUA KECAMATAN BUA KABUPATEN LUWU

Oleh kelompok 11 :

Hasnawati_2004411100
Sitti Arafah_2004411123
Jesi Ramadani_200441112
Rifki Rusmal Into_2004411649

5F

FAKULTAS TEKNIK KOMPUTER

UNIVERSITAS COKROAMINOTO PALOPO
2022

i
 iii

KATA PENGANTAR
Puji syukur atas kehadirat Allah SWT yang telah melimpahkajn rahmat dan
hidayahnya, sehingga penulis dapat menyelesaikan proposal ini dengan judul
“Rancang Bangun Website Kantor Desa Padang Kalua Kecamatan Bua
Kabupaten Luwu”. Tak lupa shalawat serta salam semoga tercurahkan kehadirat
Nabi Muhammad saw, atas berkat bimbingan beliaulah yang telah menghantarkan
umatnya kejalan yang diridhoi Allah SWT.
Penulis mempersembahkan ucapan terima kasih yang sebesar-besarnya kepada
kedua orang tua penulis yang tercinta dan telah membesarkan anaknya dari segala
bentuk cinta yang tulus serta iringan doa yang tulus ikhlas demi kesuksesan
penulis dalam menuntut ilmu dan meraih cita-cita. Serta tak lupa saudara dan
keluarga penulis yang senantiasa mendukung segala aktivitas yang dilakukan oleh
penulis.

Palopo, 1 Desember 2022

Kelompok 5

i
 v

DAFTAR ISI
Halaman
HALAMAN JUDUL ................................................................................... i
KATA PENGANTAR ................................................................................ ii
DAFTAR ISI ............................................................................................... iii
DAFTAR GAMBAR .................................................................................. iv
DAFTAR TABEL ....................................................................................... vi
BAB I PENDAHULUAN ..........................................................................................
1.1 Latar Belakang...............................................................................................1
1.2 Rumusan masalah..........................................................................................2
1.3 Tujuan Penelitian...........................................................................................2
1.4 Manfaat Penelitian.........................................................................................3
BAB II TINJAUAN PUSTAKA ...............................................................................
2.1 Kajian Teori...................................................................................................4
2.2 Hasil Penelitian yang Relevan.......................................................................16
2.3 Kerangka Pikir...............................................................................................18
BAB III METODE PENELITIAN ............................................................................
3.1 Jenis Penelitian............................................................................................20
3.2 Tempat dan Waktu Penelitian.......................................................................21
3.3 Batasan Penelitian.........................................................................................21
3.4 Tahapan Penelitian........................................................................................21
DAFTAR PUSTAKA............................................................................................53

ii
 vi

DAFTAR GAMBAR

Gambar 1. Kerangka Pikir.....................................................................................

18
Gambar 2. Tahapan penelitian (R&D) .................................................................
19
Gambar 3.Sistem yang berjalan ............................................................................
22
Gambar 4 Analisis sistem yang diusulkan ............................................................
23
Gambar 5. Use Case Diagram Admin ...................................................................
26
Gambar 6 .Use Case Diagram Login Admin ........................................................
26
Gambar 7. Use Case Diagram Menu Profil ..........................................................
27
Gambar 8. Use Case Diagram Menu Visi Misi ....................................................
27
Gambar 9. Use Case Diagram Menu Sejarah .......................................................
28
Gambar 10 Use Case Diagram Galeri ..................................................................
28
Gambar 11. Use Case Diagram Berita .................................................................
29
Gambar 12. Use Case Diagram User ....................................................................
29
Gambar 13. Activity diagram login admin ............................................................
30
Gambar 14. Activity Diagram Profil .....................................................................
31
Gambar 15. Activity Diagram Visi Misi Admin ....................................................
32
iii
Gambar 16. Activity Diagram Sejarah ..................................................................
33
Gambar 17. Activity Diagram Galeri ....................................................................
34
Gambar 18. Activity Diagram Berita ....................................................................
35
Gambar 19. Activity Diagram User Profil ............................................................
36
Gambar 20. Activity Diagram User Visi Misi ......................................................
37
Gambar 21. Activity Diagram User Sejarah .........................................................
38
Gambar 22. Activity Diagram User Galeri ...........................................................
39
Gambar 23. Activity Diagram User Berita ............................................................
40
Gambar 27. Class Diagram...................................................................................
41
Gambar 28. Rancangan Interface admin ..............................................................
42
Gambar 29. Rancangan Interface admin ..............................................................
43
Gambar 30. Perancangan interface menu beranda...............................................
44
Gambar 31. Perancangan interface menu beranda...............................................
45 vii

Gambar 32. Perancangan interface menu visi misi .............................................

46
Gambar 33. Perancangan interface sejarah ...........................................................
47
Gambar 34. Perancangan interface galeri .............................................................
48 Gambar 35. Perancangan interface
berita ............................................................. 49

viii

iv
 DAFTAR TABEL

Tabel 1 Use case diagram ....................................................................................

12
Tabel 2 Diagram Activity .....................................................................................
13
Tabel 3 Simbol Diagram Sequence ......................................................................
14
Tabel 4 Simbol Diagram Class ............................................................................
14
Tabel 5. Deskripsi Aktor ......................................................................................
22
Tabel 6. Admin .....................................................................................................
49
Tabel 7. Profil......................................................................................................
49
Tabel 8. Visi Misi .................................................................................................
49
Tabel 9. Sejarah ....................................................................................................
50
Tabel 10. Galeri .................................................................................................... 50
Tabel 11. Berita .................................................................................................... 50

v
 i

BAB 1
PENDAHULUAN
1.1 Latar Belakang
Pembangunan desa saat ini tidak terlepas dari perkembangan teknologi
informasi, mulai dari yang paling sederhana seperti penggunaan telepon seluler
sampai pada telepone pintar atau (smartphone) hingga pemanfaatan internet
dengan berbagi fitur yang bertujuan untuk membantu masyarakat dalam
melakukan aktivitas sehari-hari tidak hanya diperkotaan tetapi sampai dipedesaan.
Dengan bantuan teknologi informasi sehingga informasi yang disampaikan bisa
diakses dengan mudah oleh masyarakat desa. Kurangnya pemahaman masyarakat
dan aparatur desa terkait teknologi informasi menyebabkan pelayanan kepada
masyarakat tidak optimal.
Desa merupakan suatu wilayah yang ditempati sejumlah penduduk sebagai
kesatuan masyarakat yang didalamnya terdapat kesatuan hukum yang memiliki
organisasi pemerintah terendah langsung dibawah camat dan tidak berhak
menyelenggarakan rumah tangga sendiri. Kantor Desa Padang Kalua adalah
sebuah desa yang terletak di Kecamatan Bua, Kabupaten Luwu. Desa padang
Kalua memiliki luas wilayah 43,2 ha dan mempunyai jumlah penduduk sebanyak
1414 jiwa. Proses pelayanan kepada masyarakat yang dilakukan oleh pihak kantor
Desa sebagian besar sudah mengunakan sistem komputer. Namun dalam hal
penyebaran informasi kepada masyarakat dan khalayak luar masih secara manual,
menggunakan media papan informasi, spanduk maupun penyampain secara lisan
sehingga informasi yang disebarkan oleh aparat desa lambat diterima oleh
masyarakat.
Berdasrkan hasil wawancara awal dengan Kepala Desa Padang Kalua
(Ramin) wawancara pra-riset, tanggal 24 maret 2021, beliau mengemukakan
bahwa sosialisasi serta penyebaran informasi dikantor desa padang kalua baik
berupa informasi maupun pemberitahuan dan himbahuan saat ini dianggap kurang
efektif oleh masyarakat dan pihak kantor desa karna masih menggunakan media
berupa spanduk dan melakukan pengumuman dirumah-rumah ibadah .Semua
proses penyebaran informasi masih secara manual, maka diperlukan sebuah sarana
yang bisa membantu pihak kantor Desa Padang Kalua untuk membagikan
 2
informasi kepada masyrakat luas dan dapat memuat profil instansi kantor Desa
maupun seputar tentang kantor Desa Padang Kalua agar khalayak luar juga dapat
mengetahui seputar kantor Desa Padang Kalua. Solusi untuk memecahkan
masalah yang terjadi, maka diperlukan suatu media penyebaran informasi yang
dapat menangani permasalahan tersebut salah satunya, yaitu website desa.
Website adalah kumpulan halaman-halaman yang digunakan untuk
informasi teks, gambar diam atau gerak animasi, suara, atau gabungan dari
semuanya, baik yang bersifat statis maupun dinamis yang membentuk suatu
rangkaian bangunan yang saling terkait, yang masing-masing dihubungkan
dengan jaringan-jaringan halaman. Website menjadi salah satu sarana yang
digunakan untuk menyampaikan sebuah informasi dari pihak pemerintahan untuk
masyarakat umum. Dukungan teknologi yang kini semakin maju, pilihan untuk
membangun sebuah sistem informasi website juga lebih beragam dan
dipermudah ,salah satunya framework atau dapat diartikan sebuah kerangka kerja.
Dengan menggunakan framework proses pembuatan website akan lebih cepat,
mudah dan didukung dengan hasil tampilan website yang lebih terkini dan lebih
menarik serta responsif bagi pengguna. Dengan segala keunggulannya aplikasi
website ini akan yang akan menjadi media penyebar informasi paling tepat, yang
mana pada aplikasi website ini, nantinya akan memuat informasi seputar desa dan
pemberitahuan penting yang ada pada kantor desa padang kalua.
Setelah mempelajari dan mengamati permasalahan yang ada, maka penulis
berkeinginan untuk melakukan penelitian dengan judul “Rancang Bangun Website
Kantor Desa Padang Kalua Kecamatan Bua Kabupaten Luwu”.

1.2 Rumusan Masalah

Berdasarkan latar belakang masalah diatas, maka dapat dirumuskan masalah
“Bagaimana merancang dan membagun Website Desa Padang Kalua?”

1.3 Tujuan Penelitian

Berdasarkan rumusan masalah diatas maka tujuan penelitian yang akan
dilakukan adalah Merancang dan membangun Website yang dapat digunakan oleh
Kantor Desa Padang Kalua.
 3

1.4 Tujuan Penelitian

Berdasarkan manfaat dalam penelitian merancang dan membangun aplikasi
website Desa yang ada pada Kantor Desa Padang Kalua Kecamatan Bua
Kabupaten Luwu yang dibuat diharapkan dapat bermanfaat, diantaranya:
1. Manfaat Bagi Kantor Desa Padang Kalua
Hasil penelitian ini bermanfaat bagi Kantor Desa Padang Kalua untuk
memberikan informasi Desa kepada masyarakat luas tentang profil Desa, Visi dan
Misi Desa, beserta pelayanan yang ada di kantor Desa.
2. Manfaat Bagi Peneliti
Bagi peneliti bermanfaat sebagai penambah wawasan lebih dalam
pengaplikasian teknologi dan mengetahui media yang tepat dalam penyebaran
informasi.
3. Manfaat terhadap Dunia Akademik
Manfaat penelitian ini terhadap dunia akademik adalah menambah literatur
bagi pembuatan laporan sejenis dalam lingkungan Universitas Cokroaminoto
Palopo.
4. Manfaat Bagi Masyarakat
Manfaat bagi masyarakat dengan mempermudah lapisan masyarakat dalam
mendapatkan informasi yang dibutuhkan di Desa Padang Kalua dengan cepat dan
akurat.
 4
BAB II TINJAUAN PUSTAKA
2.1 Kajian Teori
Kajian Teori Pada bagian ini akan dijelaskan mengenai teori-teori dari
beberapa sumber yang menjadi referensi yang digunakan untuk merancang
Aplikasi Berbasis Website yang akan di bangun atau kajian materi-materi yang
diambil dari Buku, e-Book, Internet, serta media cetak lainnya seperti Jurnal dan
Skripsi.
1. Rancang Bangun
Menurut Pressman (dalam Subriadi, 2018:980), rancang merupakan
serangkaian prosedur untuk menerjemahkan hasil analisis dari sistem kedalam
bahasa pemograman untuk dideskripsikan dengan detail sebagaimana
komponenkomponen sistem di implementasikan. Adapun bangun / pembangunan
sistem menurut Pressman adalah kegiatan menciptakan sistem baru maupun
mengganti atau memperbaiki sistem yang telah ada baik secara keseluruhan
maupun sebagian. Jadi bangun sistem merupakan proses membangun sistem
informasi dan komponen yang didasarkan pada spesifikasi desain.
Menurut Bambang 2013 (dalam Sari, 2017:81) menyatakan bahwa,
rancang bangun adalah proses pembangunan sistem untuk menciptakan sistem
baru maupun mengganti atau memperbaiki sistem yang telah ada baik secara
keseluruhan maupun hanya sebagian. Dari beberapa pengertian tersebut, maka
dapat didefinisikan bahwa rancang bangun merupakan kegiatan hasil analisa
kedalam bentuk paket perangkat yang kemudian akan menciptakan sebuah sistem
dan juga akan dapat memperbaiki sistem yang sudah ada.
2. Website
Menurut Putri Destiana (2020:50) website dapat diartikan sebagai
kumpulan halaman yang menampilkan informasi data teks, gambar diam atau
gerak animasi, suara, video atau gabungan dari semuanya, baik yang bersifat
statis maupun dinamis yang membentuk satu rangkaian bangunan yang
saling terkait dimana masing-masing dihubungkan dengan jaringan-jaringan
halaman (hyperlink)”.
Menurut Yuhefizar (dalam Supriatiningsih 2019:97) website adalah
keseluruhan halaman-halaman web yang terdapat dari sebuah domain yang

4
 5

mengandung informasi. Sebuah web biasanya dibangun atas banyak halaman web
yang saling berhubungan. Hubungan antara satu halaman web dengan halaman
web yang lainnya disebut dengan Hyperlink sedangkan teks yang dijadikan media
penghubung disebut Hypertext. Berdasarkan pengertian tersebut, maka bisa
disimpulkan bahwa website adalah kumpulan halaman-halaman yang dapat
menampilkan teks, gambar, video, suara, yang masing-masing dihubungkan
dengan jaringan-jaringan halaman.
3. Desa
Menurut Undang-Undang No. 6 Tahun 2014, Desa adalah kesatuan
masyarakat hukum yang memiliki batas-batas wilayah yang berwenang
untuk mengatur dan mengurus kepentingan masyarakat setempat, berdasarkan
asal usul dan adat istiadat setempat yang diakui dan dihormati dalam sistem
Pemerintahan Negara Kesatuan Republik Indonesia.
Menurut Sanusi Herman (2019:123) Desa, menurut “universal”, adalah
sebuah aglomerasi permukiman di area pedesaan (rural), Di indonesia, istilah desa
adalah pembagian wilayah administratif di Indonesia di bawah kecamatan, yang di
pimpin oleh kepala desa. Dari beberapa pengertian tersebut, bisa ditarik
kesimpulan bahwa desa merupakan kesatuan masyarakat hukum yang mempunyai
batas wilayah yang berwenang.
4. Php
Menurut Herman Sanusi (2019:124) PHP atau Hypertext Preprocessor
adalah salah satu teknologi baru yang mulai banyak dimanfaatkan untuk
perkembangan web. PHP merupakan suatu bahasa pemrograman yang bersifat
server side yang memiliki kemampuan untuk dikombinasikan dengan teks,
HTML, dan komponen-komponen lain untuk membuat suatu halaman web lebih
menarik, dinamis dan interaktif, juga bersifat open source yang digunakan secara
luas terutama untuk pengembangan web dan dapat disimpan dalam bentuk
HTML. Hypertext Prepocessor merupakan suatu bahasa pemrograman yang
berfungsi untuk membangun suatu website dinamis. Pertama kali PHP dibuat oleh
Rasmus Lerdorf pada tahun 1994 dengan nama Personal Home Page Tools.
Kemudian berganti dengan Form Interpreter (FI), dengan wujud berupa
sekumpulan script. Tahun 1996 PHP/FI 2.0 dirilis dengan implementasi program
C. Dengan perkembangann tekonologi, pada saat ini PHP 5.4.7 mampu
melakukan derefensi sebuah array.
 6
Menurut Putratama (2016:3) PHP (Hypertext Preprocessor) adalah suatu
bahasa pemprograman yang digunakan untuk menerjemahkan baris kode program
menjadi kode mesin yang dapat dimengerti oleh komputer yang bersifat server
side yang dapat di tambah ke dalam HTML. Dari beberapa pengertian tersebut,
bisa disimpulkan bahwa Hypertext Preprocessor adalah bahasa pemograman yang
paling banyak digunakan secara luas untuk pembutan website dinamis dan
digunakan secara luas untuk pembuatan dan pengembangan sebuah web.
5. MySQL
Menurut Eviana Septiana Rachman (2017:47 ) MySQL merupakan salah
satu contoh produk RDBMS yang sangat popular di lingkungan Linux, tetapi juga
tersedia pada Windows.Banyak situs web yang menggunakan MySQL sebagai
database server (server yang melayani permintaan akses terhadap database).
MySQL sebagai dB server juga dapat diakses melalui program yang dibuat
dengan menggunakan Borland Delphi. Dengan cara seperti ini database dapat
diakses secara langsung melalui program executable yang kita buat sendiri.
Menurut Aryanto (dalam Cut Fachrul Rozi 2020:4), MySQL adalah sebuah
perangkat lunak sistem manajemen basis data SQL (Database Management
System) atau DBMS yang multithread, multi-user,dengan sekitar 6 juta instalasi di
seluruh dunia. Mysql AB membuat mysql tersedia sebagai perangkat lunak gratis
di bawah lisensi GNU General Public License (GPL), tetapi mereka juga menjual
dibawah lisensi komersial untuk kasus-kasus dimana penggunaannya tidak cocok
dengan penggunaan GPL. Berdasarkan pendapat yang dikemukakan oleh peneliti
diatas dapat ditarik kesimpulan bahwa MySQL merupakan suatau software atau
program yang digunakan untuk membuat sebuah basis data yang bersifat open
source.
6. HTML
Sidik 2010 (dalam Prabowo 2017:75) mendefinisikan Hypertext Markup
Language (HTML) adalah file teks murni yang dapat dibuat dengan editor teks
sembarang. Dokumen ini dikenal sebagai web page. Dokumen HTML merupakan
dokumen yang disajikan dalam browser web surfer. Dokumen ini umumnya berisi
informasi atau interface sistem di dalam internet.
Dalam hal ini skrip <html> berperan sebagai tanda awal penulisan dokumen
html,kemudian <head> sebagai informasi page header. Didalam skrip ini
pemrogram dapat meletakkan tag – tag title, base, isi index, link, script, style dan
meta, untuk skrip <title> digunakan sebagai indikasi untuk penulisan judul
 7

halaman dokumen webyang dibuat. Pada skrip <body>dapat diletakkan berbagai

atribut seperti warna, dan latar belakang.
Menurut Ahmad Solichin (dalam Agus Ramdhani Nugraha 2017:6) HTML
(Hypertext Markup Language) merupakan bahasa pemograman web yang
memberitahukan peramban web (web browser) bagaimana menyusun dan
menyajikan konten di halaman web. Dengan kata lain HTML adalah pondasi web.
Dari beberapa pengertian diatas, bisa disimpulkan bahwa Hypert Text Markup
Languange (HTML) adalah teks yang bisa digunakan untuk menampilkan suatu
halaman website.
7. CSS
Menurut Suryana (dalam Saifudin 2017:11) mendefinisikan “CSS
(Cascading Style Sheets) adalah suatu bahasa stylesheets yang digunakan untuk
mengatur tampilan suatu website, baik tata letaknya, jenis huruf, warna, dan
semua yang berhubungan dengan tampilan”.
Menurut Rahmad dan Purnama (dalam Diah Pradiatiningtyas 2017:3) CSS
adalah salah satu bahasa yang digunakan untuk mengatur tampilan dalam web dan
berfungsi untuk memisahkan antara tampilan desain dan konten. Dari beberapa
pengertian diatas, bisa disimpulkan bahwa Cascading Style Sheet (CSS)
merupakan salah satu bahasa pemrograman web untuk mengendalikan beberapa
komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam.
8. Javascript
Menurut Ahmad Yani (2018:111) JavaScript adalah bahasa yang digunakan
untuk membuat program yang digunakan agar dokument HTML yang ditampilkan
pada sebuah Browser menjadi lebih interaktif, tidak sekedar indah saja. JavaScript
memberikan beberapa fungsionalitas ke dalam halaman web, sehingga dapat
menjadi sebuah program yang disajikan dengan menggunakan antar muka web.
Menurut Zaki (dalam Rozul Imam 2018:163) Javascript adalah skrip
program berbasis client yang dieksekusi oleh browser sehingga membuat halaman
web bisa melakukan tugas-tugas tambahan yang tidak bisa dilakukan oleh script
HTML biasa. Dari beberapa pengertian diatas, bisa disimpulkan bahwa Javascript
merupakan bahasa pemograman website agar lebih dinamis dan interaktif .
9. XAMPP
Menurut Ratnasari (2017:1) XAMPP ialah perangkat lunak bebas yang
mendukung banyak sistem operasi, merupakan campuran dari beberapa program
 8
yang mempunyai fungsi sebagai server yang berdiri sendiri (localhost), yang
terdiri dari program MySQL database, Apache HTTP Server, dan penerjemah
ditulis dalam bahasa pemrograman PHP dan Perl. Nama XAMPP merupakan
singkatan dari X (empat sistem operasi),Apache, MySQL, PHP dan Perl. Program
ini tersedia di bawah GNU General Public License dan bebas, adalah mudah
untuk menggunakan web server yang dapat melayani tampilan halaman web yang
dinamis. Dibawah folder utama XAMPP, terdapat beberapa folder penting yang
perlu diketahui.
Menurut Ramadhan dan Uus (2018:2), XAMPP adalah server yang paling
popular dikalangan programmer, selain fiturnya yang lengkap XAMPP sangat
mudah digunakan. Dari beberapa pengertian diatas, bisa disimpulkan bahwa
XAMPP adalah perangkat lunak yang yang mempunyai sistem oprasi yang
banyak diminati oleh pengguna yang mempunyai server sendiri.
10. Codeigniter
Menurut Rio Bayu Sentosa (2018:215) Codeigniter adalah sebuah
framework PHP open source yang dikembangkan oleh EllisLab. Framework ini
sudah mendukung konsep MVC (Model View Controller) yang membedakan
antara logika dan tampilan, sehingga pemrosesan aplikasi bisa dipecah-pecah
menjadi beberapa bagian yang lebih spesifik. Selain itu, CodeIgniter juga telah
menyediakan berbagai library yang siap pakai dan memungkinkan proses
pembuatan aplikasi web menjadi lebih cepat.
Menurut Supono dan Putratama ( dalam Vembria Rose Handayani 2018:78)
CodeIgniter adalah aplikasi open source berupa framework dengan model MVC
(Model, View, Controller untuk membangun website dinamis dengan
menggunakan PHP. Dari beberapa pendapat diatas, penulis dapat menyimpulkan
bahwa Codeigniter adalah suatu konsep dasar untuk memebuat sebuah aplikasi
web yang penyimpanannya sederhana dan memisahkan antara data dan proses.
11. Framework
Menurut Betha Sidik (dalam Mara Destiningrum 2017:32) Framework
adalah Kumpulan intruksi-intruksi yang dikumpulkan dalam class dan
functionfunction dengan fungsi masing- masing untuk memudahkan developer
dalam memanggilnya tanpa harus menuliskan syntax program yang sama
berulang-ulang serta dapat menghemat waktu.
Pembuatan website dengan framework yang berati kerangka kerja yang
memudahkan programmer untuk membuat sebuah aplikasi sehingga programmer
 9

akan lebih mudah melakukan perubahan (customize) terhadap aplikasinya

(website) dan dapat memakainya kembali untuk aplikasi lain yang sejenis
Suharsana dan Yuniastari (2016:21). Dengan menggunakan framework, delevoper
tidak perlu membuat program dari awal, tetapisudah diberikan library
fungsifungsi yang sudah diorganisasikan untuk dapat membuat suatu program
dengan cepat.
Dari beberapa pengertian diatas, maka penulis menyimpulkan bahwa
Framework adalah kumpulan perintah aturan-aturan yang saling berkaitan dalam
perubahan website sehingga programmer akan lebih mudah melakukan perubahan
terhadap aplikasinya (website).
12. Microsoft Visio 2010
Microsoft Visio 2010 digunakan oleh penulis untuk merancang serta
menggambarkan alur kerja sistem yang akan dibuat secara sederhana, melihat atau
membuat suatu objek dari sudut pandang yang lain. Objek yang dimaksud di sini
adalah sketsa. Salah satu contoh sketsa yang dapat dibuat menggunakan Microsoft
Visio2010 adalah diagram dan flowchart. Dengan menggunakan Microsoft
Visio2010, perancangan sederhana dapat dibuat dengan mudah.
Menurut Dadang Haryanto (2019:15) Microsoft visio adalah sebuah
program aplikasi komputer yang sering digunakan untuk membuat diagram,
diagram alir (flowchart), brainstorm, dan skema jaringan yang dirilis oleh
Microsoft Corporation. Aplikasi ini menggunakan grafik vektor untuk membuat
diagram- diagramnya. Dari beberapa pengertian diatas, bisa ditarika kesimpulan
bahwa Microsoft Visio 2010 adalah apliaksi (software) yang digunakan dalam
pembuatan diagram maupun flowchart.
13. Sublime text 3
Menurut (Farel, 2018: 58) Sublime Text adalah aplikasi editor untuk kode
dan teks yang dapat berjalan di berbagai platform operating system dengan
menggunakan teknologi Phyton API. Terciptanya aplikasi ini terinspirasi dari
aplikasi Vim, Aplikasi ini sangatlah fleksibel dan powerful. Fungsionalitas dari
aplikasi ini dapat dikembangkan dengan menggunakan sublime-packages.
Menurut (Pahlevi, dkk, 2018:29) Sublime text merupakan perangkat lunak
text editor yang digunakan untuk membuat atau mengeedit suatu aplikasi. Sublime
text merupakan salah satu text editor yang sangat powerful yang dapat
meningkatkan produktivitas dan mengembangkan kualitas kode yang tinggi. Dari
 10
beberapa pengertian diatas, maka penulis menyimpulkan bahwa Sublime text
merupakan teks editor yang sangat ampuh, cocok digunakan untuk melakukan
coding dalam berbagai bahasa.
14. Bootstrap
Menurut Bambang Suprayogi (2019:120) Bootstrap adalah front-end
framework yang bagus dan luar biasa yang mengedapankan tampilan untuk
mobile device (Handphone, smartphone dll.) guna mempercepat dan
mempermudah pengembangan website. Bootstrap menyediakan HTML, CSS dan
Javascript siap pakai dan mudah untuk dikembangkan. Bootstrap merupakan
framework untuk membangun desain web secara responsif. Artinya, tampilan web
yang dibuat oleh bootstrap akan menyesuaikan ukuran layar dari browser yang
kita gunakan baik di desktop, tablet ataupun mobile device. Fitur ini bisa
diaktifkan ataupun dinon-aktifkan sesuai dengan keinginan kita sendiri. Sehingga,
kita bisa membuat web untuk tampilan desktop saja dan apabila dirender oleh
mobile browser maka tampilan dari web yang kita buat tidak bisa beradaptasi
sesuai layar.
Menurut Abdulloh (dalam Vembira Rose Handayani 2018:78) Bootstrap
merupakan salah satu framework CSS yang sangat populer di kalangan pecinta
pemrograman website. Dengan menggunakan bootstrap, proses desain website
tidak dibuat dari nol, sehingga proses desain website lebih cepat dan mudah. Dari
beberapa pengertian diatas, penulis menyimpulkan bahwa Boostrap merupakan
sebuah library framework CSS yang dibuat khusus untuk bagian pengembangan
front-end website.
15. Unified modeling Language (UML)
Menurut Akil (2018), Bahasa pemodelan visual yang digunakan untuk
menspesifikasikan, menvisualisasikan, membangun, dan mendokumentasikan
rancangan dari suatu sistem perangkat lunak merupakan pengertian dari UML
(Unified Modeling Language). Pemodelan memberikan gambaran jelas tentang
sistem yang akan dibangun baik dari sisi structur ataupun fungsional. UML
sendiri dapat diterapkan pada semua model pengembangan, tingkatan siklus
sistem, dan berbagai macam domain aplikasi, dalam UML terdapat konsep
semantic, notasi, dan panduan masing-masing diagram. UML juga memiliki
bagian statis, dinamis, ruang lingkup, dan oraganisasional. UML bertujuan
menyatukan teknik-teknik pemodelan berorientasi obyek menjadi terstandarisasi
 11

Alat bantu yang digunakan dalam perancangan berorientasi objek

berbasiskan UML ada 8 antara lain Use Case, Class Diagram, Aktivity Diagram,
Squence Diagram, Statechart Diagram, Collaboration Diagram, Componen
Diagram dan Deployment Diagram. Namun pada penelitian ini peneliti hanya
menggunakan 4 diantaranya adalah sebagai berikut: a. Use Case
Use case adalah deskripsi fungsi dari sebuah sistem dari perspektif
pengguna. Use case bekerja dengan cara mendeskripsikan tipikal interaksi antara
user(pengguna) sebuah sistem dengan sistemnya sendiri melalui sebuah cerita
bagaimana sebuah sistem dipakai. Use case juga biasa dapat dikatakan sebagai
rangkaian atau uraian kelompok yang saling terkait dan membentuk sistem yang
teratur yang dilakukan atau di awasi sebuah actor. Adapun simbol use
casediagram dapat dilihat pada tabel berikut:

Tabel 1 Use case diagram 4

Include
No Gambar Nama

1 Actor

5
Extend

Depende
ncy 6
Association

7 Sistem

3
8 Use Case Keterangan
Generali
zatio Menspesifikasikan
himpunan peran yang pengguna mainkan
n
ketika berinteraksi dengan use case.
 12
Hubungan dimana perubahan yang Menspesifikasikan bahwa use case target
terjadi pada suatu elemen mandiri memperluas perilaku dari use case sumber
(independent) akan mempengaruhi pada suatu titik yang diberikan.
elemen yang bergantung padanya
Menghubungkan antara objek satu dengan
elemen yang tidak mandiri
objek lainnya.
(independent).

Hubungan dimana objek anak Menspesifikasikan paket yang

(descendent berbagi perilaku dan menampilkan sistem secara terbatas.
struktur data dari objek yang ada
Deskripsi dari urutan aksi-aksi yang
diatasnya objek induk (ancestor).
ditampilkan sistem yang menghasilkan
Menspesifikasikan bahwa use case suatu hasil yang terukur bagi suatu aktor.
sumber secara eksplisit.
9 Note Elemen fisik yang eksis saat aplikasi dijalankan dan
mencerminkan suatu
sumber daya komputasi.

Sumber: Rosa dan Shalahuddin (2015:156)

b. Diagram Activity
Diagram Activity menggambarkan workflow (aliran kerja) atau aktivitas dari
sebuah sistem atau proses bisnis. Simbol-simbol yang digunakan dalam diagram
Activity yaitu:

Tabel 2 Diagram Activity

No Gambar Nama Keterangan

1 Activity Memperlihatkan bagaimana

masing -masing antarmuka
kelas
saling berinteraksi satu sama lain.

2 Action
State dari sistem yang

mencerminkan eksekusi dari suatu

aksi.
 13

3 Initial
Start Point, diletakkan pada pojok

kiri atas dan merupakan awal

aktivitas

4 Final
End Point, akhir aktivitas

5 (Transition) Satu aliran yang pada tahap tertentu

Fork berubah menjadi beberapa aliran.

Sumber: Hendini (2016:4)

c. Diagram Sequence
Diagram Sequence atu diagram urutan merupakan diagram yang
menggambarkan kelakuan objek pada Use Case dengan mendeskripsikan waktu
hidup objek dan pesan yang dikirim dan diterima antara objek (Hendini, 2016:4).
Adapun simbol-simbol yang digunakan dalam Sequence Diagram, antara
lain:
Tabel 3 Simbol Diagram Sequence

No Gambar Nama Keterangan

Objek entity, antarmuka yang saling

1 Lifeline
berinteraksi.

Spesifikasi dari komunikasi antar objek

2 Message yang memuat informasi-informasi tentang aktifitas yang terjadi.

Spesifikasi dari komunikasi antar objek

3 Message yang memuat informasi-informasi tentang

aktifitas yang terjadi.

Menjalankan salah satu operation dari

4 Activation
participant .
 14
Sumber: Ruhamah (2014:59)
d.

Diagram Class
Diagram Class merupakan hubungan antar kelas dan penjelasan detail
tiap-tiap kelas didalam model desain dari suatu sistem, juga memperlihatkan
aturan-aturan dan tanggung jawab entitas yang menentukan perilaku sistem. Class
Diagram juga menunjukkan atribut-atribut dan operasi-operasi dari sebuah kelas
dan constraint yang berhubungan dengan objek yang dikoneksikan (Hendini,
2016:4).

Diagram class bersifat statis yang menggambarkan struktur dan deskripsi

class serta hubungannya antar class.Class diagram mirip dengan ERD pada
perancangan database bedanya ada ERD tidak terdapat method tapi hanya atribut.
Class terdiri dari nama kelas, atribut, dan method (Ruhamah, 2014:58-59). Simbol
diagram class diuraikan pada tabel berikut:
Tabel 4 Simbol Diagram Class
No Gambar Nama Keterangan

Hubungan dimana objek anak

(descendent) berbagi perilaku dan
1 Generalization struktur data dari objek yang ada di
atasnya objek induk (ancestor).

Upaya untuk menghindari asosiasi

Nary
2 dengan lebih dari 2 objek.
Association
 15

Himpunan dari objek-objek yang

berbagi atribut serta operasi yang

aktor.

Operasi yang benar-benar dilakukan

oleh suatu objek.

5 Realization

Hubungan dimana perubahan yang

terjadi pada suatu elemen mandiri
(independent) akan mempengaruhi
6 Depedency elemen yang bergantung padanya
 16
Gambar 2. Tahapan penelitian (R&D)
3.2 Tempat dan Waktu Penelitian
1. Tempat Penelitian
Adapun Lokasi penelitian ini dilakukan bertempat di Kantor Desa Padang
Kalua Kecamatan Bua Kabupaten Luwu.
2. Waktu Penelitian
Adapun waktu penelitian dimulai sejak Maret 2021 sampai Mei 2021.
Diawali dengan pengajuan tema serta judul dibulan Mei dilanjutkan melakukan
observasi serta wawancara pihak terkait hingga akhir Maret.Kemudian dilanjutkan
penyusunan proposal, pengumpulan data serta analisis system (desain) dilakukan
mulai awal April hingga akhir Maret.

3.3 Batasan Penelitian

Dalam hal ini, untuk menghindari terjadinya penyimpangan dalam penulisan
tugas akhir ini, peneliti membatasi masalah yang dibahas antara lain:
1. Aplikasi website yang dibuat akan menampilkan tentang informasi pada
Kantor Desa Padang Kalua Kecamatan Bua.
2. Pemrograman yang digunakan yaitu pemrograman website
berbasis framework dengan menggunakan Codeigneter versi 3.19
PHP5.6.1 dan database MySQL 5.6
3. Desain sistem menggunakan Unified Modeling Language (UML) yang ada
pada aplikasi Microsoft Visio 2010, Sublime Text 3 sebagai text editorcoding
program dan sebagai aplikasi pengolah gambar atau foto yang akan dierapkan
pada website.
4. Perancangan dan pembuatan website Kantor Desa Padang Kalua Kecamatan
Bua yang akan ditampilkan adalah beranda, Profil, Visi Misi, Sejarah ,
Galeri, dan Berita.
5. Pada penelitian Website ini hanya berupa Localhost belum di hosting atau di
onlinekan.

3.4 Tahapan Penelitian

Tahapan penelitian yang digunakan adalah sebagai berikut:
1. Pengumpulan Data
Metode pengumpulan data yang peneliti lakukan dalam penelitian ini
adalah:
 17

a. Observasi
Pada tahapan awal peneltian ini peneliti melakukan observasi secara
pendekatan dan terjun langsung kelokasi atau pada tempat dan area penelitian
yang bertempat di Kantor Desa Padang Kalua Kecamatan Bua, pada saat
observasi peneliti melakukan pengumpulan data di Kantor Desa Padang Kalua.
Tujuan dari observasi ini sendiri agar peneliti dapat lebih memahami prosedur dan
informasi yang ada pada kantor desa. b. Wawancara
Wawancara merupakan cara menjaring informasi atau data melalui interaksi
verbal/lisan. Metode yang peneliti lakukan disisni yaitu bertatap muka langsung
dengan Kepala Desa Padang Kalua yaitu Bapak Rasmin secara lisan mengenai
informasi desa.
c. Studi pustaka
Pada pengumpulan data menggunakan teknik studi pustaka selama penelitian
pengumpulan data dilakukan dengan mencari referensi internet dan
mengumpulkan buku-buku dari perpustakan. Adapun pengumpulan data melalui
internet dengan cara mencari jurnal atau skipsi.
2. Analisis Sistem
Tujuan dari analisis perancangan sistem secara umum adalah untuk
memberikan gambaran secara umum kepada pemakai tentang sistem yang baru.
Perancangan sistem secara umum merupakan persiapan dari perancangan sistem
secara terinci. Berikut adalah analisis sistem yang sedang berjalan dan sistem baru
yang akan diusulkan pada Kantor Desa Padang Kalua Kecamatan Bua. a. Sistem
yang Sedang Berjalan
Menganilisis sistem yang berjalan merupakan salah satu tahap untuk
menganilis suatu sistem dengan tujuan mengetahui apakah ada masalah atau
kesulitan yang ditemui sehingga dapat dilakukan suatu ide-ide baru dengan
membangun sebuah sistem yang baru. Sistem yang berjalan masih menggunakan
sistem yang konvesional. Analisis sistem yang berjalan pada penelitian ini dapat
dilihat pada gambar di bawah ini:
 18

Gambar3.Sistem yang berjalan

Tabel 5. Deskripsi Aktor
No Aktor Deskripsi

1 Masyarakat datang langsung

ke kantor Desa Padang
Kalua untuk mencari informasi yang ditempel pada
papan informasi atau penyampaian lisan.
Masyarakat

2 Pemberian informasi kepada masyarakat dilakukan

dengan cara secara langsung melalui lisan
atau

papan informasi.
Staf Kantor Desa

b. Sistem Yang Diusulkan

Sistem Yang diusulkan penulis sebagai pemecahan masalah dari sistem yang
berjalan sebelumnya adalah membuat website desa.Adapun analisis sistem yang
diususlkan pada penelitian dapat dilihat pada gambar 4.
 19

Gambar 4 Analisis sistem yang

diusulkan Keterangan: a. Admin
Aktivitas yang dilakukan oleh admin pertama melakukan proses login
sesudah melakukan login admin langsung masuk ke halaman beranda yang
memuat tampilan awal, selanjutnya admin melakukan proses pengelolahan data
profil, visi misi, sejarah , berita dan galeri. b. User/Pengunjung(Masyarakat)
Aktivitas yang dilakukan oleh user pada sistem ini bisa melihat informasi
yang terkait tentang Kantor Desa Padang Kalua Kecamatan Bua tanpa melakukan
proses login. Jika masyarakat(user) ingin mengakses informasi seputar Kantor
Desa Padang Kalua mereka dapat melihat informasi melalui website Desa dengan
mengakses situs aplikasi website Desa tersebut.

c. Kebutuhan Fungsional
Kebutuhan fungsional dari aplikasi website yang akan dibuat yaitu sebagai
berikut:
 20
a. Admin Kebutuhan fungsional dari admin 1)
Admin dapat login sebagai admistrator.
2) Admin dapat juga mengelola beranda.
3) Admin juga dapat mengelola informasi profil web desa.
4) Admin dapat mengelola visi misi 5) Admin dapat mengelola sejarah.
6) Admin dapat mengelola galeri
7) Admin dapat mengelola berita
8) Admin dapat melakukan logout pada sistem.
9) Admin juga dapat melihat informasi desa yang sudah diinput pada halaman
website.
b. Kebutuhan fungsional dari user
1) User dapat melihat beranda
2) User dapat melihat informasi Profil desa.
3) User dapat melihat visi misi desa.
4) User dapat melihat sejarah desa.
5) User dapat melihat galeri desa.
6) User dapat melihat berita desa. d. Kebutuhan Nonfungsional
Kebutuhan non fungsional merupakan kebutuhan yang menunjang adanya
kebutuhan fungsional. Adapun kebutuhan non fungsional pada sistem informasi
desa berbasis website berikut:
a. Kebutuhan Perangkat keras
Adapun spesifikasi hardware yanfg digunakan dalam membuat website
pada Desa Padang Kalua Kabupaten Luwu sebagai berikut:
1) Unit CPU Processor Intel® Celeron® Cpu N3060 @1.60GHz( 2 CPUs),
memory 4 GB
2) Monitor
3) Mouse
4) Hardisk 500 GB(Giga Byte) b. Kebutuhan Perangkat lunak
Adapun spesifikasi software yang digunakan dalam membuat website Pada
Desa Padang Kalua Kbupaten Luwu sebagai berikut:
1) Sistem Oprasi menggunakan Windows 10 pro.
2) Xampp 7.411 win 64
3) SublimeText3
4) Codeigneter
5) PHP 7.2.3
 21

6) MySQL 5.6
7) GoogleChrome
3. Desain
Desain sistem merupakan tahap selanjutnya setelah analisis
sistem,mendapatkan gambaran tentang apa yang dikerjakan pada analisa sistem,
maka dilanjutkan dengan memikirkan bagaimana membentuk sistem tersebut.
Dari hasil Observasi, wawancara dan studi pustaka yang dilakukan pada
tahap sebelumnya, maka penulis dapat menganalisa bahwa belum efektifnya
pemanfaatan teknologi informasi dalam proses penyebaran informasi pada Kantor
Desa Padang Kalua, maka penulis menganalisa kebutuhan dan perancangan sistem
yang akan dibuat adalah sebagai berikut : a. Use case Diagram
Use case Diagram adalah gambaran fungsionalitas dari suatu sistem,
sehingga pengguna sistem paham dan mengerti mengenai kegunaan sistem yang
akan dibangun. Dalam use case diagram website ini terdapat dua actor yaitu
admin dan user.
1) Use case Diagram Admin
Use case Diagram admin di bawah ini menggambarkan apa saja yang dapat
dilakukan / diakses oleh admin seperti mengakses halaman login, mngakses
halaman beranda , mengakses profil, mengakses halaman visi misi, mengakses
halaman sejarah , mengakses halaman galeri , mengakses halaman berita dan
mengakses logout. Untuk lebih jelasnya dapat dilihat pada gambar 5.

Gambar 5. Use Case Diagram Admin

 22
2) Use Case Diagram Login Admin
Berikut ini adalah diagram use case login admin pada website Desa Padang
Kalua Kecamatan Bua :

Gambar 6 .Use Case Diagram Login Admin

Gambar 6 menunjukkan bahwa admin melakukan login dengan cara
menginput username dan password lalu menekan tombol login kemudian sistem
akan memvalidasi username dan password yang telah diinput apakah sudah benar
atau belum.

3) Use case Diagram Menu Profil

Gambar 7. Use Case Diagram Menu Profil

Gambar 7 menunjukkan bahwa pada menu profil admin, mengelola halaman
profil dan edit, tambah data, hapus data, dan menyimpan data. 4) Use case
Diagram Menu Visi Misi
 23

Gambar 8. Use Case Diagram Menu Visi Misi

Gambar 8 Menunjukkan bahwa pada menu visi misi admin mengelola
halaman visi misi dan edit data, tambah data, hapus data, dan menyimpan data.
5) Use Case Diagram Menu Sejarah

Gambar 9. Use Case Diagram Menu Sejarah

Gambar 9 menunjukkan bahwa pada menu sejarah admin mengelola
halaman sejarah dan edit data, tambah data, hapus data, dan menyimpan data.
6) Use case Diagram Menu Galeri
 24

Gambar 10 Use Case Diagram Galeri

Gambar 10 menunjukkan bahwa pada menu Galeri admin mengelola
halaman galeri dan edit data , tambah data, hapus data, dan menyimpan data.

7) Use Case Diagram Menu Berita

Gambar 11. Use Case Diagram Berita

Gambar 11 menujukkan bahwa pada menu berita admin mengelola halaman
berita dan edit data, tambah data, hapus data, dan menyimpan data.
8) Use Case Diagram User
 25

Gambar 12. Use Case Diagram User

Gambar 12 menunjukkan bahwa user dapat melihat menu beranda, profil,
user juga dapat melihat visi misi, sejarah, galeri dan menu berita.

b. Activity Diagram
Activity Diagram Mengambarkan rangkaian aliran aktivitas digunakan untuk
mendeskripsikan aktivitas yang dibentuk dalam suatu oprasi sehingga dapat juga
digunakan untuk aktivitas sistm bukan apa yang dilakukan actor, jadi aktivitas apa
yang dapat dilakukan oleh sistem.
1) Activity Diagram login admin
Activity diagram admin login dapat melakukan proses login terlebih dahulu
untuk masuk kehalaman admistrator, seperti pada gambar 13 berikut.
 26

Gambar 13. Activity diagram login admin

2) Activity Diagram Profil Admin
Activity diagram di bawah ini, menjelaskan bahwa admin dapat melakukan
proses tambah, edit, hapus, simpan mengenai profil di Desa Padang Kalua. Selain
itu, maka data profil telah diupdate. Rancangan diagram activity profil seperti
pada gambar 14 berikut.
 27

Gambar 14. Activity Diagram Profil

3) Activity Diagram Visi Misi
Activity diagram di bawah ini, menjelaskan bahwa admin dapat melakukan
proses tambah , edit, hapus, simpan mengenai Visi misi didesa Padang Kalua.
Setelah itu maka data visi misi telah diupdate. Rancangan diagram activity visi
misi seperti pada gambar 15 berikut.

Gambar 15. Activity Diagram Visi Misi Admin

4) Activity Diagram Sejarah
Activity diagram di bawah ini, menjelaskan bahwa admin dapat melakukan
proses tambah , edit, hapus, simpan mengenai Sejarah didesa Padang Kalua.
Setelah itu maka data Sejarah telah diupdate. Rancangan diagram activity Sejarah
seperti pada gambar 16 berikut.
 28

Gambar 16. Activity Diagram Sejarah

5) Activitiy Diagram Galeri
Activity diagram di bawah ini, menjelaskan bahwa admin dapat melakukan
proses tambah , edit, hapus, simpan mengenai galeri didesa Padang Kalua. Setelah
itu maka data galeri telah diupdate. Rancangan diagram activity galeri seperti pada
gambar 17 berikut.
 29

Gambar 17. Activity Diagram Galeri

6) Activity Diagram Berita
Activity diagram di bawah ini, menjelaskan bahwa admin dapat melakukan
proses tambah , edit, hapus, simpan mengenai Berita di Desa Padang Kalua.
Setelah itu maka data berita telah diupdate. Rancangan diagram activity berita
seperti pada gambar 18 berikut.
 30

Gambar 18. Activity Diagram Berita

7) Activity Diagram User Profil
Activity Diagram di bawah ini, user dapat melakukan proses melihat profil
mengenai desa Padang Kalua, yang dilakukan oleh user adalah user memilih
halaman profil desa. Setelah memilih profil desa maka sistem akan menampilkan
halaman profil, selanjutnya user dapat melihat profil desa Padang Kalua.
Rancangan activity diagram user profil seperti pada gambar 19 berikut:
 31

Gambar 19. Activity Diagram User Profil

8) Activity Diagaram User Visi Misi
Activity Diagram di bawah ini, user dapat melakukan proses melihat Visi
Misi mengenai desa Padang Kalua, yang dilakukan oleh user adalah user memilih
halaman visi misi desa. Setelah memilih visi misi desa maka sistem akan
menampilkan halaman visi misi, selanjutnya user dapat melihat visi misi desa
Padang Kalua. Rancangan activity diagram user visi misi seperti pada gambar 20
berikut:
 32

Gambar 20. Activity Diagram User Visi Misi

9) Activity Diagram User Sejarah
Activity Diagram di bawah ini, user dapat melakukan proses melihat Sejarah
mengenai desa Padang Kalua, yang dilakukan oleh user adalah user memilih
halaman Sejarah desa. Setelah memilih Sejarah desa maka sistem akan
menampilkan halaman Sejarah, selanjutnya user dapat melihat Sejarah desa
Padang Kalua. Rancangan activity diagram user Sejarah seperti pada gambar 21
berikut:
 33

Gambar 21. Activity Diagram User Sejarah

10) Activity Diagram User Galeri
Activity Diagram di bawah ini, user dapat melakukan proses melihat Galeri
mengenai desa Padang Kalua, yang dilakukan oleh user adalah user memilih
halaman Galeri desa. Setelah memilih Galeri desa maka sistem akan menampilkan
halaman galeri selanjutnya user dapat melihat Galeri desa Padang Kalua.
Rancangan activity diagram user Galeri seperti pada gambar 22 berikut:
 34

Gambar 22. Activity Diagram User Galeri

11) Activity Diagram User Berita

Activity Diagram di bawah ini, user dapat melakukan proses melihat Berita
mengenai desa Padang Kalua, yang dilakukan oleh user adalah user memilih
halaman Berita desa. Setelah memilih Berita desa maka sistem akan menampilkan
halaman Berita, selanjutnya user dapat melihat Berita desa Padang Kalua.
Rancangan activity diagram user Desa seperti pada gambar 23 berikut:
 35

Gambar 23. Activity Diagram User Berita

c. Sequence diagram
Sequence Diagram adalah suatu diagram yang memperhatikan atau
menampilkan interaksi-interaksi antar objek didalam sistem yang disusun pada
sebuah urutan atau rangkaian waktu. Interaksi antara objek tersebut termaksud
pengguna, disiplin, dan sebagainya berupa pesan.
1) Sequence diagram login admin
Diagram sequence login admin menjelaskan bahwa admin melakukan login
dengan cara memasukkan username dan password kemudian menekan tombol
login, setelah itu sistem akan memvalidasi username dan password yang
dimasukkan oleh admin, jika benar maka sistem akan menampilkan pesan bahwa
username dan password yang dimasukkan salah. Lebih jelas dapat dilihat pada
gambar 24 berikut.

d. Class Diagram
Class diagram dari program aplikasi yang akan dibuat yang saling bereleasi.
Class diagram dapat dilihat pada gambar 27 berikut:
 36

Gambar 27. Class Diagram

e. Rancangan Interface Sistem
Rancangan interface dalam penelitian ini dapat dilihat pada gambar-gambar
dibawah ini:
1) Menu Login Admin
Menu Login Admin digunakan untuk masuk kedalam halaman administrator
untuk mengakses pengelolahan data-data yang dibutuhkan. Berikut menu login
admin dapat dilihat pada gambar di bawah ini :
 37

Gambar 28. Rancangan Interface admin

2) Halaman Admistrator
Halaman admistrator digunakan untuk mengelola data-data yang
dibutuhkan. Berikut halaman admistrator dapat dilihat pada gambar di bawah ini :

Gambar 29. Rancangan Interface admin

3) Menu Beranda
Menu Beranda digunakan untuk menampilkan halaman halaman utama
website.Berikut menu Beranda dapat dilihat pada gambar di bawah ini:
 38

Gambar 30. Perancangan interface menu beranda

4) Menu Profil
Menu Profil digunakan untuk menampilkan halaman profil desa. Berikut
menu profil dapat dilihat pada gambar di bawah ini:

Gambar 31. Perancangan interface menu beranda

5) Menu Visi Misi

Menu Visi Misi digunakan untuk menampilkan halaman visi misi terkait
Desa Padang Kalua. Berikut menu Visi Misi dapat dilihat pada gambar di bawah
ini:
 39

Gambar 32. Perancangan interface menu visi misi

6) Menu Sejarah
Menu Sejarah digunakan untuk menampilkan halaman sejarah yang ada
didesa Padang Kalua. Berikut menu Sejarah dapat dilihat pada gambar dibawah
ini:

Gambar 33. Perancangan interface sejarah

7) Menu Galeri
Menu Galeri digunakan untuk untuk menampilkan halaman gambar yang
ada didesa Padang Kalua. Berikut menu Galeri dapat dilihat pada gambar di
bawah ini:
 40

Gambar 34. Perancangan interface galeri

8) Menu Berita
Menu Berita digunakan untuk menampilkan halaman berita. Berikut menu
berita dapat dilihat pada gambar di bawah ini:

Gambar 35. Perancangan interface berita

f. Rancangan Database
1) Tabel admin
Tabel admin adalah tabel yang digunakan untuk menyimpan data admin.
Tabel ini terdiri dari dari tabel 6 field, yaitu user_id, username, password, e-mail,
nama pengguna dan foto. Rancangan tabel admin dapat dilihat pada tabel 7.
Tabel 6. Admin
No Field Type Keterangan
1. *pengguna_id Int(11) Id pengguna
 41

2. Pengguna_username Vachar(30) User name

3. Pengguna_password Vachar(35) Password
4. Pengguna_email Vachar(50) Email
5. Pengguna_nama Vachar(50) Nama pengguna
6. Pengguna_photo Vachar(40) Foto Pengguna
2) Tabel Profil
Tabel profil adalah tabel yang digunakan untuk menyimpan data admin.
Tabel ini terdiri dari 4 tabel field, yaitu, profil_id, profil_jurnal, profil_isi dan
profil_gambar. Rancangan tabel profil dapat dilihat pada tabel 8.
Tabel 7. Profil
No Field Type Keterangan
1. *profil_id Int(11) Id profil
2. Profil_judul Vachar(100) Judul profil
3. Profil_isi Vachar(100) Isi profil
4. Profil_gambar Vachar(100) Gambar Profil
3) Tabel Visi Misi
Tabel visi misi adalah tabel yang digunakan untuk menyimpan data visi
misi. Tabel ini terdiri dari 6 field, yaitu visi_id, nama, tanggal, deskrisi,
keterangan dan author. Rancangan tabel visi misi dapat dilihat pada tabel 9.
Tabel 8. Visi Misi
No Field Type Keterangan
1. *visi_id Int(11) Id visi misi
2. Visi_judul Vachar(200) Nama Header
3. Visi_tanggal Timestamp Tanggal post
4. Visi_isi Text Isi visi misi
5. Visi_keterangan Vachar(1000) Keterangan
6. Visi_author Vachar(60) Penulis
4) Tabel sejarah
Tabel sejarah adalah tabel yang digunakan untuk menyimpan data admin.
Tabel ini terdiri dari 4 field yaitu, sejarah_id, sejarah_judul, sejarah isi, dan
sejarah_gambar. Rancangan tabel sejarah dapat dilihat pada tabel 10.

Tabel 9. Sejarah
No Field Type Keterangan
1. *sejarah_id Int(11) Id sejarah
2. Sejarah_judul Varchar(100) Judul sejarah
3. Sejarah_isi Varchar(100) Isi sejarah
4. Sejarah_gambar Varchar(100) Gambar sejarah
5) Tabel Galeri
Tabel galeri adalah tabel untuk menyimpan data menu galeri. Tabel ini
terdiri dari 5 field, yaitu galeri_id, galeri_judul, galeri_tanggal, galeri_gambar dan
galeri_author. Rancangan tabel galeri dapat dilihat pada tabel 10.
 42
Tabel 10. Galeri
No Field Type Keterangan
1. *galeri_id Int(11) Id Galeri
2. Galeri_judul Varchar(60) Judul Galeri
3. Galeri_tanggal Timestamp Tanggal Post
4. Galeri _gambar Varchar(40) Foto Galeri
5. Galeri _author Varchar(60) Penulis
6) Tabel Berita
Tabel berita adalah tabel untuk menyimpan data berita terdiri dari 7 field,
yaitu berita_id, berita_nama, berita tanggal, berita_isi,
berita_kategori, berita_gambar dan berita_author. Rancangan tabel berita dapat
dilihat pada tabel
Tabel 11. Berita
No Field Type Keterangan
1. *id_Berita Int(11) Id Berita
2. Berita_Judul Varchar(100) Nama Header
3. Berita_isi Varchar(100) Isi
4. Berita_Gambar Varchar(100) Gambar
5. Berita_Keterangan Varchar (100) Keterangan
4. Pembuatan
Hasil dari design atau perancangan model sistem dengan menggunakan
Unified Modeling Languange (UML). Kemudian melakukan pembuatan program
atau proses coding rancang bangun website pada Kantor Desa Padang Kalua
Kecamatan Bua, dengan menggunakan pemrograman website berbasis framework
dengan menggunakan Codeigneter versi 3.19 PHP 5.6.1 dan database MySQL 5.6
5. Pengujian
Sebelum aplikasi di implementasikan maka perlu dilakukan pengujian
terlebih dahulu untuk menemukan kesalahan-kesalahan terhadap sistem tersebut
kemudian dilakukan perbaikan terhadap website tersebut sehingga menghasilkan
website sesuai dengan kebutuhan yang sebelumnya telah ditentukan. a. Pengujian
Sistem
Pengujian sistem ini akan dilakukan menggunkan pengujian black box. Pada
pengujian black box dilakukan pengujian terhadap fungsi tombol yang ada pada
website. Setiap tombol dan link yang ada akan diuji kesesuaian hasil output dan
tidak adanya error yang ditemukan. b. Penilaian Ahli
Pada setiap pembuatan suatu perangkat lunak harus melewati pengujian, sebelum
perangkat lunak di terapkan atau digunakan untuk menjalankan tugasnya.
Pengujian perangkat lunak tersebut merupakan proses atau rangkaian yang
 43

dirancang untuk memastikan bahwa perangkat lunak tersebut sesuai dengan yang
diharapkan dan agar tidak ada error atau melakukan hal yang tidak diharapkan.
Sehingga dibutuhkan seorang penguji yang bertugas untuk menemukan error
sebanyak mungkin serta mengetahui error yang di hasilkan.
Prosedur untuk melakukan pengujian sistem ini adalah dengan menjalankan
website pada Kantor Desa Padang Kalua Kecamatan Bua yang dilakukan oleh ahli
dalam bidang website.
6. Hasil Akhir
Hasil akhir dari penelitian ini ialah menghasilkan sebuah website Kantor
Desa Padang Kalua Kecamatan Bua. Sistem ini diharapkan dapat diterapkan
sehingga menghasilkan website yang berkualitas dan bermanfaat bagi kebutuhan
yang diperlukan oleh user, serta mempermudah penyebaran informasi dan
pencarian data lainnya dengan memanfaatkan jaringan internet.

DAFTAR PUSTAKA

Agus Ramdhani Nugraha, Gati Pramukasari. Sistem informasi akademik sekolah

berbasis web di sekolah menengah pertama negeri 11 tasikmalaya. Jumika
vol 4.
Ahmad Yani, Beni Saputra. Rancang bangun sistem informasi evaluasi siswa dan
kehadiran guru berbasis web.Jurnal Petir Vol.11.
Akil, Ibnu. 2018. Referensi Dan Panduan UML 2.4 Singkat Tepat Jelas Surabaya:
CV.Garuda Mas Sejahtera.
Bambang Suprayogi, Abdur Rahmanesa. 2019. Penerapan framework bootstrap
dalam sistem informasi pendidikan sma negeri 1 pacet cianjur jawa barat.
jurnal Teknologi Informasi Dan Komunikasi Vol. 6, No. 2.
Cholififah, dkk. 2018. Pengujian Black Box Testing Pada Aplikasi Action dan
Strategy Berbasis Android Dengan Teknologi Phonegap. Jurnal
String .Vol. 3 No.2. p-ISSN:2527 – 9961 e-ISSN: 2549-2837.
Cut Fachrul Rozi, Sarina Vita Dewi.2020. Rancang bangun aplikasi e-voting
pemilihan geuchik pada kecamatan kluet utara ( sk: di desa krueng batee )
berbasis web. Journal of Informatics and Computer Science Vol. 6.
Dadang Haryanto, Dhea Argadila. 2019. Sistem informasi pengarsipan data
konsumen di pt. Dinasti pertiwi “perumahan dewasari. Jutekin vol 7 no. 1
Destiningrum dan Adrian.2017. Sistem Informasi Penjadwalan Dokter Berbasis
Web Dengan Menggunakan Framework Codigniter (Studi Kasus: Rumah
 44
Sakit Yukum Medical Centre).Jurnal TEKNOINFO. Vol. 11, No. 2, 30-37.
ISSN 16930010.
Diah Pradiatiningtyas , Suparwanto . E-Learning Sebagai Media Pembelajaran
Berbasis Web Pada Smk N 4 Purworejo. Indonesian Journal on Networking
and Security - Volume 7.
Eviana septiana rachman, Beni noviyanto 2017. Pemanfaatan e-government pada
desa wonokarto untuk meningkatkan akurasi dan informasi potensi desa.
Jurnal tam (technology acceptance model) volume 8.
Farell Geovanne, dkk. 2018. Rancang Bangun Sistem Informasi Pengarsipan
Surat Menyurat. Jurnal Teknologi Informasi dan Pendidikan. Vol. 11, No. 2.
Herman Sanusi,Anwari S.kom,MT, Bakir, S.Si, MP 2019. Rancang bangun
sistem manajemen 1informasi desa grujugan berbasis web. Nasional
Humaniora &Aplikasi Teknologi Informasi.
Iwan Setiawa, Suhartini,dan Sebri Hesinto 2018. Rancang Bangun Website
Kecamatan Prabumulih Selatan.TEKNOMATIKA Vol.08, No.2.
Jimi Asmara 2019. Rancang Bangun Sistem Informasi Desa Berbasis Website
(Studi Kasus Desa Netpala). Jurnal Pendidikan Teknologi Informasi
(JUKANTI) Volume (2) No (1).
Prabowo. 2017. Sistem Informasi Pengolahan Sertifikat Berbasis Web Di Divisi
Training Seamolec. Jurnal Masyarakat Informatika Indonesia. Vol 2 1:75.

53

Putratama. 2016. Pemograman Web dengan Menggunakan PHP dan Framework

Codeigniter. Garut: Supono Publis.
Putri Destiana, Gata Windu, Warjiyono 2020. Rancang Bangun Website Desa
Demangharjo. Jurnal ilmiah elektronika dan computer.vol 13.
Ramadhan dan Uus. 2018. Membangun Aplikasi dengan PHP Codeigneter dan
Ajax. Kompas Gramedia. Jakarta.
Ratnasari, Elita. 2017. Pengertian dan Fungsi Xampp. Modul
Online.https://www.ilmuti.org/wp-content/.../2017/10/
Elita_RatnasariPengertian-dan-Fungsi-Xampp.pdf.
Rio Bayu Sentosa. 2018. Membangun web konten manajemen sistem secara
dinamis dengan bahasa pemrograman php framework codeigniter dengan
database mariadb. Journal of Information Technology and Computer
Science Volume 1 No 2.
Rosa dan Shalahuddin M. 2015. Rekayasa Perangkat Lunak Terstruktur Dan
Berorientasi Objek. Informatika. Bandung.
Rozul imam, agus ramdhani nugraha. Perancangan sistem informasi
emarketplace original clothing indonesia berbasis web. Jumantaka vol 01.
 45

Ruhamah. 2014. Perancangan Aplikasi E-Voting Berbasis Web Pemilihan

Presiden BEM. Journal d’computar’E. 4 edisi januari: 58.
Saifudin,Karina Murti Dwi Maharani. Sistem Informasi Pemesanan Tiket Shuttle
Berbasis Web Pada PO. Sumber Alam Purwokerto. Indonesian Journal on
Networking and Security - Volume 7.
Sari, Yuntari P. 2017. Rancang Bangun Aplikasi dan Penjualan Obat Pada
Apotek Merben. JSK.1 edisi Juni: 81.
Sistem Informasi Inventori Barang menggunakan Metode Object Oriented di PT.
Livaza Teknologi Indonesia Jakarta. Jurnal Prosisko. Vol 5 No. 1.
Subriadi, Irwin, dkk. 2018. Rancang Bangun Aplikasi Surat Masuk dan Surat
Keluar Berbasis Website pada Kantor Asuransi Jiwa Kantor Layanan
Administrasi Bandung. Jurnal Konfrensi Nasional Sistem Informasi. Edisi
Maret: 980.
Supriatiningsih, Mahmud Safudin, Eko Yulianto. Rancang bangun Sistem
Informasi Pelayanan Masyarakat Berbasis Web Pada Desa Sambeng Kulon
Kabupaten Banyumas. Indonesian Journal on Software Engineering, Vol.5.
Vembria Rose Handayani,Ragil Wijianto,Ari Anggoro. 2018.Sistem informasi
pendaftaran seleksi kerja berbasis web pada bkk (bursa kerja khusus) tunas
insan karya Smk negeri 2 banyumas. jurnal Evolusi Volume 6 No 1.