Perancangan dan Implementasi - LAPORAN KERJA PRAKTEK

Didalam melakukan analisis data menggunakan beberapa teknik pengumpulan data yang digunakan untuk pengembangan sistem secara keseluruhan. Adapun teknik pengumpulan data yang digunakan sebagai berikut:

1. Obeservasi dilakukan dengan pengamatan dan pencatatan alur proses yang terjadi secara sistematik sehingga sesuai dengan rencana dan metode yang telah ditentukan.

2. Wawancanara dilakukan dengan melalui tatap muka dan tanya jawab secara langsung dengan pihak sekolah, hal ini bertujuan untu memperoleh informasi secara langsung sehingga memperjelas kebutuhan dari sistem yang akan dikembangkan.

Dengan mendapatkan kebutuhan tambahan yaitu:

1. Menambahkan menu berita terkini yang memuat gambar, deskripsi, dan komentar.

2. Menambahkan menu galeri kegiatan yang terdapat video kegiatan yang dapat di import dari Youtube, gambar kegiatan.

3. Menambahkan menu pengumuman yang dapat memuat dekripsi, dan ekstensi PDF.

31 4. Menambahkan fitur maps pada menu kontak.

5. Menambahkan menu prestasi.

5.2.2 Construction

Hasil rancangan dari pengembangan sistem informasi sekolah dengan penambahan beberapa menu sebagai berikut:

1. Menu berita terkini

Gambar 4. 14 Mockup halaman berita terkini

Source code berita terkini

<?php

foreach ($data['items'] as $item) :

if ($this->uri->segment(1) ==

'prestasi' || $this->uri->segment(1) == 'berita-terkini') {

$badge =

$item['sub_kategori'];

}

32 ?>

<a href="<?php echo

base_url($data['slug'] . '/' . $item['id_berita']); ?>">

<img src="<?php echo base_url('assets/img/news/' . $item['gambar_utama']); ?>"

alt="<?php echo

$item['gambar_utama']; ?>">

<?php if (isset($badge)) : ?>

<span

class="badge-1

<?php echo $badge == 'GURU' ? 'red lighten-3' : 'orange lighten-3'; ?>"><?php echo strtoupper($badge); ?></span>

<?php endif; ?>

</div>

<div class="card-content tooltipped"

data-tooltip="<?php echo ucwords($item['judul']); ?>">

<p>

<?php echo strlen($item['judul']) > 40 ?

substr(ucwords($item['judul']), 0, 40) . '...' : ucwords($item['judul']); ?>

</p>

<?php echo strlen($item['deskripsi']) > 60 ?

substr(ucwords($item['deskripsi']), 0 ,60) . '...' : ucwords($item['deskripsi']); ?>

</p>

</div>

</a>

</div>

<?php endforeach; ?>

</div>

33 2. Menu berita terkini detail

Gambar 4. 15 Mockup halaman berita terkini detail

Source code detail berita terkini

</div>

<p>

Diposting pada : <?php echo

normalization_of_date_reverses($data['details']['tanggal' ]); ?>

34 </p>

<?php if ($this->uri-

>segment(1) == 'prestasi' || $this->uri->segment(1) ==

'pengumuman' || $this->uri->segment(1) == 'berita- terkini') : ?>

<span

class="badge-2

<?php echo $data['details']['sub_kategori'] == 'TK' ? 'red lighten-3' : 'orange lighten-3'; ?>"><?php echo strtoupper($data['details']['sub_kategori']); ?></span>

<?php endif; ?>

</div>

<?php if ($this->uri->segment(1)

!= 'pengumuman') : ?>

<img src="<?php echo base_url('assets/img/news/' .

$data['details']['gambar_utama']); ?>"

alt="<?php echo

$data['details']['gambar_utama']; ?>" class="w-full">

</div>

<?php endif; ?>

</div>

<?php if ($this->uri->segment(1)

== 'pengumuman') : ?>

<embed

src="<?php echo base_url('assets/files/'.$data['details']['file_pengumuma n']); ?>"

type="application/pdf

