13 BAB 3
PELAKSANAAN KERJA MAGANG
3.1 Kedudukan dan Koordinasi
Selama masa kerja magang di PT Lippo Malls Indonesia, penulis ditempatkan di divisi Digital Product sebagai seorang website developer. Selama pelaksanaan kerja magang diawasi oleh Ibu Indrie Pratiwi selaku Digital Product Deputy Head sebagai pengawas dan pendamping di divisi terkait. Ibu Indrie Pratiwi memberikan informasi mengenai kebutuhan digital product yang sedang dibutuhkan untuk menunjang pemasaran PT Lippo Malls Indonesia serta memberikan solusi atau tugas yang dilakukan guna memenuhi kebutuhan tersebut.
Selain itu, Ibu Indrie Pratiwi juga membantu dalam koordinasi sekaligus bertanggungjawab kepada Bapak Danny Crayton sebagai Director of Partnership and Marketing setiap progresnya guna memenuhi kebutuhan perusahaan.
Selain diawasi oleh Ibu Indrie Pratiwi, pelaksanaan kerja magang juga berada dibawah bimbingan langsung Bapak Ferza Rachmatullah selaku developer di bidang teknologi informasi. Setiap proses dari adanya suatu project secara teknis dipegang oleh Bapak Ferza Rachmatullah dan berada di bawah koordinasi dari Ibu Indrie Pratiwi. Segala bentuk proses kerja mulai dari awal hingga akhir didokumentasikan serta dipresentasikan langsung ke Ibu Indrie Pratiwi dan Bapak Ferza Rachmatullah. Berdasarkan progres yang sudah dipresentasikan, dilakukan revisi berdasarkan saran dan kebutuhan dari perusahaan. Koordinasi dilakukan
14 menggunakan aplikasi Zoom ketika sedang melakukan WFH dan meeting secara langsung ketika WFO sesuai dengan timeline yang telah ditentukan.
Gambar 3.1 Struktur Internship PT Lippo Malls Indonesia
Gambar 3.1 menggambarkan struktur anak magang di perusahaan PT Lippo Malls Indonesia. Secara struktural perusahaan, internship berada di bawah pengawasan Digital Product Deputy Head atau yang dikenal sebagai kepala divisi.
Di dalam divisi Digital Product terdapat developer sebagai yang bertanggung jawab atas proyek yang disampaikan dari kepala divisi dan dapat memberikan silusi melalui perancangan software. Developer dibantu oleh seorang Internship yang memiliki tugas untuk membantu dan berbagi jobdesk dengan developer guna mempecepat progres dari beberapa proyek yang dilakukan.
Divisi digital product secara khusus memiliki tanggung jawab untuk mengurus dan memberikan inovasi teknologi digital yang bisa digunakan untuk meningkatkan marketing di mal. Setiap mal yang berada di bawah naungan PT Lippo Malls Indonesia, memiliki tujuan yang sama, yaitu untuk terus dapat
15 mempertahankan keuntungan dan meningkatkan income untuk mal. Salah satu untukdua tujuan tersebut adalah dengan adanya produk digital yang bisa diaplikasikan di mal. Seperti contohnya adalah spanduk LED, website khusus mal, TV signage, dan lainnya yang dapat menjadi media penjualan.
Digital product departement yang berada di dalam bagian marketing PT Lippo Malls Indonesia memiliki tujuan untuk memberikan efisiensi melalui solusi teknologi yang diberikan. Layaknya pada masa pandemi ini, ditawarkan sebuah TV thermometer guna mengecek suhu setiap pengunjung yang masuk, sehingga setidaknya pengunjung lebih merasa aman dan percaya kepada mal yang dinaungi Lippo karena memperhatikan protokol kesehatan.
3.2 Tugas dan Uraian Kerja Magang
Tugas secara langsung diberikan oleh kepala divisi maupun supervisi di kantor baik secara langsung maupun melalui Zoom. Sebelum dilakukan pemberian tugas, biasanya dilakukan sebuah meeting awal guna memberikan informasi apa yang dibutuhkan perusahaan pada saat itu. Meeting melibatkan setiap kepala divisi bersama dengan direktur perusahaan, setelah itu setiap kepala divisi bertanggungjawab untuk memberikan informasi serta membagi tugas kepada divisinya masing-masing.
Dalam hal ini, Ibu Indrie Pratiwi sebagai kepala divisi memberikan jobdesk utama mengenai apa yang harus dilakukan oleh PT Lippo Malls Indonesia untuk memberikan alternatif kepada tenant di mal untuk tetap bertahan dari dampak adanya PSBB. Selain itu, ada beberapa tugas lain yang harus dilakukan yang berkaitan dengan divisi Digital Product. Setelah melakukan brainstorming antara
16 kepala divisi, developer dan internship. Maka mulai dirancang timeline dan dilakukan penjabaran secara spesifik guna diteruskan kepada direktur untuk mendapatkan persetujuan. Setelah menerima persetujuan dari perusahaan, maka proyek mulai dapat dikerjakan dan diselesaikan sesuai kurun waktu yang disetujui.
3.2.1 Tugas yang Dilakukan
Adapun beberapa tugas utama yang diberikan tanggung jawab kepada internship sebagai berikut:
1. Memahami kebutuhan perusahaan serta tugas yang diberikan agar dapat menghasilkan website yang sesuai dan maksimal
2. Mempelajari bahasa pemrograman, database, serta framework yang digunakan perusahaan untuk mengembangkan website yang akan dibuat 3. Mengimplementasikan ilmu dan pengetahuan yang telah dipelajari selama
perkuliahan di Universitas Multimedia Nusantara ke dalam proyek magang 4. Memberikan progres berkala kepada kepala divisi agar tetap berada di jalur
proyek yang direncanakan
5. Melakukan komunikasi dan brainstorming berkala dengan supervisi agar tujuan proyek tercapai dengan maksimal
6. Melakukan testing dan bug fixing bersama supervisi terutama pada bagian yang belum sesuai dengan keinginan perusahaan.
Selain dari tugas utama di atas, juga ada beberapa tugas sampingan lainnya yang wajib diselesaikan, antara lain sebagai berikut:
1. Melakukan update untuk website lama PT Lippo Malls Indonesia (www.lippomalls.com)
17 2. Mempelajari platform WordPress guna membuat company website baru 3. Mendesain company website baru dengan menggunakan platform
WordPress
4. Membantu untuk membuat portal job career untuk keperluan HRD PT Lippo Malls Indonesia
5. Membuat Digital Guest Book guna mengikuti anjuran pemerintah selama masa pandemi
6. Mempelajari dan menggunakan CMS Digital Signage guna membantu upload konten di setiap TV Signage yang ada di mal.
3.2.2 Uraian Kerja Magang
Kerja magang di PT Lippo Malls Indonesia dilaksanakan selama 3 bulan terhitung sejak 3 Agustus 2020 hingga 30 Oktober 2020. Selama 3 bulan, banyak beberapa pekerjaan yang dilakukan, namun yang menjadi fokus utama adalah pembuatan website manajemen untuk tenant di mal. Selama proses kerja magang ini, penulis menggunakan Gantt Chart seperti pada tabel 1 di bawah untuk memberikan gambaran waktu kegiatan penelitian yang akan dilakukan dari bulan Agustus hingga Oktober 2020.
Tabel 3.1 Kegiatan kerja magang
No Kegiatan Minggu ke-
1 2 3 4 5 6 7 8 9 10 11 12 Agustus September Oktober 1 Pemahaman tugas dan pekerjaan
selama magang
2 Pemahaman WordPress sebagai sarana untuk merancang
company website baru (http://lmi- wp.xyz/)
18 Tabel 3.1 Kegiatan kerja magang (lanjutan)
Tabel 3.1 merupakan gambaran pekerjaan yang dilakukan selama 3 bulan/12 minggu kerja magang di PT Lippo Malls Indonesia. Setiap minggunya terdapat meeting guna membahas progres dan memberikan masukan yang akan dijadikan perbaikan ataupun penambahan fitur tertentu. Di dalam gantt chart belum termasuk beberapa tugas kecil lainnya yang diberikan oleh supervisi.
A. Company Website
Pada awal memulai magang, ada permintaan dari Bapak Danny Crayton sebagai Director of Partnership and Marketing untuk membuat sebuah company website baru dikarenakan yang lama (www.lippomalls.com) sulit untuk dilakukan perubahan. Saat itu pembuatan website www.lippomalls.com dibangun oleh vendor luar pada tahun 2019 dengan menggunakan bahasa pemrograman Laravel.
Namun setelah selang setahun, terdapat beberapa perubahan yang harus dilakukan terkait dengan konten yang ada di mal dan sayangnya company website yang lama kurang user-friendly sehingga munculah permintaan untuk menggantinya.
19 Gambar 3.2 Tampilan lama company website (www.lippomalls.com)
Di atas merupakan tampilan lama company website yang dibangun menggunakan bahasa pemrograman Laravel. Kendala yang muncul pada company website tersebut adalah sulitnya dilakukan update untuk setiap konten, contohnya seperti setiap dilakukan perubahan pada konten, perubahan tersebut tidak tersimpan meski sudah disimpan. Lalu loading muat halaman yang terlalu lama serta desain antar muka (UI/UX) yang kurang menarik menjadi beberapa alasan kenapa company website lama ini perlu diganti.
Sejak awal, permintaan diajukan kepada divisi digital product dengan tujuan untuk membuat company website baru yang mudah untuk dilakukan update, karenan nantinya yang akan melakukan perubahan berkala sesuai kebutuh mal akan dilakukan oleh divisi lain. Dengan alasan supaya company website ini dapat terus di nkan n k developer selanjutnya. Berpegang dengan alasan ini maka dibuatlah sebuah company website dengan menggunakan platform WordPress,
20 dengan harapan mudah untuk dilakukan perubahan dan tidak sulit untuk digunakan oleh orang diluar divisi digital product.
A.1 Rancangan Desain Antarmuka
Sebelum memulai pengembangan website, diperlukan rancang desain antarmuka atau lebih dikenal dengan User Interface (UI). Perancangan UI ini dilakukan agar memudahkan proses pengembangan pada saat akan mengimplementasikan seluruh perancangan dan logika pemrograman sehingga menjadi sebuah website yang layak dan mudah digunakan oleh pengguna.
A.1.1 Halaman Utama
Pada halaman utama, dilakukan perancangan user interface dengan lebih menonjolkan sisi corporate. User dapat melakukan pencarian berdasarkan kata kunci dan sorting pada bagian kanan atas.
Gambar 3.3 Desain antarmuka halaman utama
21 Pada gambar 3.3 merupakan rancangan tampilan halaman utama website.
Sesuai dengan kebutuhan dan permintaan, terdapat empat halaman utama yang bisa diakses dan berisi mengenai konten seputar PT Lippo Malls Indonesia. Empat halaman tersebut adalah Our Malls, News, Career¸ dan Styles. Sisanya merupakan iklan yang nantinya dapat dijual kepada tenant atau brand.
A.1.2 Halaman Our Malls
Pada halaman Our Malls menampilkan slot iklan yang secara animasi dapat bergeser per sekian detik yang berisi iklan layanan masyarakat. Pada pembagian mal, diklarifikasikan berdasar lokasi mal.
Gambar 3.4 Desain antarmuka halaman our malls
22 Setiap dari mal yang terdapat pada halaman our malls memiliki halamannya sendiri yang memberikan informasi singkat mengenai mal tersebut.
Gambar 3.5 Desain antarmuka salah satu halaman mal
Gambar 3.5 merupakan salah satu tampilan mal yang berpindah dari halaman our malls ketika pengguna memilih pilihan mal. Menjelaskan beberapa informasi singkat seperti lokasi mal, lus wilayah, luas bangunan dan jumlah lantai yang dimiliki mal tersebut. Selain itu, terdapat penjelasan tentang cara menjadi tenant dan bagaimana menjadikan mal tesebut partner, serta terdapat C ac U yang berisi kontak mal terkait.
23 A.1.3 Halaman News
Halaman news berisi tentang kegiatan yang CSR dan press release terbaru dari beberapa mal PT Lippo Malls Indonesia.
Gambar 3.6 Desain antarmuka halaman news
Pada gambar 3.6 merupakan tampilan desain antarmuak halaman news, terdapat enam konten terbaru setiap bulannya yang akan dilakukan pembaruan secara berkala. Semua konten berupa video yang jika pengguna menekan button M e maka akan terbuka halaman baru yang menampilkan isi konten video tersebut.
A.1.4 Halaman Styles
Styles adalah aplikasi loyalti milik PT Malls Indonesia yang memberikan beberapa keuntungan untuk membernya. Seperti potongan belanja, vouchers,
24 merchandise gif,t dan lainnya. Styles memiliki tingkatan level yang diberikan kepada pelanggan berupa kartu.
Gambar 3.7 Desain antarmuka halaman styles
Pada gambar 3.7 merupakan tampilan rancangan desain halaman styles.
Terdapat penjelasan informasi untuk pengguna seperti benefit menjadi member styles. Pada halaman ini juga, pengguna dapat mendapatkan aplikasi styles di playstore.
25 Gambar 3.8 Desain antarmuka halaman styles
Pada gambar 3.8 memberikan informasi mengenai beberapa tingkatan kartu member styles. Terdapat lima tingkatan level kartu dan setiap kartu memiliki syarat, ketentuan dan benefit masing-masing.
A.1.5 Halaman Career
Pada halaman ini merupakan portal job yang diminta oleh HRD PT Lippo Malls Indonesia. HRD menginginkan sebuah hal yang mana tidak ada pada website lama, yaitu halaman khusus yang mana user yang sedang mencari pekerjaan dapat langsung mengisi pendaftaran yang nantinya formulir pendaftaran akan langsung diterima oleh pihak HRD.
26 Gambar 3.9 Desain antarmuka halaman career
Pengguna dapat melalukan sorting berdasarkan kata kunci, lokasi dan kategori. Terdapat informasi yang memudahkan pengguna untuk mengetahui lowongan pekerjaan apa yang sedang dibuka. Ketika pengguna menekan salah satu lowongan pekerjaan maka halaman akan berpindah ke halaman pekerjaan tersebut yang memberikan informasi, lokasi dan keterangan lainnya yang dibutuhkan oleh pengunjung yang sedang mencari kerja.
27 Gambar 3.10 Desain antarmuka halaman career
Berikutnya masih pada halaman career, terdapat keterangan mal yang sedang membuka lowongan pekerjaan dan ada testimoni dari beberapa staff yang sudah bekerja di PT Lippo Malls Indonesia.
A.2 Acitivty Diagram
Activity diagram adalah diagram yang dapat memodelkan proses-proses yang terjadi pada sebuah sistem, activity diagram merupakan pengembangan dari Use Case yang memiliki alur aktivitas. Pada company website PT Lippo Malls Indonesia, pengguna yang melakukan kunjungan pada alamat website akan langsung diberikan tampilan utama dari website yang terdapat beberapa halaman menu seperti our malls, news, career, dan styles. Setiap menu yang dipilih oleh pengguna akan mengalihkan pengguna ke halaman berikutnya sesuai konten pada halaman tersebut. Berbagai informasi yang dibutuhkan mengenai PT Lippo Malls Indonesia dapat diakses pada company website ini.
28 Gambar 3.11 Activity Diagram
A.3 Hasil Implementasi
Berdasarkan perencanan yang sudah dilakukan seperti merancang halaman home website, halaman our malls, halaman news, dan halaman career. Dapat dibuat sebuah company website untuk PT Lippo Malls Indonesia.
A.3.1 Halaman Utama
Pada halaman utama, sesuai dengan perancangan desain antarmuka untuk tetap dapat mempertahankan sisi korporat dan dapat menghasilkan income dari website, maka halaman utama dibuat seperti berikut.
29 Gambar 3.12 Tampilan baru company website Lippo Malls Indonesia
Gambar 3.12 merupakan tampilan baru company website Lippo Malls Indonesia yang dibangun menggunakan platform WordPress. Terdapat tiga halaman utama yaitu Our Malls, News, Career dan Styles. Tiga kotak sisanya merupakan panel untuk iklan. Tujuannya, panel ini dapat dijual kepada brand ataupun tenant yang ingin melakukan promosi di website Lippo Malls Indonesia.
Pada bagian paling bawah terdapat footer yang memberikan informasi terkait beberapa social media dan logo perusahaan terkait. Selain itu, pengguna juga dapat melakukan pencarian ataupun sorting dengan menekan button di kanan atas.
30 A.3.2 Halaman Our Malls
Pada halaman ini menampilkan setiap mal yang dimililki oleh PT Lippo Malls Indonesia.
Gambar 3.13 Halaman Our Malls pada company website Lippo Malls Indonesia
Gambar 3.13 merupakan tampilan halaman Our Malls yang mana pada bagian paling atas adalah banner yang diisi dengan konten iklan masyarakat terkait pada saat itu, bagian ini dapat dilakukan perubahan. Lalu terdapat 5 Featured Malls atau bisa dikatakan sebagai mal andalan yang dimiliki oleh PT Lippo Malls Indonesia. Dibawahnya terdapat All Malls yang dibagi sesuai provinsi yang ada di Indonesia, setiap provinsi memiliki halaman tiap mal tersendiri.
31 Gambar 3.14 Halaman Lippo Mall Kemang, salah satu tampilan di halaman Our
Malls
Gambar 3.14 merupakan salah satu tampilan halaman mal. Terdapat beberapa informasi seperti lokasi, luas tanah, luas bangunan, jumlah lantai, caption singkat, gambar bangunan mal, dan gambar kegiatan yang bisa dilakukan di mal tersebut. Pada pojok kiri atas terdapat button Back O Ma yang akan membawa user kembali ke halaman Our Malls.
A.3.3 Halaman News
Pada halaman ini menampilkan kegiatan CSR (Corporate Social Responbility) dan press releases sesuai dengan kebutuhan marketing dari PT Lippo Malls Indonesia.
32 Gambar 3.15 Halaman News
Gambar 3.15 merupakan tampilan dari halaman news berisi kegiatan CSR dan press releases yang telah dilakukan oleh Lippo Malls. Ketika user menekan M e maka halaman akan beralih ke platform Youtube yang mama menampikan video dari kegiatan CSR dan press releases.
A.3.4 Halaman Styles
Pada halaman Styles memberikan seputar loyalti program yang diberikan dari PT Lippo Malls Indonesia untuk pengunjung. Pada halaman O Fea e memberikan informasi mengenai keuntungan yang diperoleh jika mendapatkan membe l al i ini, be ik n a ada halaman Our Loyalty P g a memberikan informasi berupa tingkatan kartu dan syarat ketentuannya
33 Gambar 3.16 Halaman Our Feature Styles
Gambar 3.17 Halaman Our Loyalty Program Styles
34 Pada gambar 3.17 kartu member loyalti dapat di swipe dan di bagian atas kartu terdapat nama level kartu serta b ea e untuk informasi mengenai ketentuannya.
A.3.5 Halaman Career
Gambar 3.18 Halaman Career
Pada gambar 3.18 merupakan tampilan halaman career. Halaman ini cukup kompleks daripada halaman lainnya. Terdapat dua menu utama yaitu menu J b dan S ie . Halaman J b merupakan halaman untuk keperluan mencari pekerjaan, sedangkan halaman S ie merupakan sedikit cerita atau testimoni
35 dari para karyawan yang berada di perusahaan. User dapat melakukan pencarian pekerjaan berdasarkan keywords, regions dan category. Lalu, terdapat informasi mengenai ketersediaan lowongan berdasarkan divisi yang ada pada PT Lippo Malls Indonesia.
Berikutnya pada Rece J b adalah bagian dimana lowongan yang sedang dibutuhkan atau yang sedang dicari. Terdapat juga keterangan fulltime atau internship.
Gambar 3.19 Tampilan salah satu halaman dari Recent Jobs
Pada gambar 3.19 menampilkan salah satu halaman dari Recent Jobs, terdapat lokasi lowongan pekerjaan, kapan terakhir diterbitkan dan keterangan ketersediaan lowongan pekerjaan. Jika lowongan ditutup maka akan muncul ke e angan Thi i i g ha e i ed , namun jika masih ada lowongan maka akan muncul penjelasan singkat terkait jobdesk dan lembar formulir pendaftaran.
36 Gambar 3.20 Halaman Career (lanjutan)
Pada gambar 3.20 menampilkan lanjuta dari halaman career, terdapat bagian H I W k yang memberikan informasi mengenai alur pendaftaran lamaran kerja. Selanjutnya terdapat bagian Li f O Ma yang memberikan informasi singkat mengenai mal-mal yang membuka lowongan pekerjaan.
37 Gambar 3.21 Tampilan salah satu halaman mal dari List of Our Malls
Pada gambar 3.21 menampikan salah satu halaman mal, terdapat beberapa informasi terkait mal yang dituju, seperti lokasi, sejak kapan dibutuhkan lowongan pekerjaan, dan berapa jumlah karyawan yang berada di mal tersebut. Juga terdapat fitur see on maps yang mana user dapat mencari lokasi mal di Google Maps.
Selanjutnya terdapat bagian S ie f O S aff yang berisi testimoni dan pengalaman karyawan selama berada dan bekerja di mal-mal dibawah naungan PT Lippo Malls Indonesia. Terdapat radio button guna menggeser setiap staff yang ada pada bagian tersebut.
38 Gambar 3.22 Tampilan Stories from Our Staff
Gambar 3.23 Tampilan Quick Career Tips
Pada gambar 3.23 adalah tampilan quick career tips yang amna merupakan konten yang dibuat oleh HRD untuk keperluan job requirements. Jika user menekan salah satu menu yang ada maka halaman akan berpindah pada gambar 3.13.
39 Gambar 3.24 Salah satu tampilan Quick Career Tips
Pada gambar 3.24 memberikan informasi seputar tips & trick mengenai dunia kerja. Terdapat menu recent posts untuk melihat konten lainnya. Pada halaman ini user dapat meninggalkan komentar dengan mengisi kolom nama dan email dan menuliskan komentar. Nantinya email yang masuk dapat digunakan sebagai database untuk HRD.
40 Setelah selesai, company website diserahkan kepada divisi IT PT Lippo Malls Indonesia untuk diunggah pada domain yang dimiliki sebelumnya. Jadi tugas dari divisi digital product hanya sampai pada develeopment website. Namun mungkin karena ada kendala dan kurang adanya komunikasi yang baik, company website yang baru masih belum diganti hingga sekarang.
B. Sistem Pemesanan dan Manajemen Tenant
Sistem pemesanan dan manajemen tenant merupakan tugas utama selama magang di PT Lippo Malls Indonesia. Proses pembuatan website dilakukan bersamaan dengan tugas magang lainnya. Sistem pemesanan dan manjemen tenant ini dinamakan Chat&Eat, dibangun dengan menggunakan bahasa pemrograman PHP dan HTML boilerplate dan menggunakan framework UIkit serta menggunakan FileZilla sebagai server.
Latar belakang dari dibuatnya Chat&Eat adalah tenant yang berada di mal milik Lippo mulai mengalami penurunan omset semenjak adanya PSBB dari pemerintah. Berkurangnya jam buka mal berbanding lurus dengan kurangnya pengunjung yang datang, meski mal Lippo telah menerapkan protokol kesehatan dengan melakukan scanning suhu sebelum masuk dan penyemprotan disinfektan secara berkala tetap saja hal ini kurang membantu. Ditambah saat itu, masyarakat masih enggan untuk keluar rumah dan tingkat was-was akan COVID-19 masih cukup tinggi.
Seiring berjalannya waktu tenant mulai mengajukan permintaan kepada marketing PT Lippo Malls Indonesia melalui pemilik mal untuk dapat dibantu dalam melakukan penjualan. Setidaknya untuk iklan ataupun promosi jualan dari
41 tenant. Atas dasar ini maka dibuatlah Chat&Eat untuk menjawab keluh kesah tenant selama masa PSBB. Bekerja sama dengan divisi lain di bagian marketing PT Lippo Malls Indonesia, divisi digital product memiliki salah satu tanggung jawab untuk membuat website, dan untuk keperluan promosi dibantu oleh divisi marketing and sponsorship.
Gambar 3.25 Logo Chat&Eat
Chat&Eat adalah wadah untuk para tenant berjualan secara online.
Chat&Eat terinspirasi dari GoJek dan Grab yang sama-sama menjual makanan dan minuman secara online. Chat&Eat lebih berfokus ke setiap mal dan tenant yang kurang melek akan perkembangan teknologi, seperti tenant lokal yang skalanya lebih kecil dari tenant nasional. Berlandaskan dengan ini maka Chat&Eat dibuat sesederhana mungkin dan mempermudah para pemilik tenant untuk dapat mengurus tenant-nya secara mandiri. Selain itu, pengunjung pun dapat melakukan pemesanan secara langsung ke tenant dengan melalui aplikasi WhatsApp yang terhubung dengan menggunakan API.
42 Pada proses pembuatan Chat&Eat hanya diberikan waktu selama 2 minggu, karena dibutuhkan dengan cepat maka website Chat&Eat masih dibuat secara sederhana terlebih dahulu sesuai dengan permintaan dari atasan. Untuk pengembangannya dapat dilakukan menyusul setelah Chat&Eat dipublikasikan.
Dengan alasan waktu dan tenaga kerja, Chat&Eat dibuat dengan sederhana dan tidak sepenuhnya memiliki sistem otomatisasi. Masih dibutuhkan beberapa media lain seperti Google Form dan Google Sheets serta masih menghubungi tenant secara manual untuk permintaan mengisi formulir. Komunikasi antara penjual dan pengunjung pun masih menggunakan WhatsApp yang terhubung melalui API pada website.
Gambar 3.26 Alur proses Chat&Eat
43 Adapun langkah-langkah dari pengumpulan data hingga publikasi Chat&Eat sebagai berikut:
1. Mengirimkan tautan form pendaftaran kepada tenant
2. Tenant melakukan pendaftaran melalui google drive link (https://docs.google.com/forms/d/1_6LsIByox4VFOawjWBFerXjC96v8IS 6YMToYNR03mms/edit) dan mengisi untuk nama tenant, nomor telepon tenant, lokasi mal, menu, promo, dan lainnya
3. Setelah tenant mengisi formulir, data akan diterima berupa Google Sheets, nantinya ini yang akan menjadi panduan untuk input menu ke dalam website 4. Proses input menu ke dalam website
5. Tautan dari halaman website dipersingkat ke dalam bentuk bit.ly 6. Digital menu dapat dipublikasikan
7. Jika ada perubahan, maka tenant berhak untuk menghubungi kembali untuk melakukan permintaan perubahan menu/harga ataupun promo.
Karena tidak memungkinkan tenant yang melakukan input data ke dalam program koding, maka data diinput oleh divisi digital product. Pada tahap ini, semua masih dilakukan secara manual dan belum dilakukan pengembangan lebih lanjut dikarenakan waktu dan tenaga kerja.
Setelah semua menu tenant diinput, tautan pada halaman website terkait diubah ke dalam bentuk bit.ly supaya dapat dengan mudah diakses oleh pengunjung. Selain itu, bit.ly juga diubah ke dalam bentuk QR Code yang nantinya akan dipublikasikan melalui beberapa media sosial Lippo Malls Indonesia.
44 Website diklasifikasikan berdasarkan provinsi dan lokasi mal. Setiap mal memiliki tautan tersendiri, juga untuk tenant memiliki tautan tersendiri sesuai dengan lokasi mal.
Gambar 3.27 Tautan setiap mal
B.1 Rancangan Desain Antarmuka
Sebelum memulai pengembangan website, diperlukan rancang desain antarmuka atau lebih dikenal dengan User Interface (UI). Perancangan UI ini dilakukan agar memudahkan proses pengembangan pada saat akan
45 mengimplementasikan seluruh perancangan dan logika pemrograman sehingga menjadi sebuah website yang layak dan mudah digunakan oleh pengguna.
B.1.1 Halaman Tenant
Merupakan halaman awal yang ditampilkan jika pengguna mengakses Chat&Eat. Pada halaman ini berisi tenant yang dituju oleh pengguna dan terdapat logo tenant, nama tenant, lokasi mal, button Daftar Menu, button Promo, dan button Chat&Eat with Us untuk melakukan pemesanan.
Gambar 3.28 Desain Antarmuka Halaman Tenant
46 B.1.2 Halaman Daftar Menu
Halaman daftar menu menampilkan menu-menu yang disediakan oleh tenant, terdapat button untuk pengguna dapat beralih ke halaman promo dan button Chat&Eat with Us untuk langsung melakukan pemesanan setelah melihat menu.
Gambar 3.29 Desain Antarmuka Halaman Daftar Menu
47 B.1.3 Halaman Promo
Halaman promo menampilkan promo yang disediakan oleh tenant selama periode tertentu, pengguna dapat melihat promo dan kemudian melakukan pemesanan dengan memilih button Chat&Eat with Us.
Gambar 3.30 Desain Antarmuka Halaman Promo B.2 Flowchart
Dalam mengembangkan sebuah website, diperlukan kemampuan pengembang untuk menciptakan alur website yang nyaman dan efektif. Alur
48 aplikasi yaung efektif tentunya dapat mempermudah pekerjaan dan meminimalkan resiko atau kesalahan yang terjadi dari penggunaan website itu sendiri. Penggunaan sistem pemesanan dan manajemen tenant pada Chat&Eat dapat dijelaskan melalui flowchart.
Gambar 3.31 Flowchart Chat&Eat
Gambar 3.31 adalah alur website Chat&Eat secara keseluruhan. Pertama kali setelah pengguna melakukan akses terhadap tautan mal, maka pengguna akan diberikan pilihan beberapa tenant yang tersedia di mal tersebut. Pada halaman ini, pengguna dapat memilih tenant yang diinginkan, setelah pengguna memutuskan
49 ingin memesan menu di tenan yang mana, halaman akan berpindah ke halaman tenant. Di ini, engg na dibe ikan bebe a a ilihan e e i Daf a Men n k melihat men , P m n k menge ah i m ang edang be lang ng dan
ilihan Back Tenan Li .
Jika engg na memilih Daf a Men , maka halaman akan menam ilkan menu yang disediakan oleh tenant. Pada halaman ini juga disediakan menu P m jika engg na ingin meliha m ang edang ada. Jika dah menentukan pilihan, pengguna dapat memilih Cha &Ea i h U untuk melakukan pemesana langsung dengan pengelola tenant.
Website masih dibangun sedemikian rupa dengan harapan dapat dipublikasi lebih cepat dan mempermudah tenant. Dengan adanya Chat&Eat, komunikasi antara pengguna dengan pengelola tenant bisa lebih leluasa, pengguna dapat lebih leluasa untuk melakukan beberapa permintaan langsung kepada pengelola. Untuk sistem pembayaran biasanya langsung terjadi selama komunikasi di WhatsApp.
B.3 Server Filezilla
Filezilla adalah salah satu software FTP gratis, open-source dan cross- platform. Untuk dapat diakses, Chat&Eat menggunakan Filezilla sebagai hosting web. Package website yang terdiri dari CSS, JS, dan HTML code diunggah ke server agar dapat berjalan secara online.
Host: ftp://2.57.91.62 Username: u762111152 Password: Lippo1234!
Port: 21
50 Gambar 3.32 Chat&Eat package
B.4 Framework UIKit
Website Chat&Eat menggunakan framework UIKit sebagai design guidelines. Dengan adanya design guidelines sangat membantu untuk mempercepat proses perancangan desain produk. Di dalam UIKit sendiri terdapat banyak kumpulan elemen UI dengan pola brand product, Typography, Color Palette, Icons, Forms, button, white space, dan lainnya.
Untuk tampilan, Chat&Eat lebih berfokus untuk mobile, dikarenakan dari sisi pengelola tenant dan pengguna akan lebih sering menggunakan perangkat mobile terutama handphone untuk mengakses website. Terlepas dari itu, Chat&Eat juga dibangun dengan responsive.
B.5 Hasil Implementasi
Berdasarkan perencanaan yang sudah dilakukan dari flowchart, FTP Host dan framework, dapat dibuat sebuah website sistem pemesanan dan manejemen tenant untuk Lippo Malls Indonesia.
51 B.5.1 Halaman Awal Chat&Eat
Saat pertama kali diakses, pengguna akan ditampilkan halaman awal yang berisi berbagai nama tenant dalam satu mal yang dipilih. Di sini, pengguna dapat memilih di ten ant mana pengguna ingin memesan makanan.
Gambar 3.33 Tampilan awal Chat&Eat
B.5.2 Halaman Tenant
Setelah pengguna memilih tenant yang dikehendaki, maka halaman berpindah ke halaman tenant yang dipilih (pada contoh ini adalah tenant Maxx Coffee). Pada halaman ini terdapat logo tenant, keterangan mal, button Daf a
52 Men , button P m Ha i Ini , b Back Te a Li , dan button Cha &Ea i h U yang langsung mengarahkan pengguna ke WhatsApp untuk langsung melakukan pemesanan.
Gambar 3.34 Tampilan salah satu tenant
B.5.3 Halaman Daftar Menu
Pada halaman Daftar Menu, pengguna diberikan tampilan menu yang disediakan oleh tenant. Terdapat foto menu, nama menu, harga dan keterangan (jika ada). Pada halaman ini terdapat button P m n k men getahui promo
53 yang sedang berlangsung dan button Cha &Ea i h U untuk pengguna dapat melakukan pemesanan langsung kepada pengelola tenant.
Gambar 3.35 Halaman Daftar Menu
B.5.4 Halaman Promo
Pada halaman Promo berisi promo apa saja yang sedang berlaku di tenant tersebut. Juga terdapat button Daf a Men n k engg na kembali ke halaman sebelumnya dan b Cha &Ea i h U untuk pengguna langsung melakukan pemesanan.
54 Gambar 3.36 Halaman Promo
Chat&Eat pada saat itu masih dibangun sedemikian rupa, semua komponen yang dibutuhkan untuk bisa online dan dipublikasikan sehingga dapat diakses oleh pengunjung masih disusun secara manual. Namun keberadaan Chat&Eat cukup mendapat respon positif dan sesuai dengan permintaan dari atasan. Tenant-tenant merasa terbantu dan merasa diperhatikan oleh PT Lippo Malls Indonesia untuk tetap bertahan selama masa pandemi ini.
55 Karena dirasa proses pengumpulan data dan input menu ke dalam website cukup melelahkan dan tidak efektif, rencana berikutnya adalah mengembangkan Chat&Eat agar dapat lebih dinamis sehingga tidak perlu melakukan input data secara satu per satu yang cukup memakan waktu dan tenaga. Penulis sempat mengusulkan untuk dibuat CMS (Content Management System), sehingga ke depannya pengelola tenant dapat memasukkan menu, promo, dan keperluan mereka secara mandiri. Dengan adanya CMS tentu semuanya akan lebih mudah dan cepat, namun saat itu waktu dan tenaga kerja cukup menjadi penghalang karena disamping bertanggungjawab terhadap Chat&Eat, juga diberikan tugas lain untuk membantu divisi digital product.
Langkah terdekat adalah membuat database menggunakan MySQL sehinnga semua data dari tenant dapat secara otomatis terinput ke dalam website.
Serta mengimplementasikan fitur CRUD (Create, Read, Update, Delete) yang nantinya di dalam website akan terbagi menjadi dua bagian, yaitu untuk admin dan untuk pengguna. Namun, inovasi ini masih kurang disetujui oleh direktur PT Lippo Malls Indonesia dikarenakan sulitnya untuk memberikan edukasi kepada tenant yang rata-rata kurang melek akan teknologi dan dirasa hanya akan menambah waktu dan tenaga lebih.
3.2.3 Kendala yang Ditemukan
Selama melakukan kerja magang di PT Lippo Malls Indonesia, banyak tugas yang diberikan dan dikerjakan. Berdasarkan realita, tentunya dalam melakukan pengembangan terhadap suatu website, proses membangun website terdapat kendala atau permasalahan. Kendala yang ditemukan sedikit banyak memberikan hambatan dalam menyelesaikan atau pun melakukan optimalisasi
56 terhadap website yang dibangun. Secara umum, beberapa kendala dapat dituliskan sebagai berikut:
1. Kurangnya tenaga untuk mengerjakan berbagai tugas yang diberikan dalam waktu bersamaan. Divisi digital product hanya terdiri dari tiga orang yaitu kepala divisi, developer dan internship. Tentunya hal ini cukup berpengaruh dalam menyelesaikan beberapa tugas yang ada dan menyebabkan sulit untuk fokus pada satu proyek
2. Keputusan dari atasan seringkali berubah dan tidak konsisten. Seringkali muncul beberapa perubahan di tengah proses pengerjaan proyek, sehingga cukup menjadi hambatan dan semakin mengulur waktu di saat proyek perlu diselesaikan dengan cepat
3. Kurang baiknya komunikasi yang terjalin antara divisi digital product di bagian marketing dengan divisi IT di bagian IT PT Lippo Malls Indonesia sehingga sering menyebabkan kesalahpahaman.
4. Ketika website Chat&Eat sudah selesai dibangun dan ingin dilakukan pengembangan lebih lanjut agar lebih efisien, hal ini kurang disetujui oleh atasan dengan alasan lebih baik fokus untuk pemerataan Chat&Eat ini ke setiap mal yang Lippo miliki, dalam artian fokus untuk melayani tenant satu per satu dengan melakukan input yang secara masih manual pada saat itu.
Banyaknya muatan input serta dikejar oleh waktu untuk menyelesaikan semua mal yang ada, menjadikan sulitnya untuk fokus terhadap pengembangan Chat&Eat sehingga pada akhirnya Chat&Eat hanya sebatas itu dan kurang efektif.
57 3.2.4 Solusi atas Kendala yang Ditemukan
Berdasarkan kendala yang ditemukan dan dialami selama melakukan kerja magang di PT Lippo Malls Indonesia, ditemukan solusi atas kendala yang terjadi agar proyek pengembangan website tetap dapat berjalan dengan baik. Solusi atas kendala yang ditemukan dapat dijelaskan sebagai berikut:
1. Karena permintaan untuk menambah SDM di divisi digital product tidak diterima, maka salah satunya solusi yang ditemukan saat itu adalah dengan membuat timeline per hari per proyek. Setiap anggota yang berada dalam divisi memiliki kewajibannya sendiri dan harus diselesaikan sesuai target, agar tidak terjadi penumpukan tugas. Selain itu setiap anggota berhak dan diharapkan untuk saling back-up dan membantu mengingatkan satu sama lain terkait proyek yang sedang berjalan
2. Setiap adanya inisiasi suatu tugas atau proyek, sebelum dieksekusi dibuat sebuah notulen rapat dan dibuat sebuah mock-up untuk dipresentasikan kepada atasan. Hal ini bertujuan untuk memberikan pemahaman lebih kepada atasan dan meminimalisir adanya perubahan di tengah proses pengerjaan
3. Karena proyek harus selesai tepat waktu dan sulit untuk mengandalakan divisi lain, maka divisi digital product melakukan inisiatif untuk menggunakan hosting open source dan berlangganan paket menggunakan dana pribadi dari kepala divisi.
4. Pengembangan Chat&Eat tetap dilakukan namun berselingan dengan tugas lain. Dibantu oleh Pak Ferza sebagai developer, proses pengembangan tetap berjalan meski pada akhirnya tidak tercapai karena waktu magang untuk
58 penulis sudah selesai sebelum pengembangan selesai. Pengembangan dilakukan dengan menambahkan database dan mengimplementasikan CRUD sehingga setidaknya lebih efektif. Namun semenjak dilakukan hand-over kepada divisi IT pada bagian IT PT Lippo Malls Indonesia, Chat&Eat tidak dikembangkan dan berhenti pengoperasiannya.
