LAPORAN PERANCANGAN SISTEM APLIKASI

SISTEM HUBUNGAN INDUSTRI SMK NEGERI 13 BANDUNG

Disusun Oleh:
Cikal Gemintang Seya 101917375
Fadhil Maulana 101917378
M. Irsyaad Fattahilah 101917388
Rifki Ahmad Maulana 101917396
Rashad Razikin Zulkarnaen 101917394
Sabrina Misyell Aaliyah 101917403

REKAYASA PERANGKAT LUNAK

SMK NEGERI 13 BANDUNG
2021
 DAFTAR ISI (manual)
DAFTAR ISI......................................................................................... 1
BAB I PENDAHULUAN...................................................................... 1
1.1. Deskripsi Masalah................................................................ 1
1.2. Rumusan Masalah............................................................... 1
1.3. Batasan Masalah.................................................................. 1
1.4. Tujuan................................................................................... 1
BAB II PERANCANGAN.................................................................... 2
2.1. Software Requirement Specification (SRS)......................... 2
2.1.1. Definisi Sistem.................................................................. 2
2.1.2. Layanan/Fitur Sistem...................................................... 2
2.1.3. Keterangan Lain Mengenai Sistem................................. 4
2.2. Metode Perancangan Sistem................................................ 6
2.2.1. Entity Relation Diagram.................................................. 6
2.2.2. Class Diagram.................................................................. 6
2.2.3. Activity Diagram...............................................................7
2.2.4. Use Case Diagram............................................................ 8
2.2.5. Sequence Diagram............................................................8
BAB III HASIL DAN PEMBAHASAN............................................... 10
3.1. Entity Relation Diagram.......................................................10
3.2. Class Diagram....................................................................... 11
3.3. Activity Diagram................................................................... 12
3.4. Use Case Diagram................................................................ 13
3.5. Sequence Diagram................................................................ 14
BAB IV PENUTUP................................................................................ 18
4.1. Kesimpulan............................................................................18
4.2. Saran..................................................................................... 18
DAFTAR PUSTAKA............................................................................. 19

1
 BAB I
PENDAHULUAN
1.1. Deskripsi Masalah
Praktek Kerja Lapangan (PKL) adalah salah satu bentuk implementasi secara
sistematis dan sinkron antara program pendidikan di sekolah dengan program penguasaan
keahlian yang diperoleh melalui kegiatan kerja secara langsung di dunia kerja untuk
mencapai tingkat keahlian tertentu. Dalam proses pemetaan industri, SMK Negeri 13
Bandung masih menggunakan Google Sheets, dimana siswa mengisi secara manual industri
untuk PKL.
Tentunya akan terjadi banyak masalah seperti siswa yang usil menghapus nama siswa
lain dari tabel, menambah kuota industri, dan mendaftarkan diri ke industri yang kuotanya
sudah penuh, atau bahkan siswa yang tidak mengerti cara menambahkan nama dalam
Google Sheets.

1.2. Rumusan Masalah

Berdasarkan deskripsi permasalahan diatas bahwa masalah yang dihadapi saat ini
yaitu bagaimana cara menerapkan suatu aplikasi untuk membantu pendataan industri,
adapun hasil dari deskripsi permasalahan diatas dapat dirumuskan sebagai berikut:
1. Bagaimana cara yang mudah dan efektif untuk mendata PKL siswa/i?
2. Apa saja fitur dari sistem aplikasi Hubungan Industri?

1.3. Batasan Masalah

Adapun beberapa batasan masalah pada sistem yang akan dibangun ini diantaranya
sebagai berikut:
1. Sistem aplikasi hanya dapat diakses dengan menggunakan internet.
2. Sistem aplikasi berbasis web membutuhkan perangkat keras memadai yang dapat
menjalankan web browser.

1.4. Tujuan
Tujuan dari sistem aplikasi Hubungan Industri ini adalah:
1. Memudahkan staf hubungan industri dalam pendataan industri.
2. Memudahkan pendataan siswa/i dalam memilih industri untuk PKL.
3. Memudahkan pengguna untuk melihat data pemetaan PKL.

2
 BAB II
