slide1
Download
Skip this Video
Download Presentation
Web Engineering 2010 Pertemuan ke-06

Loading in 2 Seconds...

play fullscreen
1 / 57

Web Engineering 2010 Pertemuan ke-06 - PowerPoint PPT Presentation


  • 213 Views
  • Uploaded on

Web Engineering 2010 Pertemuan ke-06. Pengujian dan Kebergunaan Aplikasi Web ( Testing & Usability ) Husni [email protected] Husni.trunojoyo.ac.id Komputasi.wordpress.com. Outline. Pengantar Dasar-dasar Pengujian ( Testing ) di Web Metode dan teknik untuk menguji Aplikasi Web

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Web Engineering 2010 Pertemuan ke-06' - sherri


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
slide1

Web Engineering 2010

  • Pertemuan ke-06

Pengujian dan Kebergunaan Aplikasi Web

(Testing &Usability)

Husni

[email protected]

Husni.trunojoyo.ac.id

Komputasi.wordpress.com

outline
Outline
  • Pengantar
  • Dasar-dasar Pengujian (Testing) di Web
  • Metode dan teknik untuk menguji Aplikasi Web
  • Pengujian aplikasi Web Otomatis
  • Dasar-dasar Kegunaan (Usability) di Web
  • Rangkuman
testing dan usability
Testingdan Usability
  • Testing (Pengujian)
    • Memeriksa kesesuaian aplikasi versus persyaratan desainnya
    • Berorientasi untuk aspek fungsional
  • Usability (Kebergunaan)
    • Merancang dan memverifikasi kesesuaian aplikasi versus kemampuan pengguna dan kemampuan interaksi
    • Berorientasi untuk aspek non-fungsional
  • Pengujian dan Usabilityadalah aspek ortogonal
    • Pada beberapa kasus keduanya sedikit tumpang tindih!
pentingnya pengujian
Pentingnya Pengujian
  • Secara tradisional, pengujian telah berfokus pada persyaratan fungsional - tidak cukup untuk aplikasi Web.
  • Di Web, pengujian adalah ukuran penting (kritis) jaminan mutu (kualitas).
    • Memenuhi harapan pengguna
    • Menemukan kesalahan dan kekurangan
    • Banyak pengguna, banyak platform
    • Perilaku perangkat lunak pihak ketiga
pentingnya pengujian1
Pentingnya Pengujian
  • "Misi kritis" aplikasi Web
  • Desain yang buruk mengarah ke waktu yang hilang, produktivitas
  • Website Anda berbicara untuk organisasi Anda
    • Pelanggan memiliki pilihan
    • Mudah datang, mudah pergi
  • Beragam konteks
    • Proliferasi perangkat web-enabled
    • Peningkatan adopsi oleh kelompok-kelompok kebutuhan khusus – misal: orang tua
terminologi
Terminologi
  • Testing: Sebuah kegiatan yang dilakukan untuk mengevaluasi kualitas produk untuk memperbaikinya dengan mengidentifikasi cacat dan masalah.
  • Error: hasil aktual yang menyimpang dari yang diharapkan.
      • Hasil yang kita harapkan (secara teoritis) berasal dari definisi persyaratan yang kita buat.
      • Paling sering, tujuan / konsen/ harapan para stakeholder menjadi dasar pengujian.
  • Test case: sehimpunan input, kondisi pelaksanaan, dan hasil yang diharapkan untuk pengujian suatu objek.
tujuan pengujian
Tujuan Pengujian
  • Tujuan utama: menemukan kesalahan, TIDAK menunjukkan bahwa tidak ada.
  • Cakupan tes lengkap adalah mustahil, jadi pengujian berfokus pada mengurangi risiko terbesar
    • Di mana potensi kerugian terbesar?
    • Apa saja sumber risiko ini?
  • Memulai pengujian sedini mungkin - bahkan dengan sumber daya terbatas dan waktu.
