Aplikasi Berbasis Layanan

Era Industri 4.0 ditandai dengan perkembangan IT, salah satunya adalah Big Data. Dengan konsep serba “V” seperti “velocity”, “volume”, dan “v” lainnya membuat siapa yang bisa memanfaatkannya akan menang dalam persaingan. Bentuk Big Data yang “Variety” membuat rumitnya pengaksesan dan pengolahan, khususnya data yang tidak terstruktur dimana tidak berlaku standar QUERY lagi.

Beragamnya jenis data mengakibatkan para perancang aplikasi saat ini tidak lagi berpatongan dengan “single database” yang dikenal dengan istilah monolitik. Tentu saja akan sulit menyimpan beragam tipe data dalam satu sistem basis data, misalnya sistem yang terdiri data Geospasial harus bekerja sama dengan Non-Spasial.

Microservices

Untuk mengatasi beragamnya jenis basis data, saat ini banyak yang menerapkan metode microservices yang membagi aplikasi menjadi service-service kecil. Selain bermanfaat ketika dihadapkan dengan jenis tipe data yang beragam, microsoervices juga dapat mengatasi “bottleneck” ketika satu transaksi akan diakses oleh banyak pengguna, misalnya ketika deadline atau hari terakhir submit.

Aplikasi-aplikasi E-Commerce seperti Gojek, Grab, Traveloka, dan lain-lain sudah pasti menggunakan prinsip tersebut. Perpaduan antara data spasial yang dibutuhkan mitra, gudang data yang menggunakan NoSQL, misalnya mongodb, akan menyulitkan jika server hanya satu. Traveloka pun menggunakan prinsip mengakses service dari situs lain, seperti Lion, AirAsia, Garuda, dan maskapai lainnya, selain tentu saja hotel dan akomodasi pendukungnya. Servis ini dikenal dengan istilah Application Programming Interface (API). API ini ibarat tombol yang dapat diakses oleh siapapun tanpa harus menggunakan bahasa pemrograman atau platform yang digunakan oleh penyedia. Ibarat tombol listrik, tidak peduli arus searah atau bolak-balik, yang penting pengguna dapat menekan tombol on-off.

Data Semistructure

Dalam pertukaran data, aplikasi berbasis web tidak menerapkan format data terstruktur dengan baris dan kolom. Jenis data yang digunakan adalah tipe yang ramah dengan HTML, yakni XML dan Jason. Nah, ketika transaksi berjalan, dengan pertukaran message/pesan lewat metode REST ataupun SOAP, aplikasi lain dengan aman mengakses data dari service lain yang diijinkan.

Untuk mempraktikannya, misalnya kita buat sebuah database dengan aplikasi berbasis PHP-MySQL berisi data siswa. Ketika dibuat sebuah service, misalnya “data.php”, maka dapat digunakan untuk mengirim data lewat fungsi GET yang akan dimanfaatkan oleh fungsi lain. Banyak server-server testing yang gratis yang dapat dimanfaatkan. Tentu saja, yang berbayar lebih baik seperti Amazon Web Service (AWS) dan sejenisnya.

Aplikasi di atas menunjukan bagaimana service diakses langsung dari PHP server. Ketika mengakses data di atas, sistem tidak secara langsung mengakses basis data lewat SQL melainkan lewat format GET yang disiapkan oleh satu file bernama “data.php” lewat “form_get.php” untuk mempersiapkan data berformat Jason.

Sebagai bukti servis dapat dimanfaatkan oleh aplikasi lain, lewat browser kita dapat langsung mengakses “data.php” yang berisi data siswa. Tentu saja perlu menambahkan API key agar menjaga akses dari pihak-pihak yang tidak diijinkan, terutama untuk service POST dan PUT yang menginput dan mengedit data. Untuk jelasnya silahkan lihat video berikut, semoga bermanfaat.

Mudah Membuat Aplikasi Web dengan Bootstrap

Saat ini membuat aplikasi web jadi lebih mudah dengan banyaknya alat bantu disain, salah satunya adalah bootstrap. Aplikasi ini memanfaatkan teknologi HTML, CSS dan JavaScript. Bootstrap sejatinya adalah template untuk mempercepat pembuatan program. Rekan-rekan dosen pasti kenal template, misalnya template jurnal tertentu ketika akan submit. Template harus diikuti dan penulis mengisi template dengan naskah jurnalnya. Begitu juga template dalam perancangan web yang digunakan untuk mengisi konten. File template ketika akan digunakan perlu dilakukan kustomisasi sesuai dengan proses bisnis baik frontend maupun backend. Kata bootstrap pertama kali saya dengar ketika kuliah web technology dimana seorang siswa asal Perancis mempresentasikan tugasnya dengan teknik praktis ini.

Salah satu situs penyedia template bootstrap terkenal adalah: https://startbootstrap.com/. Silahkan kunjungi situs tersebut dan masuk ke menu templateadmin & dashbord untuk melihat template yangt ersedia.

