PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK.

(1)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA

PELAJARAN WEB DESIGN UNTUK SISWA SMK

SKRIPSI

Diajukan untuk Memenuhi Sebagian dari Syarat Untuk Memperoleh Gelar Sarjana Pendidikan Program Studi Pendidikan Ilmu Komputer

Oleh:

Aditya Meilaz Rahmanto 0806787

PROGRAM STUDI PENDIDIKAN ILMU KOMPUTER

FAKULTAS PENDIDIKAN MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS PENDIDIKAN INDONESIA 2015


(2)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA

PELAJARAN WEB DESIGN UNTUK SISWA SMK

Oleh

Aditya Meilaz Rahmanto

Sebuah skripsi yang diajukan untuk memenuhi salah satu syarat memperoleh gelar Sarjana pada Fakultas Pendidikan Matematika dan Imu Pengetahuan Alam

© Aditya Meilaz Rahmanto Universitas Pendidikan Indonesia

Mei 2015

Hak Cipta dilindungi undang-undang

Skripsi ini tidak boleh diperbanyak seluruhnya atau sebagian, dengan dicetak ulang, difoto kopi atau cara lainnya tanpa ijin dari penulis


(3)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

LEMBAR PENGESAHAN

ADITYA MEILAZ RAHMANTO

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA

PELAJARAN WEB DESIGN UNTUK SISWA SMK

Disetujui dan disahkan oleh pembimbing: Pembimbing I

Harsa Wara P., M.Pd NIP. 198008102009121003

Pembimbing II

Budi Laksono Putro, MT NIP. 197607102010121002

Mengetahui

Ketua Program Studi Pendidikan Ilmu Komputer

Enjang Ali Nurdin, Dr., M.Kom NIP. 196711211991011001


(4)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu i

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA

PELAJARAN WEB DESIGN UNTUK SISWA SMK ABSTRAK

Untuk merancang suatu halaman website, dibutuhkan sebuah aplikasi khusus salah satu aplikasinya adalah Adobe Dreamweaver. Kendala yang dihadapi di lingkungan Sekolah Menengah Kejururan Taliwang dalam proses belajar Desain Web adalah ketersediaan alat yang digunakan, yaitu Notepad++. Jika dibandingkan dengan Adobe Dreamweaver, Notepad++ masih memiliki batasan dari sisi fitur yang digunakan untuk mendesain web. Namun untuk dapat menggunakan Adobe Dreamweaver membutuhkan dana yang relatif mahal antara Rp 289.000 – Rp 2.316.000. Oleh karena itu, penelitian ini bertujuan membuat aplikasi sejenis Adobe Dreamweaver dengan menggunakan metode penelitian dan pengembangan (R&D) dan memperoleh kelayakan dalam lingkup penggunaannya. Langkah-langkah penelitian yang diterapkan menggunakan alur yang dimulai dari analisis, desain/perancangan, pengembangan, pengujian dan penilaian. Analisis awal mendapatkan data dari hasil wawancara dengan dosen pembimbing, para pengembang web dan guru yang mengajarkan tentang Desain Web. Angket validasi yang diberikan kepada ahli media dan ahli materi dan angket penilaian yang diberikan kepada 38 siswa SMK Puragabaya Bandung terhadap aplikasi HJCode dan angket perbandingan fitur Adobe Dreamweaver dan HJCode kepada 128 web developers. Dari hasil penilaian tersebut didapatkan bahwa aplikasi HJCode yang telah dikembangkan dinilai sangat baik dengan rata-rata persentase kelayakan 76.67% oleh ahli media dan 86.67% oleh ahli materi dan hasil dari angket penilaian dari siswa adalah 81.20% dan hasil perbandingan fitur oleh para pengembang didaptkan rata-rata 50.52% untuk Adobe Dreamweaver dan 59.15% untuk HJCode. Sehingga dari hasil yang didapatkan bahwa aplikasi yang diberikan dengan nama HJCode dapat digunakan sebagai alat bantu dalam merancang atau mendesain web dan menjadi alat bantu belajar di sekolah.

Kata Kunci: Text Editor, Web Design, Leraning Object Review Instrument


(5)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu ii

THE DEVELOPMENT OF WEB-BASED APPLICATION TEXT EDITOR (HJCODE) AS A MEDIUM OF LEARNING IN WEB DESIGN SUBJECTS

FOR VOCATIONAL STUDENTS (SMK) ABSTRACT

To design website page, it takes a special application, one of its applications is Adobe Dreamweaver. The complication faced by the Vacational student (SMK) Taliwang in the learning process web design, is the availability of tools used, such us Notepad++. When it compares to Adobe Dreamweaver, Notepad++ still has limitations in terms of features used for web designing. However, to be able to use Adobe Dreamweaver require relatively expensive funds approximately Rp. 289.000 - Rp. 2.316 million. Therefore, this study aims to create similar application like Adobe Dreamweaver using methods of research and development (R&D) and gain eligibility within the scope of its use. The measure applied in research using flow that starts from the analysis, design, development, testing and assessment. To obtain preliminary analysis of data from interviews with the supervisor, the web developers and teachers who teaches about Web design. The validation questionnaire given to media experts and expert content and assessment questionnaire given to 38 students of SMK Puragabaya Bandung against HJCode application and questionnaires comparison of the features Adobe Dreamweaver and HJCode to 128 web developers. From the results of the assessment showed that HJCode application that has been developed is considered very good with an average percentage of 76.67% viability by media experts and 86.67% by matter experts and the results of the questionnaire assessment of students is 81.20% and the comparison of features by the developers obtained average for Adobe Dreamweaver 50.52% and 59.15% for HJCode. So that, from the results obtained that the application is provided with the name HJCode can be used as a tool in designing or web design and become a learning tool in schools.

Keywords: Text Editor, Web Design, Learning Object Review Instrument (LORI), Media, Development, HJCode, Adobe Dreamweaver


(6)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu vi

DAFTAR ISI

ABSTRAK ... Error! Bookmark not defined. ABSTRACT ... Error! Bookmark not defined. KATA PENGANTAR ... Error! Bookmark not defined. UCAPAN TERIMAKASIH ... Error! Bookmark not defined. DAFTAR ISI ... vi DAFTAR TABEL ... ix DAFTAR GAMBAR ...x BAB I PENDAHULUAN ... Error! Bookmark not defined. 1.1 Latar Belakang Masalah... Error! Bookmark not defined. 1.2 Rumusan Masalah ... Error! Bookmark not defined. 1.3 Batasan Masalah ... Error! Bookmark not defined. 1.4 Tujuan Penelitian ... Error! Bookmark not defined. 1.5 Manfaat Penelitian ... Error! Bookmark not defined. 1.6 Definisi Operasional ... Error! Bookmark not defined. BAB II LANDASAN TEORI ... Error! Bookmark not defined. 2.1 Text Editor ... Error! Bookmark not defined. 2.2 Aplikasi Web ... Error! Bookmark not defined. 2.3 HyperText Markup Language (HTML) . Error! Bookmark not defined. 2.4 Cascading Style Sheets (CSS) ... Error! Bookmark not defined. 2.5 JavaScript ... Error! Bookmark not defined. 2.6 Media Pembelajaran ... Error! Bookmark not defined.


(7)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu vii

2.7 Computer Software (Aplikasi Komputer)Error! Bookmark not defined.

2.8 Software Development Process (Proses Pengembangan Aplikasi)Error! Bookmark not de BAB III METODE PENELITIAN ... Error! Bookmark not defined.

3.1 Metodologi Penelitian ... Error! Bookmark not defined. 3.2 Prosedur Penelitian ... Error! Bookmark not defined. 3.2.1 Tahap Analisis ... Error! Bookmark not defined. 3.2.2 Tahap Desain ... Error! Bookmark not defined. 3.2.3 Tahap Pengembangan ... Error! Bookmark not defined. 3.2.4 Tahap Pengujian ... Error! Bookmark not defined. 3.2.5 Tahap Penilaian ... Error! Bookmark not defined. 3.3 Populasi dan Sampel ... Error! Bookmark not defined. 3.4 Instrumen Penelitian ... Error! Bookmark not defined. 3.5 Teknis Analisis Data ... Error! Bookmark not defined. BAB IV HASIL PENELITIAN DAN PEMBAHASANError! Bookmark not

defined.

4.1 Tahap Analisis ... Error! Bookmark not defined. 4.1.1 Analisis Umum ... Error! Bookmark not defined. 4.1.2 Analisis Pengguna ... Error! Bookmark not defined. 4.1.3 Analisis Kebutuhan Perangkat LunakError! Bookmark not defined. 4.1.4 Analisis Kebutuhan Perangkat KerasError! Bookmark not defined. 4.2 Tahap Desain ... Error! Bookmark not defined.

4.2.1 Flowchart ... Error! Bookmark not defined. 4.2.2 Storyboard ... Error! Bookmark not defined. 4.2.3 Fitur ... Error! Bookmark not defined.


(8)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu viii