PERANCANGAN
2.1. Software Requirements Specification (SRS)
2.1.1. Definisi Sistem
Sistem aplikasi Hubungan Industri adalah sebuah konsep sistem aplikasi yang
diharapkan dapat memudahkan staf hubungan industri dalam melakukan
pendataan industri untuk PKL, dan juga membantu siswa/i untuk mendaftarkan
diri ke industri yang ingin dituju untuk PKL.

2.1.2. Layanan/Fitur Sistem

A. Menu awal
Menu awal adalah tampilan pertama yang akan pengguna lihat, dari sini
pengguna dapat memilih menu selanjutnya yang akan dituju, terdapat pilihan
untuk mengisi pemetaan, lihat data pemetaan, dan hasil data pemetaan.
B. Fitur Tampilan Siswa

1. Mengisi pemetaan
Untuk opsi ini siswa diharuskan login dengan menggunakan NIS dan
password yang selanjutnya akan divalidasi oleh data yang sudah dimasukan oleh
admin. Setelah siswa berhasil login maka akan tampil menu dengan pilihan:
a. Ajukan Industri
Opsi ini dipilih ketika siswa mendapatkan industri di luar data pemetaan
sekolah, maka siswa diharuskan untuk mengajukan industrinya itu.
b. Pilih Industri
Opsi ini dipilih ketika siswa ingin memilih industri yang sudah
disediakan oleh sekolah.
c. Hubungi admin
Opsi ini dipilih ketika siswa ingin menghubungi admin.
2. Lihat data industri
Opsi ini berisi data industri yang bisa dilihat oleh siswa sebelum siswa
memilih industri. Didalamnya terdapat data lengkap industri yang bisa dijadikan
acuan oleh siswa untuk memilih industri yang akan dipilihnya.

3
 3. Hasil data industri
Opsi ini berisi data hasil pemetaan yang bisa dilihat siswa sebagai bukti
bahwa siswa tersebut sudah diterima di industri yang dipilihnya.

B. Fitur Tampilan Admin

1. Login
Untuk opsi ini admin diharuskan memasukan username dan password yang
sudah disediakan selanjutnya akan divalidasi oleh sistem. Setelah tervalidasi maka
akan muncul opsi sebagai berikut :
2. Masukan Data Siswa
Pada opsi ini admin diharuskan untuk memasukan data siswa, dimana data
tersebut dapat dimasukan secara otomatis oleh sistem.
3. Masukan Data Industri
Pada opsi ini admin diharuskan untuk memasukan data industri, dimana data
tersebut dapat dimasukan secara otomatis oleh sistem.
4. Daftar Pengajuan Industri
Pada opsi ini admin dapat melihat daftar pengajuan industri dari siswa yang
mengajukan industri, dimana nantinya data tersebut bisa dikonfirmasi oleh admin
agar datanya bisa ditampilkan pada lihat data pemetaan.
5. Lihat data pemetaan
Opsi ini berisi data industri yang bisa dilihat oleh siswa dan admin.
Didalamnya terdapat data lengkap industri, dan juga admin bisa memasukan data
pembimbing pada opsi ini.
6. Hasil data pemetaan
Opsi ini berisi data industri, siswa, pembimbing yang dapat dilihat oleh
admin. Pada opsi ini juga admin bisa mencetak data hasil tersebut.
7. Data PKL Siswa
Opsi ini berisi data industri, siswa, pembimbing yang datanya dapat
diurutkan berdasarkan tahun pemetaannya. Pada opsi ini hanya dapat dilihat oleh
admin sebagai referensi pemetaan selanjutnya.
D. Logout
Siswa dapat melakukan logout untuk mengakhiri penggunaan, siswa nantinya
dapat melakukan login untuk masuk lagi.

