## DESIGN AND ANALYSIS WEBSITE TEACHERS HIGH SCHOOL (CASE STUDY SMAN 2 PANGKALAN BUN KOTAWARINGIN  BARAT CENTRAL KALIMANTAN)
V. Abdi Gunawan 1) , Abertun Sagit Sahay 2)
1,2) Department of Informatics, Faculty of Engineering, Palangka Raya University Palangkaraya
Email : abdi_gnwn@yahoo.com 1) , abertun@gmail.com 2)

## Abstract
With  the  growing  world  of  technology  and  information,  many  teachers  use  LCD  projectors  in performing its duties. However, many students want to file material used by the teacher. Not infrequently the  student  fails  to  obtain the  file.  Seeing these  conditions,  the  National  High  School  2  Pangkalan  Bun has a website that is intended for all students to acquire learning materials and also the announcement of which is managed by the teacher.
In  the  analysis  and  design  of  this  school  website,  software  development  method  used  is  Linear Sequential or too waterfall. The steps followed in this method include taapan analysis and design phases. Unified Modeling Language (UML) is used this stage which is a tool in the process. UML diagrams used are usecase diagrams, activity diagrams and class diagrams.
From the analysis and design, looks actor who created are teachers, visitors and admin. Usecase produced  is  manage  announcements,  news  management,  material  management,  profile  management, governance  subjects  for  teachers  actor.  As  for  the  actor  admin  usecase  that  there  is  a  teacher  account management.  As  for  the  visitors just  biased  view  news,  announcements,  download  the  material  and  see the teacher profile.

## Keywords: Website, diagrams
1. Pendahuluan

## 1.1 Latar Belakang
Perkembangan  teknologi  informasi sekarang ini sangat pesat, bisa dikatakan semua  bidang  yang  ada  di  dunia  ini merasakan  keuntungan  dengan  makin berkembangnya  teknologi  informasi  ini. Secara  khusus  dalam  bidang  pendidikan peranan teknologi sekarang ini sangatlah dibutuhkan. Apabila kita melihat mundur sekitar  20  tahun  yang  lalu,  dimana teknologi  informasi  masih sangat  minim penggunaannya dan  proses  informasi itu sampai ke orang masih lamban.
Sangat  berbeda  dengan  keadaaan teknologi  yang  ada  sekarang  ini,  hanya dalam  hitungan  beberapa  detik  saja, informasi  yang kita sampaikan langsung
bisa  diterima  oleh  orang  banyak  secara luas.
Dalam  proses  belajar  dan  mengajar sekolah  menengah  atas,  kebanyakan guru yang mengajar juga sudah memanfaatkan teknologi zaman sekarang. Contohnya ketika memberikan pengajaran di ruang kelas, guru menyampaikan  materi  menggunakan teknologi  digital  yaitu  dengan  LCD Proyektor dan Laptop yang berisi materi.
Agar materi pelajaran itu bisa sampai kepada  semua  siswa  tanpa  harus memberikan  kepada  beberapa  siswa, maka  diperlukan  sebuah  website  khusus yang  dikelolah  oleh  guru-guru  untuk mengunggah  materi  pelajarannya.  Dan materi  yang  diunggah  oleh  guru-guru
tersebut  bisa  diakses  atau  diunduh  oleh siswa.

## 1.2 Rumusan Masalah
Dari  latar  belakang  yang  diuraikan diatas, maka dapat dirumuskan permasalahan sebagai berikut “Bagaimana analisis dan desain Website Guru  Sekolah  Menengah  Atas    (Studi
Kasus SMAN 2 Pangkalan Bun Kabupaten  Kotawaringin  Barat  Provinsi Kalimantan Tengah) ?