4.3 Tahap Pengembangan ... Error! Bookmark not defined. 4.3.1 Pembuatan Antarmuka ... Error! Bookmark not defined. 4.3.2 Coding atau Pengkodean ... Error! Bookmark not defined. 4.3.3 Alpha Testing ... Error! Bookmark not defined. 4.3.4 Pemaketan atau packaging ... Error! Bookmark not defined. 4.3.5 Uji Produk Pada Ahli... Error! Bookmark not defined. 4.4 Tahap Implementasi ... Error! Bookmark not defined. 4.4.1 Pemasangan Aplikasi HJCode ... Error! Bookmark not defined. 4.4.2 Uji pemakaian ... Error! Bookmark not defined.

4.4.3 Angket penilaian siswa terhadap HJCodeError! Bookmark not defined. 4.5 Tahap Penilaian ... Error! Bookmark not defined.

4.5.1 Penialaian Kelayakan Aplikasi HJCode oleh Para AhliError! Bookmark not define 4.5.2 Penilaian Para Pengembang Web atau Developers Terhadap

Aplikasi HJCode ... Error! Bookmark not defined.

4.5.3 Penilaian Siswa Terhadap Aplikasi HJCodeError! Bookmark not defined.

4.5.4 Kekurangan, Kelebihan, Kendala dan Rekomendasi AplikasiError! Bookmark not d BAB V KESIMPULAN DAN SARAN ... Error! Bookmark not defined.

5.1 Kesimpulan ... Error! Bookmark not defined. 5.2 Saran ... Error! Bookmark not defined. DAFTAR PUSTAKA ... Error! Bookmark not defined. LAMPIRAN


(9)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu ix

DAFTAR TABEL

Tabel 1.1 Perbandingan Aplikasi Code Editor (Esteve, 2010)Error! Bookmark not defined. Tabel 3.1 Simbol-Simbol flowchart ... Error! Bookmark not defined.

Tabel 3.2 Tabel Aspek Penilaian Ahli Media dan Ahli Materi (LORI)Error! Bookmark not defined Tabel 3.3 Tabel Aspek Penilaian Siswa ... Error! Bookmark not defined.

Tabel 3.4 Tabel Interpretasi Ratting Scale ... Error! Bookmark not defined. Tabel 4.1 Fitur HJCode ... Error! Bookmark not defined. Tabel 4.2 Hasil Alpha Testing ... Error! Bookmark not defined. Tabel 4.3 Hasil Penilaian Fitur Adobe Dreamweaver dan HJCode oleh Ahli

Materi ... Error! Bookmark not defined.

Tabel 4.4 Hasil Instrumen Penilaian Oleh Ahli Materi (LORI)Error! Bookmark not defined. Tabel 4.5 Hasil Penilaian Instrumen Oleh Ahli Media (LORI)Error! Bookmark not defined. Tabel 4.6 Hasil Penilaian Fitur Adobe Dreamweaver dan HJCode oleh Ahli

Media ... Error! Bookmark not defined. Tabel 4.7 Hasil Penilaian Fitur Adobe Dreamweaver dan HJCode Oleh

Developers Web ... Error! Bookmark not defined. Tabel 4.8 Hasil Angket Penilaian Siswa ... Error! Bookmark not defined.


(10)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu x

DAFTAR GAMBAR

Gambar 2.1 Web Application Model ... Error! Bookmark not defined.

Gambar 3.1 Tahapan-tahapan R&D Sugiyono (2012:409)Error! Bookmark not defined. Gambar 3.2 Skema Penelitian dan PengembanganError! Bookmark not defined.

Gambar 4.1 Antarmuka untuk pengguna yang pertama kali menggunakan aplikasi HJCode ... Error! Bookmark not defined. Gambar 4.2 Tampilan antarmuka Live Guide ... Error! Bookmark not defined. Gambar 4.3 Tampilan antarmuka editor HJCode Error! Bookmark not defined. Gambar 4.4 Tampilan antarmuka log panel HJCodeError! Bookmark not defined. Gambar 4.5 Tampilan antarmuka Separate Design ViewError! Bookmark not defined. Gambar 4.6 Tampilan antarmuka Save Dialog ... Error! Bookmark not defined.

Gambar 4.7 Tampilan antarmuka Export Dialog Error! Bookmark not defined. Gambar 4.8 Tampilan antarmuka Shortcut List .. Error! Bookmark not defined. Gambar 4.9 Tampilan antarmuka Evaluasi ... Error! Bookmark not defined. Gambar 4.10 Tampilan antarmuka penilaian EvaluasiError! Bookmark not defined.


(11)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

BAB I PENDAHULUAN

1.1 Latar Belakang Masalah

Semakin pesatnya perkembangan teknologi, kini website menjadi media pemasaran produk yang dibilang lebih menguntungkan karena efisiennya waktu dan luasnya cakupan daerah untuk pemasaran. Dengan begitu, kebutuhan akan web designer juga terus meningkat. Web design lebih menekankan fitur fungsional dari sebuah situs web. Seorang desainer web dapat bekerja kantoran ataupun memulai usaha sendiri. Kemampuan atau skill dan strategi pemasaran serta sikap mental positif menjadi hal penting yang harus ada pada seorang calon pengusaha. Pada dasarnya yang dilihat dari sebuah pilihan berkarir menjadi web designer bukan sekedar peluang, tetapi bagaimana peluang itu kita bentuk agar menjadi prospek kerja yang bagus untuk masa depan kita.

Dengan adanya teknologi web, kita dapat berkomunikasi dengan siapa saja dan di mana saja diseluruh dunia dengan menggunakan fasilitas e-mail maupun dengan cara chatting untuk berkomunikasi, bahkan kita dapat menjadikan web sebagai media dalam belajar dengan konten informasi yang sangat luas sehingga memudahkan kita dalam mencari informasi. Hal ini sesuai dengan pernyataan Marshall McLuhan (1980) dalam teorinya, ”Technological Determinism” yang menyatakan bahwa kemajuan teknologi menyebabkan adanya perubahan sosial dalam diri masyarakat yang salah satunya adalah kelahiran konsep “global village” yang menganggap dunia layaknya sebuah desa (Severin & Tankard, 2001: 458). Konsep ini muncul karena media elektonik dan internet mampu membuat setiap orang di mana pun dan kapan pun bisa saling berinteraksi dengan cepat, mudah dan tanpa banyak biaya seperti berinteraksi dengan orang didekatnya. Secara umum internet menjadi salah satu media untuk berinteraksi yang bisa melibatkan banyak orang, dipakai banyak orang, dimanfaatkan banyak orang dan menjadi kebutuhan utama life style masyarakat masa kini. Namun,


(12)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

bagaimana stuktur perjalanan semua data yang disampaikan melalui internet itu melalui sebuah tahapan awal pembuatan dasar melalui web.

Dalam perancangan atau pengembangan website dibutuhkan aplikasi tertentu untuk memudahkan seorang pengembang dalam mendesain sebuah situs web seperti Adobe Dreamweaver, Sublime Text dan Notepad++. Namun, dari ketiga aplikasi text editor yang populer digunakan tersebut hanya aplikasi Adobe Dreamweaver yang dirancang khusus untuk pengembangan atau perancangan halaman web. Tetapi pada kenyataannya banyak pengembang atau developer lebih memilih menggunakan Notepad++ atau Sublime karena bisa didapatkan secara gratis walaupun kedua aplikasi text editor ini tidak memiliki fitur-fitur yang disediakan seperti Adobe Dreamweaver untuk mendesain suatu halaman web.

Adanya perkembangan teknologi dibidang pendidikan menjadikan pendidikan lebih maju dan berkembang. Salah satunya pada mata pelajaran Web Design yang diajarkan di SMKN 1 Taliwang kelas X TKJ (Teknik Komputer Jaringan). Pada mata pelajaran ini siswa belajar untuk memahami konsep dasar bahasa Hyper Text Markup Language (HTML), Cascading Style Sheets (CSS) dan bahasa skrip seperti JavaScript kemudian mengaplikasikannya ke dalam suatu halaman website. Untuk mendesain sebuah web siswa di SMKN 1 Taliwang menggunakan 2 aplikasi yang terdapat pada komputer, diantaranya adalah text editor dan web browser. Text editor berfungsi sebagai media untuk mendesain sebuah web yang terdiri dari kode-kode HTML, CSS dan JavaScript. Sedangkan web browser berfungsi sebagai penerjemah dari kode-kode HTML, CSS dan JavaScript menjadi halaman website.


(13)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Tabel ‎0.1 Perbandingan Aplikasi Code Editor (Esteve, 2010)

Features Text Editor

Adobe Dreamweaver jEdit PSPad Notepad++ Sublime Text

Price £240 - £420 Free Free Free Free Trial (or £46)

Code View Yes Yes Yes Yes Yes

Design View Yes No No No No

Browser Preview Yes No Yes No No

Text Helpers Yes No Yes Yes Yes

Themes (code

highligting) Yes Yes Yes Yes Yes

Debugger Yes No No Plugin Yes

FTP Yes Yes No Plugin Plugin

Version Control Yes No No No Plugin

Plugins Yes Yes Yes Yes Yes

Open Source No No Yes Yes Yes

Portable No No Yes Yes Yes


(14)

4