4
2.1.3. Keterangan Lain Mengenai Sistem
a. Kebutuhan Non-Fungsional
1. Sistem ini berbasis web dan dijalankan dengan web browser.
2. Sistem dibangun dengan bahasa pemrograman HTML, JavaScript, CSS
PHP, dan Laravel 7.
3. Sistem dibangun dengan basis data MySQL.
4. Sistem memiliki antarmuka yang mudah dipahami.
b. Deskripsi Rinci Kebutuhan
- Antarmuka Perangkat Keras
Spesifikasi perangkat keras (hardware) yang digunakan untuk menunjang
sistem adalah sebuah handphone, atau komputer yang dapat menjalankan web
browser dan mempunyai akses internet.
- Antarmuka Perangkat Lunak
Spesifikasi perangkat lunak (software) yang digunakan untuk menunjang
sistem adalah sebagai berikut:

No Perangkat Lunak Kegunaan

1 HTML, CSS, JavaScript, PHP Bahasa pemrograman

2 MySQL Basis data aplikasi

3 Draw.io Pembuatan diagram sistem

4 Figma.com Perancangan desain

5 Apache Web server

Tabel 1. Perangkat lunak untuk menunjang kebutuhan sistem
c. Kebutuhan Fungsional
- Fungsi Sistem
1. Sistem menyimpan data-data industri dan siswa.
2. Sistem akan menampilkan hasil akhir pemetaan industri.
- Fungsi Siswa
1. Siswa dapat login dengan memasukkan NIS dan password.
2. Siswa dapat memilih industri untuk PKL.
3. Siswa dapat mengajukan industri lain.
4. Siswa dapat melihat hasil pemetaan.

5
 - Fungsi Admin
1. Admin dapat login dengan memasukkan username dan password.
2. Admin dapat mengelola data siswa.
3. Admin dapat mengelola data industri.
4. Admin dapat mengelola data pembimbing siswa.
5. Admin dapat mencetak hasil pemetaan akhir.
d. Performansi
Tidak ada batasan performansi karena kemampuan perangkat keras yang
digunakan telah memadai.
e. Batasan Perancangan
Sistem merupakan aplikasi berbasis web sehingga tidak dapat diakses tanpa
koneksi internet.

2.2. Metode Perancangan Sistem

Perancangan sistem aplikasi Hubungan Industri menggunakan metode
pengembangan Entity Relationship Diagram (ERD) dan Unified Model Language (UML)
yang terdiri dari Class Diagram, Activity Diagram, Use Case Diagram, dan Sequence
Diagram. UML adalah sebuah pendekatan modern untuk pemodelan dan dokumentasi
perangkat lunak. UML dikembangkan oleh tiga insinyur yang bekerja di Rational Software,
yaitu Grady Booch, Jim Rumbaugh, dan Ivar Jacobson. Menurut Booch (2005:7), pengertian
UML adalah “Bahasa standar untuk membuat suatu rancangan software. Pada umumnya
UML digunakan khusus untuk menggambarkan dan membangun, dokumen artefak dari
software-intensive system.”

2.2.1. Entity Relationship Diagram

Menurut salah satu para ahli, Brady dan Loonam (2010), Entity Relationship
diagram merupakan teknik yang digunakan untuk memodelkan kebutuhan data dari
suatu organisasi, biasanya oleh system analyst dalam tahap analisis persyaratan proyek
pengembangan sistem. Sementara seolah-olah teknik diagram atau alat peraga
memberikan dasar untuk desain database relasional yang mendasari sistem informasi
yang dikembangkan.

6
2.2.2. Class Diagram
Class diagram adalah visual dari struktur sistem program pada jenis-jenis yang di
bentuk. Class diagram merupakan alur jalannya database pada sebuah sistem. Class
diagram merupakan penjelasan proses database dalam suatu program.

Menurut Satzinger (2011:28): “Diagram kelas atau class diagram menjelaskan

struktur sistem dari segi pendefinisian class-class yang akan dibuat untuk membangun
sebuah sistem.”

No Gambar Nama Keterangan

1 Himpunan dari objek-objek yang
Class berbagi atribut serta operasi yang
sama.
2 Nary Upaya untuk menghindari asosiasi
Association dengan lebih dari 2 objek.
2 Hubungan dimana objek anak
berbagi perilaku dan struktur data
Generalization
dari objek yang ada diatasnya objek
induk.
3 Deskripsi dari urutan aksi-aksi yang
ditampilkan sistem yang
Collaboration
menghasilkan suatu hasil yang
terukur bagi suatu aktor.
4 Operasi yang benar-benar dilakukan
Realization
oleh suatu objek.
5 Hubungan dimana perubahan yang
terjadi pada suatu elemen mandiri
Dependency akan mempengaruhi elemen yang
bergantung pada elemen yang tidak
mandiri.
6 Apa yang menghubungkan antara
Association objek satu dengan objek yang
lainnya.
Tabel 2. Daftar Simbol Class Diagram