## 1.3 Batasan Masalah
Batasan  masalah  dari  laporan  ini adalah :
1. Peralatan atau software yang digunakan dalam perancangan diantaranya Adobe Dreamweaver, Wampserver, PhpMyAdmin (MySQL).
2. Website yang dirancang hanya dikelolah oleh guru.
3. Guru dapat mengelolah materi, mengelolah pengumuman,
menambahkan  data  mata  kuliah,  dan mengelolah profilnya.

## 1.4 Pengertian Internet
Secara  umum  Internet  merupakan jaringan  global  yang  terbentuk  dari jaringan komputer lokal dan regional,memungkinkan komunikasi  data  antar  komputer-komputer yang  terhubung  ke  jaringan  tersebut  dengan menggunakan berbagai macam media seperti  jalur  telepon,  jaringan  seluler,  dan lain sebagainya. Internet berasal dari bahasa inggris,  yakni  inter  berarti  antar  dan  net berarti  jaringan  sehingga  dapat  diartikan hubungan antar jaringan. (Bunafit Nugroho, 2004) .

## 1.5 Pengertian Website
Website  atau  situs  adalah  kumpulan halaman  yang  menampilkan  informasi  data teks,  data  gambar  diam  atau  gerak,  data
animasi, suara, video dan atau gabungan dari semuanya,  baik  yang  bersifat  statis  maupun dinamis  yang  membentuk  satu  rangkaian bangunan  yang  saling  terkait  dimana masing-masing dihubungkan dengan jaringanjaringan halaman (Hyperlink). Bersifat  statis  apabila  isi  informasi  website tetap,  jarang  berubah,  dan  isi  informasinya searah  hanya  daripemilik  website.  Bersifat dinamis apabila  isi  informasi  website  selalu berubah-berubah,  dan  isi  informasinya interaktif dua arah berasal dari pemilik serta pengguna website. (Athkinson:2004).
1.6 Unified Modeling Language (UML)
1.6.1 Pengenalan UML
Pada perkembangan teknologi
perangkat  lunak,  diperlukan  adanya  bahasa yang digunakan untuk memodelkan perangkat  lunak  yang akan dibuat dan perlu adanya  standarisasi  agar  orang  di  berbagai negara dapat mengerti pemodelan perangkat lunak.

## 1.6.2 Use Case
Dalam  membuat  sebuah  sistem, langkah  awal  yang  perlu  dilakukan  adalah menentukan  kebutuhan.  Terdapat  dua  jenis kebutuhan,  yaitu  kebutuhan  fungsional  dan kebutuhan nonfungsional. Kebutuhan fungsional  adalah  kebutuhan  pengguna  dan stakeholder sehari-hari  yang  akan  dimiliki oleh  sistem,  dimana  kebutuhan  ini  akan digunakan  oleh  pengguna  dan stakeholder . Sedangkan  kebutuhan  nonfungsional  adalah kebutuhan  yang  memperhatikan  hal-hal berikut yaitu performansi, kemudahan dalam menggunakan  sistem,  kehandalan  sistem, keamanan  sistem,  keuangan,  legalitas,  dan operasional. (Nick Jenkins, 2005).

## 1.7 Metodologi Penelitian
1.7.1 Lokasi Penelitian
Objek  penelitian  adalah  Kantor Kecamatan  Danau  Sembuluh  Kabupaten Seruyan Provinsi Kalimantan Tengah.
1.7.2 Alat dan Bahan Adapun alat dan bahan yang diperlukan dalam rancang bangun perangkat lunak ini meliputi:
1. Komputer  atau notebook dengan spesifikasi  i3,  dengan  RAM  2  GB dan  sistem  operasi  yang  digunakan berbasis Microsoft windows 7.
2. Perangkat  Lunak  dalam  analisis  dan desain website ini adalah
a. Microsoft  Office  Visio 2007 untuk pembuatan desain sistem.
b. StarUML