Aplikasi text editor yang digunakan di SMKN 1 Taliwang sebagai alat bantu belajar dalam mendesain web adalah aplikasi Notepad++ yang terdapat pada komputer. Jika dilihat dari masing-masing keunggulan dari aplikasi text editor yang sering digunakan pada Tabel 1.1, Adobe Dreamweaver merupakan salah satu aplikasi yang mendukung dalam perancangan suatu halaman web dengan kelengkapan fitur yang mendukung dalam perancangan seperti yang dikatakan oleh (Rickyanto, 2002) bahwa ruang kerja, fasilitas dan kemampuan dreamweaver mampu meningkatkan produktivitas dan efektivitas dalam desain maupun dalam membangun sebuah situs web. Namun, untuk dapat menggunakan Adobe Dreamweaver sebagai alat bantu penunjang dalam belajar desain web di sekolah. Sekolah harus mengeluarkan biaya yang relatif mahal yaitu sekitar Rp 289.000 – Rp 2.316.000. Dengan harga yang mahal ini, tidak menutup kemungkinan bagi sekelompok orang atau perorangan yang ingin belajar desain web akan menggunakan aplikasi ilegal atau pembajakan perangkat lunak, dimana program komputer sebagai software merupakan bagian dari objek yang dilindungi oleh hak cipta. Hal ini dapat dilihat dari ketentuan Undang-Undang Nomor 19 Tahun 2002 sebagaimana diubah lagi dengan Undang-Undang Nomor 28 Tahun 2014 tentang Hak Cipta yang mengatur tentang perlindungan terhadap program komputer.

Berdasarkan latar belakang yang telah diuraikan tersebut, maka peneliti tertarik untuk mengembangkan aplikasi text editor sejenis Adobe Dreamweaver sebagai alat bantu belajar dan merancang halaman web dengan judul penelitian yang akan dilaksanakan adalah : “Pengembangan Aplikasi Text Editor Berbasis Web (HJCode) Sebagai Media Pembelajaran dalam Mata Pelajaran Web

Design Untuk Siswa SMK”.

Diharapkan dengan pengembangan text editor berbasis web yang akan dinamakan HJCode ini dapat membantu siswa dalam belajar Web Design sehingga tujuan pembelajaran dapat tersampaikan.


(15)

5

1.2 Rumusan Masalah

Berdasarkan latar belakang masalah yang telah dibahas, dapat dirumuskan permasalahan yang akan diteliti dengan pertanyaan berikut:

1. Bagaimana pengembangan aplikasi text editor berbasis web?

2. Bagaimana kelayakan aplikasi text editor berbasis web dalam mata pelajaran Web Design?

3. Bagaimana penilaian atau respon web developers atau pengembang web pada aplikasi text editor berbasis web?

4. Bagaimana penilaian atau respon siswa terhadap aplikasi text editor berbasis web pada mata pelajaran Web Design?

1.3 Batasan Masalah

Terdapat batasan masalah dalam penelitian yang akan dilaksanakan. Batasan masalah tersebut diantaranya adalah:

1. Penelitian hanya ditujukan untuk pengembangan suatu produk dan menguji produk tersebut kepada ahli media, ahli materi dan siswa.

2. Produk yang dikembangkan digunakan untuk uji coba client side scripting. 3. Produk yang dikembangkan tidak menguji compatibility setiap client side

atau browser yang berbeda.

4. Produk yang dikembangkan tidak menggunakan database server maupun server side scripting dengan tujuan portabilitas produk.

5. Hasil uji coba dirangkum kedalam ratting scale sehingga terlihat kelayakan dari produk yang dikembangkan.

1.4 Tujuan Penelitian

Tujuan penilitian ini adalah sebagai berikut:


(16)

6

2. Mendapatkan kajian mengenai kelayakan pembuatan aplikasi text editor berbasis web untuk mata pelajaran Web Design.

3. Mendapatkan penilaian atau respon web developers atau pengembang web terhadap aplikasi text editor berbasis web.

4. Mendapatkan penilaian atau respon siswa terhadap pembuatan aplikasi text editor berbasis web untuk mata pelajaran Web Design.

1.5 Manfaat Penelitian

Manfaat yang diharapkan dalam penelitian ini adalah: 1. Bagi Guru

Dengan adanya media seperti aplikasi text editor berbasis web ini guru dapat menggunakannya sebagai alat bantu dalam menyampaikan materi pada mata pelajaran Web Design dan memicu guru untuk membuat media pembelajaran untuk mata pelajaran lainnya.

2. Bagi Siswa

Peniliti mengharapkan siswa mendapat manfaat dari hasil belajar yaitu pemahaman siswa yang baik dalam belajar dan pengalaman dalam belajar Web Design berbantu aplikasi text editor berbasis web sehingga sewaktu berada di lapangan siswa percaya diri terhadap kemampuan yang dimilikinya.

3. Bagi Peneliti lainnya

Peneliti mengharapkan penelitian ini mampu menarik perhatian peneliti lainnya untuk melakukan pengembangan aplikasi atau media sebagai alat bantu dalam pembelajaran.

1.6 Definisi Operasional

Didalam penelitian ini ada beberapa istilah yang umum digunakan. Diantaranya adalah sebagai berikut:


(17)

7

Media yang membawa pesan-pesan atau informasi yang bertujuan instruksional atau mengandung maksud-maksud pengajaran.

b. Text Editor

Merupakan aplikasi yang tergolong ke dalam aplikasi pengolah kata yang memungkinkan pengguna dapat merubah isi dari suatu halaman dan menempatkan suatu gambar sebagai media dalam pembuatan suatu website.

c. Berbasis Web

Berbasis web atau Web based berjalan menggunakan basis teknologi web (internet) atau browser.

d. Web Design

Perancangan web (web design) adalah istilah umum yang digunakan untuk mencakup bagaimana isi web konten ditampilkan, (biasanya berupa hypertext atau hypermedia) yang dikirimkan ke pengguna akhir melalui World Wide Web (www), dengan menggunakan sebuah browser web atau perangkat lunak berbasis web.

e. HJCode

HJCode merupakan singkatan dari (HTML, JavaScript, CSS Code) yang merupakan aplikasi text editor berbasis web atau program compiler yang digunakan untuk mendesain suatu web


(18)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

BAB III

METODE PENELITIAN

3.1 Metodologi Penelitian

Berdasarkan latar belakang dan tujuan penelitian yang telah dibahas pada BAB I, metode penelitian yang digunakan pada penelitian ini adalah metode penelitian Research & Development (R&D). Sebagaimana yang dikatakan oleh Borg, W.R & Gall, M.D (Sukmadinata, 2012:57) bahwa “R&D merupakan metode untuk mengembangkan dan menguji suatu produk”, maka penelitian ini akan menghasilkan suatu produk. Dan untuk memperjelas hasil dalam pengembangan maka penelitian ini akan menggunakan pendekatan penelitian deskriptif kualitatif.

Menurut Sugiyono (2012:35) “metode penelitian deskriptif adalah metode penelitian yang dilakukan untuk mengetahui nilai variable mandiri atau lebih (independen) tanpa membuat perbandingan atau menggabungkan antara variable satu dengan yang lain.

Sebagaimana yang dikemukakan oleh Sugiyono (2011:407) bahwa “Penelitian research and development adalah metode penelitian yang digunakan untuk menghasilkan produk tertentu dan menguji keefektifan produk tersebut”. Sehingga pada penelitian ini R&D merupakan jenis metode penelitian yang cocok, karena sesuai dengan tujuan penelitian dan didukung oleh teori para ahli.

3.1 Prosedur Penelitian

Pada prosedur penelitian dan pengembangan terdapat beberapa tahapan yang harus dikerjakan dalam suatu penelitian berdasarkan teori dari beberapa ahli. Ada beberapa pendapat ahli tentang prosedur penelitian R&D. Menurut Sugiyono(2011:409), penelitian jenis R&D mempunyai beberapa tahapan, seperti yang digambarkan pada Gambar 3.1 berikut :


(19)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Gambar ‎0.1 Tahapan-tahapan R&D Sugiyono (2012:409)

Pengembangan suatu perangkat lunak tergantung dari tujuan, keperluan dan beberapa faktor lain yang berkaitan erat dengan pembuatan perangkat lunak. Del Diana (Munir, 100:2012) telah menyusun ciri-ciri utama tugas pengembangan perangkat lunak sebagai berikut:

“(i) menetapkan tujuan, (ii) analisis isi, (iii) mengelompokkan ciri-ciri pelajar, (iv) menetapkan strategi arahan, (v) pengembangan bahan pembelajaran, (vi) ujian dan penyempurnaan. Siklus hidup desain perangkat lunak meliputi: (a)analisis syarat dan menetapkan sistem yang akan dikembangkan, (b) desain sistem, (c) penerapan dan ujian unit-unit perangkat lunak, (d) ujian sistem), (e) operasi dan penyelenggaraan.”

Munir (2012:101) menyimpulkan pengembangan perangkat lunak untuk keperluan pembelajaran dikemukakan oleh para ahli dalam berbagai bidang ini seperti yang dinyatakan Bork (1984), Gery (1987), dan Hartemik (1998) yang pada umumnya meliputi: analisis, desain, pendidikan, desain perangkat lunak, desain bahan pembelajaran, pengembangan, penilaian, produksi, implementasi dan pemeliharaan/penggunaan. Berdasarkan tahapan yang diusung para ahli di atas, maka disimpulkan berikut ini merupakan tahapan dalam pengembangan