tingkat pengujian
Tingkat Pengujian
  • Unit tests:
    • Pengujian unit "atomik" - kelas, halaman web, dll – secara independen. (Pengembang)
  • Integration tests:
    • Uji interaksi unit (Tester & Pengembang)
  • System tests:
    • Pengujian keseluruhan sistem, yang terintegrasi (tim Dedicated)
  • Acceptance tests:
    • “Real-world” tests – pengujian dalam kondisi yang sedekat mungkin dengan lingkungan "hidup" yang mungkin (Klien)
  • Beta tests:
    • Informal, tes produk-lebar yang dilakukan oleh pengguna “friendly".
peran tester
Peran Tester
  • Tester (Penguji) ideal memiliki sikap "destruktif".
  • Sangat sulit bagi pengembang untuk “menghancurkan" pekerjaan mereka sendiri.
  • Namun, proyek-proyek Web fokus berat pada test unit, membuatnya lebih rentan terhadap kesalahan.
  • Beberapa panduan:
    • Ada orang lain dalam tim Web melakukan tes.
    • Tester terbaik adalah orang yang mendapatkan bug yang paling banyak (untuk diperbaiki).
spesifikasi rekayasa web
Spesifikasi Rekayasa Web
  • Errordalam contentWeb:
    • Ditemukan terutama melalui proofreading - sangat mahal
    • Tes alternatif : Spell-check, meta-information
  • Struktur hypertext:
    • Apakah setiap halaman dapat diakses melalui link?
    • Apakah setiap link halaman ke struktur hypertext bekerja?
    • Apakah ada link yang rusak?
    • Apa yang terjadi ketika pengguna men-klik “Back" pada browsernya?
spesifikasi rekayasa web1
Spesifikasi Rekayasa Web
  • Subjektif persyaratan untuk presentasi
    • Kenyamanan di mata yang melihat (estetika).
    • Tester harus membedakan perilaku yang diterima dari yang salah.
    • Pengujian Presentasi di Web meminjam dari penerbitan cetak (tampilan).
  • Multi-platform delivery
    • Dapatkah diuji pada setiap perangkat?
    • Dapatkah dibuat kasus uji pada setiap perangkat?
    • Simulator sering tersedia, namun mungkin buggy.
spesifikasi rekayasa web2
Spesifikasi Rekayasa Web
  • Ketersediaan Global
    • Pengujian konten dinamis dalam beberapa bahasaPengujian untuk kesulitan tata letak karena berbagai teks panjang.
  • Usia Muda & Multi-disiplinnya Tim Web
    • Keengganan untuk menerima metode pengujian.
    • Kurangnya pengetahuan pengujian.
    • Bangunan konsensus yang diperlukan.
    • Mungkin melakukan pengujian terlalu banyak, sama buruknya dengan terlalu sedikit.
spesifikasi rekayasa web3
Spesifikasi Rekayasa Web
  • Banyak komponen sistem
    • Third-party; platform berbeda.
    • Pengujian integrasi dan konfigurasi komponen juga diperlukan.
  • Ketidakmatangan metode uji
    • Paket uji yang cocok untuk teknologi baru sering tidak ada, atau ada tetapi dirancang dengan jelek.
  • Perubahan terus menerus
    • Perubahan persyaratan, perangkat keras, perangkat lunak.
    • Tes ulang setelah setiap upgrade besar.
pengujian link
Pengujian Link
  • Menemukan link yang rusak
    • Dapat diotomatiskan dengan spider
    • Tidak membantu untuk halaman tanpa link masuk (incoming link).
  • Mendapatkan halaman terpencil (orphan)
    • Orphan adalah halaman tanpa link kembali ke struktur navigasi.
    • Pengguna mendapatkan frustrasi dan meninggalkan.
  • Menangkap statistik
    • Dalam dan lebarnya navigasi.
    • Jarak antara dua dua halaman terkait.
    • Jumlah link.
    • Waktu muat (load time).
pengujian browser
Pengujian Browser
  • Browser bervariasi, berdasarkan :
    • Pabrikan
    • Versi
    • Sistem Operasi
    • Perangkat
    • Konfigurasi (stylesheets, JavaScript on/off)
    • Standard kepatuhan W3C
  • Pertanyaan penting untuk diajukan:
    • Bagaimana status dikelola?
    • Dapat halaman web (dinamis) dibookmark?
    • Dapatkah pengguna membuka banyak jendela (window)?
    • Apa yang terjadi saat cookie dan/atau scripting dimatikan?