" frameBorder="0" scrolling="auto" height="400px"

width="100%">

</embed>

</div>

<?php endif; ?>

</div>

35 </div>

</div>

3. Menu galeri kegiatan

Gambar 4. 16 Mockup halaman berita terkini detail

<?php

foreach ($data['items'] as $item) : $image = $this-

>image_information_model->get_where(['id_informasi' =>

$item['id_informasi']]);

if ($this->uri->segment(1) ==

'galeri-kegiatan') {

$badge = $item['sub_kategori'];

} ?>

36 <h5><?php echo

ucwords($item['judul']); ?></h5>

<?php if (isset($badge)) : ?>

<span

class="badge-2

<?php echo $badge == 'GURU' ? 'red lighten-3' : 'orange lighten-3'; ?>"><?php echo strtoupper($badge); ?></span>

<?php endif; ?>

</div>

<?php if (count($image) >

1) : ?>

<a href="<?php echo base_url($data['slug'] . '/' . $item['id_informasi']);

?>"

class="btn-oval secondary waves-effect">Selengkapnya</a>

</div>

<?php endif; ?>

</div>

<img src="<?php echo base_url('assets/img/informations/' .

$image[0]['gambar']); ?>"

alt="<?php echo

$item['judul']; ?>">

</div>

<?php endforeach; ?>

<?php echo $data['pagination']; ?>

</div>

37 4. Halaman detail galeri kegiatan

Gambar 4. 17 Mockup halaman detail galeri kegiatan

</div>

<h7>Video Galeri Kegiatan</h7>

<iframe width="560"

height="315"

38 src="<?php echo ucfirst($data['details']['linkvideo']); ?>"

frameborder="0"

allowfullscreen><

/iframe>

</div>

<h7>Foto Kegiatan</h7>

<?php

$images =

$this->image_information_model->get_where(['id_informasi'

=> $data['details']['id_informasi']]);

foreach ($images as $image) :

<img src="<?php echo base_url('assets/img/informations/' .

$image['gambar']); ?>"

alt="<?ph p echo $image['gambar']; ?>">

</div>

<?php endforeach;

</div>

<a href="#!"

class="prev waves-effect waves-light"><i

class="ma terial-icons">keyboard_arrow_left</i></a>

<a href="#!"

class="next waves-effect waves-light"><i

class="ma terial-icons">keyboard_arrow_right</i></a>

</div>

39 4.2.3 Hasil dan Deployment

Pada tahapan Construction sistem, hasil rancangan yang telah dibuat kemudian diterapkan pada sistem informasi sekolah sehingga sistem dapat digunakan oleh client (pihak sekolah) dan akan bisa dilakukan tahapan deployment.

Sistem informasi sekolah adalah sistem yang berbasis website yang terdiri dari beberapa tampilan sebagai berikut:

1. User

1.1 Tampilan berita terkini

Tampilan halaman berita terkini digunakan untuk menampilkan berita dari sekolah yang isi dari berita tersebut di input dari sisi admin. Pada berita terkini terdapat beberapa kategori yang ditujukan untuk guru ataupun siswa.

Terdapat feedback dari client yang mengharuskan terjadi perbaikan dari tampilan. Sehingga memperoleh hasil akhir seperti berikut:

Gambar 4. 18 Hasil halaman berita terkini

40 1.2 Tampilan berita terkini detail

Halaman detail berita terkini digunakan untuk menampilkan isi berita dari setiap berita yang ada. Dihalaman ini juga dapat menambahkan komentar untuk berita tersebut. Feedback dari client untuk halaman ini sudah sesuai keinginan.

Gambar 4. 19 Hasil halaman detail berita terkini

41 1.3 Tampilan galeri kegiatan

Pada tampilan halaman galeri kegiatan digunakan untuk menampilkan foto dan video dari kegiatan yang dilakukan oleh pihak sekolah. Untuk fitur video menggunakan link embed yang didapat dari platform youtube.

Sebelum tahap akhir, halaman galeri ini tidak disertai fitur video, namun terdapat permintaan client untuk menambahkan fitur video pada halaman galeri kegiatan ini