(20)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

aplikasi text editor berbasis web HJCode pada mata pelajaran Web Design digambarkan dalam bagan berikut:

Gambar ‎0.2 Skema Penelitian dan Pengembangan

3.2.1 Tahap Analisis

Fase pertama ketika akan melakukan studi penelitian dimulai dengan menganalisis permasalahan yang akan diteliti sesuai pernyataan Profesor Sugiyono (2011:298) bahwa penelitian dapat berangkat dari adanya potensi atau masalah. Dalam menganalisis kebutuhan saat pengembangan aplikasi text editor berbasis web ini sesuai yang dikemukakan Munir


(21)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

(2008:196) bahwa pada tahap ini ditetapkan tujuan pengembangan perangkat lunak, baik bagi pelajar maupun bagi lingkungan. Maka dilaksanakan studi literatur dan studi lapangan. Menurut Munir (2012:101) fase ini menetapkan keperluan pengembangan software dengan melibatkan tujuan pembelajaran, pelajar, pendidik dan lingkungan. Analisis ini dilakukan dengan kerjasama di antara pendidik dengan pengembangan perangkat lunak dalam meneliti kurikulum berasaskan tujuan yang ingin dicapai.

 Studi Literatur

Pada fase ini dilakukan pengumpulan data dengan cara mempelajari buku, makalah, majalah ilmiah dan Website internet untuk memperoleh informasi yang berhubungan dengan konsep-konsep pengembangan sistem.

 Studi Lapangan

Studi lapangan dilaksanakan untuk mengetahui tanggapan pengguna terhadap text editor yang sedang digunakan dan text editor yang akan dikembangkan, dengan menggunakan angket survey lapangan dan wawancara yang diberikan pada guru, sehingga diharapkan dapat mengetahui kebutuhan di lapangan.

3.2.2 Tahap Desain

Pada tahap desain dilakukan perancangan dalam bentuk alur gambar tiap bagian media yang masih berbentuk sketsa. Menurut Munir (2012:101) fase ini meliputi unsur unsur yang perlu dimuat dalam software yang akan dikembangkan berdasarkan suatu model pembelajaran ID (Instructional Design). Kemudian menurut Sugiyono (2011:301) menyatakan desain produk harus diwujudkan dalam gambar atau bagan


(22)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

sehingga dapat digunakan sebagai pegangan untuk menilai dan membuatnya.

Dalam desain untuk aplikasi yang akan dikembangkan dipenelitian ini meliputi tujuan untuk mempermudah seorang guru ataupun siswa dalam merancang suatu halaman website dengan user intarface yang mempermudah dalam penggunaannya, kegiatan ini dilakukan untuk penyesuaian desain dan konten dari aplikasi text editor yang akan dikembangkan. Kemudian setelah tahap tadi selesai dilakukan rancangan dalam bentuk flowchart atau bagan alur dari aplikasi text editor berbasis web, yang ditindaklanjuti dengan pembuatan storyboard atau skenario dari text editor dan rancangan antarmuka. Setelah itu dilakukan validasi dan penilaian terhadap storyboard oleh ahli materi dan media, aspek yang dinilai ialah kesesuaian desain dan konten dalam text editor tersebut. a. Flowchart

Menurut Widada (2005) “flowchart adalah penggambaran secara grafik dari langkah-langkah dan urutan prosedur dari suatu program”. Flowchart yang akan digunakan pada tahap desain adalah flowchart program. Adapun symbol-simbol yang digunakan terdapat pada table 3.1.

b. Storyboard

Ketika alur kerja atau flowchart sudah dirancang, maka rancangan tersebut bisa diubah kedalam storyboard. Storyboard sendiri adalah cerita atau alur dari program yang digambarkan.

c. Rancangan Antarmuka Pemakai

Antarmuka pemakai merupakan bentuk tampilan grafik yang berhubungan langsung dengan pengguna yang dapat menerima informasi dari pengguna dan memberikan informasi kepada pengguna


(23)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

untuk membantu mengarahkan alur penelusuran masalah sampai ditemukan solusi. Antarmuka pemakai dari aplikasi text editor berbasis web yang akan dikembangkan merujuk kepada storyboard yang telah dibuat.

Tabel ‎0.1 Simbol-Simbol flowchart

No. Nama Simbol Penjelasan

1. Input/Output Mempresentasikan Input data atau Output data yang diproses atau informasi.

2. Proses Mempresentasikan Operasi

3. Penghubung Keluar ke atau masuk dari bagian lain flowchart khususnya halaman yang sama

4. Anak Panah Alur kerja

5. Penjelasan Komentar tambahan

6. Keputusan Keputusan dalam program

7. Predifined Process Rincian Operasi ada di tempat lain

8. Preparation Pemberian harga awal

9. Terminal Awal dan akhir dari


(24)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

10. Dokumen I/O dalam format yang

dicetak

11. Pita Magnetik I/O yang menggunakan pita magnetic

12. Magnetik Disk I/O yang menggunakan

magnetic disk

13. Magnetik Drum I/O yang menggunakan

magnetic drum

14. On-line Storage I/O yang menggunakan penyimpanan akses langsung 15. Punched Tape I/O yang menggunakan pita

kertas berlubang

16. Manual Input Input yang dimasukkan

secara manual dari keyboard

17. Display Output yang ditampilkan

pada terminal

18. Manual Operation Operasi manual

19. Communication Link

Transmisi data melalui channel komunikasi, seperti telepon

Sugiyono (2011:302) menuturkan bahwa validasi desain merupakan proses kegiatan untuk menilai apakah rancangan produk dalam hal ini sistem kerja baru secara rasional akan lebih efektif dari yang lama atau


(25)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

tidak. Setelah dilakukan validasi oleh ahli maka dilakukan perbaikan sesuai dengan masukan dari ahli media dan ahli materi.

3.2.3 Tahap Pengembangan

Fase ini berasaskan model ID yang telah disediakan dengan tujuan merealisasikan sebuah prototip perangkat lunak pembelajaran (Munir, 2012:101). Tahap ini dilakukan pengembangan perangkat lunak berdasarkan skenario dan desain yang telah dibuat dan sebelumnya telah di setujui dan lulus uji oleh para ahli. Desain produk yang telah dibuat tidak bisa langsung diuji coba dulu, tetapi harus dibuat terlebih dulu, menghasilkan barang, dan barang tersebut yang diuji coba (Sugiyono, 2011:302).

Pada tahap pengembangan, desain yang telah disetujui oleh para ahli kemudian dikembangkan dalam bentuk produk. Pengembangan dilakukan berdasarkan hasil studi pendahuluan, rancangan antarmuka, rancangan pemrosesan data user. Setelah produk text editor selesai dikembangkan, tahapan selanjutnya ialah dengan melakukan uji kelayakan oleh para ahli apakah produk yang dihasilkan sesuai dengan desain awal, apakah produk yang dihasilkan sesuai dengan kebutuhan dan harapan para ahli. Apabila telah sesuai maka para ahli akan menyetujui dan produk layak untuk dapat di uji coba. Uji kelayakan terhadap produk terbagi menjadi 3 poin yaitu : a. Pengujian produk

Pengujian awal sebelum dilakukan uji coba ke lapangan sangat diperlukan agar kesalahan fatal baik dalam isi konten maupun produk dapat ditanggulangi sehingga menghasilkan produk yang berkualitas dan memenuhi kebutuhan di lapangan.


(26)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Tahap ini pengujian dilakukan terhadap kualitas produk baik konten maupun performa dari program tersebut. Dalam hal performa uji kelayakan dilakukan terhadap navigasi dari produk text editor apakah sudah mencukupi, kemudian sudah memadai sebagai alternatif penguasaan materi dan tidak terdapat kesalahan.

c. Revisi Produk

Selesai tahap uji kelayakan dan validasi oleh ahli, apabila terdapat kekurangan dan kesalahan dalam produk maka dilakukan revisi dan meninjau ulang produk yang bertujuan supaya produk memiliki kelayakan dan fungsionalitas yang baik sebagai alat bantu atau tools dalam perancangan halaman web.

3.2.4 Tahap Pengujian

Fase ini membuat pengujian unit-unit yang telah dikembangkan dalam proses pembelajaran dan juga prototip yang telah siap (Munir, 2012:101). Dalam fase ini dilaksanakan uji coba kepada responden yaitu guru dan siswa yang terkait. Disamping itu implementasi pengembangan perangkat lunak pembelajaran disesuaikan dengan model pembelajaran yang diterapkan (Munir, 2008:200). Hal itu dilakukan untuk meningkatkan kualitas text editor tersebut. Apakah sudah sesuai dengan kondisi di lapangan yang sebenarnya? Dan apakah text editor tersebut tepat guna atau tepat sasaran? Untuk mengetahui hal tersebut maka dilakukan tahap lanjutan dengan menggunakan angket penilaian yang diberikan kepada setiap siswa serta guru yang mengajar Web Design.

3.2.5 Tahap Penilaian

Fase ini mengetahui secara pasti kelebihan dan kelemahan perangkat lunak yang dikembangkan sehingga dapat membuat penyesuaian dan