## 1.7.3 Metode Pengembangan Sistem
Metodologi  pelaksanaan  penelitian yang  digunakan  mengadopsi  metodologi pengembangan    perangkat    lunak,      yaitu Waterfall Model.
Gambar 1. Tahapan Paradigma Waterfall
a. Analysis (Analisis)
Proses pencarian kebutuhan difokuskan pada perangkat lunak, dimana akan didefinisikan fasilitas yang ada  dalam  perangkat  lunak  Pada  tahap ini  dilakukan  analisis  sistem  untuk memperoleh  informasi  tentang  sistem, menganalisis  data-data  yang  ada  dalam sistem.
b. Design (Desain)
Pada tahap ini merupakan perancangan  sistem  baru  berdasarkan data-data  yang  telah  dikumpulkan  pada tahap sebelumnya dengan cara merancang  perangkat  lunak  diantaranya
Alur user interface, UML, serta rancanagan input dan output.

## 2. Pembahasan

## 2.1 Use Case
Sebuah use  case menggambarkan suatu  urutan  interaksi  antara  satu  atau  lebih aktor dan sistem. Setiap use case menggambarkan  perilaku  sejumlah  aspek sistem, tanpa mengurangi struktur internalnya.  Selama  pembuatan  model  use case  secara  pararel  juga  harus  ditetapkan obyek-obyek  yang  terlibat  dalam  setiap  use case.

## 2.2 Aktor Use Case
Tabel 1. Aktor Use Case No Aktor Deskripsi 1 Guru Guru  merupakan  orang  yang  berhak mengelola  data  materi  pelajaran, data  pengumuman  pelajaran,  data profil  dirinya,  dan  menambahkan data Mata Pelajaran. 2 Admin Admin  merupakan  orang  yang berhak mengaktifkan dan menonaktifkan  akun  guru.  Admin juga  berhak  untuk  menghapus  akun guru. Admin juga dapat menambahkan  akun  yang  menjadi akun baru. 3 Siswa / Pengunjung Siswa atau juga pengunjung website merupakan orang yang dapat melihat  pengumuman,  mengunduh materi  pelajaran,  dan  melihat  profil guru yang terdaftar yang aktif.

## 2.2.1 Use Case per Aktor
Tabel 2. Use Case Guru
No Use Case Deskripsi 1 Login Merupakan proses dimana guru  akan  masuk  ke dalam  sistem.  Ada  dua permintaan inputan di proses ini, yaitu username dan  password.  Guru  yang berhasil  melewati  proses ini  adalah  guru  yang akunnya sudah aktif. 2 Daftar Merupakan proses dimana guru  membuat  akun  baru. Data-data yang perlu dimasukkan  dalam  proses ini  diantaranya  username, Analys is Design Coding Testin
g Maintanance
password,  nama,  jabatan, nip,  dll.  Akun  baru  yang didaftarkan oleh guru tidak  akan  langsung  aktif. Hanya admin yang mempunyai wewenang mengaktifkan akun. 3 Kelola  Mata Pelajaran Merupakan proses dimana guru  menambahkan  Mata Pelajaran  ke  dalam  basis data. 4 Kelola Materi Merupakan proses dimana guru  dapat  menambahkan materi baru, memperbaharui (mengedit)  materi  yang sudah  ada  di  basis  data, dan juga untuk menghapus  materi  dari basis data 5 Kelola Pengumuma n Merupakan proses dimana guru dapat membuat pengumuman baru, memperbaharui pengumuman  yang  sudah ada,  dan  juga  menghapus pengumuman  dari  basis data. 6 Kelola Profil Merupakan proses dimana guru akan memperbaharui profil  dari  dirinya  sendiri. Pada  proses  ini,  guru dapat  mengunggah  1  foto yang nantinya akan
dijadikan foto profil guru.
Tabel 3. Use Case Admin
No Use Case Deskripsi 1 Login Merupakan  proses  dimana  admin
masuk  ke  dalam  sistem.  Untuk  login akan  dibutuhkan username  dan password milik admin. 2 Kelola Akun Merupakan  proses  dimana  admin dapat mengaktifkan akun yang terdaftar  atau  menonaktifkan  akun yang  sebelumnya  aktif,  serta  admin juga  dapat  menghapus  akun.  Akun yang  dikelola  ini  merupakan  akun guru. 3 Kelola Admin Merupakan  proses  dimana  admin dapat menambahkan akun baru untuk admin, namun tidak dapat menghapusnya.
Tabel 4. Use Case Siswa / Pengunjung
No Use Case Deskripsi 1 Mengunduh materi Merupakan proses dimana  Siswa  atau pengunjung dapat mengunduh materi
yang dibuat oleh guru 2 Melihat Pengumuman Merupakan proses dimana  Siswa  atau pengunjung dapat melihat  pengumuman yang sudah dibuat oleh guru 3 Melihat profil Merupakan proses dimana  Siswa  atau pengunjung dapat melihat  profil  guru satu per satu.