7
2.2.2. Activity Diagram
Activity Diagram menurut Sukamto dan Shalahuddin (2013:161) “Diagram yang
menggambarkan workflow (aliran kerja) atau aktivitas dari sebuah sistem atau proses
bisnis, atau menu yang terdapat pada software (perangkat lunak)”.

Yang perlu diperhatikan adalah bahwa diagram aktivitas menggambarkan aktivitas

sistem bukan apa yang dilakukan aktor, jadi aktivitas yang dapat dilakukan oleh sistem.
Activity Diagram dibuat berdasarkan sebuah atau beberapa use case (kasus).

No Gambar Nama Keterangan

1 Activity adalah kegiatan yang
Activity
dilakukan oleh sistem.
2 Status awal aktivitas sistem, sebuah
Status Awal diagram harus mempunyai status
awal.
4 Status akhir yang dilakukan sistem,
Status Akhir sebuah diagram aktivitas memiliki
sebuah status akhir
3 Merupakan simbol yang digunakan
Decision jika ada pilihan lebih dari 1.

5 Digunakan untuk menggabungkan 2

Node
atau lebih aktivitas menjadi 1.
6 Memisahkan 2 kegiatan yang
Fork dilakukan secara paralel.
Tabel 3. Daftar Simbol Activity Diagram

8
2.2.3. Use Case Diagram
Use Case Diagram adalah sebuah diagram yang berisi urutan interaksi antara aktor
(pengguna) dan sistem. Menurut Satzinger, Jackson, & Burd (2010): “Use case
diagram adalah diagram yang menampilkan berbagai peran pengguna dan bagaimana
peran ini berfungsi dalam sebuah sistem.”

No Gambar Nama Keterangan

1 Menspesifikasikan himpunan peran
Actor yang pengguna mainkan ketika
berinteraksi dengan use case.
2 Hubungan dimana perubahan yang
terjadi pada suatu elemen mandiri
Dependency
akan mempengaruhi elemen yang
bergantung pada elemen lain
4 Hubungan dimana objek anak
berbagi perilaku dan struktur data
Generalization
dari objek yang ada diatasnya objek
induk.
3 Apa yang menghubungkan antara
Association
objek satu dengan objek lainnya.
5 Menspesifikasikan paket yang
System menampilkan sistem secara terbatas.

6 Deskripsi urutan dari aksi-aksi yang

ditampilkan sistem yang
Use Case
menghasilkan suatu hasil yang
terukur bagi aktor.
Tabel 4. Daftar Simbol Use Case Diagram

9
2.2.4. Sequence Diagram
Sequence Diagram adalah suatu diagram yang menjelaskan interaksi objek dan
menunjukkan (memberi tanda atau petunjuk) komunikasi diantara objek-objek tersebut.
Sequence diagram digunakan untuk menjelaskan perilaku pada sebuah skenario dan
menggambarkan bagaimana entitas dan sistem berinteraksi, termasuk pesan yang
dipakai saat interaksi. Semua pesan digambarkan dalam urutan pada eksekusi.
No Gambar Nama Keterangan
1 Merepresentasikan entitas di luar
Actor sistem yang sedang berinteraksi
dengan sistem.
2 Elemen yang bertanggung jawab
menyimpan data atau informasi. Ini
Entitas
dapat berupa beans atau model
object.
4 Elemen yang mengatur aliran
informasi untuk sebuah skenario.
Control
Objek ini umumnya mengatur
perilaku dan perilaku bisnis.
3 Berupa tepi dari sistem, seperti user
Boundary interface atau suatu alat yang
berinteraksi dengan sistem lain.
5 Merepresentasikan entitas tunggal
General dalam sequence diagram.

6 Menghubungkan objek selama