(27)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

penggambaran perangkat lunak yang dikembangkan untuk pengembangan perangkat lunak yang lebih sempurna (Munir, 2012:101). Untuk memperoleh hasil tersebut dilakukan penilaian dengan menggunakan angket validasi dari LORI (Learning Object Review Instrument) v1.5 kepada ahli media dan guru, serta siswa dengan format angkat kemudahan dalam penggunaan dari aplikasi yang dikembangkan. Tujuan utamanya ialah untuk melihat apakah aplikasi text editor yang dikembangkan layak diimplementasikan di lapangan, kemudian melihat apakah siswa semakin termotivasi untuk belajar dan mudah untuk belajar dan mudah memahami materi Web Design dan mengetahui kelebihan dan kekurangan dari aplikasi text editor ini. Selain itu bahwa tahap penilaian merupakan tahap yang ingin mengetahui kesesuaian software tersebut dengan program pembelajaran (Munir, 2008:200).

3.3 Populasi dan Sampel

Populasi adalah wilayah generalisasi yang terdiri atas: obyek/subyek yang mempunyai kualitas dan karakteristik tertentu yang ditetapkan oleh peneliti untuk dipelajari dan kemudian ditarik kesimpulannya (Sugiyono, 2011:80).

Sampel adalah bagian dari jumlah dan karakteristik yang dimiliki oleh populasi tersebut. Bila populasi besar, dan penelitian tidak mungkin mempelajari semua yang ada pada populasi, misalnya karena keterbatasan dana, tenaga, dan waktu, maka peneliti dapat menggunakan sampel yang diambil dari populasi itu. Apa yang dipelajari dari sampel itu, kesimpulannya akan dapat diberlakukan untuk populasi (Sugiyono, 2013).

Gay dan Diehl (1992) berpendapat bahwa sampel haruslah sebesar-besarnya. Pendapat Gay dan Diehl (1992) ini mengasumsikan bahwa semakin banyak sampel yang diambil maka akan semakin representatif dan hasilnya dapat digenelisir. Namun ukuran sampel yang diterima akan sangat bergantung pada jenis penelitiannya.


(28)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

1. Jika penelitiannya bersifat deskriptif, maka sampel minimumnya adalah 10% dari populasi.

2. Jika penelitiannya korelasional, sampel minimumnya adalah 30 subjek. 3. Apabila penelitian kausal perbandingan, sampelnya sebanyak 30 subjek

per group.

4. Apabila penelitian eksperimental, sampel minimumnya adalah 15 subjek per group.

Frankel dan Wallen (1993:92) menyarankan besar sampel minimum untuk: 1. Penelitian Deskriptif sebanyak 100

2. Penenlitian korelasional sebanyak 50

3. Penelitian kausal-perbandingan sebanyak 30/group 4. Penenlitian eksperimental sebanyak 30/15 per group

Apabila subjek kurang dari 100, lebih baik diambil semua sehingga penelitiannya merupakan penelitian populasi. Tetapi jika jumlah subjeknya besar, dapat diambil antara 10-15% atau 20-25% atau lebih (Arikunto, 2002).

Berdasarkan pada pemaparan di atas, populasi dalam penelitian ini menggunakan pendekatan penelitian deskriptif kualitatif yang akan dilakukan pada forum-forum Web Developers seperti Komunitas JavaScript Indonesia dan Komunitas PHP Indonesia dan juga ke sekolah yang mengajarkan tentang Desain Web. Setiap subjek akan menguji coba aplikasi HJCode yang bisa diakses secara online maupun offline.

Penelitian yang dilakukan pada forum atau komunitas tersebut akan dilakukan kepada responden yang pernah menggunakan Adobe Dreamweaver untuk dapat menilai sisi fitur antara HJCode dan Adobe Dreamweaver. Sementara penelitian yang dilakukan di Sekolah Menengah Kejuruan Puragabaya merupakan


(29)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

penelitian populasi, dikarenakan kelas X terdiri dari 2 kelas yang jumlah keseluruhannya adalah 43 siswa.

3.4 Instrumen Penelitian

Instrumen adalah alat pada waktu penelitian menggunakan sesuatu metode (Arikunto, 2006:149). Dalam penelitian ini instrumen yang digunakan ada beberapa macam diantaranya intrumen untuk studi lapangan, instrumen untuk validasi para ahli, instrumen penilaian dari siswa terhadap aplikasi text editor berbasis web.

Instrumen penelitian merupakan alat ukur yang digunakan untuk mendapatkan informasi kuantitatif tentang variasi karakteristik variabel secara objektif (Hadjar, 1996).

Ada beberapa jenis instrumen yang dapat digunakan dalam sebuah penelitian, diantaranya adalah tes, kuesioner, wawancara, observasi, skala bertingkat, dan dokumentasi.

1. Instrumen Studi Lapangan

Dalam studi lapangan instrumen yang dilakukan tanya jawab, angket dan studi literatur. Tanya jawab dilakukan dengan guru di sekolah, dosen pendidikan ilmu komputer dan mahasiswa ilmu komputer dan pendidikan ilmu komputer di Universitas Pendidikan Indonesia (UPI) mengenai materi yang dibutuhkan dalam pengembangan aplikasi text editor berbasis web.

2. Penilaian dan Instrumen Rancangan Validasi Ahli

Instrumen validasi ahli merupakan instrumen yang digunakan pada tahapan validasi oleh para ahli terhadap aplikasi text editor yang dikembangkan. Ahli yang terlibat dalam pengembangan aplikasi text editor ini diantaranya adalah ahli materi, dan ahli media. Instrumen ini berbentuk angket penilaian yang dibagikan ke masing-masing penguji


(30)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

atau ahli, agar instrumen yang digunakan reliabel dan dapat dipertanggung jawabkan maka dilakukan riset literatur dengan standar baku LORI dan penilaian fitur antara Adobe Dreamweaver dan HJCode atau aplikasi yang akan dikembangkan.

Tahap penerapan instrumen ini dilakukan saat tahap desain aplikasi text editor dengan tujuan agar produk yang dikembangkan memiliki kualitas rancangan yang tinggi baik dalam segi konten maupun produk aplikasi text editor tersebut. Penilaian instrumen rancangan desain aplikasi text editor menggunakan jenis pengukuran ratting scale, sesuai dengan pernyataan yang dikemukakan oleh Sugiyono (2011:97) bahwa: “... Pada instrumen terdapat empat macam jenis pengukuran diantaranya, skala likert, skala guttman, sematic differensial, dan ratting scale. Dari ketiga skala pengukuran yang dikemukakan, data yang diperoleh semuanya adalah data kualitatif yang dikuantitatifkan. Tetapi dengan ratting scale data mentah yang diperoleh berupa angka kemudian ditafsirkan dalam pengertian kualitatif.”

Dalam mengukur kualitas konten yang dimuat dalam aplikasi text editor ini, maka dilakukan penilaian oleh ahli media, berikut ini merupakan beberapa aspek yang perlu diperhatikan dalam menilai media pembeljaran berdasarkan standar baku LORI yang dikembangkan Nesbit, Belfer, dan vargo tahun 2002 lalu adalah aturan yang sering digunakan untuk mengukur segala macam media yang digunakan dalam pembelajaran misalnya e-Learning dan media pembelajaran. Aspek-aspek yang diperhatikan dalam LORI diantaranya: content quality, learning goal alignment, feedback and adaption, motivation, presentation design, interaction usability, accessibility, reusability, dan standart compliance. Setiap aspek


(31)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

tersebut memiliki komponen-komponen penilaian mandiri, berikut penjelasannya:

a. Aspek Kualitas (Content quality) Kebenaran (varacity)

Ketepatan (accuracy)

Keseimbangan penyajian ide (Balanced presentation of ideas) Sesuai dengan detail tingkatan (Appropriate level of detail) b. Aspek pembelajaran (Learning goal alignment)

Kejelasan tujuan pembelajaran (alignment among learning goals)

Kegiatan (activity) Penilaian (assesments)

Karakteristik peserta didik (learner characteristics) c. Umpan balik dan adaptasi (feedback and adaptation)

 Umpan balik yang didapatkan dari masukan dan model yang berbeda-beda dari pembelajar

d. Motivasi (motivation)

 Kemampuan untuk memotivasi dan menarik populasi yang didentifikasikan peserta didik (ability to motivate and interest an identified population of learners)

e. Presentasi desain (presentation design)

 Desain visual dan suara untuk meningkatkan belajar dan proses mental yang secara efisien (design of visual and auditory information for enhanced learning and efficient mental processing) hal ini sama seperti aspek motivasi (motivation)


(32)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu f. Interaksi penggunaan (Interaction Usability)

Kemudahan navigasi (ease of navigation)

Prediktibilitas dari antarmuka pengguna (predictable of the user interface)

Kualitas fitur antarmuka bantuan (quality of the interface help features)

g. Aksesibilitas (accessibility)

 Desain control dan format presentasi untuk mengakomodasi peserta didik penyandang cacat dan mobile (design of controls and presentation formats to accomodate disabled and mobile learners)