Gambar 4. 20 Hasil halaman galeri kegiatan

42 Gambar 4. 21 Hasil halaman detail galeri kegiatan

1.4 Tampilan pengumuman

Pada tampilan halaman pengumuman ini digunakan untuk menampilkan pengumuman dari pihak sekolah yang dapat dikategorikan untuk siswa ataupun guru. Pada tampilan pengumuman ini terdapat fitur menampilkan ekstensi PDF untuk menampilkan file yang di input. Tidak ada komentar dari pihak client.

43 Gambar 4. 22 Hasil halaman pengumuman

Gambar 4. 23 Hasil halaman detail pengumuman

44 1.5 Tampilan berita prestasi

Pada tampilan halaman berita prestasi ini ditujukan untuk menampilkan informasi prestasi yang ada disekolah. Pada halaman ini terdapat gambar dan deskripsi yang di input dari sisi admin. Tidak ada komentar dari pihak client.

Gambar 4. 24 Hasil halaman berita prestasi

Gambar 4. 25 Hasil halaman detail berita prestasi

45 2. Admin

2.1 Tampilan form berita terkini

Tampilan form berita terkini digunakan untuk menampilkan informasi yang berkaitan tentang berita dari sekolah seperti judul, gambar, tanggal, dan deskripsi. Pada form ini juga dapat digunakan untuk menambah, mengubah, melihat detail, dan menghapus data berita terkini. Terdapat perubahan yang diminta oleh client pada bagian sub ketegori.

Gambar 4. 26 Tampilan admin form berita terkini 2.2 Tampilan form galeri kegiatan

Tampilan form galeri kegiatan digunakan untuk menampilkan informasi yang berkaitan tentang galeri dari sekolah seperti nama kegiatan, deskripsi, link untuk menampilkan video, memilih kategori, dan gambar dari kegiatan.

Pada form ini juga dapat digunakan untuk menambah, mengubah, melihat detail, dan menghapus data galeri kegiatan. Pihak client sudah cukup dengan tampilan yang ada.

Gambar 4. 27 Tampilan admin form galeri kegiatan 2.3 Tampilan form pengumuman

Tampilan form pengumuman digunakan untuk menampilkan informasi yang berkaitan tentang galeri dari sekolah seperti judul pengumuman, tanggal, sub kategori, file yang berekstensi PDF dan deskripsi. Pada form ini juga dapat digunakan untuk menambah, mengubah, melihat detail, dan menghapus data pengumuman. Pihak client sudah cukup dengan tampilan yang ada.

Gambar 4. 28 Tampilan admin form pengumuman

47 2.4 Tampilan form berita prestasi

Tampilan form berita prestasi digunakan untuk menampilkan informasi yang berkaitan tentang berita dari sekolah seperti judul, gambar, tanggal, dan deskripsi. Pada form ini juga dapat digunakan untuk menambah, mengubah, melihat detail, dan menghapus data berita prestasi. Pihak client sudah cukup dengan tampilan yang ada.

Gambar 4. 29 Tampilan admin form berita prestasi 4.2.4 Dampak Implementasi Sistem

Dampak dari pada implementasi sistem informasi sekolah ini bagi penulis yaitu dapat mengetahui langkah apa saja yang digunakan oleh perusahaan dalam menerima project dari pihak luar, cara menyelesaikan permasalahan yang ada, mulai dari tahap pengumpulan kebutuhan, perancangan, pembangunan sistem, hingga ke tahap akhir dari sistem. Disisi lain dampak terhadap pihak client yaitu dapat dengan mudahnya memberikan informasi kepada pengguna sistem sehingga hal ini dapat membantu kinerja dari pihak sekolah. Dampak dari pihak perusahaan adalah dapat mengetahui kemampuan kinerja dari Mahasiswa kerja praktek dalam menerapkan ilmu yang dimilikinya pada project sebenarnya.

BAB V

Dalam dokumen LAPORAN KERJA PRAKTEK (Halaman 39-57)