## 2.3 Use Case Diagram
Gambar 2. Use Case Diagram
Dari  Gambar  2,  terdapat  tiga  aktor, diantaranya  aktor  admin,  aktor  guru,  dan aktor  pengunjung.  Aktor  pengunjung  ini secara  nyata  bisa  jadi  siapa  saja,  guru  yang belum  terdaftar  atau  guru  yang  belum  login akan  dianggap  pengunjung.  Siswa  juga berada  pada  aktor  pengunjung.  Setiap  aktor ini mempunyai tugas masing-masing.

## 2.4 Activity Diagram
Activity  diagram menggambarkan berbagai  alir  aktivitas  dalam  sistem  yang sedang dirancang, bagaimana masing- masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir.
Guru Kelola Materi Kelola Pengumuman Kelola Mata Pelajaran Kelola Profil Login Pengunjung Mengunduh Materi Melihat Profil Melihat Pengumuman Admin Kelola Akun
Gambar 3. Activity Diagram Guru
Gambar 3 di atas menjelaskan secara keseluruhan  aliran  aktivitas  untuk  aktor guru.  Secara  garis  besar  aktivitas  utama aktor  guru  ada  4,  diantaranya  (1)  aktivitas untuk  mengelola  materi,  (2)  aktivitas  untuk mengelola  materi,  (3)  aktivitas  untuk mengelola profil, dan (4) aktivitas mengelola Mata Pelajaran.
Gambar 4. Activity Diagram Admin
Gambar 4 di atas menjelaskan secara keseluruhan  aliran  aktivitas  untuk  aktor admin.  Secara  garis  besar  aktivitas  utama aktor  admin  ada  2,  yaitu  untuk  mengelola akun guru (kelola akun) dan juga mengelola admin.