Silahkan pilih, misalnya SB Admin dengan status “Free” dan diunduh jutaan kali. Selanjutnya klik template yang dituju untuk masuk ke menu download. Lanjutkan dengan menekan Free Download.

Setelah mengunduh, coba cek jalankan dengan terlebih dahulu mengekstrak file rar hasil unduhan. Jalankan file index.html untuk melihat template tersebut. Berikutnya silahkan mengkustomisasi file index.html tersebut, misal menghapus bagian-bagian tertentu, atau bisa mengganti nama misalnya index.php jika menggunakan bahasa PHP.

Oiya, untuk testing, misalnya dengan Github, karena jumlah file yang sedikit, memudahkan Anda upload ke Github online (non-desktop) karena per folder kurang dari 100 file.Sekian info singkat ini, semoga bermanfaat.

Upgrade Skill Pemrograman Android

Ketika tidak mengajar, hal paling mengasyikan bagi dosen adalah pelatihan, terutama dari program studi diploma dan vokasi. Program studi jenis ini mengharuskan dosen memiliki ketrampilan yang bisa dibagikan kepada mahasiswa walaupun tentu saja tidak mungkin seorang dosen menguasai seluruh bidang yang ada, salah satunya adalah pemrograman mobile berbasis Android.

Cara paling praktis adalah saling berbagi ilmu oleh dosen-dosen yang ada. Beberapa hari yang lalu diadakan pelatihan mobile programming dengan Android Studio. Bahasa yang digunakan adalah Java disertai dengan Web Service berbasis CodeIgniter. Web service ini berfungsi menghubungkan aplikasi Android dengan sistem basis data, misalnya MySQL.

Ternyata banyak elemen-elemen yang perlu dikuasai untuk membuat aplikasi untuk handphone itu. Dari pembuatan layout, Grader Script, hingga pembuatan menu-menu lanjut seperti masukan berupa tanggal, combo, hingga upload image ke server. Bahkan instalasi software Android Studio pun butuh waktu. Tips dan Trik banyak diberikan terutama untuk mempercepat proses pembuatan aplikasi, misalnya penggunaan Genymotion yang menggantikan emulator bawaan Android Studio yang berat.

Sangat perlu untuk mengetahui teknik-teknik pembuatan praktis dan bagaimana beberapa paket dimanfaatkan yang berhubungan dengan user interface dan koneksi ke DBMS, misalnya dengan library volley. Rencananya akan dilanjutkan dengan pelatihan-pelatihan sesuai dengan peminatan seperti android yang menggunakan artificial intelligence, networking, hingga sistem informasi management (SIM). Dari semua itu, yang terpenting adalah kebersamaan antar dosen terutama dalam mengikuti visi misi tujuan dan sasaran (VMTS) prodi teknik komputer yang fokus salah satunya ke pemrograman berbasis network dan artificial intelligence pada perangkat embedded, yang kali ini diwakili oleh aplikasi mobile/gadget.

Ngobrolin Teknologi Pemrograman Mobile

Bagi Anda yang sudah lama berkecimpung di dunia teknologi informasi, teknologi mobil merupakan teknologi baru yang sedang booming saat ini. Pengguna ponsel cerdas saat ini diprediksi sudah sampai 1 milyar sehingga sebagian besar proses bisnis beralih dari konvensional menjadi online berbasis aplikasi. Postingan ini sekedar men-share webinar yang dilakukan oleh jurusan teknik komputer Universitas Islam “45” Bekasi dengan pembicara saya dan bpk Malikus Sumadya, S.Si, M.T., dosen pengajar mata kuliah pemrograman mobile yang saat ini tinggal merampungkan disertasi doktor ilmu komputer-nya di Universitas Indonesia.

Inti dari webinar ini sebenarnya mengenalkan beberapa pilihan teknologi dalam membuat aplikasi, khususnya berbasis Android yang jumlah penggunanya lebih banyak dari iOS (apple). Dimulai dari yang berbasis tanpa kode (no coding) hingga yang rumit, misalnya Android Studio serta framework dengan Web Service, baik yang berbasis PHP maupun Python. Manfaat lain acara webinar ini salah satunya adalah ajang bertemu dengan pihak-pihak yang berminat dengan pemrograman mobile baik dari pelajar, guru, maupun mahasiswa ilmu komputer, khususnya program teknik komputer (D3 maupun Vokasi). Berikut link youtubenya, kurang lebihnya mohon maaf, semoga bermanfaat.

Aplikasi Machine Learning di Web dengan Python

Aplikasi web saat ini merupakan aplikasi yang wajib diketahui oleh pihak-pihak yang terlibat dengan ilmu komputer baik mahasiswa, dosen, hingga staf IT di perusahaan. Di tahun 2020, permintaan aplikasi berbasis Artificial Intelligence (AI) sangat tinggi. Mau tidak mau, programmer dan pengembang wajib mengetahui tool yang mendukung AI, salah satunya adalah bahasa pemrograman Python.

Framework Web Python

