BAB 2 LANDASAN TEORI 2.1 Teori Pemrograman Web 2.1.1 Internet Internet adalah sekumpulan komputer yang semuanya terkoneksi satu sama lain. Ketika sebuah komputer terhubung dengan Internet (online), maka komputer tersebut akan menjadi bagian dari internet dan terhubung dengan setiap komputer yang juga terhubung pada saat yang sama. (Castro, 2007, p14). Tidak ada satupun yang berhak mengakui memiliki internet, dan tidak ada satu orangpun atau organisasi manapun yang mengontrol internet sepenuhnya. Internet lebih dari sebuah konsep daripada suatu entitas nyata yang sebenarnya, dan itu bergantung pada infrastruktur fisik yang menghubungkan jaringan ke jaringan lain. Internet adalah jaringan komputer yang dikembangkan oleh Departemen Pertahanan Amerika Serikat di tahun 1969 untuk keperluan militer. Melalui proyek ARPA yang disebut ARPANET (Advanced Research Project Agency Network), mereka mendemonstrasikan bagaimana dengan hardware dan software komputer yang berbasis UNIX, kita bisa melakukan komunikasi tanpa batasan jarak dengan menggunakan saluran telepon. 6 7 Dengan perkembangan jumlah pengguna internet yang besar, terciptalah budaya internet. Sebagai suatu budaya, internet mempunyai pengaruh yang besar atas ilmu, dan pandangan dunia. Dengan hanya memakai mesin pencarian seperti Google, pengguna di seluruh dunia mempunyai akses Internet yang mudah untuk mendapatkan bermacam informasi. Dibanding dengan buku dan perpustakaan, Internet melambangkan penyebaran pengetahuan, informasi dan data secara ekstrem. 2.1.2 World Wide Web World Wide Web adalah sekumpulan dokumen dalam jumlah sangat besar yang senantiasa berubah-ubah dengan cepat, di mana semua itu ada pada internet dan ditulis dalam bentuk HTML. (Castro, 2007, p14) World Wide Web (yang selanjutnya akan ditulis dengan WWW) merupakan kumpulan server web dari seluruh dunia yang berguna menyediakan data ataupun informasi untuk dapat digunakan bersama. Melalui web, pengguna internet dapat mengakses informasi-informasi tidak hanya teks tetapi juga data multimedia seperti gambar, suara, dan video. Jadi dapat disimpulkan bahwa WWW adalah sekelompok dokumen multimedia yang saling bertautan dengan dihubungkan oleh hypertext. WWW tidak sama dengan internet. Internet adalah jaringan yang secara luas menghubungkan jutaan komputer secara global di mana setiap komputer dapat berkomunikasi satu sama lain selama mereka online. Sedangkan 8 WWW adalah sebuah cara untuk mengakses informasi dengan media internet. WWW adalah model berbagi informasi yang dibuat diatas sebuah jaringan yang kita kenal dengan internet. 2.1.3 HyperText Markup Language (HTML) HTML atau HyperText Markup Language, memiliki dua fitur esensial – hypertext dan universalitas. Hypertext berarti Anda dapat membuat sebuah link pada sebuah halaman web yang mengarahkan pengunjung ke halaman web lain pada internet. Itu berarti informasi pada web bisa diakses dari berbagai arah. Universalitas maksudnya bahwa dikarenaan dokumen HTML disimpan sebagai Text Only file, secara virtual setiap komputer dapat membaca dan membuka halaman web tersebut. Tidak masalah apakah pengunjung membukanya lewat Macintosh, Unix, atau Windows, atau bahkan mobile OS sekalipun. (Castro, 2007, p14) HTML memberikan sarana kepada penulis untuk: 1. Publikasikan dokumen online dengan judul, teks, tabel, daftar, foto, dll. 2. Mengambil informasi online melalui hypertext link, di klik tombol. 3. Mendesain forms untuk melakukan transaksi dengan layanan jarak jauh, untuk digunakan dalam mencari informasi, membuat reservasi, memesan produk, dll 4. Sertakan spread-sheets, klip video, klip suara, dan aplikasi lainnya secara langsung dalam dokumen mereka. 9 Struktur dasar HTML : <!DOCTYPE html> <html> <head> <title> JUDUL WEBSITE</title> </head> <body> <!-- Isi Website --> </body> </html> Keterangan : <!DOCTYPE html> : Sebuah tag yang harus dideklarasikan pertama kali pada dokumen HTML. Tag ini bukan termasuk HTML tag, tetapi tag ini menginstruksikan kepada web browser mengenai versi HTML yang digunakan. Tag <!DOCTYPE html> adalah deklarasi doctype untuk HTML5, <html> : Merupakan tag pembuka dari sebuah halaman website. Tanpa mendeklarasikan <html>, maka sebuah script tidak dapat dikenal sebagai halaman website. Selain itu, segala bentuk kode yang ditulis di luar tag hml tidak akan masuk ke dalam elemen halaman website. 10 <head> : Merupakan tag yang berisi semua informasi yang terkandung dalam kepala dokumen. Informasi ini tidak akan ditampilkan dalam saat browser dijalankan.Dalam tag head biasanya terkandung tag meta, tag title, tag link untuk menghubungkan html dengan script lain seperti CSS , javascript, dan jquery. <body> : Merupakan tag untuk membuka sebuah isi script yang ada didalam HTML. Semua yang terkandung dalam tag body (kecuali syntax untuk server-side scripting) akan terlihat pada browser. 2.1.4 HTML5 HTML5 adalah standar HTML terbaru yang sedang dikembangkan namun telah diterapkan oleh beberapa website besar di dunia serta telah didukung oleh hampir semua web browser. Target utama dari pengembangan HTML5 ini adalah untuk meningkatkan dukungan bahasa mark up terhadap multimedia paling mutakhir tetapi tetap menjaga kemudahan bagi manusia dan pemahaman yang konsisten bagi komputer dan devices (Lawson & Sharp, 2011). Pada pembuatan skripsi ini, terdapat pertimbangan mengapa website dibuat dalam HTML5. Faktor-faktor yang menjadi dasar penggunaan HTML5 yaitu : 11 1. Kemudahan Akses Semantic menjadi alasan kenapa HTML5 membuat sebuah situs menjadi mudah diakses. Dengan berbagai tag HTML5 yang ada, seperti <header>, <footer>, <nav>, <section>, <article>, dan lain sebagainya, membuat screen reader dapat membaca isi website dengan mudah. Sebelumnya, screen reader harus menentukan berperan sebagai apakah tiap tag <div> dalam website, walau sudah terdapat kelas atau ID di dalam elemen tersebut. Dengan tag semantic pada HTML5, screen reader dapat dengan mudah menentukan seluruh isi website ke dalam bagian-bagian tertentu sehingga menciptakan pengalaman menggunakan yang lebih baik. 2. Kode yang Ringkas Pada HTML lama, harus didefinisikan banyak <div> dengan berbagai kelas atau id untuk tiap bagian website seperti header,footer, navigation, dan lain sebagainya. HTML5 menghadirkan cara yang lebih simpel, elegan, dan mudah dengan menggunakan tag-tag semantic seperti <section>, <article>, <header>, <footer>, <aside> dan <nav>. Dengan fitur ini, kesulitan untuk mengetahui bagian website yang mana yang tertulis pada kode karena semua berupa <div> tidak akan terjadi lagi. 3. Penyimpanan Data yang Cerdas HTML5 menggunakan penyimpanan data lokal di sisi klien. Penyimpanan data ini lebih baik daripada cookies karena memungkinkan untuk menyimpan data dari berbagai jendela browser yang terbuka, performa 12 dan keamanan yang lebih baik, serta penyimpanan data handal bahkan setelahbrowser ditutup. 4. Cross Browser Hampir semua browser terbaru yang digunakan mendukung HTML5 secara baik. Doctype dari HTML5 telah dibuat sedemikian rupa sehingga tiap browser, bahkan versi yang lama sekalipun, dapat mengenalinya. Meskipun demikian, tidak semua browser mampu mengenali seluruh tag elemen HTML5. Untuk browser yang terlampau kuno, misalnya IE6, harus ditambahkan javascript tertentu. 2.1.5 Server-side Programming Penulisan program untuk pemrosesan form, pembuatan halaman dinamis, akses database, serta fitur e-business dan e-commerce. (Wang & Katila, 2004, p24). 2.1.6 PHP PHP (PHP Hypertext Preprocessor) adalah bahasa pemrograman yang dirancang untuk menghasilkan halaman web interaktif pada komputer yang melayaninya, yang disebut web server. Tidak seperti HTML, dimana browser menggunakan tags dan markup untuk membuat halaman, kode PHP berjalan diantara halaman yang diminta dan web server, menambahkan dan merubah 13 output dasar dari HTML (Davis & Phillips, 2007, p2). PHP bersifat serverside, yang berarti kode program PHP duproses seluruhnya di dalam web server. Keluaran dari proses web server tersebut akan disertakan pada halaman HTML. PHP memiliki dukungan lapisan integrasi database sehingga PHP dapat dikoneksikan dengan berbagai macam database seperti MySQL, Oracle, PostgreSQL, dan lain sebagainya. Prinsip kerja PHP diawali dengan permintaan sebuah halaman web dari browser komputer client. Server menerima permintaan dari client kemudian mengidentifikasikan halaman yang dikehendaki dan menyampaikan segala macam informasi, misalnya mencari informasi dari suatu database. Selanjutnya web server akan mencarikan berkas dan memberikan isi ke mesin PHP dan mesin PHP akan memproses dan memberikan hasilnya berupa kode HTML ke web server, selanjutnya web server menyampaikan keluaran berupa halaman HTML ke client. Pengembangan aplikasi pada skripsi ini menggunakan bahasa pemrograman PHP karena berbagai macam kelebihan dari PHP seperti : • Bersifat open source sehingga mudah didapat. • Mudah dipahami dan mudah untuk dikembangkan karena banyak forumforum yang membahas mengenai bahasa pemrograman ini. • PHP selalu up to date mengikuti perkembangan teknologi internet 14 Kode PHP yang disisipkan ke dalam HTML harus menggunakan tag <?php di depannya dan tag ?> pada akhir script. Berikut adalah contoh sederhana penggunaan PHP dalam suatu halaman HTML : <!DOCTYPE html> <html> <head> </head> <body> <?php echo "Hello World!!"; ?> </body> </html> 2.1.7 Client-side Scripting Penulisan script untuk browser yang akan disampaikan bersama dengan halaman web kepada konsumen. Client-side scripting juga dapat membuat halaman web menjadi lebih interaktif dan responsive. (Wang & Katila, 2004, p24) 2.1.8 CSS CSS ( Cascading Style Sheet) adalah bahasa style sheet yang mengizinkan pengembang dan pengguna untuk memasang style (misalnya, font dan spasi ) untuk dokumen-dokumen terstruktur (misalnya, dokumen 15 HTML dan aplikasi XML ). Dengan memisah presentasi style dokumen dari isi dokumen itu sendiri, CSS menyederhanakan pengembangan dan pemeliharaan website. (W3C, 2011) Dengan menggunakan CSS, akan diperoleh beberapa keuntungan seperti : 1. Memisahkan presentasi sebuah dokumen dari konten dokumen itu sendiri. 2. Mempermudah dan mempersingkat pembuatannya. 3. Halaman website menjadi tidak padat, sehingga halaman website menjadi SEO friendly. 4. Dapat dengan mudah mengganti tampilan website dengan cukup mengganti nilai dan definisi pada satu file CSS saja. Ada 3 (tiga) cara untuk mengaplikasikan CSS ke HTML : 1. In-line In-line style dituliskan langsung di dalam HTML tag menggunakan atribut style seperti contoh di bawah ini : <p style=”font-weight:bold”>This text is bold</p> 2. Internal Embedded, atau Internal style digunakan untuk seluruh halaman. Di dalam tag head, tag style meliputi semua style pada halaman. Contoh deklarasi inline CSS : <head> 16 <style> p{ font-weight:bold; } /*membuat semua elemen p dalam halaman ini menjadi bold*/ </style> </head> 3. External CSS eksternal digunakan untuk lebih dari satu halaman website. CSS dibuat pada dokumen yang berbeda dan memiliki ekstensi .css (missal: style.css). Tautan untuk memanggil CSS eksternal ditulis pada tag head dengan struktur seperti berikut : <link rel="stylesheet" type="text/css" href="style.css" /> 2.1.9 Javascript Javascript (biasa disingkat JS) adalah bahasa yang ringan, interpreted, dan ber-orientasi objek, dengan fungsi first-class. Javascript terkenal dengan bahasa scripting untuk halaman website, tetapi bisa juga dipakai pada lingkungan bukan browser seperti node.js atau Apache CouchDB. Tujuan utama dari pemakaian javascript adalah untuk mengubah halaman website statis menjadi halaman website dinamis dan interaktif dalam ruang lingkup client-side scripting (W3C, 2011). 17 Syntax penulisan javascript mirip dengan bahasa pemrograman Java dan bahasa pemrograman C sehingga banyak aturan-aturan penulisan dari kedua bahasa pemrograman tersebut yang biasa diterapkan dalam javascript. Akan tetapi ada yang membedakan javascript dengan Java yaitu pengembangnya. Javascript dikembangkan oleh Netscape dan produk website-nya disebut web script sedangkan Java dikembangkan oleh Sun Microsystems dan produk website-nya adalah applet. Javascript bergantung pada browser yang memanggil halaman website yang mengandung javascript dan tentu saja script tersebut berada di dalam dokumen HTML. Javascript juga tidak memerlukan compiler khusus untuk menjalankannya. Penulisan javascript dilakukan di dalam tag HTML dan sama seperti bahasa pemrograman C, javascript bersifat case sensitive. Javascript dapat dituliskan pada tag body maupun tag head. Pada head, javascript digunakan untuk membuat suatu function yang diaktifkan melalui event trigger pada tag body. Berikut adalah cara penulisan javascript dalam sebuah dokumen HTML : <body> <script> document.write(“Hello World”); </script> 18 </body> 2.1.10 JQuery JQuery adalah javascript library yang cepat dan singkat yang menyederhanakan event handling, animating, dan interaksi Ajax untuk pengembangan rapid website. jQuery dibuat untuk mengubah cara dalam penulisan javascript (jQuery, 2012). Pada perkembangannya jQuery tidak sekedar sebagai framework javascript, namun memiliki kehandalan dan kelebihan yang cukup banyak. Hal tersebut menyebabkan banyak developer web menggunakannya. jQuery memiliki slogan “Write less, do more” yang kurang lebih maksudnya adalah kesederhanaan dalam penulisan kode, tapi dengan hasil yang lebih banyak. JQuery merupakan library yang bersifat open source, alias gratis dengan lisesnsi GNU General Public License dan MIT License. Ukuran jQuery sangat ringan sekali, hanya terdiri dari satu file dan berukuran kurang lebih 20 KB saja. jQuery terus berkembang dan memunculkan versi-versi yang baru yang bisa diunduh secara gratis di situs resmi jQuery. Manfaat dari pemakaian jQuery dalam pengembangan antarmuka website adalah sebagai berikut : 1. Mengakses bagian halaman website dengan mudah. Javascript memberikan cara pengaksesan bagian tertentu dari halaman web dengan menggunakan aturan Document Objekct Model 19 (DOM) dan pengaksesan harus secara spesifik menyesuaikan struktur aturan HTML. 2. Merespon interaksi user dalam halaman Dengan adanya jQuery tampilan web tidak hanya menarik namun juga lebih atraktif. Interaksi dengan user akan semakin meningkat. 3. Menambahkan animasi ke halaman Dengan memilih animasi menggunakan jQuery ketimbang animasi menggunakan Flash, maka akses halaman website akan menjadi lebih ringan dan tidak memakan banyak bandwidth. 4. Mengambil informasi di server tanpa harus memuat ulang halaman web Konsep ini sebenarnya sudah ada di teknologi web berbasis AJAX. Namun pengimplementasian AJAX ternyata sulit, dan jQuery memiliki banyak library khusus yang mempermudahnya. 5. Mengubah bagian halaman tertentu CSS menawarkan metode yang cukup handal dalam mengatur dan mempercantik halaman website. Namun terkadang CSS memiliki kelemahan yang cukup mengganggu, yaitu beberapa perintah CSS tidak didukung oleh semua browser. Sekali lagi JQuery menawarkan solusi untuk mengatasi hal tersebut. Dengan JQuery, “kesenjangan” 20 yang terjadi antara browser dalam urusan CSS akan tertutup dengan baik. 6. Menyederhanakan penulisan Javascript biasa Dengan menggunakna jQuery penulisan kode Javascript yang terlalu banyak dapat dihindari. Untuk memasang jQuery, kita dapat mengunduhnya dari situs resmi jQuery, kemudian meletakannya di folder yang diinginkan lalu dipanggil dokumen HTML dengan menuliskan kode berikut : <script type='text/javascript' src='jquery1.4.2.min.js'></script> Contoh penulisan jQuery : $(document).ready(function(){ // Your code here. Dengan menggunakan syntax ini berarti pada saat halaman web telah terbuka dengan baik, maka kode yang ada di dalam ini akan dieksekusi. alert("Hello World!"); }); 21 2.2 Teori Interaksi Manusia dan Komputer 2.2.1 Interaksi Manusia dan Komputer Interaksi manusia dan komputer berarti mengkombinasikan metode pengumpulan data dan bingkai kerja intelektual dari psikologi eksperimental dengan perangkat yang powerful dan dapat digunakan secara luas, yang dikembangkan dari ilmu komputer. (Shneiderman & Plaisant, 2010) Tujuan dasar dari IMK adalah untuk meningkatkan interaksi antara pengguna dan komputer dengan membuat komputer lebih berguna dan mengerti terhadap kebutuhan pengguna. Semenjak manusia hampir setiap waktu berada di dekat komputer, IMK menjadi suatu hal penting yang dibutuhkan dalam rutinitas sehari-hari (Sinha & Gaurav, 2010). Dengan tujuan utama IMK yang sudah dijelaskan sebelumnya, ruang lingkup dalam IMK bisa sangat luas dan berhubungan dengan perilaku manusia. Ruang lingkup tersebut antara lain psikologi, ergonomis, linguistik, dan sosiologi. Faktor-faktor tersebut memang bukan disiplin ilmu yang dipelajari dalam perkuliahan Teknik Informatika tetapi merupakan hal yang memegang peranan penting dalam membuat suatu antar muka yang baik dan dapat diterima oleh banyak orang. 22 2.2.2 Delapan Aturan Emas Delapan aturan emas adalah prinsip-prinsip pokok yang harus diinterpretasikan, disempurnakan, dan diperluas untuk setiap lingkungan desain. Prinsip-prinsip itu memiliki batas, tetapi bisa memberikan awal yang bagus bagi desainer mobile, desktop, dan website. (Shneiderman & Plaisant, 2010) Prinsip-prinsip tersebut disajikan untuk berfokus pada peningkatan produktivitas pengguna dengan menyediakan data entri prosedur yang disederhanakan, tampilan yang mudah dipahami, dan umpan balik informatif yang cepat untuk meningkatkan perasaan kompetensi, penguasaan, dan kontrol atas sistem. Menurut Shneiderman, aturan-aturan emas yang mendasari desain suatu antar muka tersebut adalah : 1. Berupaya untuk Konsisten Urutan tindakan yang konsisten harus diperlukan dalam situasi yang mirip, terminology identic harus digunakan dalam prompts, menus, dan help screens, dan perintah yang konsisten harus diterapkan menyeluruh. 2. Mengenali kebutuhan pengguna yang universal Mampu membedakan pengguna dari novice sampai pengguna expert, rentang usia, kecacatan yang dimiliki, dan keragaman teknologi yang mempengaruhi persyaratan panduan desain 23 3. Berikan umpan balik yang informatif Untuk setiap aksi operasi, harus ada beberapa sistem umpan balik. Untuk aksi yang sering dan kecil, respon dapat menjadi sederhana, sedangkan untuk aksi yang tidak biasa dan besar, respon harus lebih besar. 4. Desain dialog untuk menghasilkan penutup Urutan tindakan harus diatur ke dalam kelompok dengan permulan, pertengahan, dan akhiran. Umpan balik yang informatif pada penyelesaian dari sekelompok aksi memberikan operator sebuah kepuasan dari pencapaian, rasa lega, sinyal untuk menurunkan rencana kontingensi dan pilihan dari pikiran mereka, dan indikasi bahwa pengguna bisa mempersiapkan untuk kelompok tindakan berikutnya. 5. Berikan penanganan eror yang sederhana Sebisa mungkin, rancanglah sistem agar pengguna tidak membuat kesalahan yang serius. Jika kesalahan serius dibuat, sistem harus bisa mendeteksi kesalahan dan menyarankan penanganan kesalahan yang sederhana dengan petunjuk yang jelas. 6. Memungkinkan aksi kembali yang mudah Fitur ini mengurangi kecemasan, sejak pengguna tahu bahwa kesalahan tidak dapat dibatalkan, sehingga mendorong eksplorasi pilihan yang tidak familiar. Aksi pembalikan bisa berbentuk suatu aksi, entri data, atau sekelompok aksi lengkap. 24 7. Mendukung internal locus control Operator yang berpengalaman sangat menginginkan perasaan bahwa mereka yang berkuasa atas sistem dan sistem merespon setiap aksi mereka. Rancang sistem untuk membuat pengguna menjadi inisiator dari aksi, bukan hanya sebagai responden. 8. Mengurangi ingatan jangka pendek Keterbatasan pemrosesan informasi pada manusia dalam ingatan jangka pendek mengharuskan tampilan dibuat sederhana, tampilan beberapa halaman harus dikonsolidasikan, frekuensi jendela-gerak dikurangi, dan pelatihan memadai dialokasikan untuk kode, mnemonic, dan serangkaian aksi. 2.2.3 Website Storyboard Storyboard adalah sketsa sederhana berdasarkan konten dari halaman web. Storyboard secara sederhana menggambarkan elemen-elemen dari halaman seperti header, footer, margin, navigation bar, logo, dan elemen grafik lainnya untuk mendukung penyampaian konten, umpan balik konsumen, dan persetujuan storyboard. (Wang & Katila, 2004, p24) Dalam pengembangan sebuah website, Storyboard dapat dibuat dalam bentuk diagram alur hubungan antar halaman website (sitemap) dan bisa juga dalam bentuk sketsa gambar sederhana untuk memberi bayangan mengenai 25 tata letak dari elemen-elemen website yang akan dipakai nantinya (wireframe). Storyboard dapat dibuat secara manual dengan menggunakan kertas, maupun memanfaatkan website pembuatan storyboard yang bisa diakses secara gratis atau berbayar. Beberapa pertanyaan umum yang mendasari pembuatan storyboard antara lain : 1. Apa tujuan dari website yang akan dibuat? 2. Siapa yang akan menjadi pengunjung dari website ? 3. Konten apa saja yang akan dimasukan ke dalam website ? 4. Bagaimana orang-orang ingin menggunakan website ini ? Pengembangan sebuah aplikasi atau dengan menggunakan storyboard memiliki beberapa keuntungan yaitu : 1. Membuat perubahan desain lebih efisien. 2. Membuat navigasi desain lebih baik. 3. Membuat pengembangan konten lebih design friendly. 4. Membantu web programmer dalam navigasi antar halaman website 26 Gambar 2.1 Storyboard dengan model sitemap Gambar 2.2 Storyboard dengan model wireframe 27 2.3 Teori Rekayasa Piranti Lunak 2.3.1 Software Engineering Software Engineering adalah disiplin teknik yang menyangkut segala aspek produksi software dari tahap awal spesifikasi sistem sampai kepada pemeliharaan sistem setelah sistem mulai digunakan (Sommerville, 2011, p.7). Software engineering penting untuk diterapkan karena dua alasan berikut : 1. Semakin banyak individu dan masyarakat mengandalkan kemajuan sistem perangkat lunak. Seorang software engineer harus bisa memproduksi sistem terpercaya dan dapat diandalkan secara ekonomis dan cepat. 2. Hal ini biasanya lebih murah, dalam jangka panjang, untuk menggunakan metode rekayasa perangkat lunak dan teknik untuk sistem perangkat lunak daripada hanya menulis program seolah-olah itu adalah sebuah proyek pemrograman personal. Untuk sebagian besar jenis sistem, sebagian besar biaya adalah biaya untuk mengubah perangkat lunak tersebut setelah mulai digunakan. Pendekatan sistematis yang digunakan pada software engineering terkadang disebut proses software. Proses software adalah serangkaian aktivitas yang mengarah kepada produksi software. Ada 4 (empat) aktivitas 28 mendasar yang biasa terjadi pada proses software. Aktivitas-aktivitas tersebut adalah : 1. Spesifikasi software, di mana konsumen dan teknisi menetapkan software yang akan dibuat dan juga kendala yang akan dihadapi pada saat pengembangannya. 2. Pengembangan software, di mana software dirancang dan diprogram. 3. Validasi software, di mana software diperiksa untuk memastikan apakah sesuai dengan kebutuhan atau persyaratan konsumen. 4. Evolusi software, di mana software dimodifikasi sesuai kebutuhan konsumen dan permintaan pasar yang terus berubah. 2.3.2 Spiral Model Spiral model adalah proses evolusi software yang menggabungkan model prototipe berulang dengan aspek kontrol dan sistematik dari model linier sekuensial (Pressman, 2010, p45). Spiral model adalah sebuah metamodel di mana seluruh lifecycle model lainnya dapat ditemukan. Spiral model terdiri dari 4 (empat) kuadran dari diagram Cartesian. Kuadrankuadran tersebut yaitu perencanaan, analisa risiko, engineering, dan evaluasi pelanggan Spiral model memiliki 2 (dua) fitur pembeda. Pertama adalah pendekatan siklus untuk pengembangan defini derajat sistem dan implementasi pada saat derajat resiko menurun. Kedua adalah anchor point 29 milestones untuk memastikan komitmen dari pemegang saham kepada sistem solusi yang layak dan menguntungkan. Gambar 2.3 Siklus spiral model Iterasi pertama dari spiral model dimulai dari kuadran perencanaan yaitu menyangkut pengumpulan persyaratan dan perencanaan proyek. Proyek kemudian memasuki kuadran analisa resiko yang mengatur analisa biaya/keuntungan dan hambatan/peluang untuk menentukan pilihan apakah proyek akan memasuki kuadran engineering atau tidak. Kuadran engineering.adalah kuadran di mana pengembangan software terjadi. Hasil dari pengembangan ini (prototipe atau bahkan hasil akhir) ditujukan untuk evaluasi pelanggan dan permulaan dari putaran kedua spiral model. 30 2.3.3 Unified Modeling Language (UML) Unified Modeling Language (UML) adalah suatu set dari standarisasi pemodelan yang digunakan untuk menspesifikasikan atau mendeskripsikan sistem perangkat lunak dari segi objek (Whitten & Bentley, 2007, p 371). Tiga (3) aspek dari UML : 1. Language Language memungkinkan kita berkomunikasi tentang subyek. Dalam pengembangan sistem, subyek melingkupi kebutuhan dan sistem. Tanpa bahasa, anggota tim akan mengalami kesulitan untuk berkomunikasi dan bekerja sama dalam membangun sistem yang berhasil. 2. Model Model merupakan representasi dari subyek. Model menangkap sekumpulan ide yang dikenal sebagai abstraksi tentang subyek. Tanpa model, anggota tim akan mengalami kesulitan dalam memahami persyaratan dan sistem, dan menyadari akibat dari perubahan ketika sistem dikembangkan. 3. Unified Istilah unified merujuk pada fakta bahwa Object Management Group (OMG), organisasi standardisasi industri yang diakui, dan Rational Software Corporation menciptakan UML untuk mempertemukan sistem informasi dan praktek teknik terbaik teknologi industri. Praktek ini melibakan teknik terapan 31 yang memungkinkan kita membangun sistem lebih berhasil. Tanpa bahasa yang umum, sangat sulit bagi anggota tim untuk lebih produktif dan berkontribusi dalam membangun sistem. Berikut adalah lima macam UML yang umum digunakan pada saat pengembangan sebuah software atau website. 2.3.4 Use Case Diagram Diagram use case adalah sebuah diagram yang menggambarkan interaksi antara sistem dan pengguna. Dengan kata lain, diagram ini secara grafis mendeskripsikan siapa yang akan menggunakan sistem dan dengan cara apa pengguna akan berinteraksi dengan sistem. (Whitten & Bentley, 2007, p. 246). Sebuah use case menyajikan satu interaksi antara aktor dengan sistem, terkait dengan aktivitas tertentu, misalnya login ke sistem, mengaktifkan sebuah menu, membuat laporan, dan sebagainya. Aktor adalah pengguna sistem, baik manusia atau mesin, yang berinteraksi dengan sistem untuk melakukan aktivitas tertentu. Diagram ini dibuat untuk membantu penyusunan kebutuhan atau persyaratan (requirement) sebuah sistem perangkat lunak, apabila diterapkan pendekatan berorientasi obyek (object oriented analysis). Pengembang sistem 32 diberikan kemudahan dalam mengkomunikasikan rancangan dengan klien, dan merancang test case untuk semua feature yang ada pada sistem. Gambar 2.4 Skema use case diagram (Whitten & Bentley, 2007). 2. 3.5 Activity Diagram Activity diagram adalah sebuah diagram yang dapat digunakan untuk menggambarkan aliran dari proses bisnis, langkah-langkah dari sebuah use case, atau logika dari sebuah perilaku objek (Whitten & Bentley, 2007, p. 390). Berbeda dengan diagram use case yang hanya menggambarkan apa yang dilakukan oleh sistem, pada activity diagram, bagaimana sistem melakukan suatu aksi dijelaskan lebih rinci. Activity diagram 33 menggambarkan berbagai alir aktivitas dalam sistem yang sedang dirancang, bagaimana masing-masing alir berawal, decision yang mungkin terjadi, dan bagaimana mereka berakhir. Activity diagram juga dapat menggambarkan proses paralel yang mungkin terjadi pada beberapa eksekusi. Gambar 2.5 Skema activity diagram (Whitten & Bentley, 2007). 34 2.3.6 Sequence Diagram Sequence Diagram adalah diagram UML yang memodelkan logika dari sebuah use case dengan menggambarkan interaksi pesan diantara objek dalam urutan waktu. (Whitten & Bentley, 2007, p. 659). Sequence Diagram disusun berdasarkan urutan waktu. Setiap sequence diagram mempresentasikan suatu aliran dari beberapa aliran di dalam use case. Gambar 2.6 Skema sequence diagram (Whitten & Bentley, 2007). 2.3.7 Class Diagram Class Diagram adalah sebuah gambaran grafis dari struktur objek statis sistem, menunjukkan kelas objek yang menyusun sistem serta hubungan diantara kelas objek tersebut (Whitten & Bentley, 2007, p. 400). 35 Gambar 2.7 Skema class diagram (Whitten & Bentley, 2007). 2.3.8 Model-View-Controller Pattern Model-View-Controller (MVC) memisahkan presentasi dan interaksi dari data sistem. Sistem ini terbagi dalam tiga komponen logis yang berinteraksi satu sama lain. Komponen Model mengelola sistem data dan operasi yang terkait pada data. Komponen View mendefinisikan dan mengelola bagaimana data disajikan kepada pengguna. Komponen Controller mengelola interaksi pengguna (misalnya pada penekanan tombol, klik mouse, dll) dan melewati interaksi ini ke View dan Model. (Sommerville, 2011, p155). Dengan demikian, desain MVC memberikan pemisahan tugas dan tanggung jawab yang jelas antara komponen Model, View, dan Controller. Tujuan penggunaan MVC dalam pemrograman adalah untuk mengelompokkan fungsi-fungsi yang ada dan berserakan tidak jelas menjadi 36 sebuah kesatuan sesuai dengan tipenya masing-masing. Misalnya fungsifungsi yang digunakan untuk mengakses database disatukan dalam satu tempat, kemudian fungsi untuk menampilkan tampilan website dalam satu tempat yang lain. Dengan terpisahnya antara fungsi logika program serta tampilan dari program, maka akan memudahkan proses web development. Khususnya ketika kita harus bekerja dalam sebuah tim. Masing-masing anggota tim bisa mengerjakan pekerjaannya sendiri. Programmer bisa mengerjakan tugasnya yang berkaitan dengan logika program, sedangkan desainer bisa mengerjakan tugasnya yang berkaitan dengan proses penampilan website tersebut. a. Model Implementasi aplikasi data. Komponen ini merupakan kode utama yang melakukan kerja internal aplikasi. Komponen Model tidak tahu sama sekali bagaimana bentuk komponen View dan Controller. b. View Implementasi layer presentansi yang berinteraksi dengan pengguna. Komponen View memerlukan data dari Controller untuk meneruskan input pengguna ke komponen Model. 37 c. Controller Bertindak sebagai pusat kendali aplikasi dan penanggungjawab lalu lintas data ke komponen Model dan View. Controller mengatur Model dan View dengan bereaksi terhadap data yang dikirimkan oleh pengguna. Proses MVC yang terjadi dalam suatu kasus user request adalah sebagai berikut : 1. Pengguna melalui browser mengirimkan suatu request untuk suatu halaman kepada controller yang berada di server. 2. Controller mengambil data yang diperlukan dari model dalam hal melakukan respond terhadap request. 3. Controller mengolah halaman dan mengirimkannya kepada view. 4. View mengirim halaman kembali melalui browser agar dapat dilihat oleh client. Proses di atas dapat dilihat pada gambar di halaman selanjutnya. 38 Gambar 2.8 Organisasi pada MVC (Sommerville, 2011). 2.4 Teori Sistem Basis Data 2.4.1 Basis Data Database adalah sekumpulan file yang saling berhubungan (Whitten & Bentley, 2007, p518). Basis data atau database adalah sekumpulan data yang memiliki hubungan secara logika dan diatur dengan susunan tertentu serta disimpan dalam media penyimpanan komputer. Data itu sendiri adalah representasi dari semua fakta yang ada pada dunia nyata. Basis data sering digunakan untuk melakukan proses terhadap data-data tersebut untuk menghasilkan informasi tertentu. Misalnya dari data-data nama siswa dan tanggal lahir siswa bisa didapatkan informasi nama siswa yang berulang tahun pada hari ini. 39 Dalam basis data ada sebutan-sebutan untuk satuan data yaitu : 1. Karakter, ini adalah satuan data terkecil. Data terdiri atas susunan karakter yang pada akhirnya mewakili data yang memiliki arti dari sebuah fakta. 2. Field, adalah sekumpulan dari karakter yang mewakili fakta tertentu misalnya seperti nama siswa, tanggal lahir, dan lain-lain. Dalam dunia perancangan database, field juga disebut atribut. 3. Record, adalah kumpulan dari field. Pada record ditemukan banyak sekali informasi penting dengan cara mengkombinasikan field-field yang ada. 4. Table, adalah kumpulan dari record-record yang memiliki kesamaan entitas dalam dunia nyata. Kumpulan dari table adalah database, wujud fisik sebuah database dalam komputer adalah sebuah file yang di dalamannya terdapat berbagai tingkatan data yang telah disebutkan di atas. 5. File, adalah bentuk fisik dari penyimpanan data. File database berisi semua data yang telah disusun dan diorganisasikan sedemikian rupa sehingga memudahkan pemberian informasi. 2.4.2 Database Management System (DBMS) Database Management System (DBMS) adalah perangkat lunak komputer khusus yang disediakan dari vendor-vendor komputer yang 40 digunakan untuk membuat, mengakses, mengontrol, dan mengelola database (Whitten & Bentley, 2007, p525). DBMS berperan sebagai antarmuka antara pengguna dengan database. Pengguna meminta DBMS untuk menjalankan berbagai operasi (insert, update, delete, dan retrieval) pada database. Komponen-komponen dari DBMS melaksanakan operasi yang telah diminta dan memberikan data yang diperlukan oleh pengguna. Gambar 2.9 Struktur dari DBMS (Whitten & Bentley, 2007). 1. DDL (Data Definition Language) yaitu sebuah bahasa yang digunakan oleh DBMS untuk menentukan sebuah database atau melihat database. 41 2. DML (Data Manipulation Language) yaitu bahasa yang digunakan untuk membuat, membaca, meperbarui, dan menghapus record-record pada sebuah database. 3. Data Manager adalah pusat komponen software dari DBMS yang dikenal juga dengan Database Control System. 4. Data Dictionary merupakan repository dari deskripsi data pada database. Data dictionary digunakan untuk mengontrol integritas data, operasi dan akurasi database dan merupakan bagian yang penting dari DBMS 5. Data Files yang berisi porsi data dari database. 6. Compiled DML untuk menngubah query level tinggi menjadi perintah akses level rendah yang dikenal dengan compiled DML. 7. End users yaitu pengguna akhir yang meminta DBMS untuk melakukan serangkaian operasi tertentu. 2.4.3 Entity Relationship Diagram (ERD) Entity Relatinship Diagram (ERD) adalah model data yang menggunakan beberapa notasi untuk menggambarkan data dalam konteks entitas dan hubungan yang digambarkan oleh data tersebut (Whitten & Bentley, 2007, p271) Komponen-komponen yang digunakan dalam ERD terdiri dari : 42 1. Entity Entity adalah suatu kumpulan objek atau suatu yang dapat dibedakan atau diidentifikasikan secara unik. Kumpulan entity tersebut disebut dengan Entity Set. 2. Relationship Relationship adalah suatu hubungan yang terjadi antara satu entity dengan satu entity yang lainnya atau lebih. Kumpulan relationship yang sejenis disebut relationship set. Jika suatu entity dihubungkan dengan relationship, maka penggambarannya dilakukan dengan menggunakan simbol garis lurus. 3. Atribut Atribut menunjukkan fungsinya sebagai pembentuk karakteristik yang melekat pada setiap entity. Disamping penamaan yang unik berdasarkan fungsinya, atribut-atribut dapat dibedakan berdasarkan sejumlah pengelompokkannya. Gambar 2.14 Skema Entity Relationship Diagram (Whitten & Bentley, 2007). 43 2.4.4 MySQL MySQL adalah sebuah server database realsional yang menyediakan fitur yang sama yang dapat ditemukan di pesaing server database relasional. (Gilmore, 2010, p477) MySQL menggunakan bahasa SQL (Structured Query Language) yang digunakan untuk berkomunikasi dengan sebuah database. a. Query MySQL Query MySQL merupakan istilah yang digunakan untuk menyatakan berbagai perintah MySQL. Setiap perintah melakukan beberapa hal terhadap database MySQL. Sebagai contoh, perintah Query MySQL CREATE akan membuat tabel dan database MySQL, sedangkan Query MySQL SELECT akan memilih baris-baris yang sudah pernah disisipkan dalam database. Konstruksi penulisan Query MySQL dimulai dengan perintah ADD, DROP, CREATE, INSERT, SELECT, UPDATE, REPLACE, dan DELETE. Contoh sederhana penulisan query MySQL : SELECT * FROM nama_tabel; Potongan query di atas memerintahkan database untuk mengambil semua baris dan kolom dari table nama_tabel dan menampilkannya. 44 2.5 Simulasi Simulasi adalah teknik untuk pengujian, analisis, atau pelatihan pada sistem yang digunakan di dunia nyata, atau di mana sistem dunia nyata dan sistem konseptual di reproduksi oleh model. Simulasi digunakan ketika sistem nyata tidak bisa dilakukan. Sistem nyata tidak bisa dilakukan karena 1) sistem tidak bisa diakses, 2) berbahaya untuk menjalankan sistem, atau 3) sistem mungkin tidak eksis. Jadi untuk mengantisipasi faktor-faktor tersebut, computer akan meniru operasi dari proses dan fasilitas dari sistem nyata (Sokolowski & John & Banks, et al , 2009). Metode simulasi dapat menjelaskan tingkah laku sebuah sistem dalam beberapa waktu dengan mengobservasi tingkah laku dari sebuah model matematika yang dibuat sesuai dengan karakter sistem yang asli sehingga seorang analis bisa mengambil kesimpulan tentang tingkah laku dari sistem dunia nyata. Dalam dunia teknologi digital, peran simulasi banyak berpengaruh dalam menghadirkan pengalaman baru bagi pengguna dalam merasakan sesuatu yang tidak dapat dirasakannya secara langsung. Ambil contoh aplikasi simulasi untuk mencoba kacamata yang akan dibuat pada skripsi ini. Seorang pengguna yang ingin membeli sebuah kacamata di toko kamacata online, telah mendapatkan kacamata yang dia inginkan. Akan tetapi ada keinginan untuk mencoba terlebih dahulu kacamata tersebut sebelum memutuskan untuk membelinya. Dengan sebuah sistem peraga atau simulasi, maka calon pembeli tersebut akan mendapatkan gambaran mengenai kondisinya pada saat memakai kacamata tersebut. 45 2.6 Website Website atau dalam bahasa indonesia dikenal dengan situs web atau sering disingkat menjadi situs adalah sejumlah halaman web yang memiliki konten saling relevan. Konten tersebut dapat berupa teks, berkas multimedia, dan berkas-berkas lainnya (Mifflin, 2011). Sebuah website ditempatkan pada sebuah server web (hosting) dan memiliki alamat yang unik dan spesifik (domain) yang dapat diakses melalui internet, ataupun LAN (Local Area Network) melalui tautan yang dikenal dengan URL (Uniform Resource Locator). Halaman gabungan atas semua website yang dapat diakses dengan internet disebut dengan WWW (World Wide Web). Website ada 2 (dua) macam dilihat dari fungsi, perubahan konten, dan kemampuannya berinteraksi dengan pengunjung web. Yaitu website statis, dan website dinamis. Website statis adalah website yang isinya cenderung tetap dan jarang berubah. Namun saat ini website statis akan sangat jarang kita temui kecuali website tersebut merupakan website yang masih dalam tahap pembuatan atau merupakan hasil karya mereka yang sedang belajar membuat website. Website dinamis merupakan kebalikan dari website statis. Isi website dinamis dapat berubahubah sesuai dengan isi database serta konfigurasi yang sudah dipersiapkan sebelumnya. Website yang ada di internet saat ini sebagian besar sudah merupakan website dinamis. 46 2.6. 1 Website Interaktif Beberapa tahun belakangan ini, internet berubah dengan cepat. Desain website telah berevolusi menjadi lebih banyak pengalaman interaktif. Array dari produk website interaktif saat ini telah memudahkan banyak praktisi atau pemilik website untuk mencapai target pengunjung mereka (Silkey & Robert, 2006). Dengan konsep interaktif ini, pengunjung website tidak hanya seperti membaca website layaknya sebuah surat kabar, tetapi juga dapat melakukan interaksi seperti berkomentar, chatting, mengunggah file tertentu, melakukan suatu kostumisasi, dan melakukan simulasi khusus seperti yang akan dibuat pada skripsi ini. 2.7 OpenCV OpenCV (Open Source Computer Vision Library) adalah sebuah program open source dalam bidang computer vision dan library untuk machine learning software. OpenCV dibuat untuk memberikan infrastruktur umum bagi aplikasi computer vision dan untuk mempercepat penggunaan persepsi mesin dalam produk komersil. OpenCV menjadi bagian dari produk BSD-licensed yang berarti produkproduk berlisensi gratis. Hal ini membuat OpenCV mudah untuk dimodifikasi dan digunakan (OpenCV,2012). Library dalam OpenCV memiliki lebih dari 250 algoritma yang dioptimalkan. Algoritma ini bisa digunakan untuk mendeteksi dan mengenali wajah, identifikasi objek, klasifikasi aksi manusia melalui video, mengikuti pergerakan kamera, 47 mengikuti pergerakan suatu objek, mengikuti pergerakan mata, ekstraksi model 3D, mencari gambar yang sama dari gambar pada database dan kemudian dicocokan, dan masih banyak lagi. OpenCV telah diunduh lebih dari 5 juta kali dan digunakan lebih dari 47 ribu penggunanya. OpenCV dapat dipakai pada C++, C, Phyton, PHP, dan Java Interface. OpenCV juga berjalan pada OS Windows, Linux, Android, dan Mac OS. OpenCV lebih condong ke arah aplikasi real-time vision. 2.8 Pendeteksian Wajah Pendeteksian wajah adalah mengenai pencarian ada atau tidaknya wajah di dalam suatu citra dan jika ada, maka akan dikembalikan lokasi dan isi setiap wajah pada citra tersebut. Menurut Tsao, Lee, Chang, dan Lin (2010), metode yang digunakan untuk mendeteksi wajah dapat dikelompokkan sebagai berikut: 1. Metode knowledge based dan feature invariant Metode ini dikembangkan dengan memanfaatkan fitur-fitur wajah seperti mata, hidung, mulut, warna kulit, yang kemudian mengelompokkan fitur-fitur tersebut dengan mempertimbangkan hubungan geometris diantara fitur-fitur tersebut. 48 2. Metode template matching Metode ini menemukan fitur-fitur wajah berdasarkan kesamaan atau korelasi antara gambar yang ditangkap dengan pola standar wajah seperti mata, hidung, mulut, dan kontur wajah. Cara yang digunakan untuk kategori ini adalah dengan menggunakan template gambar wajah yang diperoleh dari rata-rata tingkat gradasi pixel dari sampel wajah. 3. Metode appearance-based Berbeda dengan metode template matching, metode ini juga melakukan proses pembelajaran untuk memperoleh template dari sampel training (wajah dan bukan wajah). Menurut Anila dan Devarajan (2010), metode appearance-based memperoleh hasil yang sangat baik dalam hal keakuratan dan kecepatan. 2.8.1 Framework Viola-Jones Framework Viola-Jones adalah kerangka kerja pendeteksian obyek pertama yang diusulkan oleh Paul Viola dan Michael Jones untuk memberikan tingkat pendeteksian obyek secara real-time. Framework ViolaJones diimplementasikan pada OpenCV sebagai fungsi cvHaarDetectObjects() yang dapat digunakan untuk proses deteksi adanya citra wajah dalam sebuah gambar. Framework ini menggabungkan tiga konsep utama, yaitu: fitur Haar-Like, Algoritma AdaBoost, dan Cascade classifier. 49 a. Fitur Haar-Like Nama Haar merujuk pada suatu fungsi matematika (Haar Wavelet) yang berbentuk kotak. Haar-Like memproses gambar dalam kotak-kotak sehingga didapatkan perbedaan nilai yang menandakan daerah gelap dan terang. Jika perbedaan nilai di atas nilai ambang (threshold) , maka dapat dikatakan bahwa fitur tersebut ada. Untuk menentukan ada tidaknya fitur Haar pada gambar bergerak (video) dimana terjadi perhitungan dan penjumlahan pixel secara terus-menerus dan membutuhkan waktu yang lama, Viola dan Jones menggunakan teknik Integral Image. b Algoritma AdaBoost Viola dan Jones menggunakan algoritma AdaBoost yang berfungsi untuk mencari fitur-fitur yang memiliki tingkat pembeda yang tinggi. Hal ini dilakukan dengan mengevaluasi setiap fitur terhadap data latih dengan menggunakan nilai dari fitur tersebut. Fitur yang memiliki batas terbesar antara wajah dan non-wajah dianggap sebagai fitur terbaik. c. Cascade classifier Cascade adalah daerah gambar yang digolongkan sebagai obyek yang dicari setelah melewati proses pemfilteran. Nilai cascade didapatkan dari training cascade dengan menggunakan algoritma AdaBoost. Cascade classifier adalah sebuah rantai stage classifer, dimana setiap stage classifer digunakan untuk mendeteksi apakah di dalam gambar terdapat obyek yang dicari. Classifier dengan banyak fitur akan mendapatkan 50 tingkat pendeteksian yang lebih akurat serta error yang rendah, namun membutuhkan waktu yang lama dalam perhitungannya. 2.9 Kacamata Kacamata menurut kamus besar bahasa Indonesia (2008) adalah lensa tipis untuk mata guna menormalkan dan mempertajam penglihatan. Selain menjadi alat bantu penglihatan, kacamata juga berfungsi sebagai pelindung mata dari sinar matahari, alat bantu khusus untuk menikmati hiburan, alat bantu dalam berolahraga, atau sekedar pelengkap mode dalam dunia fashion. 2.9.1 Perkembangan kacamata Kacamata pertama kali ditemukan sekitar 3000 tahun yang lalu oleh bangsa di kota tua Niniwe, dimana pada waktu itu fungsinya adalah sebagai kaca pembesar. Bahan yang digunakan juga bukanlah lensa kaca melainkan batu Kristal. Perkembangan kacamata kemudian baru melesat pada abad XII di Cina dan Eropa. Ketika itu, Bangsa Yunani kuno menggunakan bola kaca berisi air sebagai kaca pembesar. Kemudian pada tahun 1268 Roger Bacon, seorang ilmuan berkebangsaan Inggris, menemukan kacamata baca. Dan pada tahun 1300an kacamata mulai diproduksi dengan pusat pembuatan di Venesia. Tapi 51 kacamata saat itu belum seperti sekarang. Kualitas lensanya sederhana, dan pemakaiannya juga merepotkan. Berbagai cara kemudian dilakukan untuk membuat kacamata nyaman dipakai. Ada yang memasang rantai kecil pada kedua sisi kacamata dan diikatkan di bagian belakang kepala, seperti kacamata perenang, ada lagi yang mengaitkan kacamata pada topi. Ini pun merepotkan, bahkan mengganggu, terutama saat harus membaca di dalam ruangan atau membuka topi untuk memberi salam. Hingga pada akhirnya, tercetuslah ide untuk memasang tangkai sehingga kacamata itu dapat dikaitkan di telinga. Tahun 1784, Benjamin Franklin berhasil menemukan kacamata bifokus yang memiliki lensa cembung dan lensa cekung dalam satu bingkai. Pada tahun 1908 dan 1910 barulah dikenal lensa cembung cekung yang benar-benar menyatu dalam satu lensa. Materi lensa pun turut berkembang menjadi lensa kaca dan plastic (Optik Melawai, 2010). 2.9.2 Jenis kacamata menurut kegunaannya Dewasa ini kacamata tidak hanya berfungsi sebagai alat bantu penglihatan saja. Kacamata sudah menjadi barang fashion. Pada toko-toko fashion baik itu toko konvensional maupun toko online, kacamata termasuk kedalam aksesoris fashion. Tidak sampai disitu, kacamata juga memiliki fungsi sebagai aksesoris olahraga. Sebagai aksesoris olahraga, kacamata berguna sebagai alat bantu pemakai sekaligus pengaman dalam melakukan 52 kegiatan olahraga. Berikut adalah pembagian jenis kacamata berdasarkan kegunaannya. 1. Prescription Eyeglasses Prescription eyeglasses adalah kacamata yang digunakan untuk membantu penglihatan pemakai. Prescription eyeglasses dibuat berdasarkan resep (prescription). Resep tersebut berisi bermacam parameter dalam bentuk angka yang merupakan hasil pengukuran dari kesehatan mata pemakainya. Resep tersebut biasa diberikan oleh dokter dari hasil tes kesehatan mata pasien. Parameter ukuran yang biasa terdapat dalam resep dokter antara lain cylinder, axis, dan spehere. Terkadang resep juga menyertakan spesifikasi lensa dan bingkai kacamata. Prescription eyeglasses digunakan pada orang yang mengalami gangguan penglihatan seperti rabun jauh, rabun dekat, silinder, dan gangguan mata lainnya (Bedinghaus, 2009). 2. Sunglasses / Fashion eyeglasses Sunglasses atau yang biasa dikenal dengan kacamata hitam adalah kacamata yang berfungsi untuk melindungi mata dari sindar matahari. Karena bentuknya yang bermacam-macam, sunglasses dapat disesuaikan dengan mode dan pakaian yang dipakai. Hal ini menjadikan sunglasses menjadi aksesoris fashion dan sekarang banyak dikenal sebagai fashion eyeglasses. Jadi sebagai media pelindung mata dari silaunya matahari, 53 kacamata jenis ini juga dapat dipakai sebagai sarana mode (Bedinghaus, 2009). 3. Sportswear Eyeglasses Sportswear eyeglasses merupakan kacamata yang digunakan dalam berolahraga. Kacamata jenis ini biasanya lebih bersifat khusus tergantung jenis olahraganya. Sporstwear eyeglasses secara umum berfungsi sebagai pelindung dan pengaman dalam berolahraga. Contoh sporstwear eyeglasses yang sering ditemui adalah Ski-google, swimming google, dan cycling eyeglasses (Heiting, 2010). 2.9.3 Jenis lensa kacamata Lensa kacamata memiliki beragam jenis sesuai kebutuhan dari pemakai. Masing-masing lensa memiliki tujuan masing-masing dan harga yang berbeda. Menurut salah satu artikel pada website optik bernama Optik Melawai (2012), jenis lensa pada kacamata terbagi menjadi beberapa macam yaitu:. 1. Lensa tunggal (Single vision lens) Lensa yang hanya memiliki satu ukuran saja dengan satu titik fokus. Lensa ini biasa digunakan oleh seseorang yang memiliki kelainan mata, seperti rabun jauh, rabun dekat, dan astigmatisma atau silinder. 54 Dikatakan single vision karena kegunaannya untuk satu ukuran, jarak jauh atau jarak dekat saja. 2. Lensa bifocal (bifocal lens) Lensa bifocal memiliki 2 (dua) titik fokus yang dipergunakan untuk memenuhi kebutuhan mata presbiopi atau mata tua. Kegunaannya untuk melihat jauh sekaligus dekat dengan satu lensa. Satu titik terletak pada bagian bawah biasa digunakan untuk aktivitas membaca atau penglihatan jarak dekat. Sedangkan lensa bagian atas dipakai untuk melihat jarak jauh. 3. Lensa progresif (Progressive lens) Lensa ini memiliki 2 (dua) titik focus. Yang membedakannya dengan lensa bifocal terletak pada lensanya yang tidak memiliki jarak atau garis pembatas antara fokus untuk melihat jauh dengan fokus untuk melihat dekat. Lensa ini juga menghasilkan sudut pandang jarak sedang sehingga menambah kenyamanan pemakainya. 4. Lensa transisi (Transisions lens) Lensa ini mampu menghasilkan perubahan warna sesuai lingkungannya. Jika berada di dalam ruangan, lensa akan menjadi bening seperti kacamata baca. Sebaliknya apabila terkena sinar matahari yang cerah, warnanya akan berubah menjadi gelap seperti sunglasses sehingga memberikan perlindungan mata dari sinar ultraviolet. Cocok bagi 55 pengguna yang sering beraktivitas di luar dan di dalam ruangan serta pemilik mata sensitif. 2.9.4 Parameter dari prescription eyeglasses Dalam pembuatan prescription eyeglasses, terdapat spesifikasi dan parameter yang harus diikuti. Parameter tersebut menentukan akan seperti apa lensa yang dihasilkan dan lensa tersebut harus sesuai dengan penglihatan pemakainya. Menurut Heiting (2013), parameter yang menentukan prescription eyeglasses adalah: 1. Cylinder Nilai silinder memberikan kekuatan pada lensa yang dibutuhkan untuk mengoreksi kornea astigmatisma. Nilai silinder biasa disingkat sebagai cyl. Nilai dari silinder tersebut berupa tanda positif dan negatif. 2. Axis Nilai untuk axis selalu dinyatakan dalam derajat. Axis mendeskripsikan pengukuran yang dibutuhkan bagi lensa untuk mengimbangi penyimpangan kornea. Nilai axis selalu antara 0° dan 180°. 56 3. Sphere Nilai sphere pada prescription memberitahukan kekuatan lensa apa yang dibutuhkan. Bentuk pendek, Sph atau S, sering digunakan. Huruf D (distance) berarti kacamata digunakan untuk penglihatan jarak jauh. N (near) berarti kacamata digunakan untuk penglihatan jarak dekat seperti kacamata baca. 2.10 E-commerce Electronic Commerce adalah suatu konsep umum yang mencakup segala bentuk transaksi bisnis atau pertukaran informasi yang dilakukan dengan menggunakan teknologi informasi dan komunikasi. Yang termasuk e-commerce adalah perdagangan barang, jasa, dan material elektronik. Seluruh perdagangan itu dilakukan secara elektronik (Amir Manzoor, 2010, p2). Proses yang terjadi dalam e-commerce adalah sebagai berikut : 1. Presentasi elektronik (website) untuk produk dan layanan. 2. Pemesanan secara langsung (online) beserta tagihannya. 3. Otomasi akun pelanggan secara aman, baik nomor rekening maupun nomor kartu kredit 4. Pembayaran dan penanganan transaksi yang juga dilakukan secara online. Kegiatan e-commerce mencakup banyak hal. Untuk membedakannya, ecommerce diklasifikasikan menjadi 2(dua) yaitu: 57 1. Business to Business 2. Rekan bisnis yang sudah saling mempercayai dan diantara keduanya sudah terjalin hubungan yang cukup lama. 3. Pertukaran data dilakukan secara berulang-ulang dan berkala dengan format data yang telah disepakati bersama. 4. Salah satu pelaku tidak harus menunggu rekan lainnya untuk mengirimkan data. 5. Model umum yang digunakan adalah peer to peer. 2. Bussines to Consumer 1. Terbuka untuk umum, di mana informasi disebarkan secara umum pula. 2. Pelayanan yang digunakan juga bersifat umum sehingga dapat digunakan oleh orang banyak. 3. Pelayanan yang digunakan berdasarkan permintaan. 4. Sering dilakukan sistem pendekatan client – server. Tujuan suatu perusahaan menggunakan e-commerce adalah untuk meningkatkan efektifias dan efisiensi dalam meningkatkan keuntungannya. Biaya pembuatan website yang relatif lebih murah dibandingkan membeli lahan untuk membuka toko merupakan faktor utama pendorong pelaku bisnis untuk menerapkan e-commerce pada usahanya. Sedangkan manfaat dalam penggunaan e-commerce dalam suatu perusahaan yaitu : 58 1. Dapat meningkatkan pangsa pasar 2. Menurunkan biaya operasional 3. Melebarkan jangkauan pemasaran 4. Meningkatkan loyalitas konsumen 5. Memperpendek waktu produksi. Layaknya sistem perdagangan lainnya, e-commerce juga memiliki ancaman yang dapat membahayakan aset – asset berharga dari perusahaan jika celah – celah keamanannya disalahgunakan oleh pihak yang tidak bertanggungjawab. Berikut adalah beberapa ancaman yang mungkin terjadi dalam penerapan e-commerce : 1. Pelanggaran dan penyalahgunaan wewenang legal oleh pihak ilegal. 2. Menginjeksi sistem dengan sesuatu yang dianggap legal tetapi belum tentu legal di masa yang akan datang. 3. Pemantauan (monitoring) terhadap informasi – informasi penting dari transaksi e-commerce yang dilakukan oleh peretas. 4. Menjebak pelanggan ke dalam sebuah server palsu kemudian meminta pelanggan untuk memberikan informasi pribadi mereka tanpa mengetahui bahwa tindakan tersebut berbahaya. 5. Menghalangi seseorang dalam mengakses informasi, sumber, dan fasilitas lainnya. 59 6. Penolakan terhadap sebuah aktivitas transaksi atau sebuah komunikasi baik secara sengaja maupun tidak sengaja.