h. Usabilitias (reusability)

 Kemampuan untuk digunakan dalam berbagai konteks belajar juga dengan pelajar dari latar belakang yang berbeda (ability to use in varying learning contexts and with learners from differing backgrounds)

i. Standar kepatuhan (standars compliance)

 Kepatuhan terhadap standar internasional dan spesifikasi

Setelah melihat aspek penilaian yang LORI kembangkan. Maka aspek penilaian validasi ahli dan ahli media yang digunakan pada penelitian ini yaitu seperti pada tabel berikut :

Tabel ‎0.2 Tabel Aspek Penilaian Ahli Media dan Ahli Materi (LORI)


(33)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

1 2 3 4 5

Aspek Kualitas Isi / Materi (Content Quality)

- Kebenaran (Veracity) - Ketepatan (Accuracy) - Keseimbangan penyajian

ide (Balanced presentation of ideas) - Sesuai dengan detail

tingkatan (Approptiate level of detail)

Aspek Pembelajaran (Learning goal alignment)

- Kejelasan tujuan pembelajaran (Alignment among learning goals) - Kegiatan (Activities) - Penilaian (Assessments) - Karakteristik peserta

didik (Learner characteristics)

Umpan balik dan adaptasi (Feedback and Adaptation)

- Umpan balik dan adaptasi (Feedback and adaotation): Umpan balik


(34)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu yang didapatkan dari

masukan dan model yang berbeda-beda dari pembelajar

Motivasi (Motivation)

- Motivasi (Motivation): Kemampuan untuk memotivasi dan menarik populasi yang diidentifikasikan peserta didik

Presentasi Desain (Presentation Design)

- Desain visual dan suara untuk meningkatkan pembelajaran dan mengefisiensikan proses mental

Interaksi Penggunaan (Interaction Usability)

- Kemudahan navigasi - Prediktibilitas dari

antarmuka pengguna - Kualitas fitur antarmuka

bantuan

Aksesibilitas (Accessibility) - Desain control dan


(35)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu format presentasi untuk

mengakomodasi peserta didik pentyandang cacat dan mobile

Usabilitas (Reusability)

- Kemampuan untuk digunakan dalam berbagai konteks belajar juga dengan pelajar dari latar belakang yang berbeda

Standar Kepatuhan (Standar compliance)

- Kepatuhan terhadap standar internasional dan spesifikasi

3. Instrumen Penilaian dari Siswa

Pada Instrumen untuk siswa bentuknya sama dengan instrumen untuk ahli yakni menggunakan ratting scale. Yang terpenting bagi penyusun instrumen dengan ratting scale adalah harus dapat mengartikan setiap angka yang diberikan pada alternatif jawaban pada setiap instrumen (Sugiyono, 2011:98). Berdasarkan hal tersebut maka siswa dapat memilih salah satu angka sebagai jawaban atas pertanyaan yang diajukan pada instrumen yaitu terdiri dari: skor 4 untuk menyatakan sangat baik, skor 3 untuk menyatakan baik, skor 2 menyatakan cukup baik dan skor 1 menyatakan kurang baik.


(36)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Hasil dari instrumen ini digunakan untuk menilai respon dari responden atau dalam hal ini siswa terhadap aplikasi text editor berbasis web yang dikembangkan. Dengan mengadopsi aspek penilaian bagi siswa oleh Prayoga (2011:36) yakni meliputi aspek perangkat lunak (usabilitas, reliabel, kompatibilitas), aspek pembelajaran (interaktivitas, dan motivasi) dan aspek komunikasi visual (visual dan layout) dengan uraian sebagai berikut:


(37)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Tabel ‎0.3 Tabel Aspek Penilaian Siswa

No. Kriteria

Penilaian

1 2 3 4

Aspek Perangkat Lunak

1. Aplikasi HJCode dapat digunakan dengan mudah

2. Aplikasi HJCoden nyaman untuk digunakan 3. Aplikasi HJCode tidak mudah macet

4. Selama digunakan tidak ada galat atau error pada program

5. Dapat digunakan dikomputer lain

6. Dapat diinstalasi/dijalankan dikomputer lain Aspek Pembelajaran

7. Respon aplikasi HJCode mudah dipahami

8. Aplikasi HJCode merespon segala yang diperintahkan pengguna

9. Memberikan semangat belajar 10. Menambah pengetahuan Aspek Komunikasi Visual

11. Tampilan aplikasi HJCode menarik

12. Perpaduan warna dari aplikasi HJCode sesuai

Layout


(38)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu menarik

14. Menu-menu diposisikan dengan tepat

Untuk menghitung hasil angket dengan menggunakan Likert Scale atau skala Likert. Pertama-tama tentukan terlebih dahulu skor ideal. Skor ideal adalah skor yang ditetapkan dengan asumsi bahwa setiap responden pada setiap pertanyaan memberikan jawaban dengan skor tertinggi.

Keterangan : P: angka persentase

Skor ideal: skor tertinggi tiap butir x jumlah responden x jumlah butir.

Data dari hasil angket kepada ahli ini akan dijadikan sebagai landasan kualitas dan kuantitas dari aplikasi text editor berbasis web yang diterapkan. Apabila terdapat kekurangan maka akan dilakukan perbaikan berdasarkan data tersebut.

3.5 Teknis Analisis Data

1. Analisis Data Instrumen Studi Lapangan

Analisis yang dilakukan terhadap data yang diperoleh dari survey pendahuluan baik dari lapangan maupun studi literatur dijadikan sebagai landasan yang memperkuat perlunya penelitian ini. Hasil data


(39)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

instrumen diolah sesuai dengan masing-masing bentuk instrumen tersebut.

2. Analisis Data Instrumen Rancangan oleh Ahli

Instrumen rancangan oleh ahli menggunakan pengukuran ratting scale sehingga hasil data yang diperoleh sudah merupakan angka dan menggunakan kesimpulan penilaian yang terdiri dari tiga pilihan yaitu layak digunakan. Kesimpulan penilaian tersebut sebenarnya sudah ditentukan kelayakan rancangan aplikasi yang akan dikembangkan. 3. Analisis Data Instrumen Validasi Ahli

Ratting scale digunakan dalam menganalisis hasil data instrumen validasi ahli. Selain itu ada pernyataan kesimpulan yang menyatakan layak atau tidak aplikasi text editor berbasis web yang dikembangkan. Pernyataan kesimpulan tersebut dibagi jadi 3 yakni layak digunakan, layak digunakan dengan perbaikan, dan tidak layak digunakan. Pernyataan tersebut cukup mewakili hasil validasi, namun agar pembuktian lebih kuat dan terukur maka dilakukan penghitungan dengan rumus ratting scale.

Ratting scale atau skala beringkat adalah suatu ukuran subjektif yang dibuat beskala (Arikunto, 2006:157). Ratting scale terdiri dari beberapa tingkat penilaian yaitu: skor 4 untuk menyatakan sangat baik. Skor 3 untuk menyatakan baik, skor 2 untuk menyatakan cukup baik, dan skor 1 unutk menyatakan kurang baik. Ratting scale tidak terbatas untuk pengukuran saja, tetapi untuk mengukur persepsi responden terhadap fenomena lainnya, seperti skala untuk mengukur status sosial ekonomi, kelembagaan, pengetahuan, kemampuan, proses kegiatan dan lain-lain (Sugiyono, 2006:98). Penghitungan ratting scale ditentukan dengan rumus (Sugiyono, 2009:99) sebagai berikut :


(40)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Keterangan : P: angka persentase

Skor ideal: skor tertinggi tiap butir x jumlah responden x jumlah butir

Selanjutnya tingkat validasi dalam penelitian ini digolongkan ke empat kategori dengan menggunakan skala sebagai berikut (Gonia, 2009:50):

Selanjutnya kategori tersebut bisa dilihat berdasarkan tabel interpretasi sebagai berikut (Gonia, 2009:50) :

Tabel ‎0.4 Tabel Interpretasi Ratting Scale Skor Persentase (%) Interpretasi 0 – 25 Tidak Baik

25 – 50 Kurang Baik

50 – 75 Baik


(41)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

Data penlitian yang bersifat kualitatif seperti komentar dan saran dijadikan dasar dalam merevisi aplikasi text editor berbasis web ini.

4. Analisis Data Instrumen Siswa

Analisis data instrumen siswa terhadap aplikasi text editor berbasis web ini memiliki tahapan yang sama dengan analisis data para ahli yakni dengan menggunakan ratting scale. Sugiyono (2011:98) menuturkan yang paling terpenting bagi penyusun instrumen dengan ratting scale adalah harus dapat mengartikan setiap angka yang diberikan pada alternatif jawaban pada setiap instrumen.

Mengenai tahapan yang dilakukan untuk menganalisis data dari angket yang diisi siswa cukup mengikuti tata cara validasi data dari ahli karena validasi data siswa memiliki cara yang sama yakni menggunakan ratting scale.


(42)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

BAB V

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Berdasarkan tahap-tahap penelitian dan pengembangan yang telah dilalui, dapat ditarik beberapa kesimpulan sebagai berikut:

1. Aplikasi text editor HJCode ini menggunakan model pengembangan dari Munir (2010) yang memiliki tahapan diantaranya.

a. Analisis Umum b. Analisis Pengguna