Python awalnya adalah aplikasi yang digunakan untuk back-end tetapi saat ini dengan framework-framework yang tersedia bisa juga bermain di front-end. Salah satu framework yang terkenal adalah Flask dan Jango. Untuk bagaimana ilustrasi penggunaan Flask untuk menjalankan aplikasi AI berbasis web silahkan lihat di www.bisa.ai
berikut ini.

Menggunakan Web Server Lain

Untuk testing biasanya dengan framework web Python, tetapi untuk implementasi biasanya menggunakan web server yang banyak dipakai, salah satunya adalah Apache dengan bahasa pemrograman PHP-nya yang terkenal dan sampai saat ini masih banyak digunakan. Untuk itu diperlukan pengetahuan mengintegrasikan PHP dengan Python. Misal kita punya kode Python sederhana perkalian 2×4 berikut ini:

  • print(“<B>Hasil Olah dengan Python</B><br>”)
  • y=2*4
  • print(“<B>Hasil 2 x 4 = </B>”)
  • print(y)

Misal kita beri nama tes.py. Selanjutnya kita buat satu kode PHP yang memanggil “tes.py” tersebut untuk dijalankan. Sebelumnya perlu kita ketahui bersama bahwa menjalankan “tes.py” dapat dilakukan lewat konsol dengan mengetik python tes.py. Nah, instruksi tersebut yang kita gunakan dalam kode php kita berikut ini. Perhatikan, PHP berwarna merah ditujukan untuk menjalankan file tes.py berbahasa Python.

  • <html>
  • <head>
  • <title></title>
  • </head>
  • <body>
  • <h3>Tes PHP to Access Python</h3>
  • <?php
  • $my_command = escapeshellcmd(‘C:/python27/python tes.py’);
  • $command_output = shell_exec($my_command);
  • echo $command_output;
  • ?>
  • </body>
  • </html>

Beri nama file tersebut, misalnya index.php. Yang perlu diperhatikan adalah python yang digunakan haru disetel path-nya. Atau arahkan saja python.exe disertai lokasi foldernya. Contoh yang saya gunakan adalah python versi 2 di c:/python27/python.exe. Jika lebih dari satu environment jangan sampai salah lokasi. Letakan kedua file di atas (tes.py dan index.php) di lokasi web. Untuk XAMPP di htdocs, sementara yang lain, misalnya Wamp Server di folder www.

Tulisan “Tes PHP to Access Python” berasal dari index.php sementara tulisan “Hasil Olah dengan Python”, “Hasil 2×4” dan hasil kalinya (“8”) berasal dari tes.py. Sekian, semoga bermanfaat.

How to Draw a Diagram using Draw IO?

Draw IO is a free web-based tool for drawing a model such as Entity Relation Diagram (E-R Diagram), Flow chart, Data Flow Diagram (DVD), Unified Modeling Language (UML), etc. You can access it at www.draw.io in start using it without installation. Immediately you will be asked the location for saving the xml file, for example you use your harddrive, so yo have to choose Device.

And please click the “create a new diagram” or “open existing diagram” if you want to open a xml file of your diagram that have drawn before. Before drawing, this application will ask you to create the name of your diagram.

And let your creativity flows, and for exercise, try to draw E-R diagram like this.

Save your figure by clicking the menu save and if you want to capture for your document (word, power point, etc) you have to download it into image, xml, and other file support. So far, I like to download as GIF than JPEG or others. Because it give a good resolution that you can see below. Ok .. good luck.

Paten pada Rekayasa Perangkat Lunak

Rekayasa Perangkat Lunak (Software Engineering) merupakan bidang baru yang banyak diminati oleh anak-anak muda kita. Bahkan menjadi jurusan yang laris di tingkat Sekolah Menengah Kejuruan. Berbeda dengan perangkat keras yang jelas terlihat hasil jadinya, pada perangkat lunak, hasil kreasi kita tidak tampak secara langsung sehingga muncul pertanyaan bagaimana bentuk hak cipta-nya? Mengingat saat ini mudah sekali dibajak/digandakan.

Tuntutan Apple terhadap Samsung dan Google terhadap aplikasi yang dibuatnya membuat saya ingin mengetahui lebih jelas seluk beluk Paten, yang dijadikan dasar tuntutan. Paten sendiri dengan mudah dapat kita searching di Google. Sebagai contoh Paten terhadap bidang yang saya tekuni, yaitu Soft Computing. Gambar berikut salah satu contoh sketsa paten yang diajukan oleh Dingding Chen, Syed Hamid, Harry Smith tentang Jaringan Syaraf Tiruan dengan Neuron yang disusun berdasarkan Optimasi oleh Algoritma Genetik.

