Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Merancang Aplikasi Inventory Support IT Berbasis WEB Pada PT Cahaya Lestari Permai Abadi Rama Dwi SaputraA. Raja Fadhilah HamdanA. Vini DelvianiA. Khalil Gibran AlmaulidiA. Aries Saifudin5 Teknik Informatika. Universitas Pamulang. Tanggerang Selatan. Indonesia E-mail : Asrama5772@gmail. Arajafadilah20@gmail. Adelvianivini@gmail. peank@gmail. Submitted Date: Juli 16, 2022 Revised Date: Agustus 6, 2022 Reviewed Date: Juli 19, 2022 Accepted Date: Agustus 28, 2022 Abstract Web-Based IT Stock Inventory Support Application Design at PT Cahaya Lestari Permai Abadi is motivated by the lack of efficiency and effectiveness of data storage and management from the company and this application is made using HTML. PHP. MySQL and DRAW. IO will support the efficiency and effectiveness of the company's work in storing and processing data so that it gets the information needed. The purpose of writing this Practical Work Report is to study, analyze, design. A web-based information system at PT Cahaya Lestari Permai Abadi in particular to support the company's operational activities. The software developed in making this application uses HTML (Hypertext Markup Languag. which is the basic language for web scripting and is client side which allows displaying information in the form of text, graphics, and also to connect between web page displays . In addition, for data storage and processing, the programming language PHP (PHP Hypertext Preprocesso. and MySQL database are also The final result of this Practical Work Lecture is a web-based application design that can provide a clear picture of inputting IT inventory support at PT Cahaya Lestari Permai Abadi. Keywords: Design. Support Application. Stock Inventory. Web-based Abstrak Perancangan Aplikasi Stock Inventory Support IT Besbasis Web Pada PT Cahaya Lestari Permai Abadi dilatarbelakangi kurangnya efisiensi dan efektifitasnya penyimpanan dan pengelolaan data dari perushaan tersebut dan aplikasi ini dibuat menggunakan HTML. PHP. MySQL dan DRAW. IO akan menunjang efisiensi dan efektifitas kerja perusahaan dalam menyimpan dan mengolah data sehingga mendapatkan informasi yang dibutuhkan. Tujuan dari penulisan Laporan Rekayas Perangkat lunak ini adalah untuk mempelajari, menganalisa, merancang. Sebuah sistem informasi berbasis web pada PT Cahaya Lestari Permai Abadi khususnya untuk menunjang dalam kegiatan oprasional perusahaan. Perangkat lunak yang dikembangkan dalam pembuatan aplikasi ini menggunakan HTML (Hypertext Markup Languag. yang merupakan bahasa dasar untuk web scripting dan bersifat client side yang memungkinkan menampilkan informasi dalam bentuk teks, grafik, dan juga untuk menghubungkan antar tampilan halaman web . Selain itu, untuk penyimpanan dan pengolahan data maka digunakan pula bahasa pemrograman PHP (PHP Hypertext Preprocesso. dan MySQL database. Hasil akhir dari penelitian ini adalah sebuah rancangan aplikasi berbasis web yang dapat memberikan gambaran jelas mengenai tentang penginputan stock inventory support IT pada PT Cahaya Lestari Permai Abadi. http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Keywords: Rancangan. Aplikasi Dukungan. Persediaan Stok. Berbasis web Pendahuluan (Ngafifi, 2. Manusia menggunakan teknologi karena memiliki akal. Dengan akalnya manusia ingin keluar dari masalah, ingin hidup lebih baik, lebih aman, dan sebagainya. Perkembangan teknologi terjadi karena seseorang menggunakan akalnya untuk menyelesaikan setiap masalah yang dihadapinya. Kemajuan teknologi adalah sesuatu yang tidak bisa dihindari dalam kehidupan ini, karena kemajuan teknologi akan Setiap inovasi diciptakan untuk memberikan manfaat positif bagi kehidupan Teknologi juga memberikan banyak kemudahan, serta sebagai cara baru dalam melakukan aktivitas manusia. Manusia juga sudah menikmati banyak manfaat yang dibawa oleh inovasi-inovasi teknologi yang telah dihasilkan dalam dekade terakhir ini. (Sukamdana, 2. Sistem informasi berbasis web penting untuk dimiliki oleh setiap perusahaan dalam mendukung proses bisnis yang Sistem informasi berbasis web ini juga penting untuk dimiliki oleh PT Cahaya Lestari Permai Abadi. Perusahaan ini memiliki masalah proses bisnis yang sangat rentan dengan barang yang akan di jual seperti waktu kadaluarsa barangnya dan mengakibatkan kerusakan pada barang. Salah satu faktor pendukung proses bisnis yang berjalan adalah dengan mempunyai sistem inventory. Demikian perlu adanya pembuatan system inventory sebagai sarana untuk perekapan data. Diharapkan dapat memudahkan perekapan data serta lebih efisian dalam perekapannya. Metodelogi 1 Merancang Aplikasi Stock Support IT Berbasis Web Inventory Pada umumnya sistem dibuat sebagai suatu alat untuk mempermudah dalam pekerjaan manusia, dalam sistem terdapat kompenen yang saling berinteraksi dan kerja sama dalam mencapai sasaran dan tujuan. Dengan adanya sistem maka lebih mudah juga dalam melakukan pekerjaan. Sistem memiliki fungsi untuk menangani fungsi yang secara terus menerus dan berulang-ulang atau yang rutin terjadi. Dengan adanya sistem maka lebih memperrmudah dalam melakukan suatu pekerjaan (Purba, 2. Secara umum suatu sistem dapat diartikan sebagai suatu kumpulan atau himpunan dari unsur, komponen yang terorganisir, saling berinteraksi, saling ketergantungan satu sama lain dan terpadu untuk mencapai tujuan PT Cahaya Lestari Permai Abadi merupakan sebuah office yang terletak di Jl. Percetakan Negara No. C253. RT01/RW006, Kec. Campaka Putih. Kota Jakarta Pusat. Daerah Khusus Ibukota Jakarta 10570. PT. Cahaya Lestari Permai Abadi membutuhkan sebuah website aplikasi stock inventory support IT yang akan digunakan untuk menginput barang support IT, dimana isinya menunjukkan stock barang yang Berdasarkan analisa kebutuhan yang ada, maka website aplikasi stock inventory support IT dibangun menggunakan visual studio code. 2 Definisi Perancangan Perancangan adalah penggambaran, perencanaan dan pembuatan sketsa atau pengaturan dari berbagai elemen yang terpisah ke dalam satu kesatuan yang utuh dan berfungsi (Trianto, 2. Perancangan adalah proses pengembangan spesifikasi baru berdasarkan rekomendasi hasil analisis sistem Berdasarkan definisi di atas, penulis menarik kesimpulan bahwa perancangan merupakan suatu pola yang dbuat untuk mengatasi masalah yang dihadapi perusahaan atau organisasi setelah melakukan analisis terlebih dahulu (Kurniawan, 2. 3 Defini Sistem (Herliana, 2. Sistem adalah Sekelompok unsur yang erat yang saling berhubungan antara satu dengan yang lainnya, yang berfungsi bersama sama untuk mencapai tujuan tertentu. (Sudjiman, 2. Sistem adalah Kumpulan hal atau elemen yang saling bekerja sama atau yang dihubungkan dengan cara-cara tertentu sehingga membentuk satu kesatuan untuk melaksanakan suatu fungsi http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . guna mencapai suatu tujuan (Sudjiman, 2. Sistem adalah kumpulan dari sub sistem atau bagian atau komponen Saling bekerjasama secara harmonis untuk mencapai tujuan tertentu (Sudjiman, 2. Dari definisi tersebut dapat disimpulkan bahwa sistem adalah sekelompok unsur atau bagian atau komponen baik fisik maupun non fisik yang saling berhubungan dan saling bekerja sama atau untuk melaksanakan suatu fungsi guna mencapai suatu tujuan. 4 Definisi Informasi Informasi diartikan sebagai hasil dari pengolahan data dalam suatu bentuk yang lebih berguna dan lebih berarti bagi penerima yang menggambarkan suatu kejadian Ae kejadian yang nyata yang digunakan untuk sebuah keputusan (Yuzistin, 2. Informasi adalah bagian dari data yang dapat diolah sehingga digunakan sebagai dasar untuk mengambil keputusan yang tepat Informasi sebagai data yang telah diproses pengetahuan seseorang ya ng menggunakan data tersebut (Suwita, 2. Dari pengertian diatas dapat ditarik kesimpulan bahwa informasi dapat didefinisikan sebagai hasil dari pengolahan data dalam suatu bentuk yang lebih berguna dan lebih berarti bagi penerimanya yang menggambarkan suatu kejadiankejadian yang nyata yang digunakan untuk pengambilan keputusan. 1 Logo Balsamiq Mockup Balsamiq mockup adalah program aplikasi yang digunakan untuk membuat tampilan design user interface sebuah aplikasi. Software ini menyediakan tools yang dapat memudahkan dalam membuat desain prototyping aplikasi yang akan di Software ini berfokus pada konten yang ingin digambar dan fungsionalitas yang dibutuhkan oleh 7 XAMPP XAMPP adalah sebuah perangkat lunak yang berfungsi sebagai web server yang berdiri sendiri xampp sendiri terdiri dari beberapa berapa program antara lain Apache HTTP Server. MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa pemrograman PHP dan Perl . 5 Definisi Web World Wide Web . atau sering disebut Web merupakan salah satu sumber daya internet yang berkembang pesat. Informasi Web didistribusikan dengan pendekatan hyperlink yang memungkinkan seseorang memeperoleh informasi dengan meloncat dari satu halaman ke halaman lain (Juliany, 2. ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Gambar 2. 2 Logo XAMPP Visual Studio Code 6 Balsamiq Mockup Gambar 2. 3 logo Visual Studio Code Visual studio Code merupakan sebuah perangkat lunak atau software teks editor yang biasa digunakan oleh para pengembang perangkat lunak . Visual studio Code juga merupakan sebuah http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . aplikasi yang multiflatform yang artinya aplikasi ini dapat berjalan digunakan pada semua system operasi seperti linux , windows dan MAC support dengan html 5 kita dapat membuat sebuah diagram secara online. Draw. io memberikan fitur fitur lengkap dalam membuat sebuah diagram sehingga draw. io sangat mudah digunakan . Draw. Gambar 2. 3 Draw. Draw. io adalah sebuah website yang digunakan untuk membuat sebuah diagram secara online hanya dengan menggunakan browser yang ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. UML (Unified Modelling Languag. UML adalah UML merupakan singkatan dari AuUnified Modelling LanguageAy yaitu suatu metode permodelan secara visual untuk sarana perancangan sistem berorientasi objek, atau definisi UML yaitu sebagai suatu bahasa yang sudah menjadi standar pada visualisasi, perancangan dan juga pendokumentasian sistem Saat ini UML sudah menjadi bahasa standar dalam penulisan blue print software. UML (Unified Modeling Languag. terdiri dari beberapa diagram, diantaranya yaitu : Use Case Diagram Use Case diagram menjelaskan apa yang akan dilakukan oleh sistem yang akan dibangun dan siapa yang berinteraksi dengan sistem. Use case diagram menjadi 13 dokumen kesepakatan antara customer, user dan developer. User menggunakan dokumen use case diagram ini untuk memahami sistem dan mengevaluasi bahwa benar yang dilakukan sistem adalah untuk memecahkan masalah yang user ajukan. Use case diagram memberikan gambaran statis dari sistem yang sedang dibangun dan merupakan artifak dari proses analisis. Tabel 2. 1 Use Case Diagram Class Diagram Class diagram merupakan diagram yang selalu ada di pemodelan sistem berorientasi obyek. Class diagram menunjukkan hubungan antar class dalam sistem yang sedang dibangun dan http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. bagaimana mereka saling berkolaborasi untuk mencapi tujuan. Class diagram digunakan untuk menggambarkan disain statis dari sistm yang sedang dibangun. Tabel 2. 2 Class Diagram Sequence Diagram Sequence dalam sistem untuk mencapai tujuan dari use case: interaksi yang terjadi antar class, operasi apa saja yang terlibat, urutan antar operasi, dan informasi yang diperlukan oleh masing-masing operasi. Sequence diagram menjelaskan aspek 17 dinamis dari sistem yang sedang dibangun Tabel 2. 3 Sequance Diagram http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Activity Diagram Diagram status yang memperlihatkan aliran dari suatu aktivitas ke aktivitas lainnya dalam suatu Diagram ini terutama penting dalam pemodelan fungsi-fungsi suatu sistem dan membertekanan pada aliran kendali antar objek. Tabel 2. 4 Activity Diagram Hasil dan Pembahasan 1 Analisis Sistem Merupakan tahap pertama melakukan perancangan sebuah sistem/aplikasi. Analisis dilakukan dengan tujuan untuk memperoleh kebutuhankebutuhan apa saja yang diperlukan dalam membangun sebuah aplikasi. Selain itu analisis sistem juga bertujuan untuk mengidentifikasi masalah dalam membangun sebuah aplikasi. Dimana pada proses ini juga nantinya akan dibuat sebuah rumusan pemecahan masalah dari masalah tersebut. Analisa ini diperlukan sebagai dasar untuk tahapan perancangan aplikasi. Dalam membangun sebuah aplikasi diperlukan tehapan-tahapan yang dilakukan dalam pembangunannya. Begitu juga pada penelitian ini, fokus penelitian ini ialah menciptakan sebuah aplikasi berbasis web yang memiliki fungsi sebagai media untuk mengedit serta memanipulasi sebuah foto/gambar. Untuk itu diperlukan tahapan-tahapan yang dilakukan dalam membangun aplikasi ini meliputi proses analisis yang terdiri dari analisis kebutuhan aplikasi dan arsitektur sistem, perancangan sistem yang terdiri dari perancangan diagram use case, activity diagram, perancangan struktur navigasi dan perancangan antarmuka aplikasi yang akan dibangun dengan berbasis web. Analisis Kebutuhan System Analisis ini dilakukan guna mendapatkan point-point penting yang dibutuhkan untuk dapat merancang aplikasi stock inventory support it berbasis web. Dari sisi spesifikasi aplikasi, tujuan dari rancangan aplikasi ini ialah sebagai media untuk menginput stock inventory support it, untuk itu spesifikasi aplikasi yang akan dicapai dalam perancangan aplikasi ini ialah sebagai berikut: User dapat membuat dan menghapus master User dapat membuat , mengedit dan menghapus transaksi masuk barang barang. http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . User dapat melihat perincian laporan masuk barang barang dalam periode tertentu. User dapat membuat , mengedit dan menghapus transaksi pengeluran barang User dapat melihat laporan perincian penngeluaran barang dalam periode tertentu. User dapat melihat perincian laporan persediaan barang dalam periode tertentu. ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. penerima , id barang , nama barang dan quantity Tabel 3. 3 Tabel Masuk Barang 3 Perancangan Database Tabel Admin Tabel Admin adalah tabel yang menampung petugas yang akan mengoperasikan system. Secara garis besar hak akses dibagi menjadi 2 yaitu pegawai dan admin yang berisikan, kode username , nama username , nama petugas , password username , alamat username , nomor hp username dan jabatan username. Tabel Pengeluaran Barang Tabel Transaksi pengeluaran adalah table yang digunakan untuk melakukan transaksi barang apa saja yang akan digunakan/keluar. Tabel ini berisi kode transaksi , tanggal transaksi , nama penerima , id barang , nama barang dan quantity Tabel 3. 1 Tabel Admin Tabel 3. 4 Tabel Pengeluaran Barang Tabel Barang Tabel Barang adalah tabel yang digunakan untuk menyimpan data barang yang masuk dalam Tabel ini berisikan id barang , kode barang dan nama barang. Tabel 3. 2 Tabel Barang 4 Flowchart Flowchart atau Diagram alir, bagan alir, atau bagan arus adalah sebuah jenis diagram yang mewakili algoritme, alir kerja atau proses, yang menampilkan langkah-langkah dalam bentuk simbol-simbol grafis, dan urutannya dihubungkan dengan panah . 1 Membuat User Baru Tabel Masuk Barang Flowchart ini menggambarkan kegiatan yang dilakukan Admin dari sistem yang dibuat: Tabel Transaksi pengeluaran adalah table yang digunakan untuk melakukan transaksi barang apa saja yang akan digunakan/keluar. Tabel ini berisi kode transaksi , tanggal transaksi , nama http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Gambar 3. 1 Membuat User Baru Gambar 3. 2 Membuat Barang Baru Pada gambar 3. 5 diperlihatkan alur penginputan user baru , sebagai berikut: Admin menginputkan email dan Password pada form login aplikasi. Admin dapat memilih menu pegawai. Admin dapat menambahkan user ke dalam sistem dan sistem akan secara otomatis memproses penambahan produk baru tersebut kedalam list. Admin akan kembali ke halaman awal dengan kondisi data telah diperbarui. 2 Membuat Barang Baru Flowchart ini menggambarkan kegiatan yang dilakukan Admin dari sistem yang dibuat: Pada gambar 3. 10 diperlihatkan alur diagram administrasi, sebagai berikut: Admin menginputkan email dan Password pada form login aplikasi Sistem langsung menampilkan halaman utama apabila email dan password telah benar atau sesuai dengan data yang disimpan dalam system. Admin dapat memilih menu produk. Admin dapat menambahkan produk ke dalam sistem dan sistem akan secara otomatis memproses penambahan produk baru tersebut kedalam list. Admin akan kembali ke halaman awal dengan kondisi data telah diperbarui. http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. 3 Input Masuk barang Flowchart ini menggambarkan kegiatan yang dilakukan Admin dari system yang dibuat. Gambar 3. 4 Use Case Barang Pada use case ini admin. dapat mengakses menu produk dan melalukan input id barang , kode barang dan nama barang. 5 Flowchart Pengeluaran Barang Flowchart ini menggambarkan kegiatan yang dilakukan Admin dari system yang dibuat. Gambar 3. 3 Input Masuk Barang Pada gambar 3. 10 diperlihatkan alur diagram administrasi, sebagai berikut: Admin menginputkan email dan Password pada form login aplikasi Sistem langsung menampilkan halaman utama apabila email dan password telah benar atau sesuai dengan data yang disimpan dalam sistem Admin dapat memilih menu masuk barang Admin dapat menambahkan masuk barang ke dalam sistem dan sistem akan secara otomatis memproses penambahan masuk barang baru tersebut kedalam list Admin akan kembali ke halaman awal dengan kondisi data telah diperbarui 4 Use Case Barang Menggambarkan proses pembuatan produk yang dilakukan oleh admin: Gambar 3. 5 Flowchart Pengeluaran Barang Pada gambar 3. 11 diperlihatkan alur diagram administrasi, sebagai berikut: Admin menginputkan email dan Password pada form login aplikasi Sistem langsung menampilkan halaman utama apabila email dan password telah http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . benar atau sesuai dengan data yang disimpan dalam sistem Admin dapat memilih menu pengeluaran Admin dapat menambahkan pengeluaran barang ke dalam sistem dan sistem akan secara otomatis memproses penambahan pengeluaran barang baru tersebut kedalam Admin akan kembali ke halaman awal dengan kondisi data telah diperbarui Use Case Diagram Use case diagram merupakan diagram yang menggambarkan hubungan antara aktor dengan sistem. Use case diagram bisa mendeskripsikan sebuah interaksi antara satu atau lebih aktor dengan sistem yang akan dibuat. ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Use Case Layanan Akses Menggambarkan proses layanan yang dapat diakses oleh user: Gambar 3. 7 Use Case Masuk Barang Pada use case ini admin. dapat mengakses menu masuk barang dan melakukan input kode masuk barang , tanggal masuk barang , nama supplier , id barang quantity barang dan harga Use Case Pengeluran Barang Menggambarkan proses pengeluaran barang dilakukan oleh admin: Gambar 3. 6 Use Case Layanan Akses Pada use case ini admin. dapat mengakses layanan login dan logout pada aplikasi Use Case Masuk Barang Menggambarkan proses pembuatan produk yang dilakukan oleh admin: Gambar 3. 8 Use Case Pengeluaran Barang Pada use case ini admin. dapat mengakses menu pengeluaran barang lalu menginput kode pengeluaran barang , tanggal keluar barang , nama penerima barang id barang quantity barang dan harga barang. http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Activity Diagram Activity diagram adalah diagram yang menggambarkan rancangan aliran aktivitas atau aliran kerja dalam sebuah sistem yang akan Activity Diagram Login Login dimulai ketika admin website, lalu sistem akan menampilkan form login. Admin memasukkan username yang sudah terdaftar dan password dan sistem akan memverifikasi username dan password tersebut dan apabila terdaftar maka sistem akan langsung mengarahkan pengguna ke halaman awal. Gambar 3. 10 Activity Diagram Produk Activity Diagram Masuk Barang proses penginputan masuk barang dimulai ketika admin telah login kedalam system dan berada dihalaman awal / utama lalu memilih menu masuk barang , kemudian admin melakukan penginputan kode masuk barang , tanggal masuk barang , nama supplier , id barang , quantity barang dan harga barang lalu system akan memproses data kedalam database. Gambar 3. 9 Activity Diagram Login 2 Activity Diagram Produk proses pembuatan produk baru dimulai ketika admin telah login kedalam system dan berada dihalaman awal / utama lalu memilih menu produk , kemudian admin melalukan penginputan produk baru dengan mengisi id barang , kode barang dan nama barang lalu system akan memproses data kedalam database . Gambar 3. 11 Activity Diagram Masuk Barang Activity Diagram Pengeluaran Barang proses pengiputan pengeluaran barang dimulai ketika admin telah login kedalam system dan berada dihalaman awal / utama lalu memilih menu pengeluaran barang, kemudian admin melakukan penginputan kode pengeluaran barang, tanggal tanggal keluar barang, nama penerima http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . barang, id barang, quantity barang lalu system akan memproses data kedalam database. ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Gambar 3. 13 Diagram Sequence Login Diagram Sequence Produk Diagram sequence Produk menggambarkan bagaimana actor/ Admin membuat produk Pada diagram ini setelah admin berhasil login, admin masuk kedalam menu produk lalu memasukan id barang, kode barang dan nama Sistem akan memproses/ menyimpan data tersebut ke dalam databasenya. Setelah itu sistem akan menyimpan data dan menampilkan data yang telah diperbarui Gambar 3. 12 Activity Diagram Pengeluaran Barang Sequence Diagram Sequence Diagram adalah salah satu dari diagram - diagram yang ada pada UML, sequence diagram ini adalah diagram yang menggambarkan kolaborasi dinamis antara sejumlah object. Kegunaannya untuk menunjukkan rangkaian pesan yang dikirim antara object juga interaksi antara Diagram Sequence Login Pada diagram ini user memasukkan username beserta password untuk masuk ke dalam sistem, sistem akan memvalidasi atau mengecek data yang dimasukkan oleh user. Apabila data tersebut sama dengan data yang disimpan di database maka sistem akan memperbolehkan user untuk masuk ke dalam halaman utama. Gambar 3. 14 Diagram Sequence Produk Diagram Sequence Masuk barang Diagram Masuk menggambarkan bagaimana actor/ Admin menginput masuk barang barang. Pada diagram ini setelah admin berhasil login, admin masuk kedalam menu pengeluaran barang lalu memasukan kode pengeluaran barang , tanggal keluar barang , nama penerima ,id barang , quantity barang lalu sistem akan memproses/ menyimpan data tersebut ke dalam databasenya. Setelah itu sistem akan menyimpan data dan menampilkan data yang telah diperbarui. Gambar 3. 15 Diagram Sequence Masuk Barang http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . Diagram Sequence Pengeluaran barang Diagram sequence Pengeluaran barang menggambarkan bagaimana actor/ Admin menginput pengeluaran barang. Pada diagram ini setelah admin berhasil login, admin masuk kedalam menu masuk barang lalu memasukan kode masuk barang , tanggal masuk barang , nama supplier ,id barang , quantity barang , harga barang lalu sistem akan memproses/ menyimpan data tersebut ke dalam databasenya. Setelah itu sistem akan menyimpan data dan menampilkan data yang telah diperbaharui. ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Halaman Login Tampilan login yang berfungsi untuk memasukan username dan password user yang telah daftar pada database. Gambar 3. 17 Halaman Login Gambar 3. 16 Diagram Sequence Pengeluaran Barang Pada halaman login terdapat dua kolom tombol yakni kolom username dan kolom password digunakan untuk memasukan nama username yang terdapat pada database kolom password digunakan unttuk memasukan password , kolom login digunakan untuk masuk kedalam halaman utama dan terdapat satu tombol yakni tombol login untuk masuk kehalaman utama Halaman Utama Desain MockUp Mockup merupakan media visual yang digunakan untuk melihat preview sebuah konsep Selanjutnya diberikan efek visual sehingga hasil gambar terlihat menyerupai wujud yang Mockup akan memberikan gambaran desain sebelum diaplikasikan menjadi benda nyata sehingga memudahkan pekerjaan desainer. Mockup pun akan membantu desain terlihat nyata dan lebih menarik karena variasi dua dimensi dan tiga dimensi. Mockup yang mempunyai tampilan menarik dan terkesan modern ini, tentu saja cocok digunakan saat presentasi atau dimasukkan ke dalam Graphic Standard Manual . uku GSM)(Seputar Mocku. Berikut merupakan tampilan desain mockup aplikasi inventory support it berbasis web di PT Cahaya Lestari Permai Abadi : Gambar 3. 18 Halaman Utama Halaman utama adalah layar tampilan ketika user login kedalam aplikasi , pada halaman utama menggunakan tampilan side bar , didalam side bar ini terdapat menu : Barang yang dimana bila diklik akan mengarahkan ke menu barang Masuk Barang yang dimana bila diklik akan mengarahkan ke menu masuk barang http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . Pengeluaran barang yang dimana bila diklik akan mengarahkan ke menu pengeluaran Laporan Stock yang dimana bila di klik akam mengarahkan ke menu laporan stock . Pada halaman ini juga terdapat heading profil dimana menu ini berguna untuk mengatur password user dan juga akses untuk log out . Menu Barang ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Menu Masuk barang barang merupakan menu yang dapat diakses oleh user setelah login kedalam system lalu pada tampilan utama user memilih menu masuk barang, didalam menu masuk barang barang terdapat tombol tambah jika ingin membuat membuat masuk barang baru, tombol search mencari data masuk barang barang yang sudah dibuat, tabel yang berisi tramsaksi masuk barang barang yang sebelumnya sudah dibuat, tombol edit untuk mengedit data masuk barang barang, tombol hapus untuk menghapus, tombol detail untuk melihat detail isi transaksi. Menu Pengeluaran Barang Gambar 3. 19 Menu Barang Menu barang merupakan menu yang dapat diakses oleh user setelah login kedalam system lalu pada tampilan utama user memilih barang, didalam menu barang terdapat tombol tambah jika ingin membuat membuat barang , lalu tombol search untuk mencari data barang yang telah dibuat, tombol edit untuk mengedit data barang yang telah dibuat sebelumnya. Menu Masuk Barang Gambar 3. 21 Menu Pengeluaran Barang Menu Pengeluaran barang merupakan menu yang dapat diakses oleh user setelah login kedalam system lalu pada tampilan utama user memilih menu pengeluaran barang, didalam menu pengeluran barang terdapat tombol tambah jika ingin membuat membuat pengeluaran baru, tombol search mencari data pengeluaran barang yang sudah dibuat, tabel yang berisi transaksi pengeluaran barang yang sebelumnya sudah dibuat, tombol edit untuk mengedit data pengeluaran barang, tombol hapus untuk menghapus, tombol detail untuk melihat detail isi transaksi. Menu Laporan Stock Gambar 3. 20 Menu Masuk Barang Gambar 3. 22 Menu Laporan Stock http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . Menu laporan stock merupakan menu yang dapat diakses oleh user setelah login kedalam system lalu pada tampilan utama user memilih menu laporan stock, pada menu ini user dapat melihat laporan persediaan barang pada periode sesuai dengan yang diinginkan dengan cara mengatur rentang tanggal pada kolom yg disediakan lalu mengklik tombol view, jika ingin mencetak laporan bisa menggunakan tombol cetak. ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. , kolom kode barang disi dengan kode barang dan nama barang diisi nama barang tombol kolom status diceklist sesaui dengan status barang yg bersangkutan simpan untuk menyimpan data tombol kembali untuk kembali ke menu barang. Menu Tambah Masuk Barang Menu Tambah Barang Gambar 3. 25 Menu Tambah Masuk Barang Gambar 3. 23 Menu Tambah Barang Form tambah barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu barang lalu mengklik tombol tambah , kolom kode barang disi dengan kode barang dan nama barang diisi nama barang tombol simpan untuk menyimpan data tombol kembali untuk kembali ke menu barang. Menu Edit Barang Form tambah masuk barang barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu masuk barang lalu mengklik tombol tambah, pada menu ini terdapat form yg terdiri dari kode masuk barang, tanggal, masuk barang, supplier, barang, jumlah barang dan harga lalu terdapat tombol tambah barang yang berfungsi untuk memasukan data kedalam tabel transaksi lalu pada tabel transaksi terdapat tombol edit digunakan untuk mengedit kembali data barang yang beli dan tombol hapus untuk menghapus baris transaksi, tombol simpan untuk menyimpan data, tombol kembali untuk kembali ke menu masuk barang. Menu Edit Masuk Barang Gambar 3. 24 Menu Edit Barang Form edit barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu barang lalu mengklik tombol edit pada list barang Gambar 3. 26 Menu Edit Masuk Barang http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Form edit data masuk barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu masuk barang lalu mengklik tombol edit, pada menu ini terdapat kolom yg terdiri dari kode masuk, tanggal, masuk, supplier, barang, jumlah barang dan harga lalu terdapat tombol tambah barang yang berfungsi untuk memasukan data kedalam tabel transaksi lalu pada tabel transaksi terdapat tombol edit digunakan untuk mengedit kembali data barang yang beli dan tombol hapus untuk menghapus baris transaksi, tombol simpan untuk menyimpan data, tombol kembali untuk kembali ke menu masuk. Menu Pengeluaran barang merupakan menu yang dapat diakses oleh user setelah login kedalam system lalu pada tampilan utama user memilih menu pengeluaran barang, didalam menu pengeluran barang terdapat tombol tambah jika ingin membuat membuat pengeluaran baru, tombol search mencari data pengeluaran barang yang sudah dibuat, tabel yang berisi transaksi pengeluaran barang yang sebelumnya sudah dibuat, tombol edit untuk mengedit data pengeluaran barang, tombol hapus untuk menghapus, tombol detail untuk melihat detail isi transaksi. 10 Menu Detail Masuk Barang Menu Edit Pengeluaran Barang Gambar 3. 29 Menu Edit Pengeluaran Barang Gambar 3. 27 Menu Detail Masuk Barang Form detail data masuk barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu masuk barang lalu mengklik tombol detail, pada menu ini hanya berisi data masuk barang yang sebelum telah diinput dan terdapat tombol kembali untuk kembali ke menu masuk 11 Menu Tambah Pengeluaran Barang Form edit pengeluaran barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu pengeluaran lalu mengklik tombol edit, pada menu ini terdapat form yg terdiri dari kode pengeluaran, tanggal, penerima, barang, jumlah barang lalu terdapat tombol edit barang yang berfungsi untuk memasukan data kedalam tabel transaksi lalu pada tabel transaksi terdapat tombol edit digunakan untuk mengedit kembali data barang yang beli dan tombol hapus untuk menghapus baris transaksi, tombol simpan untuk menyimpan data, tombol kembali untuk kembali ke menu pengeluaran barang. Gambar 3. 28 Menu Tambah Pengeluaran Barang http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. 13 Menu Detail Pengeluaran Barang Gambar 3. 32 Master Barang Gambar 3. 30 Menu Detail Pengeluaran Barang Form detail data pengeluaran barang barang merupakan menu yg dapat akses oleh user yang telah masuk kedalam menu pengeluaran barang lalu mengklik tombol detail, pada menu ini hanya berisi data pengeluaran barang yang sebelum telah diinput sebelumnya dan terdapat tombol kembali untuk kembali kemenu pengeluaran barang. Menu master barang adalah menu yang dapat diakses oleh user melalui menu data barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat , menambah , mengedit dan menghapus data barang . 9 Implementasi System Gambar 3. 33 Induk Data Pegawai Gambar 3. 31 Halaman Login Menu data pegawai adalah menu yang dapat diakses oleh user melalui menu data pegawai yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat , menambah , mengedit dan menghapus data username dan password untuk akses kedalam aplikasi Pada menu ini user memasukan username dan password sesuai dengan akses yang diberikan oleh administrator, jika username dan password sudah sesuai maka user akan masuk kedalam tampila halaman utama. Gambar 3. 34 Induk Data Supplier http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. Menu data supplier adalah menu yang dapat diakses oleh user melalui menu data supplier yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat , menambah , mengedit dan menghapus data supplier . Gambar 3. 37 Menu Laporan Stok Harian Menu laporan stock harian adalah menu yang dapat diakses oleh user melalui menu Laporan stock harian yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak mutasi harian barang . Gambar 3. 35 Menu Transaksi Pembelian Menu pembelian barang adalah menu yang dapat diakses oleh user melalui menu data pembelian barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat menginput , mengedit dan menghapus transaksi pembelian barang . Gambar 3. 38 Menu Laporan Stok Bulanan Menu laporan stok bulanan adalah menu yang dapat diakses oleh user melalui menu laporan stok bulanan yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak mutasi bulanan barang . Gambar 3. 36 Menu Transaksi Penjualan Menu penjualan barang adalah menu yangq dapat diakses oleh user melalui menu data penjualan barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat menginput , mengedit dan menghapus transaksi penjualan barang . Gambar 3. 39 Menu Laporan Stok Tahunan Menu laporan stock tahunan adalah menu yang dapat diakses oleh user melalui menu laporan stock tahunan yang tedapat pada http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . ISSN: 2541-1004 e-ISSN: 2622-4615 32493/informatika. menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak mutasi tahuan barang. Gambar 3. 42 Menu Laporan Penjualan Barang Harian Menu laporan pembelian harian barang adalah menu yang dapat diakses oleh user melalui menu laporan pembelian harian harian barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak rekap transaksi pembelian barang harian. Gambar 3. 40 Menu Laporan Penjualan Barang Harian Menu laporan penjualan harian barang adalah menu yang dapat diakses oleh user melalui menu laporan penjualan harian barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak rekap transaksi penjualan barang harian. Gambar 3. 43 Menu Laporan Penjualan Barang Bulanan Menu laporan pembelian bulanan barang adalah menu yang dapat diakses oleh user melalui menu laporan pembelian bulanan barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak rekap transaksi pembeian barang bulanan. Gambar 3. 41 Menu Laporan Penjualan Barang Bulanan Menu laporan penjualan harian barang adalah menu yang dapat diakses oleh user melalui menu laporan penjualan harian barang yang tedapat pada menu dashboard di halaman utama pada menu ini user dapat melihat dan mencetak rekap transaksi penjualan barang bulanan. Kesimpulan Dengan adanya Sistem Informasi Inventory berbasis web ini, staff Gudang dapat melakukan pengecekan stock barang yang ada di masing-masing Gudang dengan mudah dan fleksibel tanpa di batasi waktu dan jarak. Dapat memberika informasi tentang stock Inventory dari masing-masing Gudang dengan akurat dan aktual bagi perusahaan. Dengan Inventory berbasis web, perusahaan dapat melakukan Tindakan pencegahan dari http://openjournal. id/index. php/informatika This work is licensed under a Creative Commons Attribution-NonCommercial 4. International (CC BY-NC 4. License Copyright A 2022 Rama Dwi Saputra. Raja Fadhilah Hamdan. Vini Delviani. Khalil Gibran Almaulidi. Aries Saifudin Jurnal Informatika Universitas Pamulang Penerbit: Program Studi Teknik Informatika Universitas Pamulang Vol. No. September 2022 . masalah kekurangan stock di masingmasing Gudang. References