pengujian beban
Pengujian Beban
  • Apakah sistem memenuhi waktu respon dan throughput yang dibutuhkan?
  • Profil beban – jenis akses, kunjungan per hari, jenis transaksi, transaksi per sesi, dll yang diharapkan
  • Harus menentukan rentang nilai untuk waktu respon dan throughput.
  • Mengevaluasi hasil untuk mencari kemacetan (bottleneck).
pengujian tekanan
Pengujian Tekanan
  • Bagaimana sistem berperilaku dalam kondisi tak-normal / ekstrim?
  • Pengujian harus memberitahu Anda …
    • Jika sistem memenuhi waktu tanggapan dan throughputs target
    • Jika sistem merespon dengan pesan kesalahan yang sesuai. (Yaitu degradasi tertata)
    • Jika sistem crash (seharusnya TIDAK!)
    • Seberapa cepat sistem sembuh pada operasi normal.
pengujian berkelanjutan
Pengujian Berkelanjutan
  • Mensimulasikan penggunaan selama jangka waktu yang panjang
  • Pengujian untuk kesalahan yang "pop up" karena sumber daya tersebut tidak dirilis oleh suatu operasi.
    • Koneksi database yang tak dilepas
    • Kebocoran memory lainnya
  • Biasanya, menjalankan operasi beberapa kali tidak menghasilkan error, maka perlu untuk pengujian terus-menerus.
