PENGGUNAAN WURFL (WIRELESS UNIVERSAL RESOURCE FILE) UNTUK DETEKSI PERANGKAT KLIEN DAN CMS (CONTENT MANAGEMENT SYSTEM) PADA PEMBANGUNAN M-LEARNING
JEFFRY PIANOV
DEPARTEMEN ILMU KOMPUTER FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM INSTITUT PERTANIAN BOGOR BOGOR 2009
PENGGUNAAN WURFL (WIRELESS UNIVERSAL RESOURCE FILE) UNTUK DETEKSI PERANGKAT KLIEN DAN CMS (CONTENT MANAGEMENT SYSTEM) PADA PEMBANGUNAN M-LEARNING
JEFFRY PIANOV
Skripsi Sebagai salah satu syarat untuk memeroleh gelar Sarjana Komputer pada Fakultas Matematika dan Ilmu Pengetahuan Alam Institut Pertanian Bogor
DEPARTEMEN ILMU KOMPUTER FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM INSTITUT PERTANIAN BOGOR BOGOR 2009
ABSTRACT JEFFRY PIANOV. Using WURFL (Wireless Universal Resource File) for client device detection and CMS (Content Management System) on m-learning development. Guided by Sri Wahjuni. Nowdays, most of the existing learning content has been designed for desktop computers and is not suitable for mobile devices with limited resources and computing capabilities. The main problem is that the screen size of mobile devices (cell phone, smart phone or PDA) is smaller than the screen size of desktop devices (personal computer or laptop). Therefore, we need to create a customized presentation for both types of devices to make learner feel comfortable when they learn. This paper presents an architecture to provide a good adaptation results for both types of devices. The architecture consists of two parts, the detection engine and the adaptation engine. The detection engine is responsible for detecting the client device based on devices capabilities provided by WURFL (user-agent, screen size, etc) and the adaptation engine is responsible for providing layout adaptation based on the results of detection and the requested content. The adapted content will be sent to the client by the server. Finally, the architecture has been successfully implemented in a website called KSB (Kasih Sayang Bunda) and also the CMS for managing articles. The system can also be continually updated to provide a good adaptation in the future. Key words: M-learning , WURFL, User-agent, Adaptation, CMS.
Judul Nama NIM
: Penggunaan WURFL (Wireless Universal Resource File) untuk Deteksi Perangkat Klien dan CMS (Content Management System) pada Pembangunan M-learning : Jeffry Pianov : G64066016
Menyetujui: Pembimbing
Ir. Sri Wahjuni, M.T. NIP. 196805012005012001
Mengetahui: Dekan Fakultas Matematika dan Ilmu Pengetahuan Alam Institut Pertanian Bogor
Dr. drh. Hasim, DEA. NIP. 196103281986011002
Tanggal Lulus :
RIWAYAT HIDUP Penulis lahir di Medan pada tanggal 22 Nopember 1984 sebagai anak pertama dari empat bersaudara, putra dari pasangan Ir. Bahtera Peranginangin dan Rante Malem Purba. Pada tahun 2002 penulis menyelesaikan pendidikan menengah umum di SMU Cahaya Medan dan pada tahun yang sama lulus seleksi masuk D3 IPB melalui jalur Undangan Seleksi Masuk IPB (USMI). Penulis diterima sebagai mahasiswa pada program studi Diploma 3 Instrumentasi dan Teknologi Komputer, Departemen Fisika IPB. Selanjutnya pada tahun 2005 penulis lulus dari D3 IPB dan melanjutkan ke program S1 Penyelenggaraan Khusus Ilmu Komputer IPB pada tahun 2007.
PRAKATA Puji dan syukur penulis panjatkan kepada Tuhan Yang Maha Esa atas kasih karunia-Nya sehingga penulis dapat menyelesaikan tugas akhir berupa skripsi ini. Penghargaan dan ucapan terima kasih penulis sampaikan kepada dosen pembimbing, Ibu Ir. Sri Wahjuni, M.T., atas bimbingan dan arahan beliau penulis dapat menyelesaikan skripsi ini. Ucapan terima kasih juga penulis sampaikan kepada dosen penguji Bapak Endang Purnama Giri, S.Kom.,M.Kom., dan Bapak Hendra Rahmawan, S.Kom.,M.T., atas waktu dan masukan yang berarti dalam penyempurnaan skripsi ini, juga kepada seluruh staf pengajar yang telah mendidik penulis selama menuntut ilmu di Departemen Ilmu Komputer IPB. Penulis mengucapkan terima kasih kepada Cahyadi Bagus Hendrawan dan Dwi Annisanur Salamah, S.Kom., yang telah memberikan waktu dan bantuannya selama proses penelitian berlangsung. Ucapan terima kasih juga penulis sampaikan kepada orang tua dan adik-adik penulis, Siska, Leo dan Adi, yang selalu mendoakan penulis dan kepada Shanty Rosdiana, SP., yang selalu memberikan dukungan dan motivasi dalam pengerjaan skripsi ini. Terakhir penulis mengucapkan terima kasih kepada seluruh mahasiswa Ilmu Komputer Penyelenggaraan Khusus angkatan 1, Sukma, Eka, Rico, Dimas, Weni dan teman-teman lainnya atas kebersamaan yang indah selama ini, dan kepada pimpinan PT. Jawa Soft, Ewan Makepeace, serta rekan-rekan sekerja yang selalu memberikan dukungan kepada penulis.
DAFTAR ISI Halaman DAFTAR ISI....................................................................................................................................iv DAFTAR TABEL.............................................................................................................................v DAFTAR GAMBAR ........................................................................................................................v DAFTAR LAMPIRAN .....................................................................................................................v PENDAHULUAN.............................................................................................................................1 Latar Belakang .............................................................................................................................1 Tujuan Penelitian..........................................................................................................................1 Ruang Lingkup Penelitian ............................................................................................................1 Manfaat Penelitian........................................................................................................................1 TINJAUAN PUSTAKA....................................................................................................................1 E-learning.....................................................................................................................................1 M-learning....................................................................................................................................1 Perangkat Mobile..........................................................................................................................1 User-Agent String.........................................................................................................................2 WURFL........................................................................................................................................2 CMS .............................................................................................................................................2 PHP similar_text() Function.........................................................................................................3 METODE PENELITIAN..................................................................................................................3 Analisis Sistem .............................................................................................................................3 Perancangan Sistem......................................................................................................................3 Implementasi Sistem ....................................................................................................................6 Pengujian Sistem ..........................................................................................................................6 HASIL DAN PEMBAHASAN.........................................................................................................7 Arsitektur Sistem..........................................................................................................................7 Implementasi Database Server.....................................................................................................7 Proses Pendeteksian Perangkat Klien...........................................................................................7 Hasil Mesin Deteksi .....................................................................................................................8 Proses Adaptasi Layout ................................................................................................................9 Hasil Mesin Adaptasi ...................................................................................................................9 Fungsionalitas CMS ...................................................................................................................10 Proses Pemeliharaan Repositori User-Agent ..............................................................................10 Hasil Pengujian...........................................................................................................................11 KESIMPULAN DAN SARAN.......................................................................................................12 Kesimpulan.................................................................................................................................12 Saran...........................................................................................................................................13 DAFTAR PUSTAKA .....................................................................................................................13
iv
DAFTAR TABEL Halaman Informasi user-agent yang terdapat pada Internet Explorer 8 ...........................................................2 Rancangan tabel-tabel MySQL .........................................................................................................4 Rancangan fungsionalitas CMS ........................................................................................................5 Hasil implementasi MySQL..............................................................................................................7 Contoh user-agent klien ....................................................................................................................7 Contoh hasil penyaringan pada tabel wurfl .......................................................................................8 Contoh hasil penyaringan pada tabel user_agent_desktop ................................................................8 Contoh nilai kemiripan pada tabel wurfl ..........................................................................................8 Contoh nilai kemiripan pada tabel user_agent_desktop ...................................................................8 Contoh hasil perbandingan A dan B..................................................................................................8 Kombinasi hasil mesin deteksi ..........................................................................................................8 Kelas-kelas yang digunakan pada proses adaptasi layout .................................................................9 Jenis-jenis perangkat mobile ...........................................................................................................11 Jenis-jenis perangkat desktop ..........................................................................................................12
DAFTAR GAMBAR Halaman Linear sequential model ....................................................................................................................3 Arsitektur sistem ...............................................................................................................................3 Sub proses pendeteksian perangkat klien ..........................................................................................4 Sub proses adaptasi layout ................................................................................................................5 Sub proses pembaharuan repositori user-agent mobile .....................................................................5 Sub proses pembaharuan repositori user-agent desktop....................................................................6 Hasil adaptasi desktop pada browser Firefox ....................................................................................9 Hasil adaptasi mobile pada BlackBerry Storm..................................................................................9 Hasil adaptasi desktop (CMS) pada browser Firefox......................................................................10 Hasil adaptasi mobile (CMS) pada BlackBerry Storm....................................................................10 Browser Google Chrome yang memeroleh adaptasi mobile ...........................................................10 Browser Google Chrome yang memeroleh adaptasi desktop ..........................................................10 Pesan yang ditampilkan setelah proses pengecekan update WURFL .............................................11 Pesan yang ditampilkan setelah proses update WURFL berhasil ...................................................11 Rata-rata waktu deteksi perangkat mobile.......................................................................................11 Rata-rata waktu adaptasi perangkat mobile .....................................................................................12 Rata-rata waktu deteksi perangkat desktop .....................................................................................12 Rata-rata waktu adaptasi perangkat desktop....................................................................................12
DAFTAR LAMPIRAN Halaman Jenis-jenis perangkat mobile yang digunakan pada uji adaptasi .....................................................14 Jenis-jenis perangkat desktop yang digunakan pada uji adaptasi ....................................................14 Hasil uji navigasi website KSB menggunakan browser Google Chrome .......................................15 Hasil uji navigasi website KSB menggunakan Apple iPhone .........................................................16 Hasil uji navigasi CMS menggunakan browser Google Chrome....................................................17 Hasil uji navigasi CMS menggunakan Apple iPhone .....................................................................18
v
PENDAHULUAN Latar Belakang Dewasa ini perkembangan teknologi komunikasi dan informasi berkembang sangat pesat. Teknologi membuat segala aktifitas manusia menjadi lebih mudah, praktis dan cepat. Informasi dapat diperoleh dengan mudahnya melalui berbagai media salah satunya Internet. Melalui Internet tidak ada lagi batasan waktu, jarak dan tempat bagi manusia untuk mendapatkan informasi yang mereka butuhkan. Kombinasi teknologi telekomunikasi dan Internet memungkinkan pengembangan sebuah sistem baru dalam pembelajaran yaitu mobile learning (m-learning). M-learning merupakan konsep pembelajaran secara mobile menggunakan perangkat mobile seperti PDA (Personal Digital Assistance) atau telepon selular yang memungkinkan adanya proses pembelajaran “kapanpun di manapun” (Krämer 2005). Pada tahun 2008 seorang mahasiswi Ilmu Komputer Institut Pertanian Bogor, telah mengembangkan sebuah website m-learning yang berisikan pengetahuan dan informasi tentang ‘Kesehatan dan Tumbuh Kembang Anak’ dengan tujuan dapat bermanfaat bagi masyarakat dan pelajar, khususnya para pengguna perangkat mobile yang membutuhkan pembelajaran praktis tentang anak (Nursalamah 2008). Akan tetapi masih terdapat beberapa kekurangan pada sistem tersebut seperti: masih terdapat kegagalan dalam pendeteksian perangkat klien, adaptasi hanya dilakukan pada halaman indeks, artikel website masih bersifat statis, tidak terdapat fasilitas untuk memerbarui sistem pendeteksian dan tidak terdapat CMS (Content Management System). Oleh sebab itu pada penelitian ini penulis mencoba untuk membangun sebuah sistem mlearning yang mampu mengatasi semua masalah tersebut. Tujuan Penelitian Penelitian ini bertujuan untuk mengimplementasikan WURFL (Wireless Universal Resource File) pada pembangunan m-learning dengan harapan semakin banyak jumlah perangkat klien yang dapat dideteksi dengan benar dan mengimplementasikan CMS untuk memberikan kemudahan dalam pengelolaan serta pemeliharaan sistem mlearning.
Ruang Lingkup Penelitian Ruang lingkup penelitian ini adalah: 1 Adaptasi hanya dilakukan pada sisi server. 2 Adaptasi pada perangkat mobile tidak dirancang untuk sebuah perangkat tertentu melainkan dirancang sama untuk semua jenis dan ukuran perangkat moblie. 3 Perangkat mobile dan perangkat desktop yang dimaksud haruslah memiliki browser dan koneksi Internet. 4 Nama domain dan alamat server bersifat sementara dan hanya bertujuan sebagai alat bantu dalam penelitian ini. 5 CMS hanya dirancang untuk mengelola artikel dan memerbarui repositori useragent. 6 Algoritme fungsi similar_text() yang digunakan tidak menjadi topik bahasan khusus dalam penelitian ini. Manfaat Penelitian Hasil penelitian ini diharapkan dapat bermanfaat bagi penelitian selanjutnya untuk menghasilkan website m-learning yang paling efisien, terutama dalam metode pendeteksian perangkat klien. Selain itu hasil penelitian ini juga diharapkan dapat mendorong penyebaran pengetahuan tentang kesehatan dan tumbuh kembang anak kepada masyarakat luas. TINJAUAN PUSTAKA E-learning Electronic learning merupakan suatu jenis belajar mengajar yang memungkinkan tersampaikannya bahan ajar ke siswa dengan menggunakan media Internet, Intranet atau media jaringan komputer lain (Hartley 2001). M-learning Mobile learning merupakan konsep pembelajaran secara mobile menggunakan perangkat mobile seperti PDA (Personal Digital Assistance) dan telepon selular yang memungkinkan adanya proses pembelajaran “kapanpun di manapun” (Krämer 2005). Pada implementasinya m-learning mengambil pembelajaran dari konten e-learning (Cobcroft 2006). Perangkat Mobile Perangkat mobile merupakan perangkat bergerak yang digunakan sebagai alat komunikasi dan komputasi seperti PDA (Personal Digital Assistance), smart phone
1
dan cell phone. Berbagai perangkat mobile ini dibedakan berdasarkan spesifikasi perangkat keras dan perangkat lunaknya seperti prosesor, ukuran memori, screen resolution, sistem operasi, web browser, dan sebagainya (Georgieva & Georgiev 2007). User-Agent String User-agent string adalah program yang digunakan untuk mengidentifikasi diri ke HTTP (Hypertext Transfer Protocol), server mail dan berita, untuk penggunaan pelacakan dan tujuan lainnya (MSDN 2009). Ketika kita mengunjungi halaman web, browser akan mengirimkan user-agent string ke server hosting situs yang kita kunjungi. String ini menunjukkan jenis browser yang kita gunakan, sistem operasi yang digunakan dan lain sebagainya. Pada Tabel 1 dicantumkan penjelasan dari user-agent string berikut ini: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727). Tabel 1 Informasi user-agent yang terdapat pada Internet Explorer 8
pada grup product_info terdapat kapabilitas: brand_name, is_wireless_device, uaprof, device_os, mobile_browser dan lain sebagainya. Kapabilitas-kapabilitas tersebut memiliki nama yang unik dan selalu memiliki nilai. Nilai tersebut dapat direpresentasikan dengan menggunakan boolean, nomor atau string. Di bawah ini dapat dilihat contoh kapabilitas dari Sony Ericsson K770i yang terdapat pada WURFL: <device id="sonyericsson_k770i_ver1" user_agent="SonyEricssonK770i" fall_back="sonyericsson_k700_ver1" actual_device_root="true">
… …
MSIE 8.0
Nama browser dan versinya
Tujuan utama dari WURFL adalah untuk mengumpulkan sebanyak mungkin informasi mengenai semua perangkat mobile yang ada sehingga pengembang akan mampu membangun aplikasi dan layanan yang lebih baik bagi para pengguna. WURFL bersifat open-source dan dikelola sepenuhnya oleh Luca Passani dan beberapa kontributor lainnya. Tidak ada jaminan apapun bahwa setiap informasi yang terdapat pada WURFL adalah benar. Semua informasi diperoleh dengan mengumpulkan laporan dari pengguna dan pengembang di seluruh dunia (Passani 2008).
Windows NT 5.1
Sistem operasi Windows XP
CMS
Trident
Mesin (enggine) yang digunakan Internet Explorer
4.0
Versi mesin
.NET CLR 2.0.50727
Menggunakan versinya
Informasi
Keterangan
Mozilla
Secara Explorer dirinya Mozilla
4.0
Versi Mozilla
compatible
Menunjukkan bahwa browser ini kompatibel dengan fitur umum yang ditetapkan
historis Internet mengidentifikasikan sebagai browser
.NET
dan
WURFL Wireless Universal Resource File adalah database yang menyimpan kapabilitaskapabilitas dari berbagai jenis perangkat mobile dalam bentuk XML (eXtensible Stylesheet Language). Kapabilitas tersebut dikumpulkan dalam beberapa grup seperti: product_info, display, image_format, sound_format dan lain sebagainya. Setiap grup menyimpan berbagai kapabilitas, seperti
Content Management System adalah serangkaian pekerjaan dan proses untuk mengelola seluruh konten mulai dari pembuatan sampai pengarsipan konten tersebut. Dalam kenyataanya CMS adalah sebuah konsep daripada sebuah produk. Konsep ini meliputi sejumlah proses yang menjadi pondasi website untuk generasi berikutnya dimana penulis konten akan memiliki hak, kewajiban dan tanggung jawab yang lebih dari pembuat atau pengembangnya. Tujuan utama dari CMS adalah meningkatkan integrasi dan memberikan proses otomasisasi yang efisien untuk memberikan kontribusi penyebaran informasi dalam Internet (Burlaca 2003).
2
PHP similar_text() Function Fungsi ini menghitung kesamaan di antara dua string seperti yang dijelaskan dalam Oliver [1993]. Perlu diketahui bahwa pelaksanaannya tidak menggunakan susunan pseudo kode seperti pada Oliver. Perhatikan juga bahwa kompleksitas dari algoritme ini adalah O (N ** 3) dimana N merupakan panjang dari simbol yang sama dan berurutan (Achour et al. 2009). METODE PENELITIAN Metode penelitian yang digunakan untuk pengembangan sistem ini mengacu pada metode pengembangan rekayasa perangkat lunak oleh Pressman yaitu linear sequential model (Pressman 2001). Tahapannya dapat dilihat pada Gambar1. Analisis Sistem
Perancangan Sistem
3 Menyediakan fasilitas CMS memberikan kemudahan pengelolaan artikel website. 4 Menyediakan fasilitas repositori user-agent.
untuk dalam
pemeliharaan
Berbeda dengan penelitian sebelumnya, penelitian ini menggunakan WURFL sebagai sumber data perangkat mobile sedangkan sumber data perangkat desktop akan diperoleh dari berbagai jenis browser desktop seperti Firefox, Internet Explorer, Opera, dan lain sebagainya. WURFL yang digunakan pada penelitian ini adalah WURFL 2.0.8 dengan tanggal update 16 Juli 2009. Adapun data artikel yang akan digunakan masih bersumber pada artikel website sebelumnya. Perancangan Sistem Sistem yang dibangun bertujuan agar dapat memberikan hasil adaptasi untuk perangkat mobile dan perangkat desktop. Arsitektur sistem yang akan dibangun dapat dilihat pada Gambar 2. Client Browser
request
Implementasi Sistem Server response
Pengujian Sistem
Mesin Adaptasi
result
Mesin Deteksi
Gambar 1 Linear sequential model Pemilihan metode ini berdasarkan pertimbangan bahwa requirement dalam pembangunan m-learning sudah sangat jelas dan dipahami dengan baik. Analisis Sistem Pada tahap ini terlebih dahulu dilakukan analisis terhadap sistem sebelumnya dan dari hasil analisis tersebut akan dibangun sebuah sistem yang baru dengan spesifikasi sebagai berikut: 1 Sistem mampu mengenali perangkat klien berdasarkan kelompoknya yaitu kelompok perangkat mobile dan kelompok perangkat desktop. 2 Sistem mampu memberikan adaptasi layout yang sesuai dengan kelompok perangkatnya. Hasil adaptasinya adalah website m-learning untuk perangkat mobile dan website e-learning untuk perangkat desktop.
merging
Jenis-jenis Template
checking
Repositori Artikel
Repositori User-Agent
Gambar 2 Arsitektur sistem Komponen inti dari arsitektur tersebut adalah mesin deteksi dan mesin adaptasi. Mesin deteksi bertujuan untuk mendeteksi perangkat klien berdasarkan repositori useragent yang ada. Di lain pihak mesin adaptasi bertugas untuk memilih jenis template yang dibutuhkan dan menggabungkannya dengan repositori artikel. Kedua mesin tersebut diharapkan mampu menghasilkan adaptasi yang sesuai dengan perangkat klien. Berdasarkan hasil analisis dan arsitektur sistem di atas, dibentuklah beberapa rancangan pembangunan sistem yang akan di
3
implementasikan. Secara umum rancanganrancangan tersebut adalah sebagai berikut: 1 Rancangan Arsitektur Sistem Untuk menjalankan sistem diperlukan sebuah web server yaitu Apache HTTP Server. Web server tersebut bertanggung jawab untuk menerima dan melayani permintaan dari klien. Selain itu dibutuhkan juga sebuah database server untuk menyimpan data yang akan digunakan oleh sistem yaitu: data user-agent dan data artikel. 2 Rancangan Data Berbeda dengan sistem sebelumnya yang tidak menggunakan database, pada penelitian ini sistem akan dibangun dengan sebuah database yaitu MySQL. MySQL terdiri atas server SQL, program klien untuk mengakses server, tools untuk administrasi, dan interface untuk menulis program. Pada Tabel 2 dapat dilihat rancangan tabel-tabel MySQL yang diperlukan dalam pembangunan sistem.
akan menggunakan sebuah fungsi menghitung nilai kemiripan di antara kalimat (string). Rancangan sub pendeteksian perangkat klien dapat pada Gambar 3.
untuk 2 buah proses dilihat
Start
User-Agent String
Get Data
String For Filter
Cut The String Until Found Symbol ‘/’
Get Data Filtering Table Desktop_user_a gent
Filtering Table Wurfl
Found?
NO
NO
Found?
YES
YES
Tabel 2 Rancangan tabel-tabel MySQL Nama tabel
Fungsi tabel
Content
Menyimpan seluruh data artikel
Content_cate gories
Menyimpan data kategori artikel
Wurfl
Menyimpan user-agent dan beberapa kapabilitas perangkat mobile yang diperoleh dari WURFL
Desktop_user _agent
untuk
Filtered UserAgent
Filtered UserAgent
Get Data
Get Data
Calculate Similarity For All Records, Then Get The Maximum Value
Calculate Similarity For All Records, Then Get The Maximum Value
A=X
A=0
Menyimpan user-agent dari berbagai jenis browser desktop seperti: Firefox, Opera, Google Chrome dll
3 Rancangan Proses Pendeteksian Perangkat Klien Pendeteksian perangkat klien dilakukan dengan cara mendeteksi user-agent yang terdapat pada HTTP header. Informasi tersebut diberikan oleh browser pada saat klien melakukan request ke server. Mesin deteksi akan mencocokkan informasi tersebut dengan user-agent yang terdapat pada repositori. Oleh sebab itu, repositori useragent akan dibagi ke dalam 2 kelompok. yaitu: kelompok user-agent mobile dan kelompok user-agent desktop. Pengelompokan ini bertujuan agar mesin deteksi dapat membandingkan nilai kemiripan maksimum dari masing-masing kelompok. Pada tahap implementasinya mesin deteksi
B=0
B=Y
Get Data
Compare A&B
YES
A ≥ B?
User-Agent Mobile
NO
User-Agent Desktop
C
Gambar 3 Sub proses pendeteksian perangkat klien 4 Rancangan Proses Adaptasi Layout Oleh karena ukuran layar pada perangkat mobile jauh lebih kecil dibanding perangkat desktop maka tampilan website (design) juga harus disesuaikan dengan kedua perangkat tersebut. Adaptasi layout yang dimaksud adalah menyediakan 2 jenis template yang
4
berbeda yaitu: jenis desktop template dan jenis mobile template. Untuk memeroleh hasil adaptasi layout yang baik pada kedua jenis template, diterapkan aturan-aturan sebagai berikut: • Mengubah DTD (Document Type Definition) pada HTML. Desktop template menggunakan DTD XHTML 1.0 Transitional, sedangkan pada mobile template menggunakan DTD XHTML Mobile 1.0. • Menyesuaikan penggunaan CSS (Cascading Style Sheets) seperti mengubah pengunaan layout 2 kolom untuk desktop template menjadi layout 1 kolom untuk mobile template, penggunaan nilai padding yang berbeda dan lain sebagainya. • Meminimalkan penggunaan gambar pada mobile template seperti: icon dan banner yang dapat direpresentasikan dengan teks. Rancangan sub proses adaptasi layout dapat dilihat pada Gambar 4. C
Get Data
YES
Is User-Agent Mobile?
NO
Load Mobile Template
Load Desktop Template
Mobile Template
Desktop Template
Selain itu pada CMS juga akan diintegrasikan fasilitas pemeliharaan repositori user-agent. Pada Tabel 3 dapat dilihat rancangan fungsionalitas CMS. Tabel 3 Rancangan fungsionalitas CMS Fungsi
Fitur-fitur yang tersedia
Pengolahan artikel website
Menambahkan artikel Mengedit artikel Menghapus artikel CMS Editor
Pemeliharaan repositori user-agent
Mengecek dan memerbarui WURFL (user-agent mobile) Menambahkan browser baru (user-agent desktop)
6 Rancangan Pemeliharaan Repositori UserAgent Jenis dan jumlah perangkat mobile akan terus bertambah begitu juga dengan perangkat desktop dengan versi/jenis browser baru. Oleh sebab itu agar sistem dapat terus berjalan dengan baik, maka data yang terdapat pada repositori user-agent harus dapat terus diperbaharui. Rancangan proses pembaharuan repositori user-agent mobile dapat dilihat pada Gambar 5.
Process Content Manager
Send Adoption to Client Browser
End
Gambar 4 Sub proses adaptasi layout 5 Rancangan CMS Pada penelitian ini CMS dirancang untuk dapat menjalankan seluruh fitur-fitur CMS, baik pada perangkat mobile dan juga desktop. CMS bertujuan untuk memberikan kemudahan dalam pengelolaan artikel website. Pada CMS akan terdapat sebuah editor untuk memformat teks dan paragraf dengan baik.
Gambar 5 Sub proses pembaharuan repositori user-agent mobile
5
Hal yang sama juga dilakukan untuk repositori user-agent desktop akan tetapi, proses pembaharuannya akan dilakukan secara terpisah. Rancangan proses pembaharuan repositori user-agent desktop dapat dilihat pada Gambar 6.
1 Instalasi web server dan database server untuk dapat menjalankan sistem. 2 Membuat database beserta tabel-tabelnya. 3 Mengunduh WURFL dan melakukan parsing dokumen XML (eXtensible Markup Language) ke dalam database.
C
4 Membuat desktop template dan mobile template. 5 Membuat kode program sesuai dengan perancangan sistem.
Content Adaptation
Lingkungan implementasi yang digunakan adalah: Login Page
1 Perangkat keras: MacBook Pro 2.4 GHz, memori 4 GB dan hard disk 200 GB. YES
NO
Is Login Page For Mobile?
Username, Password & User-Agent
Username & Password
Get Data
Get Data
Authentication Checking
Authentication Checking
Is True?
Is True?
YES
Is UA for Desktop? NO
2 Perangkat lunak: OS X Leopard 10.5, Windows XP SP3, MAMP 1.7, iPhone SDK 3.0, Android SDK 1.1, RIM BlackBerry 4.7.0, Windows Mobile SDK 6.0, Openwave Simulator 7.0, VirtualBox 2.2, FileZilla 3.2, Coda 1.6 dan Notepad++ 5.3.
NO
Pengujian Sistem
NO
YES
YES
Saving UA to Database
Content Adaptation
Home Page CMS
End
Gambar 6 Sub proses pembaharuan repositori user-agent desktop Implementasi Sistem
Sistem akan diuji pada 24 jenis perangkat mobile, 6 jenis browser pada sistem operasi Windows, 5 jenis browser pada sistem operasi Mac OS dan 3 jenis browser pada sistem operasi Linux. Langkah-langkah pengujian yang akan dilakukan adalah sebagai berikut: 1 Uji adaptasi Melakukan akses ke website dan CMS dengan beberapa perangkat mobile dan perangkat desktop, kemudian akan dilihat apakah hasil adaptasinya sesuai atau tidak. 2 Uji navigasi Menguji navigasi untuk hasil adaptasi dekstop dan hasil adaptasi mobile, apakah seluruh navigasi berfungsi dengan baik atau tidak. 3 Uji kinerja Mencatat waktu yang diperlukan oleh server untuk mendeteksi perangkat klien dan waktu yang dibutuhkan oleh server untuk melakukan proses adaptasi. Pengujian juga akan dilakukan terhadap CMS untuk melihat kinerja fungsionalitasnya.
Secara garis besar langkah-langkah yang akan dilakukan pada tahap implementasi sistem adalah:
6
HASIL DAN PEMBAHASAN Arsitektur Sistem Aplikasi sistem yang telah dibangun bersumber pada beberapa teknologi perangkat lunak seperti berikut: • HTML, sebagai program yang digunakan untuk pembuatan template website. • CSS, sebagai presentasi (tampilan dan pemformatan) dari template website. • MySQL, sebagai program yang digunakan dalam pembuatan database. • PHP, sebagai program yang digunakan dalam pembuatan kinerja sistem. Hasil implementasi sistem ditempatkan pada jasa server berikut ini: 1 Server http://www.co.cc Server ini sebagai jasa penyedia nama domain yang digunakan yaitu ksbweb.co.cc dengan batas masa hingga 10 Juni 2010. 2 Server http://www.freehostia.com Server ini sebagai jasa penyedia web server dan database server. Batas masa aktifnya hingga 10 Juni 2010. Untuk dapat menjalankan sistem, konfigurasi web server yang harus dipenuhi adalah sebagai berikut: • Dapat menjalankan skrip PHP yang ditulis menggunakan PHP 5. • Tersedia fungsi-fungsi pemrosesan XML.
untuk
• Dapat melakukan koneksi ke server WURFL. • Tersedia fungsi-fungsi untuk pemrosesan berkas berbentuk ZIP. Implementasi Database Server Sesuai dengan racangan tabel-tabel MySQL pada Tabel 2, hasil implementasinya dapat dilihat pada Tabel 4, dimana hasil tersebut adalah hasil pada saat pengujian. Tabel 4 Hasil implementasi MySQL No
Nama tabel
Jumlah record
1
content
14
2
content_categories
3
3
desktop_user_agent
4
wurfl
5 3.931
Pada Tabel 4, baris ke 1 berisi data artikel website yang bersifat dinamis karena dapat diolah melalui CMS, sedangkan pada baris ke 2 berisi data kategori artikel yang bersifat statis karena pada CMS tidak diberikan fitur untuk mengolahnya. Kategori artikel hanya digunakan pada adaptasi desktop untuk memermudah navigasi sedangkan pada adaptasi mobile data tersebut tidak digunakan. Pada baris ke 3 dan baris ke 4 berisi data useragent yang digunakan pada proses pendeteksian dimana keduanya dapat diperbaharui melalui fitur-fitur yang tersedia pada CMS. Proses Pendeteksian Perangkat Klien WURFL menyediakan user-agent dari berbagai jenis perangkat mobile dalam jumlah yang sangat banyak, akan tetapi pada kenyataannya terdapat beberapa user-agent yang tidak sama dengan user-agent yang sesungguhnya. Oleh karena itu proses pendeteksian user-agent tersebut dilakukan dengan cara membandingkan nilai kemiripan antara user-agent klien dengan user-agent yang terdapat pada database server. Perhitungan tingkat kemiripan tersebut menggunakan fungsi yang telah tersedia pada PHP 5. Dari hasil implementasi yang dilakukan, proses pendeteksian perangkat klien akan dijalankan oleh kelas DeviceManager.php. Kelas ini berfungsi sebagai mesin deteksi pada sistem. Berikut akan dijelaskan langkahlangkah proses pendeteksian perangkat klien. Pada saat klien mengakses server, browser klien akan memberikan informasi user-agent melalui HTTP Header dan informasi tersebut akan diambil mesin deteksi. Mula-mula mesin deteksi akan memotong user-agent tersebut dari simbol awal sampai menemukan simbol ‘/’. Contoh user-agent yang diperoleh dapat dilihat pada Tabel 5. Tabel 5 Contoh user-agent klien ID
User-agent klien
S
Mozilla/5.0 (SymbianOS/9.1; U; enus) AppleWebKit/413 (KHTML, like Gecko) Safari/413
Hasil pemotongannya adalah ‘Mozilla’. Selanjutnya hasil tersebut (string) akan digunakan untuk menyaring 2 jenis tabel yang terdapat pada database server yaitu: tabel wurfl dan tabel desktop_user_agent sehingga diperoleh beberapa user-agent yang kata
7
depannya sama dengan user-agent klien. Proses ini bertujuan untuk membatasi jumlah user-agent yang akan dihitung tingkat kemiripannya. Berikut contoh hasil saringannya yang dapat dilihat pada Tabel 6 dan Tabel 7. Tabel 6 Contoh hasil penyaringan pada tabel wurfl ID
User-agent mobile
M1
Mozilla/2.0 (compatible; MSIE 3.02; Windows CE; Smartphone; 176x220)
M2
Mozilla/4.0 (compatible; MSIE 4.01; Windows CE; PPC; 240x320)
M3
Mozilla/4.0 (compatible; MSIE 6.0; Windows CE; IEMobile 6.12) TMobile_Atlas
M4
M5
Mozilla/5.0 (SymbianOS/9.2; U; Series60/3.1 NokiaN81-1/1.00 Profile/MIDP-2.0 Configuration/CLDC-1.1) AppleWebKit/413 (KHTML, like Gecko) Safari/413
penyaringan
Pada contoh kasus yang berbeda, jika tidak terdapat hasil saringan pada salah satu tabel di atas maka mesin deteksi akan memberi nilai 0 (A=0 atau B=0) dan jika tidak terdapat hasil saringan pada kedua tabel di atas maka keduanya sama-sama diberi nilai 0 (A=B=0). Tabel 8 Contoh nilai kemiripan pada tabel wurfl Hitung Kemiripan (ID Tabel 5, ID Tabel 6)
A (%)
Hitung Kemiripan (S,M1)
25.00
Hitung Kemiripan (S,M2)
28.96
Hitung Kemiripan (S,M3)
21.25
Hitung Kemiripan (S,M4)
68.39
Hitung Kemiripan (S,M5)
23.63
Tabel 9 Contoh nilai kemiripan pada tabel user_agent_desktop
Mozilla/SMB3(Z100)/Samsung
Dst.. Keterangan: Terdapat 372 hasil 3931jumlah user-agent
hasil perhitungannya pada Tabel 8 dan Tabel 9.
dari
Tabel 7 Contoh hasil penyaringan pada tabel user_agent_desktop ID
User-agent desktop
D1
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_7; en-us) AppleWebKit/530.18 (KHTML, like Gecko) Version/4.0.1 Safari/530.18
D2
Mozilla/5.0 (Macintosh; U; Intel Mac OS X; en; rv:1.8.1.22) Gecko/20090615 Camino/1.6.8 (like Firefox/2.0.0.22)
D3
Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727) Keterangan: Terdapat 3 hasil penyaringan dari 5 jumlah user-agent Setelah hasil saringan diperoleh, langkah selanjutnya adalah menghitung tingkat kemiripannya, yaitu dengan membandingkan user-agent klien dengan user-agent hasil penyaringan di atas dan nilai tertinggi pada kedua tabel akan disimpan. Berikut contoh
Hitung Kemiripan (ID Tabel 5, ID Tabel 7)
B (%)
Hitung Kemiripan (S,D1)
29.95
Hitung Kemiripan (S,D2)
24.61
Hitung Kemiripan (S,D3)
30.35
Dari hasil perhitungan di atas, nilai A maksimum dan B maksimum akan dibandingkan. Hasil dari perbandingan kedua nilai tersebutlah yang akan menentukan apakah user-agent klien adalah user-agent mobile atau user-agent desktop. Contohnya dapat dilihat pada Tabel 10. Tabel 10 Contoh hasil perbandingan A dan B A (%)
B (%)
Hasil Perbandingan
68.39
30.35
A>BA
Hasil Mesin Deteksi Melalui tahapan-tahapan proses di atas maka diperoleh beberapa kombinasi hasil mesin deteksi seperti pada Tabel 11. Tabel 11 Kombinasi hasil mesin deteksi A (%)
B (%)
Hasil Perbandingan
10
5
A>BA
5
10
A
0
0
A=BA
Jika hasil perbandingan yang diperoleh adalah ‘A’ maka mesin deteksi menyatakan
8
user-agent klien berasal dari perangkat mobile dan sebaliknya jika hasil perbandingan yang diperoleh adalah ‘B’ maka mesin deteksi menyatakan user-agent klien berasal dari perangkat desktop. Proses Adaptasi Layout Seperti pada perancangannya, sistem memiliki 2 jenis template yaitu mobile template dan desktop template. Kedua jenis template tersebut memiliki beberapa halaman HTML berdasarkan fungsinya seperti: halaman beranda, halaman arsip artikel dan lain sebagainya. Dari hasil implementasi yang dilakukan terdapat 9 halaman HTML untuk jenis mobile template dan 9 halaman HTML untuk jenis desktop template. Pada halaman HTML tersebut, di dalamnya terdapat sintaksintak PHP untuk menempatkan konten/artikel yang diambil dari database. Konten yang diambil akan digabungkan dengan salah satu halaman HTML tersebut, dimana proses pemilihan halaman berdasarkan hasil mesin deteksi dan pengambilan konten berdasarkan alamat (link) yang diminta oleh klien. Proses-proses tersebut dikerjakan oleh 2 buah kelas yang dibangun dengan bahasa PHP. Fungsi masing-masing kelas dapat dilihat pada Tabel 12.
hasil deteksi dan juga hasil adaptasinya. Jika hasil deteksi yang diperoleh adalah perangkat mobile maka sistem akan memberikan adaptasi mobile dan juga sebaliknya jika hasil deteksi yang diperoleh adalah perangkat desktop maka sistem akan memberikan adaptasi desktop. Website yang dibangun diberi nama Kasih Sayang Bunda (KSB) dengan topik ‘Kesehatan dan Tumbuh Kembang Anak’. Pada Gambar 7 dapat dilihat hasil adaptasi layout untuk perangkat desktop menggunakan browser Firefox dan pada Gambar 8 dapat dilihat hasil adaptasi layout untuk perangkat mobile menggunakan BlackBerry Storm.
Tabel 12 Kelas-kelas yang digunakan pada proses adaptasi layout Nama kelas
Fungsi
Content Manager.php
Bertugas untuk mengambil (load) artikel, judul artikel dan kategori artikel Bertugas menghapus artikel
Gambar 7 Hasil adaptasi desktop pada browser Firefox
untuk (delete)
Bertugas untuk menyimpan (save) artikel View.php
Bertugas untuk menggabungkan artikel dengan template dan memberikan hasil adaptasinya kepada server untuk dikirimkan kepada klien
Hasil Mesin Adaptasi Setelah proses adaptasi layout selesai, server akan mengirimkan hasilnya melalui HTTP response kepada klien. Hasil adaptasi yang diterima oleh klien bergantung dari hasil mesin deteksi. Hanya terdapat 2 kemungkinan
Gambar 8 Hasil adaptasi mobile pada BlackBerry Storm Seperti halnya dengan website KSB, ketika klien mengakses alamat CMS, server terlebih
9
dahulu menjalankan proses pendeteksian perangkat klien kemudian menjalankan sub proses adaptasinya. Pada Gambar 9 dapat dilihat hasil adaptasi layout CMS untuk perangskat desktop menggunakan browser Firefox dan pada Gambar 10 dapat dilihat hasil adaptasi layout CMS untuk perangkat mobile menggunakan BlackBerry Storm.
dilihat pada halaman ‘Tags’. Selain itu pada CMS terdapat juga menu ‘Check WURFL’ untuk mengecek dan memerbarui repositori WURFL. Proses Pemeliharaan Repositori User-Agent 1 Proses Pemeliharaan User-Agent Desktop Jika ditemukan perangkat desktop yang memeroleh hasil adaptasi mobile, maka pengelola dapat memerbaiki hasil adaptasinya melalui halaman login CMS. Pada Gambar 11 dapat dilihat browser Google Chrome yang memeroleh adaptasi mobile.
Gambar 9 Hasil adaptasi desktop (CMS) pada browser Firefox
Gambar 11 Browser Google Chrome yang memeroleh adaptasi mobile
Gambar 10 Hasil adaptasi mobile (CMS) pada BlackBerry Storm Fungsionalitas CMS Dari hasil implementasi yang dilakukan, CMS telah dapat berjalan sesuai dengan rancangan fungsionalitasnya. Pada halaman ‘Home’ akan ditampilkan 10 judul artikel terbaru berdasarkan tanggal pembuatannya dan terdapat pagging untuk melihat artikelartikel sebelumya. Dengan mengklik judul artikel pengelola dapat mengedit atau menghapus artikel. Penambahan artikel dapat dilakukan melalui menu ‘New Article’ dimana pemformatan teks dan paragraf dilakukan dengan menggunakan tag-tag HTML tertentu seperti ‘
’ untuk paragraf, ‘
’ untuk baris baru dan lain sebagainya. Daftar dan contoh penggunaan tag-tag tersebut dapat
Pada Gambar 11, user-agent Google Chrome belum terdapat pada tabel user_agent_desktop sehingga server akan mendeteksinya sebagai perangkat mobile. Selanjutnya pengelola akan memilih opsi dari pertanyaan ‘Apakah Anda menggunakan perangkat desktop?’, dan apabila pengelola memilih pilihan ‘Benar’, maka bersamaan dengan proses autentikasi, user-agent tersebut akan ditambahkan ke dalam database dan untuk seterusnya browser Google Chrome akan mendapatkan hasil adaptasi desktop. Hasil dari penambahan user-agent tersebut dapat dilihat pada Gambar 12.
Gambar 12 Browser Google Chrome yang memeroleh adaptasi desktop
10
2. Proses Pemeliharaan User-Agent Mobile Adapun proses pembaharuan user-agent mobile (WURFL) dilakukan pada halaman ‘Home’ CMS. Pada awalnya pengelola akan mengecek apakah terdapat update atau tidak dengan mengklik menu ‘Check WURFL’ dan sistem akan memberikan pesan dari hasil pengecekannya. Pada Gambar 13 dapat dilihat hasil pengecekan yang dilakukan melalui perangkat mobile. Proses ini juga dapat dilakukan pada perangkat desktop.
Hasil uji adaptasi yang dilakukan terhadap 24 jenis perangkat mobile dan 14 jenis perangkat desktop seluruhnya berhasil. Hasil dan jenis-jenis perangkat yang diujikan dapat dilihat pada Lampiran 1. 2 Hasil Uji Navigasi Hasil uji navigasi yang dilakukan terhadap Apple iPhone dan Google Chrome menunjukkan seluruh navigasi (link) berjalan dengan baik sesuai dengan fungsinya. Hasil pengujian navigasi website KSB dapat dilihat pada Lampiran 3 dan Lampiran 4 dan hasil pengujian navigasi CMS dapat dilihat pada Lampiran 5 dan Lampiran 6. 3 Hasil Uji Kinerja Pada tahap ini ditambahkan skrip pada kode program sebagai stopwatch. • Uji kinerja deteksi dan adaptasi
Gambar 13 Pesan yang ditampilkan setelah proses pengecekan update WURFL Jika terdapat update, maka pengelola dapat melanjutkan prosesnya dengan mengklik link ‘Click Here’ pada pesan tersebut. Selanjutnya server akan mengunduh berkas wurfllatest.zip dari server repositori WURFL hingga selesai, selanjutnya berkas tersebut akan diekstraksi untuk memeroleh wurfl.xml, kemudian tabel wurfl pada database server akan dihapus dan terakhir server akan melakukan parsing wurfl.xml ke dalam tabel tersebut. Pada Gambar 14 dapat dilihat pesan yang diberikan oleh sistem jika seluruh proses dapat dijalankan server dengan baik.
Pengujian ini dilakukan dengan mengakses website KSB, kemudian mengklik beberapa link secara acak sebanyak 8 kali dan hasilnya akan dicatat oleh server pada sebuah file. Pada Tabel 13 dan Tabel 14 dapat dilihat jenis-jenis perangkat yang diujikan. Tabel 13 Jenis-jenis perangkat mobile No 1 2 3 4 5
Jenis perangkat Samsung D900 Samsung Omnia Nokia 5300 SonyEricsson W810 SonyEricsson W660
Rata-rata waktu deteksi perangkat adalah 0.00238909 detik dan adaptasinya adalah 0.07887593 Grafiknya dapat dilihat pada Gambar Gambar 16.
mobile waktu detik. 15 dan
Waktu Deteksi Rata-Rata
Detik a
0.005
Gambar 14 Pesan yang ditampilkan setelah proses update WURFL berhasil Hasil Pengujian Berikut beberapa hasil pengujian yang dilakukan terhadap sistem yang telah dibangun (website dan CMS):
0.004 0.003 0.002 0.001 0.000 1
2
3
4
5
Jenis Perangkat Mobile
Gambar 15 Rata-rata waktu deteksi perangkat mobile
1 Hasil Uji Adaptasi
11
• Uji kinerja CMS
Waktu Adaptasi Rata-Rata
Detik a
0.10 0.08 0.06 0.04 0.02 0.00 1
2
3
4
5
Jenis Perangkat Mobile
Gambar 16 Rata-rata waktu adaptasi perangkat mobile Tabel 14 Jenis-jenis perangkat desktop No 1 2 3 4 5
Jenis browser Safari 4.0 Google Chrome 2.0 Internet Explorer 8.0 Opera 9.6 Firefox 3.5
Kesimpulan
Waktu Deteksi Rata-Rata 0.06
Detik a
0.05 0.04 0.03 0.02 0.01 0.00 2
3
4
5
Jenis Perangkat Desktop
Gambar 17 Rata-rata waktu deteksi perangkat desktop Waktu Adaptasi Rata-Rata
Detik a
0.05 0.04 0.03 0.02 0.01 0.00 1
2
3
Dari hasil pengujian yang dilakukan terhadap fungsi menyimpan artikel, rata-rata waktu penyimpanan artikel melalui perangkat mobile adalah 0.000441988 detik dan rata-rata waktu penyimpanan artikel melalui perangkat desktop adalah 0.000502904 detik. KESIMPULAN DAN SARAN
Rata-rata waktu deteksi perangkat desktop adalah 0.03711168 detik dan waktu adaptasinya adalah 0.03242051 detik. Grafiknya dapat dilihat pada Gambar 17 dan Gambar 18.
1
Uji kinerja CMS dilakukan untuk melihat apakah terdapat perbedaan kinerja pada perangkat desktop dengan perangkat mobile. Adapun kinerja yang dimaksud adalah lamanya waktu yang dibutuhkan CMS untuk melakukan pemrosesan ke database server. Pada penelitian ini uji kinerja CMS dilakukan terhadap menu ‘New Article’ yaitu dengan mencatat waktu yang dibutuhkan web server untuk meyimpan artikel kedalam database server melalui masing-masing perangkat.
4
5
Jenis Perangkat Desktop
Penggunaan WURFL untuk deteksi perangkat klien pada pembangunan mlearning dan e-learning memberikan manfaat yang sangat baik. Manfaat tersebut diperoleh bukan hanya dari penggunaan WURFL saja melainkan juga dari algoritme pemrosesan WURFL. Hal ini dilihat dari hasil uji adaptasi dimana seluruh perangkat mobile dan perangkat desktop yang diujikan memeroleh hasil adaptasi yang benar. Selain itu, pada Gambar 15 dan Gambar 17 dapat dilihat waktu deteksi rata-rata perangkat mobile (0.002 detik) jauh lebih cepat dibandingkan dengan waktu deteksi rata-rata perangkat desktop (0.04 detik) dan pada Gambar 16 dan Gambar 18 dapat dilihat proses adaptasi perangkat mobile (0.08 detik) sedikit lebih lambat dibandingkan dengan proses adaptasi perangkat desktop (0.03 detik). Akan tetapi, total waktu yang dibutuhkan server dalam menjalankan keseluruhan prosesnya tidak jauh berbeda (berselisih 0.01 detik). Hal ini membuktikan bahwa kinerja sistem berjalan dengan baik dan sama pada perangkat mobile dan perangkat desktop. Implementasi CMS juga berhasil diterapkan, dimana artikel website dapat dikelola dengan mudah kapan saja dan dimana saja. Dari hasil waktu uji kinerja CMS dapat disimpulkan bahwa kinerja fungsionalitas CMS berjalan dengan baik dan sama pada kedua jenis perangkat.
Gambar 18 Rata-rata waktu adaptasi perangkat desktop
12
Saran 1 Menambahkan fitur caching pada proses deteksi dan proses adaptasi. 2 Menambahkan fitur pada CMS Editor agar mampu memasukkan konten berupa gambar dari perangkat klien. 3 Menambahkan fitur agar CMS dapat mengolah artikel yang bersumber pada dokumen seperti: teks biasa dan Microsoft Word. DAFTAR PUSTAKA Achour M et al. 2009. PHP Manual. [terhubung berkala]. http://www.php.net/manual/en Burlaca O. 2003. NeoSite: A simple Content Management. Computer Science Journal of Moldova. Cobcroft R. 2006. Literature Review Into Mobile Learning In The University Context. Creative Industries Faculty, Queensland University Of Technology. Georgieva E, Georgiev T. 2007. Methodology for Mobile Device Characteristics Recognition. International Conference on Computer System and Technologies, CompSysTech’07. Krämer BJ. 2005. Mobile Learning: The Next Generation of Learning FernUniversität’s Contributions to the 2nd Year of the Leonardo Project mlearn2. FernUniversität Hagen, Germany. [MSDN Library]. Understanding User-Agent String. [terhubung berkala]. http://msdn.microsoft.com/enus/library/ms537503(VS.85).aspx Nursalamah DA. 2008. Adaptasi E-Learning Pada Sisi Server Untuk Aplikasi Mlearning. Bogor: Departemen Ilmu Komputer, Institut Pertanian Bogor. Passani L. 2008. The Wireless Universal Resource File. [terhubung berkala]. http://wurfl.sourceforge.net Pressman R. 2001. Software Engineering: A Practitioner’s Approach. Ed ke-5. New York: McGraw-Hill.
13
LAMPIRAN
Lampiran 1 Jenis-jenis perangkat mobile yang digunakan pada uji adaptasi Resolusi layar (pixel) 128x128
128x160
176x208 176x220
240x320
320x240 320x480 480x320
Jenis perangkat Nokia 3300 Nokia 6800 LG 3300 Motorola C390 Samsung SCH S179 SonyEricsson Z300i Nokia 3110 Samsung SGH-C400 SonyEricsson K508i Nokia 3600 Nokia N70 BenQ S80 LG KG320 Siemens S81 SonyEricsson K530i SonyEricsson W810i HP iPAQ HW6500 Nokia N73 O2 Xda Atom Nokia N95 SonyEricsson W910i Nokia E61 Apple iPhone RIM BlackBerry 9000
Hasil uji adaptasi Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile Mobile
Lampiran 2 Jenis-jenis perangkat desktop yang digunakan pada uji adaptasi Sistem operasi
Jenis browser
Windows XP
MSIE 8.0 Google Chrome 2.0 Firefox 3.5 Opera 9.6 Maxthon 2.5 Lunascape 5.0 Safari 4.0 Camino 1.6 Netscape 9.0 Shiira 2.2 Seamonkey 1.1 Konqueror Galeon NetSurf 2.1
OS X Leopard
Linux Ubuntu
Hasil uji adaptasi Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop Desktop
14
Lampiran 3 Hasil uji navigasi website KSB menggunakan browser Google Chrome Halaman Beranda
Posisi Header Body Sidebar
Arsip Artikel
Hasil Pencarian *
Arsip Artikel
Ok
Tentang Kami
Ok
--
Tidak ada Ok
Form Cari
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Tentang Kami
Ok
Judul Artikel
Ok
Paging
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Arsip Artikel
Ok
Tentang Kami
Ok
Body
Breadcrumb
Ok
Sidebar
Judul Artikel
Ok
Kategori Artikel
Ok
Form Cari
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Tentang Kami
Ok
Judul Artikel
Ok
Body
Tentang Kami
Status
Kategori Artikel
Body
Isi Artikel
Link
Paging
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Arsip Artikel
Ok
Body Footer
-© Lab. NCC Ilkom IPB
Tidak ada Ok
Keterangan: * Hasil pencarian ditampilkan pada halaman Arsip Artikel -- Tidak terdapat link pada posisi tersebut
15
Lampiran 4 Hasil uji navigasi website KSB menggunakan Apple iPhone Halaman Beranda
Posisi Header Body
Artikel
Ok
Cari
Ok Ok Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Cari
Ok
Judul Artikel
Ok
Paging
Ok
Form Cari
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Artikel
Ok
Cari
Ok
Kembali
Ok
Breadcrumb
Ok
Ke Atas
Ok
Form Cari
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Cari
Ok
Judul Artikel
Ok
Paging
Ok
Form Cari
Ok
Footer
© Lab. NCC Ilkom IPB
Ok
Header
Beranda
Ok
Artikel
Ok
Body
Tentang Kami
Artikel
Form Cari
Body
Hasil Pencarian *
Status
Ke Atas
Body
Isi Artikel
Link
Cari Body Footer
-© Lab. NCC Ilkom IPB
Ok Tidak ada Ok
Keterangan: * Hasil pencarian ditampilkan pada halaman Artikel -- Tidak terdapat link pada posisi tersebut
16
Lampiran 5 Hasil uji navigasi CMS menggunakan browser Google Chrome Halaman Login
Posisi Header Body
Home
Header
Body Edit/Delete Article
Header
Body New Article
Header
Body Tags
Header
Body
Link
Status
KSB Home Page
Ok
Form Login
Ok
New Article
Ok
Tags
Ok
View Site
Ok
Check WURFL
Ok
Log Out
Ok
Judul Artikel
Ok
Paging
Ok
Home
Ok
New Article
Ok
Tags
Ok
View Site
Ok
Log Out
Ok
Button Delete
Ok
Button Save
Ok
Home
Ok
Tags
Ok
View Site
Ok
Log Out
Ok
Button Save
Ok
Home
Ok
New Article
Ok
View Site
Ok
Log Out
Ok
--
Tidak ada
Keterangan: -- Tidak terdapat link pada posisi tersebut
17
Lampiran 6 Hasil uji navigasi CMS menggunakan Apple iPhone Halaman Login
Home
Posisi Header
Radio Buttons
Ok
Header
New Article
Ok
Tags
Ok
View Site
Ok
Header
Header
Body Tags
Tidak ada
Form Login
Body New Article
-
Status
Body
Body Edit/Delete Article
Link
Header
Body
Ok
Check WURFL
Ok
Log Out
Ok
Judul Artikel
Ok
Paging
Ok
Home
Ok
New Article
Ok
Tags
Ok
View Site
Ok
Log Out
Ok
Button Delete
Ok
Button Save
Ok
Home
Ok
Tags
Ok
View Site
Ok
Log Out
Ok
Button Save
Ok
Home
Ok
New Article
Ok
View Site
Ok
Log Out
Ok
-
Tidak ada
Keterangan: - Tidak terdapat link pada posisi tersebut
18
