SEMAKSEMAK.COM: SISTEM PENJUALAN BENIH ECERAN UNTUK MASYARAKAT PERKOTAAN MENGGUNAKAN MAGENTO DAN BOOTSTRAP
ALBERT SEBASTIAN
DEPARTEMEN ILMU KOMPUTER FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM INSTITUT PERTANIAN BOGOR BOGOR 2016
PERNYATAAN MENGENAI SKRIPSI DAN SUMBER INFORMASI SERTA PELIMPAHAN HAK CIPTA Dengan ini saya menyatakan bahwa skripsi yang berjudul Semaksemak.com: Sistem Penjualan Benih Eceran untuk Masyarakat Perkotaan Menggunakan Magento dan Bootstrap adalah benar karya saya dengan arahan dari komisi pembimbing dan belum dilakukan dalam bentuk apa pun kepada perguruan tinggi mana pun. Sumber informasi yang berasal atau dikutip dari kata yang diterbitkan maupun tidak diterbitkan dari penulis lain telah disebutkan dalam teks dan dicantumkan dalam Daftar Pustaka di bagian akhir skripsi ini. Dengan ini saya melimpahkan hak cipta dari karya tulis saya kepada Institut Pertanian Bogor.
Bogor, Februari 2016 Albert Sebastian NIM G64110075
ABSTRAK ALBERT SEBASTIAN. Semaksemak.com: Sistem Penjualan Benih Eceran Untuk Masyarakat Perkotaan Menggunakan Magento dan Bootstrap. Dibimbing oleh MEUTHIA RACHMANIAH. Masyarakat perkotaan banyak yang memiliki minat di bidang bercocok tanam. Banyaknya benih yang akan terbuang (benih sisa), harga yang relatif mahal dan sulitnya mencari tempat pembelian suatu benih serta perlengkapan bercocok tanam adalah faktor-faktor utama yang membuat semangat bercocok tanam masyarakat perkotaan menurun. Untuk itu, diperlukan sebuah sistem informasi penjualan benih dalam jumlah kecil (satuan hingga puluhan) dengan harga terjangkau yang dapat dibeli oleh masyarakat perkotaan dari mana saja. Situs Semaksemak.com menjadi sebuah situs yang mencoba menjawab permasalahan di atas. Sistem Semaksemak.com dibangun dengan menggunakan Magento dengan pola pengembangan “Extreme Programming” sehingga dapat selesai dalam waktu yang cepat. Tampilan sistem dirancang dengan menggunakan framework tampilan Bootstrap sehingga menghasilkan situs yang responsif terhadap besar layar. Warna serta isi dari situs disesuaikan dengan hasil survei untuk menghasilkan situs yang tepat sasaran sesuai dengan minat masyarakat. Pembuatan website ini diharapkan dapat meningkatkan minat masyarakat perkotaan dalam bercocok tanam sekaligus memperlihatkan peran nyata teknologi informasi dalam mengembangkan pertanian di era modern ini. Kata Kunci: Benih eceran, Magento, Semaksemak.com, Sistem informasi.
ABSTRACT ALBERT SEBASTIAN. Semaksemak.com: System for Selling Small Amount of Seeds Using Magento and Bootstrap. Supervised by MEUTHIA RACHMANIAH. There are many citizens who live in a big city who have interest in planting. A big amount of seeds which wasted, price which relatively expensive, and difficultness to find a place that sells seeds and planting tools are the main factors that makes citizen in big city interest for planting decrease. Because of those reasons, we need information system that sells seeds in small amount and also accesible anywhere. Website Semaksemak.com is a website that try to solve those problems. System of Semaksemak.com was using Magento and “Extreme Programming” software development lifecycle to produce website in a short time. Interface of the website was built by using Bootstrap framework to develop a responsive website. Selection of colors and website content was adjusted to survey results to make more efficient and user-friendly website. This website will likely increase big city citizen’s interest in planting and also show contribution of information system for development of agriculture in this modern era. Keywords: Information system , Magento, Semaksemak.com, Small amount seeds.
SEMAKSEMAK.COM: SISTEM PENJUALAN BENIH ECERAN UNTUK MASYARAKAT PERKOTAAN MENGGUNAKAN MAGENTO DAN BOOTSTRAP
ALBERT SEBASTIAN
Skripsi sebagai salah satu syarat untuk memperoleh gelar Sarjana Komputer pada Departemen Ilmu Komputer
DEPARTEMEN ILMU KOMPUTER FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM INSTITUT PERTANIAN BOGOR BOGOR 2016
Penguji: 1 Rina Trisminingsih, SKomp MT 2 Muhammad Abrar Istiadi, SKomp MKom
Judul Skripsi : Semaksemak.com: Sistem Penjualan Benih Eceran Untuk Masyarakat Perkotaan Menggunakan Magento dan Bootstrap Nama : Albert Sebastian NIM : G64110075
Disetujui oleh
Ir Meuthia Rachmaniah MSc Pembimbing
Diketahui oleh
Dr Ir Agus Buono, MSi MKom Ketua Departemen
Tanggal Lulus:
PRAKATA Puji dan syukur penulis panjatkan kepada Tuhan yang Maha Esa atas segala kemurahan dan karunia-Nya sehingga karya ilmiah ini berhasil diselesaikan. Tema yang dipilih dalam penelitian yang dilaksanakan sejak bulan Februari 2015 ini adalah system engineering, dengan judul Semaksemak.com: Sistem Penjualan Benih Eceran Untuk Masyarakat Perkotaan Menggunakan Magento dan Bootstrap. Penulis menyadari bahwa dalam proses penulisan skripsi ini banyak mengalami kendala, namun berkat bantuan, bimbingan, kerjasama dari berbagai pihak serta anugerah dari Tuhan Yang Maha Esa sehingga kendala-kendala yang dihadapi tersebut dapat diatasi. Untuk itu, penulis menyampaikan ungkapan terima kasih kepada ayah, ibu serta seluruh keluarga atas segala doa dan kasih sayangnya. Ucapan terima kasih dan penghargaan disampaikan kepada Ibu Ir Meuthia Rachmaniah MSc selaku pembimbing yang telah dengan sabar, tekun, tulus dan ikhlas meluangkan waktu, tenaga, dan pikiran memberikan bimbingan, motivasi, arahan, dan saran-saran yang sangat berharga kepada penulis selama menyusun skripsi. Ucapan terima kasih juga saya tujukan kepada Ibu Rina Trisminingsih, SKomp MT dan Bapak Muhammad Abrar Istiadi, SKomp MKom selaku penguji atas segala masukan dan saran yang telah diberikan. Semoga karya ilmiah ini bermanfaat.
Bogor, Februari 2016 Albert Sebastian
DAFTAR ISI DAFTAR TABEL
vi
DAFTAR GAMBAR
vi
DAFTAR LAMPIRAN
vi
PENDAHULUAN
1
Latar Belakang
1
Perumusan Masalah
2
Tujuan Penelitian
2
Manfaat Penelitian
3
Ruang Lingkup Penelitian
3
METODE
3
Data Penelitian
3
Tahapan Penelitian
3
Lingkungan Pengembangan
6
HASIL DAN PEMBAHASAN
7
Planning
7
Design
8
Coding
10
Testing
15
Release
16
SIMPULAN DAN SARAN
17
Simpulan
17
Saran
17
DAFTAR PUSTAKA
17
LAMPIRAN
18
DAFTAR GAMBAR 1 2 3
Alur pengembangan Extreme Programming Alur pengembangan sistem. Logo Semaksemak.com.
4 5 9
DAFTAR LAMPIRAN 1 2 3 4 5 6 7 8 9 10 11 12
Pertanyaan dan Hasil Survei Usecase Diagram Activity Diagram Gambaran Tampilan Situs (Mock up) Contoh Pengintegrasian Halaman Magento dengan Bootstrap Daftar Kebutuhan Fungsional Hasil Pengujian Sistem Tampilan antarmuka situs Pengujian Responsifitas Petunjuk pembelian produk untuk pembeli Petunjuk penggunaan untuk penjual memproses pemesanan Panduan pengembangan sistem untuk sistem administrator
19 25 26 27 28 32 34 38 40 42 43 44
1
PENDAHULUAN Latar Belakang Masyarakat yang tinggal di perkotaan sering kali hanya memiliki sedikit lahan untuk bercocok tanam. Padahal, bercocok tanam adalah salah satu kegiatan yang direkomendasikan. Menteri Pendidikan dan Kebudayaan Anies Baswedan dalam Harian Kompas tanggal 16 Juni 2015, telah mengajak institusi pemerintah menjadikan penanaman pohon sebagai gerakan bukan hanya sebuah program. Dengan demikian, kegiatan ini akan meningkatkan partisipasi masyarakat dalam bercocok tanam. Kebanyakan masyarakat yang tinggal di kota memanfaatkan lahan sempit pekarangan rumah atau menggunakan pot untuk bercocok tanam. Hal tersebut membuat mereka enggan membeli benih dalam jumlah yang besar. Mereka cenderung hanya menanam tanaman dalam jumlah sedikit (tidak lebih dari 10 tanaman). Kebutuhan masyarakat perkotaan akan benih dalam jumlah sedikit (benih eceran) sering kali sulit terpenuhi karena sulit ditemukannya penjual benih yang menjual benih dalam jumlah kecil (eceran). Sebagian besar benih buahbuahan yang dapat di tanam di pekarangan seperti benih tomat, benih cabai kriting, benih pepaya, dan benih jeruk dijual dalam jumlah yang besar, ratusan atau bahkan ribuan benih per bungkus. Hal tersebut juga berlaku bagi benih bunga hias seperti bunga matahari, mawar, aster dan lain-lain. Ketersediaan benih hanya dalam jumlah banyak tidak hanya mengakibatkan uang yang harus dikeluarkan untuk membeli satu jenis benih tanaman relatif besar (belasan sampai puluhan ribu rupiah) namun juga membuat banyaknya benih sisa yang tidak terpakai atau terbuang. Banyaknya benih yang akan terbuang (benih sisa), harga yang relatif mahal dan sulitnya mencari tempat pembelian suatu benih dan perlengkapan bercocok tanam adalah faktor-faktor utama yang membuat semangat bercocok tanam masyarakat perkotaan menurun. Untuk meningkatkan semangat bercocok tanam masyarakat perkotaan, khususnya yang tidak memiliki lahan luas untuk bercocok tanam, diperlukan sebuah “toko” yang menjual benih eceran. Toko tersebut harus dapat dipercaya, mudah dijangkau, dan memiliki harga yang bersahabat. Teknologi internet di Indonesia adalah salah satu teknologi yang semakin hari semakin berkembang. Saat ini, telah banyak masyarakat Indonesia, khususnya masyarakat perkotaan yang menggunakan internet. Hal tersebut dibuktikan dengan banyaknya pengguna media sosial dan forum di internet. Tidak hanya dimanfaatkan dalam berkomunikasi, internet juga sudah banyak dimanfaatkan sebagai media promosi dan jual-beli (Nurhayati, 2010). Kemampuan mendistribusikan dan menemukan informasi dengan mudah melalui internet membuat banyak penjual dan pembeli memilih melakukan transaksi secara online. Toko online juga mampu menjanjikan pengiriman barang secara instan ke pelanggan (Gangeshwer 2013) sehingga cocok untuk masyarakat kota yang tidak sempat berpergian untuk berbelanja. Oleh sebab itu, sebuah toko online menjadi salah satu alternatif toko untuk melakukan transaksi jual-beli benih eceran tersebut. Hal tersebut juga dimanfaatkan oleh beberapa penjual untuk menjual benih, sebut saja Pelangiflora.com atau Tokotrubus.co.id yang menjual kebutuhan bercocok tanam
2 melalui media online. Meski begitu, penjualan benih dalam jumlah kecil (eceran) masih jarang ditemui. Sebelumnya, sebuah penelitian mengenai bisnis online telah dilakukan oleh Nurhayati (2010) dengan judul “Perancangan Website Sebagai Media Promosi Dafidz Baby Rental and Shop di Bogor”. Penelitian tersebut menunjukkan seberapa besar pengaruh media promosi melalui internet dalam melakukan suatu bisnis. Melalui penelitian yang dilakukan, Nurhayati mampu memberikan bukti berupa kenaikan jumlah penjualan sebagai hasil dari media promosi yang ia buat di dunia maya seperti halaman Facebook, Twitter, dan website. Hasil yang sama diharapkan akan tercapai apabila membuat website sebagai sistem e-commerce yang menjual benih eceran. Penelitian ini akan menggunakan Magento sebagai sistem pengatur isi website dan Bootstrap sebagai pengatur tampilan. Magento dipilih karena Magento merupakan salah satu platform yang paling banyak digunakan situs jual-beli di dunia dan memiliki fitur yang lengkap. Magento menawarkan fitur yang tidak ditawarkan oleh platform e-commerce lain (Presta-shop, Open-cart dan lain-lain) seperti fitur untuk debugging kode Magento, fitur multistore yang memungkinkan lebih dari satu toko dalam satu admin panel, dan memiliki fitur analisis yang lengkap mulai dari analisis kata pencarian hingga analisis hasil penjualan. Magento juga bersifat open source (walaupun ada versi berbayar dari Magento) sehingga dapat dimanfaatkan tanpa harus membayar sejumlah uang. Sementara itu, framework Bootstrap dipilih untuk mengatur tampilan dari website karena tampilannya yang bersahabat dengan pengguna, responsif, dan fitur-fitur nya yang cukup lengkap untuk mengatur tampilan.
Perumusan Masalah Berdasarkan latar belakang diatas maka perumusan masalah dari penelitian ini adalah sebagai berikut: 1 Bagaimana cara membuat aplikasi berbasis web yang dapat di akses dengan mudah oleh masyarakat, khususnya masyarakat perkotaan untuk memesan benih dan alat pertanian dasar? 2 Bagaimana cara membuat sistem informasi penjualan benih dalam jumlah kecil (eceran)? 3 Bagaimana mengintegrasikan Magento dan Bootstrap untuk membuat website? Tujuan Penelitian Penelitian ini dibuat dengan tujuan: 1 Membuat sebuah website penjualan benih dalam jumlah kecil yang diberi nama Semaksemak.com. 2 Menghasilkan sebuah toko online yang dapat diakses oleh masyarakat perkotaan yang ingin bercocok tanam. 3 Membuat sebuah situs dengan menggunakan Magento dan Bootstrap.
3 Manfaat Penelitian Dengan adanya toko online yang menjual benih dalam jumlah kecil, alatalat dasar bercocok tanam, dan berisi panduan singkat cara menanam, minat masyarakat dalam bercocok tanam akan semakin meningkat. Masyarakat, khususnya yang tinggal di kota-kota besar, akan lebih mudah mendapatkan benih, alat bercocok tanam dan informasi mengenai tanaman. Hal ini juga secara tidak langsung menyadarkan masyarakat akan pentingnya serta mudahnya bercocok tanam di tengah-tengah kota besar dengan hanya memanfaatkan lahan yang terbatas. Pembuatan website ini juga bermanfaat untuk memanfaatkan bidang keilmuan ilmu komputer di bidang pertanian. Website ini nantinya diharapkan dapat menunjukkan peran penting teknologi informasi dan komunikasi, khususnya internet, dalam perkembangan bidang-bidang keilmuan lainnya, dalam hal ini adalah pertanian. Ruang Lingkup Penelitian 1
2
3
Perangkat lunak utama yang akan dipakai dalam membangun situs Semaksemak.com adalah Magento sebagai pengatur isi dari website (Content Management System – CMS) dan Bootstrap sebagai pengatur tampilan. Pengembangan sistem berfokus pada penggabungan Magento dan Bootstrap untuk menghasilkan sebuah website jual-beli yang tepat guna bagi masyarakat, terutama masyarakat perkotaan. Pengembangan tidak berfokus pada struktur data dari Magento maupun struktur Magento. Pengembangan sistem telah selesai apabila sistem dirasa sudah layak untuk di publikasikan.
METODE Data Penelitian Data yang akan dipakai dalam membangun sistem adalah data dari benih (deskripsi, keterangan jumlah tersedia, harga, berat, gambar tanaman, lama tanam, dan cara penanaman benih), dan alat-alat yang berhubungan dengan bercocok tanam (deskripsi alat, keterangan jumlah tersedia, harga, gambar alat, dan kegunaan alat). Selain data tersebut, data mengenai minat masyarakat terhadap kegiatan bercocok tanam juga akan dikumpulkan. Data dikumpulkan melalui survei dalam bentuk kuesioner dan melalui wawancara. Tahapan Penelitian Penelitian pengembangan sistem informasi Semaksemak.com dilakukan dengan mengikuti kaidah pengembangan “Agile”. Proses pengembangan perangkat lunak “Agile” adalah proses pengembangan perangkat lunak yang mengedepankan kepuasan pengguna dengan meminimalkan waktu pengulangan pembuatan perangkat lunak. Proses “Agile” juga berfokus pada team yang kecil, namun
4 memiliki motivasi yang tinggi, cara-cara yang informal, dan kesederhanaan dari keseluruhan proses. Proses ini membuat tahapan analisis dan desain lebih sederhana, namun tidak sepenuhnya mengabaikan tahap tersebut (Pressman 2010). Prinsip “Agile” dipilih karena prinsip ini menjanjikan kualitas perangkat lunak yang lebih baik dalam waktu yang lebih cepat dan biaya yang lebih kecil (Winter 2015). Hal tersebut dimungkinkan karena prinsipnya meminimalkan dokumentasi dan peka terhadap perubahan kebutuhan. Salah satu model pengembangan “Agile” yang paling populer adalah “Extreme Programming” atau yang biasa disingkat “XP”. Dalam penelitian yang dilakukan oleh Tsun Cow dan Dac-Buu Cao (2007) dari Universitas Capella dalam jurnal ilmiah berjudul “A Survey Study of Critical Success Factors in Agile Software Projects”, XP adalah metode “Agile” yang paling banyak di pakai dalam pengembangan perangkat lunak dengan anggota tim kurang dari sepuluh orang. XP dipilih sebagai dasar pengembangan sistem karena dirasa cocok untuk menghasilkan perangkat lunak berkualitas baik dalam waktu singkat dan tim yang kecil. Tahapan-tahapan dalam metode Xtreme Programming adalah seperti yang ditunjukkan pada Gambar 1.
Gambar 1. Alur pengembangan Extreme Programming (Pressman 2010)
Peneliti mengembangkan sistem dengan mengadaptasi prinsip kerja metode XP sehingga terciptalah tahapan-tahapan seperti berikut: - Planning : perancangan dimulai dengan survei kebutuhan pengguna dan menganalisis kebutuhan sistem. - Design : membuat tampilan dari situs dan merancang kebutuhan fungsional dari situs.
5 -
Coding
-
Testing Release
: membuat kode dari situs, menyesuaikan kode Magento dengan css Bootstrap : melakukan pengujian terhadap sistem. : melakukan implementasi sekaligus konfigurasi akhir sebelum situs dapat diakses oleh pengguna secara online.
Gambar 2. Alur pengembangan sistem.
Planning Tahapan Planning terdiri dari survei untuk mencari data produk yang akan di jual dan survei minat masyarakat dalam bercocok tanam. Survei data produk dilakukan dengan metode wawancara. Peneliti mengunjungi beberapa tempat penjualan benih tanaman yang dapat diajak untuk bekerja sama atau hanya sekedar menjadi supplier. Sementara survei minat masyarakat di dalam bercocok tanam akan dilakukan dengan metode wawancara melalui media online. Di dalam tahapan ini juga dilakukan analisis kebutuhan dasar sistem. Analisis kebutuhan dilakukan dengan cara studi literatur. Dari studi literatur tersebut didapat kebutuhan-kebutuhan apa saja yang harus dipenuhi sebuah situs jual-beli dan siapa saja pengguna yang terlibat. Design Langkah pertama dalam membuat website setelah mendapatkan data yang sesuai adalah menganalisis kebutuhan pembuatan website. Desain kebutuhan pengguna kemudian didaftarkan menjadi sebuah tabel kebutuhan fungsi. Setelah kebutuhan fungsi sudah terdaftar, tahapan dilanjutkan dengan mendesain sumber daya yang akan digunakan oleh website seperti logo, warna dari website, tata letak website dan lain-lain. Desain gambar atau logo yang akan dipakai menggunakan perangkat lunak Adobe Photoshop dan CorelDraw. Selain membuat sumber daya yang digunakan dalam website, desain tampilan juga di lakukan sesuai dengan kebutuhan fungsional yang dihasilkan pada tahapan Planning.
6 Coding Setelah semua materi pembentuk website selesai, maka situs mulai dibuat. Karena belum memiliki online server, pengembangan website dilakukan di local server dengan menggunakan perangkat lunak XAMPP sebagai virtual server. Pembuatan kode sistem meliputi pembuatan dari atribut tampilan (carousel, beberapa animasi, dan lain-lain), penyesuaian kode tampilan sistem Magento dengan Bootstrap, dan pembuatan page juga block pada Magento. Testing Setelah sistem selesai dibuat, maka dilakukanlah tahap pengujian. Pengujian dilakukan dengan menggunakan metode pengujian black-box testing dan acceptance testing. Metode pengujian black-box adalah metode pengujian perangkat lunak yang fokus pada sisi fungsionalitas, khususnya pada input dan output aplikasi tanpa harus menguji hingga ke tingkat algoritme (Pressman 2010). Sementara itu, acceptance testing adalah pengujian perangkat lunak yang berbentuk simulasi pada lingkungan sebenarnya. Acceptance testing dilakukan oleh calon pengguna untuk memastikan sistem layak dipublikasikan. Release Tahapan release sistem dilakukan setelah sistem dirasa sudah layak untuk dipublikasikan. Dalam saat tahapan ini dilaksanakan sistem sudah terlebih dulu sukses melaksanakan serangkaian pengujian. Keberhasilan sistem dinilai oleh pengembang berdasarkan kemampuan sistem memproses fungsi. Dalam tahap release ini akan dilakukan implementasi sistem. Seluruh kode dari sistem diunggah ke hosting, sehingga sistem dapat diakses oleh pengguna. Aplikasi kemudian dikelola oleh penjual untuk selalu memperbarui data dan mengolah setiap pemesanan. Lingkungan Pengembangan Pembuatan situs Semaksemak.com ini dilakukan dengan menggunakan perangkat keras dan perangkat lunak. Adapun perangkat keras yang digunakan berupa komputer personal dengan spesifikasi sebagai berikut: 1 Processor Intel Core i5-4210M 2 RAM 4 GB 3 14.0” HD LED LCD 4 500 GB HDD 5 Mouse dan keyboard Sementara perangkat lunak yang digunakan dalam pembuatan sistem adalah sebagai berikut: 1 Sistem operasi Windows 8.1 2 PHP, CSS, HTML dan Javascript sebagai bahasa pengembangan yang digunakan dalam mengembangkan sistem. 3 Notepad++ sebagai text editor 4 Xampp sebagai local server
7 5 6 7
Magento sebagai pengolah isi website (Content Management System) Bootstrap sebagai framework tampilan Mozilla Firefox dan Google Chrome sebagai peramban
HASIL DAN PEMBAHASAN Planning Hasil Survei Survei dibagi dua, yakni survei untuk benih yang akan dijual dan survei mengenai minat bercocok tanam masyarakat perkotaan. Toko yang telah disurvei adalah Sriwijaya Tani (berlokasi di Karawang), BLST IPB (berlokasi di Bogor), toko-toko pertanian kecil di daerah Dramaga, Bogor seperti Dramaga Tani dan Agroteko, serta pedagang-pedagang benih tanaman skala kecil. Survei ini dilakukan setelah pengembang mendapat rekomendasi atau mengetahui suatu tempat baru yang dapat diajak untuk bekerja sama. Pertanyaan utama yang diajukan adalah apa saja benih yang dijual, berapa harga dari benih tersebut, dan apakah tertarik untuk bekerja sama atau menjadi supplier. Adapun pertanyaan tersebut berkembang sesuai dengan kondisi pada saat wawancara berlangsung. Dari seluruh toko yang diwawancarai didapat daftar benih dan benda-benda lain yang akan dijual. Selain data tersebut, didapat juga kesimpulan bahwa seluruh toko yang diwawancai berminat untuk menjadi supplier saja, tidak untuk bekerja sama ataupun berjualan melalui situs Semaksemak.com. Sebagai tambahan, survei mengenai minat bercocok tanam masyarakat perkotaan dilakukan melalui media online dengan menggunakan Google Form. Survei dilaksanakan selama 15 hari, mulai tanggal 8 Mei 2015 sampai 22 Mei 2015. Survei diikuti oleh 224 responden yang berasal dari berbagai daerah, 172 diantaranya berasal dari kota besar (Jakarta, Bogor, Bekasi, Tangerang, Depok dan Bandung). Hasil survei dari 172 masyarakat yang tinggal di perkotaan cenderung sama dengan hasil survei dari seluruh responden. Survei menunjukkan bahwa 65% responden memiliki minat dalam bercocok tanam. Dari keseluruhan responden tersebut lima alasan utama yang menghalangi mereka dalam melakukan kegiatan bercocok tanam adalah tidak ada yang mengurus, lahan yang sempit, tidak tahu cara menanam yang benar, takut gagal, dan takut mengeluarkan biaya yang tinggi. Sementara untuk tipe benih, pilihan tertinggi adalah benih bunga (42%) dengan alasan terbanyak adalah indah untuk ditanam. Survei tidak hanya meneliti minat bercocok tanam, namun juga meneliti peran media online dalam mengembangkan minat bercocok tanam tersebut. Dari 224 responden, hanya 4 responden (2%) yang mengaku pernah berbelanja kebutuhan bercocok tanam melalui media online. Hasil yang tidak jauh beda juga diperlihatkan dari jumlah situs jual-beli kebutuhan bercocok tanam yang mereka ketahui. Dari 224 Responden, 3 orang menjawab situs belanja online (Lazada, OLX, tokopedia), 1 orang menjawab situs jejaring sosial (Instagram), 3 orang menjawab situs belanja khusus kebutuhan bercocok tanam (Toko Trubus), 217 orang menjawab tidak tahu. Lalu, untuk tampilan dari website 82.1% dari responden
8 mengatakan bahwa warna yang sebaiknya dipakai dalam situs jual-beli kebutuhan bercocok tanam adalah hijau, dengan alasan terbanyak adalah warna tersebut melambangkan apa yang dijual. Menurut survei, hijau juga merupakan warna yang melambangkan kesegaran dan pepohonan. Keseluruhan hasil survei dapat dilihat pada Lampiran 1. Analisis kebutuhan fungsi website Beberapa kebutuhan dasar dari website jual-beli (e-commerce) adalah registrasi pembeli, keranjang belanja, sistem pembayaran, manajemen produk, manajemen konsumen data, manajemen pemesanan, dan pengelolaan harga (Engitel 2016). Kebutuhan-kebutuhan dasar tersebut kemudian didaftarkan berdasarkan tipe tipe pengguna dari sistem. Setelah pengguna dan fungsi dasar telah dibuat, dibuatlah usecase diagram yang dapat dilihat pada Lampiran 2 dan activity diagram yang dapat dilihat pada Lampiran 3 sebagai hasil dari analisis. Masingmasing kebutuhan yang ada pada usecase diagram menjadi daftar fitur yang akan di kembangkan pada tahap selanjutnya. Dengan kata lain, pada tahapan Planning dihasilkan satu set fungsi/fitur sistem dalam bentuk usecase dan activity diagram.
Design Desain basis data pada magento Berbeda dari sebuah framework yang hanya menyajikan struktur untuk membuat kode program saja, Magento adalah sebuah platform e-commerce yang telah menyajikan struktur program lengkap dengan struktur basis data dan fiturfitur yang diperlukan sebuah situs jual beli. Magento mendukung MySQL sebagai database management system untuk mengolah serta menyimpan data. Dari proses penginstallan Magento, secara otomatis dihasilkan 333 tabel pada basis data. Tabel yang berguna untuk pengaturan sistem dimulai dengan nama core (19 tabel), tabel yang dipakai dalam sistem penjualan dimulai dengan nama sales (47 tabel), tabel yang digunakan untuk mengolah katalog dimulai dengan nama catalog (84 tabel), dan sisanya digunakan untuk pengaturan produk serta sistem pengaturan lainnya pada Magento. Seorang pemrogram Magento bernama Völkl Anna (2015) menggambarkan struktur dari basis data Magento dalam bentuk diagram pada website pribadinya. Diagram tersebut dapat dilihat pada halaman http://anna.voelkl.at/uploads/magento/ce1922.png . Pembuatan elemen penyusun tampilan situs Proses pembuatan website dibuat dengan perencanaan yang jelas dimulai dari pembuatan gambaran tampilan website (Mock up), desain Logo yang akan digunakan, penentuan dari warna yang akan di pakai pada website dan lain-lain. Adapun berdasarkan hasil survei, warna dominan dari website yang akan dibuat adalah hijau. Setelah hal tersebut selesai, barulah mulai membuat satu persatu halaman dari website. Hal ini dilakukan agar, perubahan tampilan, atau kesalahan dalam membuat tampilan pada sistem dapat dihindari, dengan begitu proses
9 pembuatan kode tidak banyak berulang. Contoh gambaran tampilan situs dapat di lihat pada Lampiran 4.
Gambar 3. Logo Semaksemak.com.
Desain kebutuhan fungsional Selain pembuatan tampilan website, pada tahapan Design juga dilakukan desain kebutuhan fungsional. Kebutuhan yang didapat pada tahapan Planning dibuat lebih spesifik dan didaftarkan dalam sebuah tabel agar lebih memudahkan pengembang dalam mendesain aplikasi. Hasil dari desain kebutuhan fungsional dapat dilihat pada Tabel 1. Secara lebih lengkap daftar kebutuhan fungsional dapat dilihat pada Lampiran 5. Pada akhir tahap Design didapatlah hal-hal yang akan mampu dilaksanakan oleh sistem dalam bentuk daftar kebutuhan fungsi. Tabel 1 Kebutuhan Fungsi Kode Fungsi F01 F02 F03 F04 F05 F06 F07 F08 F09 F10 F11 F12 F13 F14 F15 F16 F17 F18 F19 F20 F21 F22
Nama Fungsi Registrasi pembeli Tampilan informasi: Home About us How to Order Contact us Informasi detil produk Informasi data pelanggan Informasi keranjang belanja Informasi invoice Informasi produk terbaru Login: Login penjual (admin) Login pengembang sistem (sistem administrator) Login pelanggan Pencarian data: Pencarian data produk berdasarkan kata Pencarian data produk dengan catalog (filter yang tersedia) Pencarian data customer Pencarian data pemesanan Pemesanan produk: Memasukkan produk ke keranjang belanja Ringkasan keranjang belanja Pilihan alamat pemesanan Metode pengiriman Metode pembayaran
10
Kode Fungsi F23 F24 F25 F26 F27 F28 F29 F30 F31 F32 F33 F34
Nama Fungsi Ringkasan pemesanan Proses memasukkan, menyunting dan menghapus data: Produk Kategori Produk Pemesanan Pelanggan Mengubah password Proses Pengembangan Sistem: Menambahkan halaman situs Menambahkan banner pada situs Menambahkan/Mengubah metode pembayaran Menambahkan/Mengubah metode pengiriman Mengubah logo situs Mengubah isi situs
Coding Tahapan Coding pada metode XP sejatinya membutuhkan minimal dua orang pengembang untuk saling mengoreksi dan menyusun kode (Pressman 2010). Pengembangan sistem dari Semaksemak.com dilakukan oleh satu orang pengembang sehingga metode XP yang dipakai mengalami beberapa penyesuaian. Menurut Agarwal dan Umphress (2008), pada metode extreme programming yang dilakukan oleh satu orang pengembang, tidak ada tahap saling mengoreksi antar pengembang. Pengembang membuat pengingat untuk mengembangkan setiap fungsi yang ada secara bertahap. Pengembang mengubah basis kode seorang diri, oleh sebab itu proses pengintegrasian kode dapat dilaksanakan setiap kali ada kode yang diubah tanpa mengalami konflik. Pada penelitian ini, kode yang diubah akan segera diintegrasikan dengan program utama dan dilihat perubahannya, apakah sudah sesuai dengan yang di harapkan atau tidak. Tahapan Coding pada penelitian ini terdiri dari beberapa tahapan sebagai berikut: 1 Konfigurasi Dasar Magento Pengembangan situs Semaksemak.com dilakukan dengan memanfaatkan virtual server XAMPP pada jaringan lokal komputer. Dengan begitu, pengembangan sistem Semaksemak.com dapat dilakukan tanpa memerlukan akses internet. Hal tersebut membuat proses pengembangan lebih cepat. Proses pengembangan dilakukan dengan meng-install Magento pada local server (XAMPP). Secara lengkap proses peng-install-an Magento dapat dilihat pada http://devdocs.Magento.com/guides/m1x/install/installing.html. Proses installasi akan menghasilkan 333 tabel pada database, halaman depan dari website (front end) dan halaman admin (back end) yang dapat dengan alamat “localhost/Nama-Website/admin”. Konfigurasi dasar dari Magento dibagi jadi beberapa tahap diantaranya: o Permissions Menu ini berfungsi untuk membuat level-level Admin. Setidaknya diperlukan dua buah level admin yakni sebuah akun
11 “Super Admin” yang dapat mengakses semua fungsi Magento dan sebuah akun “Admin” untuk seseorang yang hanya mengelola produk dan hal-hal terkait penjualan. Hal tersebut dapat dilakukan dengan mengakses menu System kemudian klik Permissions pada halaman Dashboard Admin dari Magento. o Config Mengatur konfigurasi dasar pada sistem dengan cara memilih menu System pada menu utama lalu pilih Configuration. Store Information: Informasi toko dapat diubah dengan cara memilih menu Store Information pada tab General. Informasi ini dipakai dalam pemberitahuan mengenai website, salah satunya dalam pengiriman email.
2
Design: Pengaturan tampilan pada kode HTML dapat dilakukan melalui menu Design. Hal tersebut dilakukan dengan cara memilih menu Design pada tab General. Pilihan “Display demo store notice” diaktifkan pada saat situs masih dalam pengembangan. Pilihan tersebut akan dinon-aktifkan apabila situs sudah berjalan secara online. Pilihan tersebut memunculkan pemberitahuan bahwa situs sedang dalam konstruksi/demo, sehingga tidak ada yang mencoba menggunakan situs.
Store Email Addresses: Akun email yang akan digunakan oleh toko diatur pada menu Store Email Address . Menu ini dapat diakses dengan memilih pilihan Store Email Address pada tab General. Email yang digunakan oleh toko dimasukkan kedalam tempatnya masing-masing untuk keperluan umum (General), penjualan (Sales), dan hubungan dengan pelanggan (Customer). Semua email haruslah merupakan alamat email asli dan dapat mengirim serta menerima email. Untuk pengembangan pada server lokal, pengaturan email tidak begitu diperlukan. (Dineshmistry 2012)
Pengaturan Tampilan Dasar System
Pengaturan dasar yang di maksud adalah menyesuaikan logo dari situs, favicon (ikon yang ada disebelah judul halaman pada tab peramban), logo yang dipakai untuk keperluan pengiriman email atau cetak, mengganti welcome message dan lain-lain. Setelah selesai dengan pengaturan tampilan dasar, maka kode CSS dan HTML mulai dikembangkan untuk menghasilkan tema dari situs.
12
3 Penyesuaian Tampilan (User Interface) Magento dengan css Bootstrap. Tahapan dalam pembuatan tema dengan Bootstrap dimulai dengan mengunduh Bootstrap pada http://getBootstrap.com/. Pada pembuatan Semaksemak.com, Bootstrap yang digunakan adalah Bootstrap 3.3.4. Langkah selanjutnya adalah menaruh bootsrap.css dan Bootstrap.js yang sudah terunduh, masing-masing pada folder css dan js dari tema skin Magento (skin/frontend/(nama tema)/default. Nama tema yang digunakan adalah semak, maka folder tema dari Magento ada pada skin/frontend/semak/default. Javascript yang digunakan oleh Bootstrap memerlukan jquery, karena itu langkah selanjutnya adalah mengunduh jquery.min.js pada http://jquery.com/download kemudian letakkan pada folder js bersama javascript dari Bootstrap. Dalam folder yang sama, buat sebuah javascript baru dengan menggunakan notepad dan beri nama “jquery.scripts.js”. Fail tersebut akan digunakan untuk membuat tambahan/variasi dari javascript. Untuk membuat Jquery dapat berjalan baik dengan Magento tanpa menimbulkan konflik maka isi fail jquery.scripts.js dengan kode sebagai berikut: jQuery.noConflict(); jQuery(document).ready(function() { // Script tambahan nantinya akan ditulis disini });
Tahap selanjutnya adalah mengintegrasikan semua javascript dan css yang akan digunakan. Hal tersebut dilakukan dengan membuat sebuah fail local.xml dan tempatkan pada folder app/design/frontend/semak/default/layout. Masukkan kode sebagai berikut kedalam local.xml:
<default translate="label" module="page"> skin_js js/jquery.min.js skin_js js/Bootstrap.js skin_js js/jquery.scripts.js skin_js js/html5shiv.js<params/>lt IE 9 skin_js js/respond.min.js <params/>lt IE 9 skin_css css/styles.css
13 skin_css <stylesheet>css/Bootstrap.css skin_css <stylesheet>css/styles.css skin_css <stylesheet>css/print.css
Local.xml adalah fail yang digunakan untuk membuat deklarasi dari fail tertentu, misalnya template dari suatu halaman, posisi widget,fail javascript, fail css, dan lain-lain. Setelah di deklarasikan pada local.xml barulah fail tersebut dapat digunakan.
digunakan sebagai referensi dari sebuah block kode dari magento. Salah satu yang digunakan dalam kode program di atas adalah yang artinya, setiap sebuah block kode dengan nama “head” dipanggil dalam suatu halaman, maka isi referensi juga akan diikutsertakan. skin_js js/jquery.min.js
Kode diatas berfungsi untuk menambahkan jquery.min.js pada tema Magento yang sedang dikembangkan. digunakan untuk memanggil suatu fungsi yang ada di dalam Magento. addItem adalah salah satu fungsi yang ada dalam Magento. addItem adalah fungsi yang berguna untuk mengikutsertakan suatu fail sebagai bahan acuan (library) tambahan pada Magento. Tipe fail yang bisa dimasukkan dalam fungsi antara lain javascript dan css. skin_css css/styles.css
Kode diatas berfungsi untuk menghilangkan style.css asli dari tema Magento yang sedang dikembangkan. removeItem adalah salah satu fungsi yang ada dalam Magento, yang berguna untuk menghilangkan suatu fail dari suatu block kode pada Magento. Fail css asli dari Magento dihilangkan agar tidak ada bentrok dengan fail css Bootstrap yang digunakan dalam pengembangan tema. Tahapan terakhir dalam pengintegrasian Bootstrap dan Magento adalah penggantian kode dari template halaman Magento. Penggantian tersebut adalah menyesuaikan kode dari tampilan Magento dengan kode dari Bootstrap sehingga setiap halaman pada Magento menggunakan css dan javascript dari Bootstrap. Halaman-halaman yang akan diubah tersebut diduplikasi dari folder
14 dasar (app/design/frontend/base/default/layout) ke folder tema (app/design/frontend/semak/default/layout) dengan struktur folder yang sama. Bootstrap memiliki class untuk membagi kolom dari sebuah situs. Class tersebut antara lain col-xs-, col-sm-, col-md-, dan col-lg-. Masingmasing class akan membuat layar responsif terhadap besar layar, col-xsdigunakan untuk layar smartphone, col-sm- digunakan untuk layar tablet, colmd- digunakan untuk layar desktop, dan col-lg- digunakan untuk layar komputer yang memiliki kerapatan layar tinggi. Lebar suatu halaman situs dibagi menjadi 12 pada Bootstrap, sehingga untuk mengatur besar kolom, masing-masing class harus diikuti dengan jumlah kolomnya. Sebagai contoh, perpaduan col-md-9 dan col-md-3 akan menghasilkan layar dengan dua bagian, masing-masing 75% (9 kolom) dan 25% (3 kolom). Penjelasan lengkap mengenai pengaturan halaman pada Bootstrap dapat dilihat pada situs http://getbootstrap.com/getting-started/ . Sementara itu, pembagian kolom pada Magento diatur berdasarkan besar dari layar. Berbeda dengan Bootstrap, Magento tidak menyediakan class yang dapat diatur besar kolomnya. Elemen halaman dalam suatu halaman website magento diatur besarnya secara langsung di dalam fail css Magento dengan menspesifikasikan besar halaman. Pengintegrasian Magento dengan Bootstrap yang paling dasar adalah penyesuaian tema Magento dengan sistem pembagian kolom pada Bootstrap. Hal tersebut dilakukan dengan mengganti class pada Magento menjadi class pada Bootstrap. Misalkan pada Magento terdapat sebuah halaman dengan dua kolom, masing-masing dengan lebar 25% layar dan 75% layar. Kolom tersebut memiliki class ‘a’ untuk kolom dengan lebar 25% dan class ‘b’ untuk kolom dengan lebar 75%. Untuk menjadikannya responsif sesuai dengan class yang ada pada Bootstrap, class ‘a’ dan ‘b’ diubah menjadi ‘col-md-4’ dan ‘col-md8’. Dengan begitu akan dihasilkan sebuah halaman situs dengan komposisi kolom yang serupa, walaupun menggunakan class yang berbeda. Penyesuaian lainnya juga dilakukan dengan mengganti berbagai class pada Magento dengan class yang ada pada Bootstrap seperti: 1 2 3 4 5
Penyesuaian class pada tombol Penyesuaian class tabel Penyesuaian Navigasi dengan bootstrap Penggunaan form pencarian Bootstrap Penggunaan carousel Bootstrap pada halaman utama dan lain-lain.
Contoh kode program dari halaman Magento yang diintegrasikan dengan Bootstrap dapat dilihat pada Lampiran 6. 4 Pembuatan Page dan Block Pada Magento Pengaturan atribut pada website tidak hanya dilakukan dengan mengubah kode dari fail yang ada pada Magento. Magento juga menyediakan sebuah fitur untuk menghasilkan halaman (Page) dan blok tertentu sebagai bagian dari halaman (Block). Fitur ini dapat diakses dengan mengklik CMS pada menu utama halaman dashboard admin dari Magento, kemudian klik Page atau Block. Pada
15 halaman tersebut, isi kolom Content dengan kode html yang akan ditampilkan pada situs. Dengan cara tersebutlah, dapat dibuat sebuah carousel, memindahmindahkan elemen dari halaman website dan mengatur isi dari halaman. Carousel adalah sebuah cara menampilkan sekumpulan gambar. Gambar yang akan ditampilkan akan berganti satu persatu dalam selang waktu tertentu. Contoh block yang digunakan pada situs Semaksemak.com adalah sebuah carousel pada halaman homepage. Kode dari carousel yang digunakan adalah sebagai berikut:
5
data-
Lagi"
Lagi"
Lagi"
Pembuatan Page dan Block Pada Magento
Pada proses pengembangan sistem ini setidaknya terdapat 4 kali iterasi. Iterasi pertama bertujuan untuk memperbaiki kesalahan tampilan pada halaman utama program, memperbaiki tata letak dari menu navigasi utama, dan perbaikan animasi CSS yang digunakan pada shopping cart.Iterasi kedua dilakukan untuk memperbaiki tata letak halaman produk, memperbaiki tata letak halaman katalog, memperbaiki responsifitas halaman produk, dan memperbaiki responsifitas halaman pemesanan. Iterasi ketiga dilakukan untuk memperbaiki bentrok javascript pada halaman pemesanan, mengubah serta memastikan tampilan checkout berjalan dengan baik, serta mengoptimalkan tata letak setiap halaman. Iterasi terakhir, iterasi ke-empat dilakukan dengan menambahkan logo IPB ke dalam situs dan membuat sebuah halaman baru yang menjelaskan apa itu Semaksemak.com. Testing Pengujian dilakukan dengan menggunakan metode black-box testing. Pengembang memastikan beberapa hal seperti fungsi berhasil dijalankan oleh program tanpa adanya error, Bootstrap dan Magento terintegrasi dengan baik, situs menampilkan informasi sesuai dengan keinginan dan lain-lain. Saat pengembangan dilakukan seorang diri, skenario pengetesan dapat dibuat dan dilaksanakan dengan mudah. Pengembang dapat melakukan pengujian dan menghimpun kode perbaikan sebelum kembali memperbaiki program (Agarwal dan Umphress 2008).
16 Hasil akhir dari pengujian fungsi dari sistem secara lengkap dapat dilihat pada Lampiran 7. Dari hasil pengujian sistem dapat disimpulkan bahwa sistem telah memenuhi fungsi utama yang diharapkan. Hampir setiap halaman pada website sudah terintegrasi dengan CSS Bootstrap sehingga sistem dapat lebih responsif terhadap besar layar. Tampilan halaman website dapat dilihat pada Lampiran 8, sementara hasil uji responsifitasnya ada pada Lampiran 9. Sementara itu, calon pengguna tidak melakukan tahap acceptance testing karena situs belum dapat diakses melalui internet. Hal tersebut disebabkan oleh masa pemesanan hosting yang telah berakhir. Release Secara lengkap, tahap Release dilaksanakan dengan beberapa tahapan sebagai berikut: 1 Memesan Hosting dan Domain. Hosting adalah tempat yang digunakan untuk menyimpan kode dan data dari situs. Sementara domain adalah alamat untuk mengakses situs. Pemilihan hosting dilakukan dengan mempertimbangkan besarnya data, perkiraan besar dari pemesanan dan kualitas dari server. Hosting dipesan berikut dengan nama domain yang akan dibuat. Pengembang memesan domain dengan nama Semaksemak.com serta memilih Niagahoster sebagai jasa penyedia layanan hosting. 2
Mengunggah Kode Website ke Server Hosting Setelah situs dirasa sudah layak untuk dipublikasikan, maka semua kode di server lokal di unggah ke server online. Seluruh kode diunggah melalui program yang disebut C-Panel, yang sudah disediakan dari penyedia jasa hosting. Setelah kode diunggah, maka dilakukanlah pengaturan terhadap basis data online yang akan digunakan sistem.
3
Konfigurasi akhir Setelah konfigurasi basis data selesai dan Magento dapat dijalankan pada server online, hal yang dilakukan selanjutnya adalah mengisi data produk ke dalam sistem. Sebelum memasukkan produk ke dalam Magento, kategori dari produk tersebut harus dibuat. Kategori dari produk dibuat dengan mengakses menu Catalog pada dashboard admin, kemudian pilih Manage Categories. Setelah itu, data produk dapat dimasukkan ke dalam sistem dengan mengakses menu Catalog pada halaman dashboard admin, kemudian klik Manage Product. Setiap produk harus dimasukkan kedalam kategori tertentu agar muncul pada halaman situs sesuai kategori masing-masing. Selain dari konfigurasi, dibuat juga petunjuk penggunaan yang membantu pengguna dalam menjalankan sistem. Petunjuk penggunaan untuk pembeli dapat dilihat pada Lampiran 10, petunjuk penggunaan untuk penjual dapat dilihat pada Lapiran 11, sementara petunjuk penggunaan untuk system administrator dapat dilihat pada Lampiran 12.
17
SIMPULAN DAN SARAN Simpulan Magento dan Bootstrap dapat digabungkan untuk membuat sebuah situs jual beli yang responsif. Sistem Semaksemak.com berhasil dibuat dengan menggunakan Magento dan Bootstrap. Instalasi serta konfigurasi dasar dari sistem dilakukan baik secara offline ataupun online agar dapat diakses oleh masyarakat perkotaan kapan saja dan dimana saja. Saran Penelitian ini hanya berfokus pada bagaimana cara mengintegrasikan Boostrap sebagai pengatur tampilan Magento. Oleh karena itu, pengembangan selanjutnya dapat dilakukan pada penelitian tentang bagaimana cara mengembangkan basis data dari Magento. Magento juga memungkinkan pengembang untuk menambahkan fitur yang belum ada dalam Magento. Penambahan fitur pada Magento dan cara publikasi situs agar situs dapat lebih dikenal oleh masyarakat juga dapat dikembangkan menjadi penelitian selanjutnya. Demi menyesuaikan minat dan tren pada masyarakat, pengembangan sistem Semaksemak.com juga dapat dilanjutkan agar senantiasa menjadi situs yang tepat guna dan disukai oleh masyarakat.
DAFTAR PUSTAKA Agarwal R, Umphress D.2008. Extreme Programming for a Single Person TeamCow. Proceedings of the 46th Annual Southeast Regional Conference; 28-29 Maret 2008; Auburn, Alabama. US: DBLP. Hal. 82-87 T, Cao DB.2007.A Survey Study of Critical Success Factors in Agile Software Projects. The Journal of System and Software 81:963-971. Dineshmistry. 2012. Setting Up Magento: So you want a REAL store and not a demo?.http://www.magentocommerce.com/wiki/3__store_setup_and_management/so _you_want_a_real_store_and_not_a_demo [4 April 2015]. Dooley J. 2011. Software Development and Professional Practice. New York (US): Apress. Engitel.2016. Typical functions of an e-commerce system.[internet].[diunduh 2016 Jan 11]. Tersedia pada: http://www.engitel.com/en/products/spingo-commerce/typicalfunctions-of-ecommerce-system.html. Gangeshwer DK.2013.E-Commerce or Internet Marketing: A Business Review from Indian Context. International Journal of u- and e- Service, Science and Technology Vol.6 No.6:187-194. Gunawan, I. 2014. Definisi, Contoh dan Dampak E-commerce. http://unindrax1eione.wordpress.com/e-commerce/definisicontoh-dan-dampak-ecommerce/ [13 Desember 2014] . Husein IM. 2010. Hubungan antara pengetahuan dan perilaku pemasar online bidang pertanian sebagai konsumen mesian pencari google dengan peringkat website [skripsi]. Bogor (ID): Ekologi Manusia, Institut Pertanian Bogor. Martin RCMM. 2007. Agile Principles, Patterns, and Practices in C#. Ed ke-3. Upper Saddle River (US): Prentice Hall. Nurhayati Y. 2010. Perancangan website sebagai media promosi dafidz baby rental and shop di bogor [skripsi]. Bogor (ID): Ekonomi dan Manajemen, Institut Pertanian Bogor.
18 Pressman RS. 2010. Software Engineering: A Practitioner's Approach 7th Ed. New York (US): McGraw-Hall. Setiawan AF. 2008. Framework. https://antonifs.wordpress.com/2008/12/31/framework/ [13 Desember 2014]. Völkl A (2015). Magento CE 1.9.2.2 database diagram. http://anna.voelkl.at/magento-ce1-9-2-2-database-diagram/ [22 Februari 2016] Winter B.2015. Agile Performance Improvement: The New Synergy of Agile and Human Performance. New York (US): Apress. Susanto I.2015-06-15. Mendikbud Serukan Penanaman Pohon Jadi Gerakan, Bukan Program.KOMPAS.http://print.kompas.com/baca/2015/06/16/MendikbudSerukan-Penanaman-Pohon-Jadi-Gerakan%2c-Bu.
19
LAMPIRAN Lampiran 1 Pertanyaan dan Hasil Survei Survei diadakan selama 15 hari, dimulai dari tanggal 8 Mei 2015 – 22 Mei 2015. Survei diikuti oleh 224 orang. Adapun pertanyaan dan hasil survei tersebut adalah sebagai berikut: 1. Apa jenis kelamin anda? - 64 laki-laki (28.6%) - 160 perempuan (71.4%) 2. Berapa usia anda? Survei diikuti responden dengan rentang usia 12-47 tahun. 3. Dimana anda tinggal? - Jakarta , 40 orang (17.9%) - Bogor , 20 orang (8.9%) - Depok , 9 orang (4%) - Tangerang , 63 orang (28.1%) - Bekasi , 40 orang (17.9%) - Lain-lain , 52 orang (23.2%) Hal ini menunjukkan bahwa responden sebagian besar (76.8%) adalah masyarakat kota besar (Jabodetabek). 4. Apakah anda memiliki halaman rumah?
Tidak, 82 orang, 37%
Ya, 142 orang, 63%
20 5. Apakah anda memiliki minat dalam bercocok tanam?
Tidak, 78 orang, 35%
Ya, 146 orang, 65%
6. Apakah yang menghalangi anda dalam melakukan kegiatan bercocok tanam? (Jawaban berupa pilihan yang dapat dipilih lebih dari satu.
Jumlah Pemilih Dari Kendala Bercocok Tanam Tidak tahu cara menanam yang benar
72
Tidak ada yang mengurus
102
Harus membeli peralatan/alat/bibit dalam jumlah banyak
26
Mengeluarkan biaya yang tinggi (alat dan bibitnya mahal)
41
Takut gagal dalam menanam
54
Tidak tahu dimana membeli bibit tanaman
28
Tidak tahu dimana membeli alat untuk bercocok tanam (pot, plastic bag , dan lain-lain)
17
Lahan yang sempit (tidak punya tempat untuk bercocok tanam
80
Other
19
Tidak ada halangan apapun dalam bercocok tanam
18 0
20
40
Jumlah Pemilih Dari Kendala Bercocok Tanam
60
80
100
120
21 7. Jika anda dapat menanam tumbuhan dalam pot atau lahan sempit di lingkungan tempat tinggal anda, benih apa yang paling ingin anda tanam? 11%1%
28% 19%
41%
Bibit buah
Bibit bunga
Bibit sayuran
Bibit tanaman Herbal
Lainnya
8. Apa alasan utama anda memilih benih pada nomor 7?
Alasan Dalam Memilih Benih/Benih Untuk Ditanam
Keperluan berbisnis (Dapat dijual apabila sudah tumbuh)
4
Memiliki hobi tanaman sejenis itu
4
Untuk diambil hasilnya dan digunakan dalam kebutuhan sehari-hari
66
Mengurangi biaya pengeluaran rumah tangga
3
Indah untuk di tanam
68
Berguna bagi keluarga
27 0
10
20
30
40
50
60
Jumlah Pemilih
9. Pernahkah anda membeli benih/peralatan bercocok tanam dengan media online? Pernah, 4 orang, 2%
Tidak Pernah, 220 orang, 98%
70
80
22 10. Pada situs apa anda biasa membeli benih/peralatan dalam bercocok tanam? - 3 orang mengaku pernah membeli benih/peralatan bercocok tanam melalui media sosial Facebook/Instagram. - 1 orang mengaku pernah membeli benih/peralatan bercocok tanam melalui situs jual beli Kaskus. - 220 orang lainnya mengaku tidak tahu/tidak pernah. 11. Sebutkan toko online yang menjual kebutuhan bercocok tanam (benih, pot, pupuk dan sebagainya) yang anda ketahui! - 3 orang menyebut situs Trubus. - 3 orang menyebut situs jual beli seperti Lazada, Kaskus, dan Tokopedia. - 1 orang menyebut nama toko online yang berjualan melalui akun Instagram. - 117 orang lainnya mengaku tidak tahu. 12. Apa yang terbayang di dalam pikiran anda apabila melihat warna berikut: a. Hijau
b. Merah
c. Putih
23 d. Abu-abu
e. Biru Muda
f. Kuning
g. Oranye
24 13. Menurut anda, apa warna yang paling tepat dijadikan warna dominan dari sebuah situs yang menjual hal-hal berkaitan dengan kegiatan bercocok tanam?
Warna yang Cocok Untuk Situs Penjual Kebutuhan Bercocok Tanam Biru
9
Abu-abu
2
Merah
1
Oranye
4
Kuning
10
Hijau
184
Putih
8
Lainnya
6 0
20
40
60
80
100
120
140
160
180
200
Jumlah Pemilih
14.
Apa alasan anda memilih pilihan nomor 13?
Tidak ada alasan, hanya menganggap warna itu yang pas
11
Warnanya sesuai dengan desain website jual beli yang ada saat ini
9
Warnanya menarik perhatian
11
Warnanya melambangkan apa yang dijual website
143
Warnanya membuat website terlihat nyaman
39
Other
11 0
Jumlah Pemilih
50
100
150
200
25 Lampiran 2 Usecase Diagram
26 Lampiran 3 Activity Diagram
27
Lampiran 4 Gambaran Tampilan Situs (Mock up)
Sketsa (Mock up) halaman depan
Sketsa (Mock up) halaman produk.
28
Lampiran 5 Contoh Pengintegrasian Halaman Magento dengan Bootstrap Salah satu contoh penggantian kode ada pada fail 2columns-left.phtml. Fail tersebut adalah fail yang digunakan sebagai template halaman dengan dua kolom. Kolom sebelah kiri lebih kecil dibandingkan kolom pada sebelah kanan. Kolom sebelah kiri digunakan sebagai sidebar, sementara kolom sebelah kanan digunakan untuk isi dari halaman situs. Kode dalam 2columns-left.phtml yang semula adalah sebagai berikut: getChildHtml('head') ?> getBodyClass()?' class="'.$this>getBodyClass().'"':'' ?>> getChildHtml('after_body_start') ?> getChildHtml('global_notices') ?>
getChildHtml('header') ?>
getChildHtml('breadcrumbs') ?>
getChildHtml('global_messages') ?> getChildHtml('content') ?>
getChildHtml('footer') ?> getChildHtml('global_cookie_notice') ?> getChildHtml('before_body_end') ?>