c. Analisis Kebutuhan Perangkat Lunak, dan d. Analisis Kebutuhan Perangkat Keras

Tahap desain meliputi diagram alir atau flow chart, storyboard, dan rancangan antarmuka. Tahap pengembangan meliputi pembuatan antarmuka, coding atau pengkodean, alpha testing, pemaketan atau packaging, validasi ahli dan revisi aplikasi. Tahap implementasi meliputi pemasangan aplikasi, uji produk kepada para developers dan siswa, dan angket penilaian siswa. Penilaian meliputi penilaian aplikasi HJCode oleh para ahli, penilaian para developers, penilaian siswa dan kekurangan, kelebihan, kendala dan rekomendasi aplikasi HJCode.

2. Ditinjau dari aspek-aspek yang digunakan Learning Object Review Instrument (LORI) oleh ahli, maka aplikasi HJCode dapat dikategorikan sangat baik, baik oleh ahli materi maupun oleh ahli media.

3. Penilaian fitur antara Adobe Dreamweaver dan HJCode yang dilakukan kepada para pengembang website yang telah dilakukan ternyata mendapat respon yang sangat baik dari hasil yang telah didapat yaitu Adobe Dreamweaver sebesar 50.52% dan HJCode mendapat 59.15%.


(43)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu

4. Hampir dari seluruh siswa memberikan respon yang positif terhadap aplikasi HJCode, diantaranya aspek perangkat lunak (usabilitas, reliabel dan kompatibilitas) 81.91%, aspek pembelajaran (interaktivitas dan motivasi) 82.40%, aspek komunikasi visual 79.61% dan layout 78.29%.

5.2 Saran

Dari penelitian dan pengemnbangan aplikasi HJCode yang telah dilaksanakan, ada beberapa rekomendasi atau saran yang ingin peneliti sampaikan, diantaranya sebagai berikut:

1. Untuk mendapatkan hasil yang ideal dan optimal memerlukan peran serta dan keterlibatan pengguna yang cukup aktif dalam menyampaikan tanggapan (feedback) yang dapat memberikan energi positif sehingga terjadinya perbaikan sistem kearah yang lebih baik. Namun hal ini memerlukan waktu yang cukup lama karena diperlukan iterasi yang terus menerus pada tahapan perancangan.

2. Pada dasarnya seorang pengembang memiliki ego yang kadang tidak sesuai dengan permintaan pengguna sehingga pemilihan pengguna sekaligus responden perlu dikaji atau dilakukan pengamatan lebih dalam 3. Penulis menyadari bahwa konten pembelajaran didalam aplikasi yang

penulis buat masih kurang sehingga perlu ditambahkan konten kreatif yang dapat mendorong minat para pengguna untuk belajar.


(44)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu 78

DAFTAR PUSTAKA

Arikunto, Suharsimi. (2002). Prosedur Penelitian Suatu Pendekatan Praktik. Jakarta: Rineka Cipta

_______ (2006). Prosedur Penelitian Suatu Pendekatan Praktik. Jakarta: Rineka Cipta

Crockford, Douglas. Tanpa Tahun. JavaScript: The World's Most Misunderstood Programming Language. Tersedia

http://javascript.crockford.com/javascript.html [23 Juli 2014] Direktorat Jenderal Hak Kekayaan Intelektual Kementerian Hukum dan Hak

Asasi Manusia Republik Indonesia. Tanpa Tahun. Referensi Hukum Hak Cipta. Tersedia https://www.dgip.go.id/hak-cipta/referensi-hukum-cipta [10 Januari 2015]

Eisenberg, Daniel. (1992). Word Processing (History Of). Published in:

Encyclopedia of Library and Information Science, vol. 49 (New York: Dekker)

Esteve, Xavi. (2010). Code editors comparison: Dreamweaver vs jEdit vs PSPad vs Notepad++ vs Sublime. Tersedia http://xaviesteve.com/1143/code-editors-comparison-dreamweaver-vs-jedit-vs-pspad-vs-notepad/ [20 Juni 2013]

Fraenkel, J. & Wallen, N. (1993). How to Design and evaluate research in education. (2nd ed). New York: McGraw-Hill Inc

Gagne, R. M. (1975). Esseentials of Learning for Instruction. New York: Holt, Rinehart and Winston

_______ (1985). The Conditions of Learning and Theory of Instruction. (Fourth Edition). New York: Holt, Rinehart and Winston


(45)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu 79

Gagne, R. M., Briggs, L. J. and Wager, W. W. (1992). Principles of Instructional Design. New York: Holt, Rinehart and Winston

Gay, L.R. dan Diehl, P.L. (1992), Research Methods for Business and. Management, MacMillan Publishing Company, New York

Gerlach dan Ely (1971). Teaching & Media: A Systematic Approach. Second Edition, by V.S. Gerlach & D.P. Ely, 1980, Boston, MA: Allyn and Bacon. Copyright 1980 by Pearson Education

Gonia, M. Firdaus. (2009). Pengembangan Multimedia Interaktif untuk Assesmen pada Pembelajaran Pembiasan Cahaya. Skripsi Prodi Pendidikan Ilmu Komputer FPMIPA UPI Bandung: Tidak Diterbitkan

Hadjar, I. (1996). Dasar-dasar Metodologi Penelitian Kuantitatif dalam Pendidikan. Jakarta: Raja Grafindo Persada

Hamalik, O. (1986). Media Pendidikan. Bandung: PT Citra Aditya Bakti Hartono, Jogiyanto, (1999). Analisis dan Design Sistem Informasi: Pendekatan

Terstruktur Teori dan Praktek Aplikasi Bisnis. Yogyakarta: Andi Heinich, R., Molenda. And Russels, J. D. (1982). Instructional Media. Amerika:

Miriam Seda

Levie, W. H. and Lentz, R.. (1982). Effects of text illustrations: a review of research. Educational Communication and Technology Journal, 30: 195-232

Kadir, Abdul. (2013). From Zero to A Pro HTML5. Yogyakarta: Andi L.R Gray. (1987). Education Research Competencies for Analysis and

Application.

Munir. (2008). Kurikulum Berbasis Teknologi Informasi dan Komunikasi. Bandung: Alfabeta

_______ (2012). MULTIMEDIA Konsep dan Aplikasi dalam Pendidikan. Bandung: Alfabeta


(46)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu 80

Ollie. (2008), Panduan Praktis Mendesain Template Joomla!. Jakarta: Mediakita Prayoga, Yoga Rizki. (2011). Pengembangan Multimedia Pembelajaran Ular

Tangga pada Materi Bangun Ruanf di Sekolah Dasar. Skripsi Program Studi Pendidikan Ilmu Komputer FPMIPA UPI: Tidak Diterbitkan Pressman, Roger S. (2001). Software Engineering : A Practitioner Approach.

McGraw-Hill Companies

Remick, Jarel. (2011). What Is a Web App? Here’s Our Defenition. Tersedia http://web.appstorm.net/general/opinion/what-is-a-web-app-heres-our-definition/ [15 Mei 2013]

Rickyanto, Isak. (2002). Desain Web dengan Dreamweaver MX. Jakarta : Elex Media Komputindo.

Rouse, Margaret. (2005). JavaScript. Tersedia

http://searchsoa.techtarget.com/definition/JavaScript [15 Mei 2013] _______ (2005). Definition Text Editor. Tersedia

http://whatis.techtarget.com/definition/text-editor [15 Mei 2013] _______ (2011). Web Application (Web App). Tersedia

http://searchsoftwarequality.techtarget.com/definition/Web-application-Web-app [15 Mei 2013]

Sampurna. (1996). Belajar Sendiri Membuat Home Page dengan HTML. Elex Media Komputindo, Jakarta.

Severin, Werner J dan James W. Tankard. (2005). Teori Komunikasi. Kencana. Jakarta.

Sufrin, Bernard. (1982). Formal Specifiaction of Display-Oriented Text Editor. North-Holland Publishing Company

Sugiyono. (2009). Memahami Penelitian Kualitatif. Bandung: Alfabeta. _______ (2011). Metode Penelitian Kuantitatif, kualitatif dan R&D. Bandung:


(47)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN UNTUK SISWA SMK

Universitas Pendidikan Indonesia | repository.upi.edu | perpustakaan.upi.edu 81

_______ (2012). Metode Penelitian Kuantitatif Kualitatif dan R&D. Bandung: Alfabeta

Sukmadinata, Nana Syaodih. (2012). Metode Penelitian Pendidikan. Bandung: PT Remaja Rosdakarya

Sulistyawan., Rubianto., Rahmad Saleh. (2008). Modifikasi Blog Multiply dengan CSS. Jakarta: Elex Media Komputindo

Suryana, Taryana dan Koeheryati. (2014). Aplikasi Internet Menggunakan HTML, CSS & JavaScript. Jakarta: PT Elex Media Komputindo

Universitas Pendidikan Indonesia. (2012). Pedoman Penulisan Karya Ilmiah. Bandung: Universitas Pendidikan Indonesia


(1)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) BAB V

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Berdasarkan tahap-tahap penelitian dan pengembangan yang telah dilalui, dapat ditarik beberapa kesimpulan sebagai berikut:

