Rancang Bangun Aplikasi Pembangkit Halaman HTML untuk Pembuatan Media Cetak Digital
Berbasis Windows Metro Style
Dosen Pembimbing :
Dwi Sunaryono, S.Kom., M.Kom.
Umi Laili Yuhana, S.Kom., M.Sc.
TUGAS AKHIR (KI091391) JURUSAN TEKNIK INFORMATIKA
INSTITUT TEKNOLOGI SEPULUH NOPEMBER
Sally Indah Khansa | 5109100027
Berkembangnya teknologi baru yang bermunculan, membuat manusia cenderung menginginkan bermacam-macam produk yang dapat membuat nyaman dan mempermudah dalam menjalani segala
aktifitasnya.
majalah The Word Magazine yang dijual di
http://itunes.apple.com.
Bagaimana Digital Newspaper Dibuat?
Baker
Rancang Bangun Aplikasi Pembangkit
Halaman HTML untuk Pembuatan Media
Cetak Digital Berbasis Windows Metro Style
• Bagaimana aplikasi pembangkit halaman yang dibuat mampu menghasilkan halaman dengan format majalah atau buku.
• Bagaimana mengelolah halaman HTML untuk dapat ditampilkan di sistem operasi Windows 8.
Rumusan Masalah
• Jenis aplikasi baru yang dapat dijalankan di win8
• Tampilan dalam 1 layar penuh
• Menggunakan bahasa pemograman vb, c#, c++ dan JavaScript
Metro Style
• sekelompok karakter yang bisa mendeskripsikan atau cocok dengan beberapa kata
• memiliki 2 fungsi utama yaitu mencari dan mengganti.
• mencari suatu pola tertentu dalam text lalu menggantinya menjadi pola yang lain
Regular Expression(regex)
Plugin jQuery untuk menampilkan konten di web dalam tata letak
flipbook. Booklet dibangun menggunakan pustaka
jQuery. Tampilan Booklet dalam satu halaman terdiri dari dua halaman HTML, sehingga terlihat seperti buku terbuka [6].
jQuery Page-Flip Plugin
• plugin jQuery yang dapat digunakan untuk membuat buklet seperti komponen yang memungkinkan untuk
menavigasi membalik halaman. Konten apapun dapat digunakan, seperti gambar atau teks.
• Plugin mengubah struktur hanya ketika membalik
halaman dan menggunakan beberapa lapisan sebagai bayangan untuk halaman untuk menciptakan lebih realitis [5].
BookBlock Booklet
Diagram Kasus Pengguna
System
Pengguna
Membuat Media Digital Baru
Melihat Daftar Media Digital Melihat Tampilan Media Digital
Menghapus Media Digital
Mengubah Konten Media Digital
Proses Pembuatan Media
Membaca inputan folder
Mencari tag Body
Mencari tag Head
Menggabungkan halaman
• Html yang sudah diurutkan + file pendukung
• Memodifikasi Body perhalaman
• Membuat Daftar Isi
• Mencari tag Style dan Script Mengcopy file
pendukung
• Membuat folder media baru
• File pendukung inputan
• Script flip book
• Index.html
• Menggabungkan body + head
Pengujian Pembuatan
Majalah oleh Aplikasi
Pengujian Pembuatan Majalah oleh
Samsung Galaxy Tab
Pengujian Pembuatan Majalah oleh
iPhone
Pengujian Subjektif
Jumlah Pengguna : 32
Perangkat yang digunakan :
• Laptop/PC
• Tablet
• SmartPhone
Pengujian Tampilan Menggunakan PC/laptop
No. Jenis Penilaian
Penilaian
Rata- rata
1 2 3 4
1 Tampilan media 1 2 19 5 3.0
2 Kenyamanan membaca media 0 1 19 7 3.2
3 Kemiripan media dengan media cetak 0 10 13 4 2.7
4 Efek flip media 0 5 10 13 3.4
Nilai Akhir 3.1
Jumlah Pengguna : 27
Browser yang digunakan :
• Chrome
• Mozilla
• Safari
Pengujian Tampilan Menggunakan Tablet
Jumlah Pengguna : 2
Browser yang digunakan :
• Chrome
• Opera Mini
No. Jenis Penilaian
Penilaian
Rata- rata
1 2 3 4
1 Tampilan media 0 0 1 1 3.5
2 Kenyamanan membaca media 0 1 1 0 2.5
3 Kemiripan media dengan media cetak 0 1 1 0 2.5
4 Efek flip media 1 0 1 0 2
Nilai Akhir 2.6
Pengujian Tampilan Menggunakan SmartPhone
Jumlah Pengguna : 3
Browser yang digunakan :
• Opera Mini
• Browser
• Dolpin
No. Jenis Penilaian
Penilaian
Rata-rata
1 2 3 4
1 Tampilan media 0 2 1 0 2.3
2 Kenyamanan membaca media 2 1 0 0 1.3
3 Kemiripan media dengan media cetak 0 2 1 0 2.3
4 Efek flip media 2 1 0 0 1.3
Nilai Akhir 1.8
Kesimpulan
• Aplikasi pembangkit halaman HTML mampu mengubah halaman HTML dan menambahkan skrip pada halaman agar tercipta efek membuka tampilan halaman seperti format buku atau majalah.
• Aplikasi dapat melakukan pembuatan media cetak digital sesuai dengan masukan halaman HTML dari pengguna.
• Aplikasi pembangkit halaman HTML mampu berjalan pada sistem operasi Windows 8.
• Hasil pembangkitan halaman HTML mampu ditampilkan di aplikasi baik di dalam PC maupun komputer tablet Windows 8.
• Aplikasi dapat menghapus dan melakukan perubahan isi halaman media.
Saran
• Aplikasi ini untuk pengembangan selanjutnya dapat menambahkan proses pengubahan halaman yang lebih detail misalnya saja dapat mengubah CSS masukan halaman dari pengguna langsung dari aplikasi.
• Aplikasi ini untuk pengembangan selanjutnya dapat memperbaiki navigasi membuka halaman yang mendukung touch gesture agar proses membuka halaman terlihat lebih halus.
Rancang Bangun Aplikasi Pembangkit Halaman HTML untuk Pembuatan Media Cetak Digital
Berbasis Windows Metro Style
Dosen Pembimbing :
Dwi Sunaryono, S.Kom., M.Kom.
Umi Laili Yuhana, S.Kom., M.Sc.