pengujian keamanan
Pengujian Keamanan
  • Skema uji sistematis sangat dianjurkan.
  • Pengujian untuk pembetulan kesalahn tidaklah cukup
    • Apakah data rahasia terpapar secara tidak sengaja?
    • Apa yang terjadi jika input data tidak lengkap?
    • Apa yang terjadi jika kita menyuntikkan kode berbahaya?
    • Halaman terenkripsi SSL
      • Apakah kerja sudah bersertifikasi SSL?
      • Apa yang terjadi jika kita mencoba mengakses halaman/situs yang terproteksi dengancara yang tak-aman (misal http://)?
pengembangan test driven
Pengembangan Test-Driven
  • Terinspirasi oleh pendekatan uji-pertama kali yang digunakan di XP (eXtreme Programming); dapat digunakan dalam semua jenis proyek.
  • Pengujian harus ditulis sebelum pelaksanaan.
    • Setiap unit memiliki tes.
    • Saat tes gagal, pengembang hanya perlu mengubah kode agar pengujian berhasil dijalankan.
  • Pengembang dapat berkonsentrasi pada langkah-langkah kecil, sementara masih membuat kode bersih yang bekerja.
  • Lebih banyak tekanan menyebabkan ebih banyak pengujian.
mengenal junit
Mengenal JUnit
  • Framework pengujian Java Open source yang digunakan untuk menuliskan dan menjalankna uji terotomasi yang dapat berulang (repeatable automated test)
  • Suatu struktur untuk penulisan test drivers
  • Fitur JUnittermasuk:
    • Pernyataan untuk pengujian hasil yang diharapkan
    • Fitu uji fitur untuk berbagi data pengujian bersama
    • Paket uji untuk memudahkan mengorganisir dan menjalankan tes
    • Grafis dan pengeksekusi (runner) uji tekstual
  • JUnitdigunakan secara luas di industri
  • JUnitdapat digunakan sebagai program Java stand alone (command line) atau di dalam IDE seperti Eclipse
mengenal cactus
Mengenal Cactus
  • Dibangun di atas framework Junit
  • Dimaksudkan untuk menguji JSP, Servlets, EJBs, Filters, dan custom tags
  • Arsitektur kompleks yang mempunyai JVM client memanggil JVM server aplikasi J2EE
  • Kelas-kelas kasus uji (testcase) harus berada pada client dan server
ekstensi junit lain
Ekstensi JUnitlain
  • HttpUnit
    • Memparse hasil HTML ke dalam DOM
    • Navigasi link yang mudah dan membetuk populasi
    • Berguna untuk uji penerimaan (acceptance) terotomasi
  • CanooWebTest
    • HttpUnitdi dalam Ant
  • JUnitPerf
    • Membungkus suatu uji JUnit
    • Mengukur kinerja yang diinginkan dan toleren terhadap scalability
keuntungan pengujian otomatis
Keuntungan Pengujian Otomatis
  • Beberapa uji mustahil dikejakan secara manual.
    • Test beban dan tekanan.
    • Test link untuk situs web besar.
  • Lebih banyak uji yang dapat dijalankan dalam waktu lebih sedikit.
  • Ketika memperbarui aplikasi, dapat mendeteksi kesalahan yang disebabkan oleh efek samping terhadap fungsi tidak berubah.
kerugian pengujian otomatis
Kerugian Pengujian Otomatis
  • Harapan terhadap pengujian otomatis sering terlalu tinggi.
    • Otomasi tidak meningkatkan efektifitas.
    • Jika uji dirancang secara jelek, mengotomatisasikannya tidak secara ajaib memperbaikinya.
  • Otomatis itu mahal
    • Infrastruktur uji eksekusi harus dirawat.
    • Biaya lisensi dan biaya pelatihan
definisi usability
Definisi Usability
  • Definisi standard ISO/IEC (1998):
    • “Sejauh mana suatu produk dapat digunakan oleh pengguna tertentu dalam konteks penggunaan yang ditetapkan untuk mencapai target yang ditetapkan secara efektif, efisien, dan memuaskan.”
  • Usability engineering adalah proses terus menerus, tapi kritis
    • Menentukan model Pengguna dan Tugas
    • Secara iteratif menguji dan mengevaluasi kembali
    • Metode berbasis Pengguna vs Pakar
usability dalam aplikasi web
Usabilitydalam Aplikasi Web
  • Spesifikasi usability software tradisional tidak dapat langsung dibawa ke ranah Web:
    • Orang menggunakan aplikasi Anda segera.
    • Tidak ada manual atau pelatih (trainer).
    • Tanpa wiraniaga.
  • Bagaimana mengelompokkan pengguna?
    • Pertama kali atau berikutnya?
    • Ahli atau pemula?
    • Broadband atau dial-up?
    • Desktop atau mobile?
masalah utama
Masalah Utama
  • Informasi kontak - alamat atau nomor telepon hilang atau tak berlaku
  • Fungsi Search tidak terlihat atau tidak jelas fungsinya
  • Tidak ada cara mudah untuk kembali ke titik kritis
  • Halaman yang harus memuat cepat namun tidak (misalnya halaman utama atau halaman link kunci)
  • "Apa yang baru" ternyata sudah usang (lama)
  • Tombol “Back” memerlukan suatu data repost
usability engineering
Usability Engineering
  • Terdiri dari 4 fase yang pada dasarnya paralel dengan proses Web Engineering

Usability Engineering

Analysis

Design

Implementation

Operation

WebEngineering

Analysis

Design

Coding

Testing

Maintenance

analisis kebutuhan
Analisis Kebutuhan
  • SystemsAnalysts & UsabilityExpertssebagai pelopor:
    • Analisis yang kompetitif
    • Definisikan tujuan kuantitatif/kualitatif
      • Information, Entertainment, Exchange (Siegel)
      • Buat jadi konkrit dan dapat diuji (testable)!
    • User-centered: Bangun profil pengguna
    • Usage-centered
      • Analisis tugas
      • Ease-of-useatau Ease-of-learning?
interaksi dan rancangan
Interaksi dan Rancangan
  • Awalnya, Interface Designer membangun suatu model konseptual
    • Presentation: Storyboards & Paper mock-ups
    • Navigation: Card-sorting
    • Berdasarkan pada use cases inti
    • Memperlihatkan struktur dasar
  • Mendapatkan feedbackdari pengguna potensial
  • Pakar usabilitymenyediakan input setelah putaran pertama ini.
interaksi dan rancangan1
Interaksi dan Rancangan
  • Designerdan coder kemudian dapat menguraikan rinciannya
  • Pengujian pengguna tambahan:
    • Prototypes – menunjukkan beberapa fungsi
    • Uji usability– nyata konteks, tugas yang nyata.
  • Pengujian remote usability
    • Contoh pengguna yang mewakili
    • Software client-Logging
    • Web-cams jika memungkinkan
    • Validitas eksternal yang lebih baik & biaya lebih rendah (?)
penulisan kode pasca d eployment
Penulisan Kode & Pasca Deployment
  • Ahli Usability mengasumsikan peran dari manajer Quality Assurance.
    • Konsistensi?
    • Pedoman & standar yang diamati?
    • Melekat ke requirement (saat ini) ?
  • Bawa pengguna yang sama kembali untuk pengujian, jika mungkin.
  • Dokumen, dokumen, dokumen!
panduan desain umum
Panduan Desain Umum
  • Pedoman desain merepresentasikan praktek terbaik
  • OK bagi pengguna “umum”
    • Kemampuan kognitif normal
    • Kemampuan audiovisual normal
  • Beberapa pedoman mungkin tidak cocok untuk pengguna dengan kebutuhan khusus.
    • Misal: Elemen navigasi bagi penderita skizofrenia
  • Teknik rekayasa usability yang lebih ketat (yang telah dibahas) harus digunakan
pengolahan informasi manusia
Pengolahan Informasi Manusia
  • Kognisi manusia memainkan peran penting dalam desain antarmuka pengguna.
    • Persepsi
      • Positioning, grouping, arranging
      • Perceiving shapes dan relationships
    • Memory
      • Keterbatsan dari memory kerja
      • Chunking, 7 + 2 (Miller)
    • Atensi
      • Berfokus pada salah satu aspek
      • Pergerakan, skema warna
pedoman waktu respon
Pedoman – Waktu Respon
  • Meningkatnya waktu respon maka kepuasan pengguna menurun
    • Saat lebih dari 3 detik, pengguna sadar dia sedang menunggu
    • Setelah 10 detik, pengguna menyerah
  • Optimalkan, atau minimalkan grafis
  • Pertimbangkan memecah halaman besar.
  • <img> - gunakan atribut “width” & “height”
  • Jangan lupakan pengguna dial-up!
    • Ukuran home page sebaiknya < 50Kb
    • Memberikan peringatan (MPG – 2.5Mb)
pedoman efisiensi
Pedoman – Efisiensi
  • Minimalkan jarak antara elemen dapat diklik (sambil menjaga ukuran efektif)
  • Hindari perubahan yang sering antara mouse dan keyboard
  • Tab yang ramah untuk browser berbasis teks
  • Minimalkan klik untuk menyelesaikan tugas (rule of thumb: tidak lebih dari 4 klik)
pedoman warna
Pedoman – Warna
  • Warna memiliki arti yang berbeda tergantung pada pengguna yang melihat warna
    • Perbedaan budaya
    • Arti spesifik domain
    • Warna yang hangat dan dingin (cool)
  • Pastikan semua informasi yang disampaikan dengan warna juga tersedia tanpa warna.
  • Minimalkan jumlah warna
  • Hindari warna ekstrim, warna yang sangat jenuh
  • Bagaimana tampilan situs Anda di LCD? CRT?
pedoman layout teks
Pedoman – Layout Teks
  • Screen vs. Kertas
  • Pertimbangkan ukuran jendela yang berbeda
    • Hindari layout lebar yang tetap
    • Hindari banyak kolom (biasanya)
  • Keterbacaan (Readability)
    • Sans-serif untuk screen, serif untuk dicetak
    • Hindari pola, latar belakang kontras rendah
    • Paragraf pendek
  • Izinkan ukuran huruf yang dipilih pengguna
pedoman struktur halaman
Pedoman – Struktur Halaman
  • Pertimbangan tampilan
  • Gunakan posisi relatif, sebaiknya tidak absolut.
  • Scroll vertikal baik digunakan; scroll horisontal TIDAK.
  • Elemen penting harus SELALU terlihat.
  • Membuat halaman ramah cetak atau sediakan style alternatif & tombol cetak.
panduan navigasi
Panduan – Navigasi
  • Sediakan pengguna suatu model dari situs web
    • Elemen navigasi intuitif
    • Peta situs (site map)
    • Breadcrumbs (remah roti)
  • Menu dropdown
    • Pro: Pemanfaatan space yang efisien
    • Kontra: Informasi kunci tersembunyi
panduan multicultural
Panduan – Multicultural
  • Lokasi biasanya bukan constraint di Web.
  • “Denominator budaya umum terkecil ”:
    • Hindari warna yang terlalu ekspresif
    • Simbol
    • Bahasa
    • Representasi informasi (format date/time)
  • Sediakan elemen form secara konsisten
panduan konsistensi
Panduan – Konsistensi
  • Konsistensi tetap meminimalkan belajar, pengguna tidak mau harus berpikir!
  • Identitas dapat diatur oleh komponen yang konsisten
    • Header: beranda, logo, navigasi, cari, bantuan
    • Footer: penulis, modifikasi, hubungi
  • Desain yang konsisten dapat menghindari pengguna “tersesat”, terutama saat melompat ke berbagai sub-unit organisasi situs.
aksesibilitas web lebih lanjut
Aksesibilitas Web Lebih Lanjut
  • Jumlah orang cacat yang memanfaatkan Web akan semakin besar.
  • Tim Berners-Lee menegaskan bahwa akses universal ke Web adalah penting.
  • 20% dari populasi dunia memiliki cacat, setidaknya pada satu inderanya.
  • Kunci penting:
    • Merancang untuk kebutuhan khusus tidak selalu memerlukan reinventing aplikasi Anda.
    • Melakukan hal itu juga dapat membantu pengguna "umum"
web accessibility initiative wai
Web Accessibility Initiative (WAI)
  • Web Content Accessibility Guidelines 2.0 (WCAG, 2008) dipublikasikan oleh W3C’s WAI
  • 12 Panduan
  • 4 Grup
    • Perceivable (dpt dipahami dgn jelas)
    • Operable
    • Understandable
    • Robust (kuat)
  • Mendefinisikan Kelompok Kebutuhan Khusus
  • Tingkat Kesesuaian (A, AA, AAA)
rangkuman
Rangkuman
  • Testingdan Usabilitymerupakan masalah orthogonal
    • Pengujian mencakup validasi persyaratan fungsional
    • Ketergunaan cenderung mencakup validasi persyaratan "non-fungsional" (tidak sepenuhnya tepat)
  • Keduanya adalah bagian dari proses perancangan aplikasi (Web) yang bagus
  • Dapat secara parsial diotomasikan
  • Perbedaan kunci:
    • Pengujian berurusan terutama dengan pengembang inhome dan (jarang) dengan pengembang eksternal dan end-user
    • Usability bergantung pada keahlian diluar "dunia teknologi"
daftar referensi
Daftar Referensi
  • Bacaan Utama
    • Kappel, G., Proll, B. Reich, S. & Retschitzegger, W. (2006). Web Engineering, Wiley & Sons. Bab 7dan 11.
  • Referensi lain
    • Kent Beck, eXtreme Programming Explained
    • http://www.usability.gov/
tool pengujian
Tool Pengujian
  • JUnit.org - http://www.junit.org
  • Cactus- http://jakarta.apache.org/cactus
  • Clover- http://www.thecortex.net/clover
  • dbUnit- http://www.dbunit.org
  • HttpUnit- http://www.httpunit.org
  • CanooWebTest- http://webtest.canoo.com
tool usability
Tool Usability
  • Pengembangan
    • Toolbar pengembang Firefox (http://chrispederick.com/work/web-developer/)
  • Pengujian
    • http://www.fujitsu.com/global/accessibility/assistance/wi/
    • http://webusability.com/usability_tools.htm
    • http://wave.webaim.org/
  • Daftar konprehensif dari tool WAI
    • http://www.w3.org/WAI/ER/tools/complete
ad