1. Aplikasi text editor HJCode ini menggunakan model pengembangan dari Munir (2010) yang memiliki tahapan diantaranya.

a. Analisis Umum b. Analisis Pengguna

c. Analisis Kebutuhan Perangkat Lunak, dan d. Analisis Kebutuhan Perangkat Keras

Tahap desain meliputi diagram alir atau flow chart, storyboard, dan rancangan antarmuka. Tahap pengembangan meliputi pembuatan antarmuka, coding atau pengkodean, alpha testing, pemaketan atau

packaging, validasi ahli dan revisi aplikasi. Tahap implementasi meliputi

pemasangan aplikasi, uji produk kepada para developers dan siswa, dan angket penilaian siswa. Penilaian meliputi penilaian aplikasi HJCode oleh para ahli, penilaian para developers, penilaian siswa dan kekurangan, kelebihan, kendala dan rekomendasi aplikasi HJCode.

2. Ditinjau dari aspek-aspek yang digunakan Learning Object Review Instrument (LORI) oleh ahli, maka aplikasi HJCode dapat dikategorikan sangat baik, baik oleh ahli materi maupun oleh ahli media.

3. Penilaian fitur antara Adobe Dreamweaver dan HJCode yang dilakukan kepada para pengembang website yang telah dilakukan ternyata mendapat respon yang sangat baik dari hasil yang telah didapat yaitu Adobe Dreamweaver sebesar 50.52% dan HJCode mendapat 59.15%.


(2)

4. Hampir dari seluruh siswa memberikan respon yang positif terhadap aplikasi HJCode, diantaranya aspek perangkat lunak (usabilitas, reliabel dan kompatibilitas) 81.91%, aspek pembelajaran (interaktivitas dan motivasi) 82.40%, aspek komunikasi visual 79.61% dan layout 78.29%.

5.2 Saran

Dari penelitian dan pengemnbangan aplikasi HJCode yang telah dilaksanakan, ada beberapa rekomendasi atau saran yang ingin peneliti sampaikan, diantaranya sebagai berikut:

1. Untuk mendapatkan hasil yang ideal dan optimal memerlukan peran serta dan keterlibatan pengguna yang cukup aktif dalam menyampaikan tanggapan (feedback) yang dapat memberikan energi positif sehingga terjadinya perbaikan sistem kearah yang lebih baik. Namun hal ini memerlukan waktu yang cukup lama karena diperlukan iterasi yang terus menerus pada tahapan perancangan.

2. Pada dasarnya seorang pengembang memiliki ego yang kadang tidak sesuai dengan permintaan pengguna sehingga pemilihan pengguna sekaligus responden perlu dikaji atau dilakukan pengamatan lebih dalam 3. Penulis menyadari bahwa konten pembelajaran didalam aplikasi yang

penulis buat masih kurang sehingga perlu ditambahkan konten kreatif yang dapat mendorong minat para pengguna untuk belajar.


(3)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN

DAFTAR PUSTAKA

Arikunto, Suharsimi. (2002). Prosedur Penelitian Suatu Pendekatan Praktik. Jakarta: Rineka Cipta

_______ (2006). Prosedur Penelitian Suatu Pendekatan Praktik. Jakarta: Rineka Cipta

Crockford, Douglas. Tanpa Tahun. JavaScript: The World's Most Misunderstood

Programming Language. Tersedia

http://javascript.crockford.com/javascript.html [23 Juli 2014] Direktorat Jenderal Hak Kekayaan Intelektual Kementerian Hukum dan Hak

Asasi Manusia Republik Indonesia. Tanpa Tahun. Referensi Hukum Hak

Cipta. Tersedia https://www.dgip.go.id/hak-cipta/referensi-hukum-cipta

[10 Januari 2015]

Eisenberg, Daniel. (1992). Word Processing (History Of). Published in:

Encyclopedia of Library and Information Science, vol. 49 (New York: Dekker)

Esteve, Xavi. (2010). Code editors comparison: Dreamweaver vs jEdit vs PSPad

vs Notepad++ vs Sublime. Tersedia

http://xaviesteve.com/1143/code-editors-comparison-dreamweaver-vs-jedit-vs-pspad-vs-notepad/ [20 Juni 2013]

Fraenkel, J. & Wallen, N. (1993). How to Design and evaluate research in

education. (2nd ed). New York: McGraw-Hill Inc

Gagne, R. M. (1975). Esseentials of Learning for Instruction. New York: Holt, Rinehart and Winston

_______ (1985). The Conditions of Learning and Theory of Instruction. (Fourth Edition). New York: Holt, Rinehart and Winston


(4)

Gagne, R. M., Briggs, L. J. and Wager, W. W. (1992). Principles of Instructional

Design. New York: Holt, Rinehart and Winston

Gay, L.R. dan Diehl, P.L. (1992), Research Methods for Business and.

Management, MacMillan Publishing Company, New York

Gerlach dan Ely (1971). Teaching & Media: A Systematic Approach. Second Edition, by V.S. Gerlach & D.P. Ely, 1980, Boston, MA: Allyn and Bacon. Copyright 1980 by Pearson Education

Gonia, M. Firdaus. (2009). Pengembangan Multimedia Interaktif untuk Assesmen

pada Pembelajaran Pembiasan Cahaya. Skripsi Prodi Pendidikan Ilmu

Komputer FPMIPA UPI Bandung: Tidak Diterbitkan

Hadjar, I. (1996). Dasar-dasar Metodologi Penelitian Kuantitatif dalam

Pendidikan. Jakarta: Raja Grafindo Persada

Hamalik, O. (1986). Media Pendidikan. Bandung: PT Citra Aditya Bakti Hartono, Jogiyanto, (1999). Analisis dan Design Sistem Informasi: Pendekatan

Terstruktur Teori dan Praktek Aplikasi Bisnis. Yogyakarta: Andi

Heinich, R., Molenda. And Russels, J. D. (1982). Instructional Media. Amerika: Miriam Seda

Levie, W. H. and Lentz, R.. (1982). Effects of text illustrations: a review of research. Educational Communication and Technology Journal, 30: 195-232

Kadir, Abdul. (2013). From Zero to A Pro HTML5. Yogyakarta: Andi L.R Gray. (1987). Education Research Competencies for Analysis and

Application.

Munir. (2008). Kurikulum Berbasis Teknologi Informasi dan Komunikasi. Bandung: Alfabeta


(5)

Aditya Meilaz Rahmanto, 2015

PENGEMBANGAN APLIKASI TEXT EDITOR BERBASIS WEB (HJCODE) SEBAGAI MEDIA PEMBELAJARAN DALAM MATA PELAJARAN WEB DESIGN

Ollie. (2008), Panduan Praktis Mendesain Template Joomla!. Jakarta: Mediakita Prayoga, Yoga Rizki. (2011). Pengembangan Multimedia Pembelajaran Ular

Tangga pada Materi Bangun Ruanf di Sekolah Dasar. Skripsi Program

Studi Pendidikan Ilmu Komputer FPMIPA UPI: Tidak Diterbitkan Pressman, Roger S. (2001). Software Engineering : A Practitioner Approach.

McGraw-Hill Companies

Remick, Jarel. (2011). What Is a Web App? Here’s Our Defenition. Tersedia http://web.appstorm.net/general/opinion/what-is-a-web-app-heres-our-definition/ [15 Mei 2013]

Rickyanto, Isak. (2002). Desain Web dengan Dreamweaver MX. Jakarta : Elex Media Komputindo.

Rouse, Margaret. (2005). JavaScript. Tersedia

http://searchsoa.techtarget.com/definition/JavaScript [15 Mei 2013] _______ (2005). Definition Text Editor. Tersedia

http://whatis.techtarget.com/definition/text-editor [15 Mei 2013] _______ (2011). Web Application (Web App). Tersedia

http://searchsoftwarequality.techtarget.com/definition/Web-application-Web-app [15 Mei 2013]

Sampurna. (1996). Belajar Sendiri Membuat Home Page dengan HTML. Elex Media Komputindo, Jakarta.

Severin, Werner J dan James W. Tankard. (2005). Teori Komunikasi. Kencana. Jakarta.

Sufrin, Bernard. (1982). Formal Specifiaction of Display-Oriented Text Editor. North-Holland Publishing Company

Sugiyono. (2009). Memahami Penelitian Kualitatif. Bandung: Alfabeta. _______ (2011). Metode Penelitian Kuantitatif, kualitatif dan R&D. Bandung:


(6)

_______ (2012). Metode Penelitian Kuantitatif Kualitatif dan R&D. Bandung: Alfabeta

Sukmadinata, Nana Syaodih. (2012). Metode Penelitian Pendidikan. Bandung: PT Remaja Rosdakarya

Sulistyawan., Rubianto., Rahmad Saleh. (2008). Modifikasi Blog Multiply dengan

CSS. Jakarta: Elex Media Komputindo

Suryana, Taryana dan Koeheryati. (2014). Aplikasi Internet Menggunakan HTML,

CSS & JavaScript. Jakarta: PT Elex Media Komputindo

Universitas Pendidikan Indonesia. (2012). Pedoman Penulisan Karya Ilmiah. Bandung: Universitas Pendidikan Indonesia