## 2.5 Class Diagram
Gambar 5 Class Diagram 2.6 Desain Interface (Template) 2.6.1 Desain Interface Home
Login Kelola materi Kelola Pengumuman Kelola Profi Kelola Mata Pelajaran Tambah Edit Hapus Tambah Edit Hapus Edit Tambah Edit Hapus Login Kelola Akun Aktifkan Akun NonAktifkan Akun Hapus AKun Main +UIMain() +UILogin() +UIKelola_Materi() +UIKelolaProfil() +UIKelolaMataPelajaran() +UIKelolaPengumuman() +UIKelolaAKun() KelolaPengumuman +tambahPengumuman() +EditPengumuman() +hapusPengumuman() KelolaProfil +ubahProfil() Kelola_Materi +tambahMateri() +editMateri() +hapusMateri() KelolaMataPelajaran +tambah() +edit() +hapus() KelolaAkun +aktifkan() +nonaktifkan() +hapus() Login +validasilogin() +logout() tblAdmin +usename varchar(20) +pwd varchar(20) +get Username() +set Username() +get Pwd() +set Pwd() tblMateri +idMateri +idPelajaran +judul +materi +idGuru +tglUpload +get idMateri() +set idMateri() +get judul() +set Judul() +get Materi() +set Materi() +get IdGuru() +set IdGuru() +get TglUpload() +set TglUpload() tblPengumuman +idPengumuman +idDosen +Judul +isi +tgl +get idPengumuman() +set IdPengumuman() +get IdDosen() +set IdDosen() +get Isi() +set isi() +get tgl() +set tgl() tblMataPelajaran +idPelajaran +matapelajaran +get idPelajaran() +set IdPelajaran() +get MataPelajaran() +set MataPelajaran() tblGuru +idGuru +username +pwd +foto +nama +nip +jabatan +alamat +email +status +get idGuru() +set idGuru() +get usename() +set username() +get pwd() +set pwd() +get foto() +set foto() +get nip() +set nip() +get jabatan() +set jabatan() +get alamat() +set alamat() +get email() +set email() +get status() +set status() Website Guru SMAN 2 Pangkalan Bun Logo Beranda Materi Pengumuman Login Guru Daftar Guru Guru Footer
Gambar 6. Desain Interface Home
Gambar 4.6 di atas merupakan desain interface atau template Home website  ini.  Dalam  template  ini terdapat tiga presentation class diantaranya  (1)  presentation  class Navigasi  website,  (2)  presentation class Website Body, dan (3) presentation class Footer. Presentation  class  Navigasi  Website digunakan untuk menampilkan menu website.  Elemen  interface  yang terdapat disini adalah anchor.
Presentation  Class  Body  Website digunakan untuk menampilkan gambar  guru  dan  nama  guru  yang diambil  dari  basis  data.  Elemen interface  yang  terdapat  disini  adalah anchor dan image. Presentation Class Footer digunakan untuk menampilkan footer website. Elemen interface  yang  terdapat  disini  adalah text dan image.

## 2.6.2 Desain Interface Materi
Gambar 7. Desain Interface Materi

## 3. Kesimpulan
Dalam  analisis  dan  desain  Website Guru SMAN 2 Pangkalan Bun menggunakan Unified Modelling Language  dimana  dari  usecase  diagram terdiri  dari  tiga  aktor  yaitu  guru, pengunjung  dan  admin.  Dimana  Guru dapat  megelola  Materi,  Pengumuman, Mata Pelajaran, Edit Profil. Pengunjung dapat melihat semua konten yang ada di website  tersebut  salah  satunya  adalah
melihat  profil  guru,  mendownload materi, berita, pengumuman. Sementara Admin  dapat  mengelola  keanggotaan dalam  hal  ini  mengelola  akun.  Dari class  diagram,  terdapat  beberapa  class tabel  yaitu  Tabel  Pengumuman,  tabel materi,  tabel  mata  pelajaran,  tabel admin, tabel guru.

## 4. Saran
Hasil dari  analisis dan desain  Website Guru  diharapkan  dapat  dilanjutkan  pada tahapan  implementasi  sehingga  diperoleh produk  dari  website  ini  yang  dapat langsung  digunakan  oleh  Guru  maupun pengunjung  dalam    hal  ini  siswa  dari SMAN 2 Pangkalan Bun.

## Daftar Pustaka
Agus, Ridho, Saluky. 2012. Membangun Aplikasi E-Goverment Untuk
Paduan  Skripsi .  Penerbit  :  PT.
Elex Media Komputindo, 2012.
Nanda.2011 Metode  Waterfall .  (Online http://dc306.4shared.com/doc/S5q cBhKW/preview.html ) Diakses
2013
Rullyadia.2010 Definisi  e-Government
(Online
elib.unikom.ac.id/download.php?i d=8819 ) Diakses 2014
Suprianto,  Dodit.  2008. Buku  Pintar Pemprograman  PHP .  Penerbit  :
OASE Media, 2008.
Website Guru SMAN 2 Pangkalan Bun Logo Nama Dosen Logout Footer Kelola Materi Kelola Pengumuman Kelola Mata Pelajaran Edit Profil Isi Kelola