(Sumber: Paten US 20050246297 A1 http://patentimages.storage.googleapis.com/US20050246297A1/US20050246297A1-20051103-D00000.png )

Sementara itu, dijelaskan pula angka-angka tersebut, misalnya 18 yang berisi rangkaian Algoritma Genetika, sebagai berikut:

18. Apparatus for producing as outputs synthetic values of at least one geophysical parameter for a well in response to inputs of actual values of geophysical parameters measured in the well, comprising a neural network ensemble selected by:

training a set of individual neural networks to produce one or more synthetic output values of at least one geophysical parameter for a well in response to a plurality of inputs of actual values of geophysical parameters measured in the well, and

using a genetic algorithm having a multi-objective fitness function to select at least one ensemble, comprising a subset of the set of individual neural fnetworks, having a desirable fitness function value.

Terlihat sederhana tetapi di dalamnya terkandung riset yang telah dilakukan oleh peneliti bidang Rekayasa Perangkat Lunak. Yang terpenting adalah kita tidak boleh seenaknya mengaku penemu jika belum mematenkan apa yang telah kita temukan. Gambar di atas, sebaiknya tidak kita copas langsung tanpa referensi.

Membuat Sistem Informasi Geografis (SIG) dengan Visual Basic 6

 

Pemr Visual Basic. 18.12.2012. Teknik Sipil S1

Sebenarnya aplikasi untuk SIG banyak dijual di pasaran seperti ArcView atau ArcGiS. Tetapi berhubung mata kuliah kita Pemrograman Visual Basic, maka mari kita coba membuatnya. Sebenarnya prinsip SIG adalah integrasi antara raster data yang biasanya gambar peta (jpg/bmp) dengan vector data yang berupa database seperti lokasi banjir, perkantoran, kemacetan, dan sebagainya.

Pertemuan yang lalu kita telah bisa mengakses suatu database gambar, nah di sini kita coba vector data yang kita gunakan kita integrasikan dengan suatu peta pada form. Ambil contoh suatu peta dari www.maps.google.com kemudian simpan dengan nama, misalnya peta.jpg. Edit gambar tersebut untuk lokasi banjir, perkantoran, dan sarana umum. Cara sederhana adalah dengan men save as, kemudian ganti dengan nama banjir.jpg, perkantoran.jpg, dan saranaumum.jpg. Simpan di folder tertentu sebagai data. Buat project baru, dengan satu form.

Arahkah background (picture) ke peta. Tambahkan ADODC, Text, dan Command Button. Buat database dengan Access, jangan lupa simpan dalam format MDB (2003). Koneksikan dengan ADODC (lihat pembahasan yang lalu tentang akses ke database).

Buat satu table baru, misalnya data. Isi dengan data seperti di atas. Instruksi untuk memanggil gambar pada Command Button “Lihat” adalah sebagai berikut:

F = “D:\rahmadya\” & Text1.Text

Image1.Picture = LoadPicture(F)

Dan jika dijalankan hasilnya berikut ini, missal diklik data BANJIR, setelah ditekan tombol LIHAT akan tampil sebagai berikut.

Atau arahkan ke perkantoran misalnya, tekan LIHAT.

Selamat mencoba.

Interaction Design dan Faktor Manusia – Pert 1

Tujuan dari disain interaksi adalah menghasilkan suatu sistem yang mudah digunakan oleh pengguna/operator. Tidak ada cara lain selain pendekatan yang manusiawi untuk menghasilkan sebuah sistem yang mudah digunakan. Hanya saja, terkadang suatu sistem dirancang untuk orang-orang tertentu yang kita tidak dapat pinta apa yang diinginkan, sehingga diperlukan bidang-bidang khusus seperti bahasa, budaya, seni, dan bidang lain yang kebanyakan di luar wilayah ilmu informatika.

Relasi antara bidang Ilmu lain dengan IMK (Sumber Gaynor)

 

Buat syarat disain interaksi untuk kasus-kasus perancangan sebuah sistem sebagai berikut (tugas kelompok):

  1. Web: game anak-anak SD
  2. Absensi karyawan (desktop)
  3. Web: Pembayaran online Pajak untuk Pensiunan
  4. Web: absensi karyawan
  5. Game: Pembelajaran untuk balita (desktop)
  6. Web: On-line Marketing busana muslimah

Ket:

  • Gunakan bahasa yang menjelaskan syarat penting untuk web tersebut
  • Posisikan kita sebagai calon pengguna
  • Tidak perlu pakai diagram, storyboard, dan sejenisnya (dibahas nanti)
  • Makin banyak ide anggota kelompok, hasil makin mendekati sempurna
  • Bisa juga dengan menyebutkan SYARAT YANG DILARANG untuk aplikasi tersebut
  • Jangan lupa menyebutkan unsur-unsur manusiawi lainnya (bosan, lupa, mau menang, dll).

Four different team members looking at the same square, but each seeing it quite differently. (Source: Gaynor).

Contoh:

Soal No.2. Absensi karyawan (desktop)

Syarat disain:

1. Bisa cepat absen (ujang)

2. Tidak bisa diabsenkan orang lain (rudy)

3. dll (sebanyak mungkin).

 

Jawaban:

  1. Web Game anak-anak SD.
  • Nama web mudah diingat oleh anak-anak (Aulia)
  • Harus bersifat komunikatif, sehingga mudah dimainkan (Aulia).
  • Game tersebut diharapkan mengandung unsur edukasi di dalamnya sehingga tidak hanya untuk sarana hiburan tetapi juga sarana belajar (Ghozia)
  • Tidak mengandung kata-kata atau gambar yang berkaitan dengan pornografi (Neti)
  • Tidak mengandung unsur kekerasan dalam visualnya (Ghozia).
  • Game tersebut dapat merangsang daya pikir anak (Aulia).
  • Harus memiliki animasi-animasi yang menarik (Winda)
  • Harus memiliki instrumen yang sifatnya ceria sebagai back sound (Neti)
  • Harus memiliki warna2 yang mencolok/menarik (Winda)
  • Menggunakan jenis dan ukuran font yang menarik (Ghalih)
  1. Absensi Karyawan (Desktop)
  • Usahakan absen lebih awal
  • Absensi tidak boleh diwakili
  • Menggunakan metode identifikasi: sidik jari, id+Password
  • Waktu identifikasi >= 1 sec
  • Kapasitas sidik jari dapat menampung >1500 sidik jari
  • Kapasitas data 32.000 data transaksi
  • Sidik yang disediakan semakin melengkapi kinerja dari mesin sidik jari.
  • (Didin, Arya, Gusti, Carolin)
  1. Pembayaran Online Pajak untuk Pensiunan (Web)
  • Tidak perlu banyak form yang diisi (Ikmal)
  • Disain sesederhana mungkin tanpa menyampingkan fungsi-fungsi (M. Fadhlan)
  • Adanya petunjuk/pedoman/panduan form (Rachmat)
  • Akses cepat dan tidak susah (Yayan)
  • Terintegrasi dengan sistem perbankan online (M. Fdhlan)
  • Dapat diakses melalui berbagai piranti (wahyu)
  • Customer service dapat dihubungi 24 jam. (Yayan)
  • Bukti transaksi yang dapat di print/simpan (Wahyu)
  • Multilingual/translate (Ikmal)
  • Sistem Pengingat/pemberitahuan jatuh tempo pembayaran via sms/email (Rachmat).
    • Yang tidak perlu dialayani
  • Terlalu banyak gambar
  • Terlalu banyak animasi
  • Terlalu banyak iklan
  • Perpaduan warna yang berlebihan
  • Font tulisan bermacam-macam
  • Panduan rumit
  • Terlalu banyak form yang diisi
  • Pengisian ulang data diri
  • Image verifikasi yang rumit untuk dibaca
  1. Absensi karyawan (Web)
  • Syarat Penting:
  • Harus melakukan login terlebih dahulu
  • Tidak bisa diabsenkan/diwakilkan orang lain
  • Harus terhubung dengan internet/server
  • Tampilan web efisien dan simple. Tidak mengandung banyak iklan
  • Id admin dengan id karyawan berbeda.
    • Tambahan:
  • Dapat juga digunakan untuk mengetahui sebe3rapa besar presentasi kehadiran karyawan pada sebuah perusahaan
  • Pembuatan web absensi karyawan sebaiknya menjadi satu dengan web perusahaan, agar para karyawan mudah mengakses web absensi karyawan tersebut.
  • Sistem absensi disesuaikan dengan waktu/jam kerja dari para karyawan.
  • (bintang Fajar, Dwiyudha, Ichsan, Eko hadi, Nurikhsan, M. Chairudin)
  1. Game Pembelajaran balita
  • Desain game menarik dan sederhana (Anita)
  • Game mendidik dan merangsang daya pikir (Indah)
  • Penggunaan Bahasa dan suara yang mudah dimengerti (Astri)
  • Cara penggunaan/cara memainkan game mudah (frida)
  • Tidak mengandung unsur pornografi (Dwi)
  1. Web: Online marketing busana muslimah
  • Judul web online harus simple dan menarik (laras)
  • Layout harus menarik (rizka)
  • Penyusunan tampilan teratur (rizka)
  • Interaksi antara admin dgn pengunjung baik (rizka)
  • Menampilkan katalog barang (desta)
  • Contack person ada (rizka)
  • Membuat animasi yang menarik di web (desta)
  • Menyediakan kolom pencarian produk yg tersedia (elmina)
  • Menyediakan kolom komentar (maulidha)
  • Menyediakan banyak pilihan model baju (Elmina)
  • Detail barang yang ditawarkan ada (laras)
  • Gambar model yang memakai sample pakaian (desta)
  • Perpaduan warna atraktif (Laras)
  • Promosi ke jejaring sosial (Maulidha)
  • Info barang sold out ada (Maulidha)
  • Mendeskripsikan cara penorderan (Elmina)
  • Penggunaan web yang mudah dikunjungi (Elmina)
  • Detail produk bisa dideskripsikan dengan suara juga (Maulidha)
  • Menyediakan mp3 player agar tidak membosankan (Maulidha)

Begitu .. bener apa salah? Tidak ada yang benar dan salah, yang ada jika nanti diaplikasikan, disukai oleh pengguna atau tidak. Seleksi alam akan terjadi dengan sendirinya.

Web-based Webcam Application Sebagai Pengganti CCTV Pengintai

Setelah lama mencari software untuk menghidupkan webcam jarak jauh berbasis web, akhirnya ketemu juga di www.remo-xp.com. Softwarenya bernama webcam7 pro. Sebenarnya tujuan saya mencari software ini selain memang bisa digunakan sebagai cctv murah meriah (seharga webcam) juga dapat diakses via internet (web). Jadi sesuai dengan proposal disertasi yang saya ajukan ke beberapa perguruah tinggi luar negeri, bisa saya manfaatkan untuk mendeteksi wajah dari jarak jauh yang nantinya akan saya implementasikan pada e-learning (atutor, moodle, dll) untuk keperluan ujian on-line. Setelah saya cek di komputer sebelah hasilnya cukup memuaskan walaupun agak patah-patah.

Perhatikan gambar di atas memperlihatkan tampilan webcam7 berbasis web untuk pengintai jarak jauh. Secara default akan menampilkan http://192.168.4.8:8080/ yang merupakan alamat laptop yang saya gunakan. Tentu saja perlu dicoba untuk membuat web sendiri tanpa bantuan software tersebut, tetapi sebenarnya software tersebut menunjukkan bahwa memang dimungkinkan untuk membuat aplikasi pengintai berbasis web. Mudah-mudahan ada siswa saya yang bisa membuat aplikasi tersebut.

Rahmadya Trias Handayanto

Storyboard

Interaksi antara manusia dengan komputer (IMK) saat ini paling banyak dijumpai pada aplikasi berbasis internet baik lewat mobile device maupun komputer jinjing (laptop). Interaksi yang baik antara pengguna dengan piranti sangat menentukan apakah piranti tersebut baik atau buruk. Karena sebaik-baiknya piranti, jika tidak disukai oleh pengguna akan ditinggalkan oleh pemakai dan akibatnya tidak laku.

Karena perancang perangkat lunak bermaksud memberi layanan kepada pengguna, maka ada baiknya sebelum dibuat, pada tahap rancangan, perancang perangkat lunak menyertakan suatu disain awal pesanan dari user yang dikenal dengan storyboard. Ini penting saat ini dimana aplikasi kebanyakan sudah berbasis multimedia (gambar, suara). Beberapa situs internet yang membahas storyboard dapat dilihat di http://multimedia.journalism.berkeley.edu/tutorials/starttofinish/storyboarding/.

Storyboard berguna dalam merancang suatu aplikasi perangkat lunak yang bekerja tidak linear sebagaimana aplikasi pada jaman dahulu. Saran yang bisa dicoba dalam membuat storyboard antara lain:

  • Pilih mana yang penting
  • Pilih situasi tertentu
  • Cari jika ada proses
  • Isu – isu penting lainnya

Intinya, jangan berfikir pertama, kedua, dan seterusnya. Berfikir secara konten yang logis. Situ situs yang akan dirancang, ada baiknya memperhatikan hal-hal berikut ini:

  • Perlukah video, atau cukup gambar saja?
  • Bagian apa yang perlu ditampilkan?
  • Butuhkan aplikasi berbasis GIS
  • Apakah dibutuhkan aplikasi interaktif seperti online chatting, dsb

Source: http://multimedia.journalism.berkeley.edu/tutorials/starttofinish/storyboarding/

Jadi sekali lagi saat akan membuat storyboard jawab pertanyaan tentang: Nonlinear parts, video, audio, photo, Graphics, dan text. Buat sesuai dengan kebutuhan pengguna.

Metodologi dalam Pembuatan Perangkat Lunak

Seperti halnya perancangan produk di industri, merancang produk perangkat lunak juga memerlukan metodologi agar produk yang dihasilkan berkualitas baik. Karena karakteristiknya yang unik (tidak bisa aus, cepat berkembang, dll) software memiliki metodologi beragam yang telah dilakukan oleh pengembang-pengembang perangkat lunak.

Dalam bukunya, Roger S presman membagi metodologi menjadi bermacam-macam (waterfall, incremen, spiral, prototype, dll). Namun, pendekatan yang disarankan oleh Martin Fowler dalam bukunya UML Distilled cukup menarik, yakni hanya membagi metodologi menjadi waterfall dan iterasi. Sedangkan yang lainnya seperti spiral, incremen, dimasukan dalam kategori iterasi. Berikut penjelasan singkatnya.

Metodologi waterfall, sesuai dengan namanya “air terjun” merupakan metode klasik yang telah digunakan oleh analis dan disain perangkat lunak. Metode ini membagi proses pembuatan perangkat lunak dalam fase-fase seperti analisa, disain, coding, testing dan implementasi dengan urutan yang jelas. Karena memiliki kelemahan yang cukup signifikan, metode Iterasi membagi proses pembuatan perangkat lunak menjadi tahapan-tahapan yang tiap tahapan terdiri dari fase-fase yang ada pada waterfall ( analisa, disain, coding, testing dan implementasi). Sehingga kemungkinan kegagalan dalam  proses pembuatan software dapat ditekan sekecil mungkin. Tahapan tersebut disusun mulai dari kebutuhan software terkecil hingga lengkap, namun tentu saja membagi menjadi tahap-tahap bukan merupakan pekerjaan yang mudah.

Sedangka dalam hal perancangan, Martin Fowler dalam buku yang sama juga menjelaskan bahwa ada dua jenis perancangan, yaitu prediktif dan adaptif. Perencanaan prediktif mengharuskan vendor pembuat perangkat lunak mampu memprediksi baik dari sisi kebutuhan software maupun hal-hal lain. Sedangkan perencanaan adaptif vendor pembuat tidak memiliki prediksi yang jelas, sehingga kebutuhan sofware selama proses pembuatan perangkat lunak bisa saja berubah (beradaptasi) mengikuti kebutuhan konsumen yang fleksibel. Oleh karena itu Martin Fowler menyarankan dalam merancang suatu sofware kita memanfaatkan tools system sebaiknya dari yang sederhana kemudian kita tambah sesuai kebutuhan dari pada memanfaatkan tools system yang kompleks dan kemudian satu persatu kita hilangkan mengikuti kebutuhan.

Namun kebanyakan kampus-kampus menggunakan metodologi yang ada di buku-buku teks klasik (Roger S Pressman dan Ian Sommerville) walaupun saat ini sudah mulai muncul metode-metode baru yang menyesuaikan dengan kebutuhan/karakter software yang dirancang seperti Agile dan Extreme Programming (XP). Menilik dari pengalaman-pengalaman yang lalu dalam membuat bahasa standar object programming UML yang banyak memakan waktu dan dana, ada baiknya para metodis (pakar di bidang metodologi) agar sedikit longgar dan mengikuti tren pasar. Bahkan sering disindir, “bedanya metodis dengan teroris hanya satu, yaitu kita bisa bernogosiasi dengan teroris”. 🙂

 

Mengkoneksikan Database Ke Matlab – Bagian 3

Mengambil data dari database lewat GUI membutuhkan sedikit pengetahuan mengenai sistem kerja GUI dan M-File pada Matlab. Jika tulisan ini pertama kali Anda baca sebaiknya Anda lihat materi sebelumnya di: BAG 1 dan BAG 2 . Jika sudah Anda mengerti, barulah bisa mengikuti tulisan ini, tentu saja sambil membuka Matlab Anda. Berhubung ActiveX  antara satu komputer dengan komputer lainnya berbeda, di sini untuk melihat data yang kita ambil saya menggunakan objek “Table” pada GUI. Coba kita mulai dari awal, buka GUI dengan mengetik guide di command window atau dengan cara File – New – GUI di pulldown menu. Pilih Blank GUI karena kita akan membuat GUI dari nol. Karena hanya sekedar mengakses database, coba rancang bentuk berikut ini yang rencananya nanti tabel tersebut akan berisi data yang dipanggil oleh GUI tersebut.


Untuk mengisi nama kolom, klik kanan pada tabel tersebut pilih Properti Editor … Isikan nama-nama kolom sesuai dengan tabel yang anda miliki. Untuk menambah kolom ketikkan klik insert, lalu isi nama pada kolom kosong seperti berikut ini.


Klik Apply dan OK jika sudah selesai, maka Anda telah berhasil membuat tabel kosong yang nantinya akan kita isikan datanya lewat script. Jika tabel dan ODBC sudah Anda buat, mari kita mencoba mengakses data dari database tersebut dengan toolbox database yang disediakan oleh matlab. Perhatikan ujung kanan bawah Matlab Anda, ada tulisan Start bukan? Banyak pengguna Matlab baru yang tidak “ngeh” dengan tombol tersebut. Coba tekan, arahkan ke toolbox, lalu pilih Visual Query Builder pada database. Gunakan cara seperti pada tulisan saya terdahulu . Berikutnya agar bisa diterapkan di GUI yang baru kita buat, maka kita mau tidak mau harus mengkonversi menjadi bahasa Matlab dengan cara mengklik: Query – Generate M-File. Oiya, pilih seluruh Fields (kode, nama dan harga) dan isikan databrg pada MATLAB workspace variable.


Hasilnya adalah serangkaian kode Matlab yang berisi koneksi database dilanjutkan dengan script SQL ambil data (Select). Simpan dan beri nama dengan nama ambildata. Sekarang kembali ke GUI yang telah Anda buat, coba jalankan (RUN) sehingga Anda akan diminta mengisi nama file GUI itu, beri nama, misalnya data. Masih kosong? Tentu saja karena belum kita isi programnya. Pada grid_opening function isikan dengan script m-file hasil generasi dari querybuilder. Bingung? Coba anda klik simbol “f” di M-file editor anda, maka akan muncul grid_openingfunction, klik maka anda diarahkan ke function tersebut. Function itu dieksekusi saat GUI dijalankan. Coba edit script berikut ini, dengan menginsert script ambildata ke data_openingfcn:


Oke, kembali ke command window, coba ketik ambildata agar variabel databrg muncul di workspace. Mengapa? Nanti Anda akan tahu sendiri maksudnya. Di fasilitas help mungkin tidak ada, tetapi jika Anda memiliki bakat “utak-atik” tentu akan menemukannya. Buka GUI dan klik kanan pada tabel dan pilih table property editor. Ribet ya bolak balik? Kalau tadi anda mengedit kolom untuk mengisi kode, nama dan harga, di sini anda klik Data untuk mengisikan data. Nah, karena Anda sudah menjalankan script ambildata, muncul dah di sana variable databrg, klik pada variabel tersebut, lanjutkan dengan apply dan OK.


Harusnya Anda melihat ada isian pada list data (conn, databrg, e dan s). Jika tidak berarti Anda belum menjalankan instruksi yang saya berikan di atas. Jika sudah, coba Anda jalankan GUI yang telah anda buat, hasilnya adalah GUI tersebut berhasil mengakses database kemudian diambil datanya dan diletakkan di objek tabel pada GUI.


Selamat mencoba, pusing dikit ga pa pa kan? Sumpah .. itu cara paling gampang !!!


Rahmadya Trias Handayanto

Membuat Frame (Form) di Netbeans

Hari/Tgl/MK/Ruang: Jumat/04-04-11/Pemrograman Berorientasi Objek/Lab. Software

Setelah pertemuan sebelumnya membahas pembuatan kelas dan memanggilnya dengan Main(), sekarang kita mencoba membuat Form, yang merupakan GUI standar dalam setiap aplikasi yang dijual di pasaran.

Klik kanan pada package, pilih New – Jframe Form.


Berikutnya kita akan membuat Layout Frame sebagai berikut. Untuk mudahnya biarkan nama variabel defaultnya.


Dobel klik pada HITUNG, maka kita akan masuk ke menu pembuatan source code. Isi sebagai berikut:

hitungLuas p = new hitungLuas();

p.setPanjang(jTextField1.getText());

p.setLebar(jTextField2.getText());

this.jTextField3.setText(“”+p.getLuas());

Maka dengan mengklik kanan frame pada project explorer, dilanjutkan “Run File” akan dihasilkan tampilan sebagai berikut:


Coba praktekan sendiri, jika ada error itu biasa, namanya belajar,


Rahmadya Trias Handayanto

Membuat Kelas Persegi Panjang

Hari/Tgl/MK/Ruang: Jumat/08-04-11/Pemrograman Berbasis Objek

Salah satu ciri khas Pemrograman Berorientasi Objek adalah munculnya Kelas pembentuk suatu objek. Oleh karena itu kita akan mencoba membuat sebuat kelas, misalnya persegi panjang dengan atribut “panjang” dan “lebar” dan operasi “luas”.

 


Gambar di atas adalah sebuah diagram Class dengan tiga sekat terdiri dari Nama, Atribut dan Operasi berturut-turut dari atas ke bawah. Akan kita coba buat dengan menggunakan bahasa Java dengan software terkenalnya “Netbeans”.


Setelah Netbeans muncul, klik File – New Project, pilih “Java Application”, dilanjutkan dengan memilih letak fisik dari file projek tersebut. Karena drive C di defreeze, letakkan di D:\<nama_mhs>. Pada Source Package, secara otomatis akan muncul nama paket yang baru anda buat.


 

public class hitungLuas {

private double panjang;

private double lebar;

public void setPanjang(String panjang) {

setPanjang(Double.parseDouble(panjang));

}

public void setPanjang(double panjang) {

this.panjang = panjang;

}

public double getPanjang() {

return panjang;

}

public void setLebar(String lebar) {

setLebar(Double.parseDouble(lebar));

}

public void setLebar(double lebar) {

this.lebar = lebar;

}

public double getLebar() {

return lebar;

}

public double getLuas() {

return getPanjang() * getLebar();

}

}

Kelas tidak dapat serta merta di jalankan karena tidak memiliki Main(). Oleh karena itu, misalnya kita akan memanggil sebuah objek baru (dikenal dengan istilah instance) dengan panjang=10 dan lebar =20. Buka source Main(), ketik berikut ini:

public static void main(String[] args) {

hitungLuas objek1 = new hitungLuas();

 

objek1.setLebar(10);

objek1.setPanjang(20);

 

System.out.println(“Luas ” + objek1.getLuas());

}

Klik kanan pada main di project explorer, maka pada kolom hasil tampak sebagai berikut:


NOTE: Pada netbeans progammer sudah diberi tahu di mana letak penulisan program yaitu pada tulisan: // TODO code application logic here . Untuk public static … dst, tidak perlu ditulis lagi. Sebagai tambahan, nama kelas yang saya buat hitungLuas(), mungkin berbeda dengan nama kelas yang Anda buat.

Untuk kelas pada Netbeans terlihat sebagai berikut:


Tampak: Nama Kelas = hitungLuas, Atribut: -lebar: double, -panjang: double sedangkan operation: getLebar():double, getLuas():double, dst.

Selamat Mencoba,


Rahmadya Trias Handayanto