Lifeline sequence (message dikirim atau atau
diterima dan aktivasinya).

Tabel 5. Daftar Simbol Sequence Diagram

10
 BAB III
HASIL DAN PEMBAHASAN
3.1. Entity Relationship Diagram

Gambar 1. Entity Relationship Diagram

Dalam ERD yang tertera di atas terdapat 3 entitas, yaitu:
1. Admin
Merupakan entitas yang berisi primary key username, dan password yang digunakan
untuk login ke menu admin untuk melakukan pengelolaan data industri, siswa, dan
pembimbing, juga untuk mendapatkan laporan akhir hasil pemetaan.
2. Siswa
Merupakan entitas yang berisi primary key nis, dan password untuk login, dan data
diri siswa berupa nama, jenis_kelamin, kelas, jurusan, dan tahun. Terakhir ada foreign key
id_industri yaitu industri yang dipilih oleh siswa untuk melakukan PKL.
3. Industri
Merupakan entitas yang berisi primary key id, nama, bidang, kontak, alamat, jurusan,
kuota, tahun, status, dan nama_pembimbing. Semua data industri akan dikelola oleh
admin.

11
3.2. Class Diagram

Gambar 2. Class Diagram

Pada class diagram berikut terdapat pula 3 class, yaitu admin, siswa dan industri.
Admin memiliki atribut username dan password yang dapat digunakan untuk
melakukan login ke halaman admin. Sebagai pengguna dengan hak tertinggi, admin dapat
mengelola siswa, industri, pembimbing, dan mencetak laporan hasil akhir pemetaan.
Siswa memiliki atribut nis, password, nama, jenis_kelamin, jurusan, kelas, dan
id_industri. Siswa memiliki metode untuk memilih industri yang sudah ada, atau
mengajukan industri baru untuk PKL.
Dan terakhir ada kelas Industri yang berisi data tentang industri berupa id, nama,
bidang, kontak, alamat, jurusan, kuota, tahun, status, dan nama_pembimbing yang nanti
dapat diubah oleh admin.

12
3.3. Activity Diagram

Gambar 3. Activity Diagram

Activity diagram ini menjelaskan semua aktivitas yang dilakukan oleh siswa, admin,
dan sistem. Siswa dan admin menuju ke menu utama, setelah itu melakukan login. Setelah
login, siswa dapat melihat data pemetaan atau melihat hasil pemetaan, dalam aktivitas
melihat data pemetaan, siswa dapat mengisi pemetaan ke industri yang sudah ada, atau
mengajukan sebuah industri, setelah itu, data masuk ke dalam sistem.
Admin dapat mengelola siswa, industri, dan pembimbing, hal ini termasuk melihat,
menambah, menghapus, atau mengubah. Semua data yang telah dikelola admin akan masuk
ke sistem dan sistem akan memproses hasil pemetaan akhir dimana admin dapat memilih
untuk menerima laporan.

13
3.4. Use Case Diagram

Gambar 4. Use Case Diagram

Terdapat 2 aktor di use case diagram, yaitu siswa dan admin, semua aktor dapat
mengakses menu awal tanpa harus melakukan login, namun untuk melakukan hal lebih
lanjut, aktor siswa dan admin perlu melakukan login.
Setelah login, aktor siswa dapat menuju ke pemetaan dan memilih industri yang
diinginkan atau mengajukan industri.
Aktor admin dapat mengelola industri dan pembimbing, selain itu admin dapat
menerima laporan hasil akhir pemetaan.

14
3.5. Sequence Diagram

Gambar 5.1 Sequence Diagram Login

Aktor dapat memilih menu login kemudian akan ditampilkan menu tampilan login.
Saat aktor memasukan data maka data tersebut akan divalidasi ke database. Setelah
memvalidasi maka status login akan di return antara data valid atau tidak valid. Jika data
tersebut valid maka aktor dapat melakukan aktivitas selanjutnya.

.
Gambar 5.2 Sequence Diagram Pilih Industri

15
 Setelah berhasil melakukan login, siswa dapat memilih menu pemetaan. Saat menu
pemetaan dipilih maka sistem akan membaca semua data industri dari database dan
menampilkannya. Lalu siswa dapat memilih salah satu industri dari data tersebut. pilihan
tersebut akan disimpan ke database. Lalu database industri akan diperbarui dan akan
terdapat message bahwa data tersebut telah disimpan.

Gambar 5.3 Sequence Diagram Ajukan Industri

Selain memilih industri, siswa juga dapat mengajukan industri baru dari luar
rekomendasi sekolah. Jika siswa memilih menu ajukan industri maka sistem akan
menampilkan formulir. Setelah formulir tersebut diisi maka data industri baru akan disimpan
ke database.

16
 Gambar 5.4 Sequence Diagram Hasil dan Lihat Pemetaan
Aktivitas ini dapat dilakukan tanpa perlu melewati proses login. Pengguna memilih
menu Lihat Pemetaan maka sistem akan membaca seluruh data dari database. Lalu, data
tersebut akan ditampilkan ke pengguna.

Gambar 5.5 Sequence Diagram Masukan Siswa atau Industri

17
 Jika admin memilih formulir siswa/industri maka sistem akan menampilkan
formulir. Setelah admin memasukkan data pada formulir, maka data tersebut akan disimpan
ke database. Jika admin memasukkan data siswa maka siswa tersebut dapat melakukan
login. Sementara jika admin memasukkan data industri maka siswa yang belum memilih
industri dapat memilih industri tersebut.

Gambar 5.6 Sequence Diagram Isi Pembimbing

Jika admin memilih menu Isi Pembimbing maka sistem akan membaca seluruh data
industri dari database dan menampilkannya. Setelah itu, admin dapat memilih industri untuk
diisi data pembimbing. Data pembimbing tersebut akan disimpan dalam database industri.

18
 BAB IV
PENUTUP
4.1. Kesimpulan
Berdasarkan dari uraian yang telah tertulis, maka dapat disimpulkan bahwa:
1. Dengan adanya sistem aplikasi khusus untuk hubungan industri, baik staf
hubungan industri dan siswa/i dapat melakukan pemetaan dengan lebih mudah.
2. Sistem aplikasi Hubungan Industri dapat berfungsi untuk memproses hasil
pemetaan akhir yang berisi data lengkap dari pemetaan.

4.2. Saran
Penulis tentu menyadari bahwa laporan serta sistem aplikasi ini masih jauh dari
kata sempurna dan mempunyai banyak tempat untuk peningkatan, sehingga penulis
mempunyai beberapa saran berikut:
1. Pengguna sistem diharapkan untuk menggunakan sistem aplikasi ini
sebaik-baiknya.
2. Menambahkan fitur baru dalam sistem aplikasi untuk menambahkan efisiensi
dan kemudahan dalam mengakses sistem.
3. Diharapkan kepada pembaca untuk memberi komentar, kritik, dan saran yang
memungkinkan untuk membantu kualitas laporan dan sistem yang dirancang.

19
 DAFTAR PUSTAKA

Guratgarut.com. (2021, 21 Januari). 5+ Contoh Class Diagram Disertai Pengertian dan Simbol.
Diakses pada tanggal 27 September 2021, dari https://guratgarut.com/contoh-class-diagram/

Bsn.or.id. (2021, 2 Mei). Contoh Activity Diagram Dan Penjelasannya Terlengkap. Diakses pada
tanggal 27 September 2021, dari https://www.bsn.or.id/activity-diagram/

Dumetschool.com (2015, 28 Juni). Mengenal Use Case Diagram. Diakses pada tanggal 28
September 2021, dari https://www.dumetschool.com/blog/Mengenal-Use-Case-Diagram

Ansoriweb.com (2020, 1 April). Pengertian Sequence Diagram: Tujuan, Simbol, dan Contohnya.
Diakses pada tanggal 28 September 2021, dari
https://www.ansoriweb.com/2020/04/pengertian-sequence-diagram.html

Bangpahmi.com (2016, April 18). Pengertian ERD (Entity Relationship Diagram) Menurut Pakar
dan Ahli. Diakses pada tanggal 30 September 2021, dari
https://bangpahmi.com/pengertian-erd-entity-relationship-diagram-menurut-pakar-dan-ahli/

20