Perbaikan Antarmuka dan Pengembangan Fitur Baru Situs Web Indonesian Future Leaders Chapter Malang menggunakan Framework Affordance-Based Design
Vol. 2, No. 2, Februari 2018, hlm. 759-767 http://j-ptiik.ub.ac.id
Perbaikan Antarmuka dan Pengembangan Fitur Baru Situs Web
Indonesian Future Leaders Chapter Malang menggunakan Framework
Affordance-Based Design
1
2
3 Nissa Madaniyah Fadhilah , Retno Indah Rokhmawati , Hanifah Muslimah Az-Zahra
Program Studi Sistem Informasi, Fakultas Ilmu Komputer, Universitas Brawijaya
1
2
3 Email: nissamadaniyah@gmail.com, retnoindahr@ub.ac.id, hanifah.azzahra@ub.ac.id
Abstrak
IFL Malang merupakan organisasi yang bergerak di bidang pendidikan, sosial dan mewadahi komunitas
untuk bersinergi bersama memberikan perubahan positif bagi Kota Malang yang mempunyai situs web
yang berdomain blogger. Situs web tersebut berfungsi untuk mewadahi penuangan informasi program-
program dan memfasilitasi pembaca agar mengetauhi IFL Malang lebih dalam. Kedepannya, pihak IFL
Malang berniat akan membuat antarmuka baru dengan alasan masih terdapat kekurangan pada tampilan
situs web IFL Malang seperti banyaknya penumpukan informasi, tata letak yang kurang rapih,
visualisasi berupa gambar masih minim dan kurang jelasnya navigasi di halaman-halaman situs web
serta terbatasnya fasilitas blogger untuk penambahan menu donasi. Metode affordance-based design
menawarkan desain dengan landasan teoritis yang melihat komponen desain secara menyeluruh serta
mempertimbangkan fungsi dan pengguna dengan baik bersama-sama, tidak hanya memperlihatkan
affordances yang diinginkan tetapi juga yang tidak diinginkan. Pada akhirnya, perbaikan desain dengan
metode ini menghasilkan desain baru yang tidak hanya melihat dari sisi positif nya tetapi juga sisi negatif
dan sangat mencerminkan pengguna serta mempunyai pengaruh yang baik pada pengujian usability
yaitu aspek efektivitas dengan menghasilkan presentase efektivitas 98,14% dari nilai maksimal 100%,
tidak ada waktu pengerjaan yang signifikan sehingga bisa dinilai baik pada aspek efisiensi dan bernilai
sangat baik pada item kepuasan pengguna.Kata Kunci: affordances,Affordance-Based Design, antarmuka pengguna, usability
Abstract
IFL Malang is an organization which moves on the field social education and accomodate the
community in Malang to synergize together to positive change for Malang who has a website with
bogger domain.The main purpose of the website is to facilitate readers to get to know more about IFL
Malang. IFL Malang was intended to develop an new interface due to several reasons. The first reason
is there are still shortcomings in user interface of the website, such as huge amount of information
accumulation, less tidy layout, visualization of the image still minimalist and lack of a clear navigation
on the website. The second reason is the limited blogger facility for the addition of Donation menu that
will be developed in the future. Affordance-based design can offer designs with a theoretical foundation
that sees the design components thoroughly and considers functions and users well together and shows
not only shows the desired affordances but also unwanted affordances. The results of design
improvements with the Affordance-based design method resulted in a new design that not only looked
at the positive side but also the negative side of an affordance and strongly reflects the user. Affordances
has a good influence on usability testing that is the aspect of effectiveness by generating a percentage
of effectiveness 98.14% of the maximum value 100 %, There is no significant processing time so that it
can be judged both on the aspect of efficiency and excellent value on all items of user satisfaction.Keywords: affordances,Affordance-Based Design, user interface, usability (IFL Malang) adalah Non Government 1.
PENDAHULUAN Organization yang merupakan organisasi yang bergerak di bidang pendidikan sosial dan
Indonesian Future Leaders chapter Malang Fakultas Ilmu Komputer Universitas Brawijaya
759 mewadahi komunitas di Kota Malang. IFL Malang mempunyai situs web berdomain blogger yang membeli domain .org. yang berfungsi untuk mewadahi penuangan informasi program IFL Malang dan memfasilitasi pembaca agar mengetauhi IFL Malang lebih dalam.
Pihak Indonesian Future Leaders chapter Malang berniat akan membangun antarmuka baru dengan alasan pertama yaitu masih terdapat kekurangan pada tampilan situs web IFL Malang seperti banyaknya penumpukan informasi, tata letak yang masih kurang rapih, visualisasi berupa gambar masih minim dan kurang jelasnya navigasi di halaman-halaman situs web. Tampilan yang diprioritaskan untuk diperbaiki adalah menu
Home, What’s New, dan About IFL Chapter Malang . Alasan kedua adalah terbatasnya fasilitas blogger untuk penambahan menu Donasi yang akan dikembangkan oleh situs web IFL Malang kedepannya.. Saat ini, donasi menjadi sumber pendanaan yang penting dan merupakan salah satu fokus bagi Non Profit Organization(Jaklevic, 2000). Nantinya, pada menu donasi terdapat sub-menu yang berisi nama-nama program yang dijalankan oleh IFL Malang. Jika pengunjung masuk ke dalam sub- menu nama program tersebut, akan ditampilkan penjelasan program yang sedang dijalankan.
Penjelasan tersebut berupa deskripsi singkat, jenis donasi, video pendukung, dan dokumentasi program yang telah dijalankan sebelumnya. Jika pengunjung tertarik untuk berdonasi, maka akan ada tombol yang mengarahkan kepada formulir pendaftaran donatur yang berisi data diri serta jenis donasi yang dipilih sehingga IFL Malang membutuhkan rancangan desain antarmuka yang baik dan dapat menarik serta mencerminkan IFL Malang itu sendiri sebagai non profit organization yang bergerak di bidang sosial, pendidikan dan kepemudaan. Untuk mendapatkan antarmuka yang sesuai dengan IFL Malang maka penulis menggunakan framework affordace-based design .
Maier dan Fadel(2009) menyarankan framework Affordace-Based Design , yang membantu desainer untuk secara bersamaan menganalisis kebutuhan pengguna, mempertimbangkan kebutuhan affordaces dan identifikasi affordaces dari komponen artefak secara bersamaan selama proses desain. Alasan lain penulis menggunakan framework ini karna masalah yang ada berhubungan dengan karakteristik Affordace-Based Design. Menurut wawancara yang dilakukan, pengujian usability perlu dilakukan pada aspek efisiensi, efektivitas dan kepuasan pengguna.
2. METODE PENELITIAN Metode penelitian dilakukan dengan beberapa tahapan diantaranya studi literatur dari penelitian sebelumnya dan berbagai refrensi. Setelah itu penulis akan mendefinisikan dan memahami affordaces pada objek penelitian yang terdiri dari menentukan kelompok pengguna, wawancara, menentukan affordaces positif dan negatif, memprioritaskan struktur affordaces dan menggambar struktur affordaces.
Setelah itu untuk perbaikan desain penulis melakukan proses identifikasi faktor affordaces yang dilakukan menggunakan Affordace Sistem Matric (ASM). Pada tahap ini, unsur affordances pada setiap komponen situs web diidentifikasi sehingga komponen-komponen yang memiliki selisih affordances paling sedikit dapat diperbaiki. Hasil analisa dari ASM selanjutnya dibuatkan strategi agar faktor affordances yang positif maupun negatif dapat diberikan strategi. Untuk pembuatan desain baru untuk fitur donasi, strategi dibuat langsung dari hasil affordances positif dan negatif yang didapatkan dari tahap wawancara. Dari strategi tersebut, dibuatkanlah prototype antarmuka yang mengandung affordances.
Setelah prototype antarmuka selesai dibuat, penulis melakukan evaluasi yang dilakukan berdasarkan komponen usability (efektivitas, efisiensi dan kepuasan pengguna). Pengukuran efektivitas dan efisiensi menggunakan lembar observasi dimana untuk aspek efektivitas menggunakan full scale scenario dan untuk efisiensi menggunakan pengukuran waktu, sedangkan penilaian kepuasan pengguna menggunakan Post-Study System Usability Questionare (PSSUQ).
3. HASIL DAN PEMBAHASAN
3.1. Pengumpulan Data dan Analisis
3.1.1 Kelompok Pengguna Menurut informasi yang didapatkan dari stakeholder, kelompok pengguna pada situs web
IFL Malang dibagi menjadi dua kelompok yaitu stakeholder dan pengguna umum.
Selanjutnya, dilakukan wawancara dengan tiga orang dari masing-masing kelompok pengguna untuk mendapatkan pernyataan mengenai situs web IFL Malang dan fitur donasi. Seluruh hasil wawancara dengan pengguna direkapitulasi dan dibuatkan daftar pernyataan. WNC_ 1_14
1 orang 1 orang
Visualisasi Tidak Membingun gkan
AFP_1_2 Operasi nyaman WNC_1_2 WNC_1_5 WNC_1_8 WNC_1_21
WNC_1_10 WNC_1_16
ID Affordance Positif Refrensi AFP_1_1 Layout Efektif WNC_1_6
IFL Malang
Tabel 2. Daftar Affordances Positif pada Situs Web
Setelah mendapatkan pernyataan mengenai situs web IFL Malang dan fitur donasi, pernyataan-pernyataan tersebut dikelompokan menjadi Affordances positif dan negatif seperti pada Tabel 2 dibawah ini :
1 orang 1 orang
WNC_ 1_17
WNC_1_1 WNC_1_3
1 orang 1 orang
Konten Tidak Mengganggu
WNC_ 1_16
1 orang 1 orang
Tidak Mengandun g Unsur Politik
WNC_ 1_15
1 orang 1 orang
Persuasif
AFP_1_3 Mencerminkan Identitas Organisasi
AFP_1_4 Bahasa Komunikatif WNC_1_7 WNC_1_14 WNC_1_15 WNC_1_18
- an Kepercayaan Pendonasi
AFP_2_2 Konten Dapat Dipercaya WNC_1_9 WNC_1_11
3.1.3. Mengidentifikasi faktor Affordances Salah satu langkah dari affordance-based design untuk melakukan perbaikan antarmuka
ID Affordance Negatif Refrensi AFN_2_1 Visualisasi Membingungkan WNC_1_17 AFN_2_2 Mengandung Unsur Politik WNC_1_16 AFN_2_3 Konten Mengganggu WNC_1_15
Donasi
Tabel 5. Daftar Affordance Negatif pada Fitur
AFP_2_7 Operasi Nayaman WNC_1_13
WNC_1_5 WNC_1_14
AFP_2_3 Menjaga Privasi WNC_1_12 AFP_2_4 Mudah Digunakan WNC_1_10 AFP_2_5 Petunjuk yang Jelas WNC_1_1 AFP_2_6 Publikasi Menarik WNC_1_2
Visualisasi Jelas
AFP_1_5 Representasi Akurat WNC_1_9 WNC_1_12 WNC_1_13
ID Affordance Positif Referensi AFP_2_1 Informasi Jelas WNC_1_3
Tabel 4. Daftar Affordance Positif pada Fitur Donasi
WNC_1_19 AFN_1_4 Konten Mengganggu WNC_1_21 AFN_1_5 Mengandung Aspek Politik WNC_1_23
WNC_1_20 AFN_1_3 Visualisasi Kaku WNC_1_11
ID Affordance Negatif Refrensi AFN_1_1 Mengandung Iklan WNC_1_22 AFN_1_2 Konten Membingungkan WNC_1_4
IFL Malang
Tabel 3. Daftar affordance negatif pada situs web
AFP_1_6 Menyorot Program WNC_1_17
WNC_1_4 WNC_1_6 WNC_1_7 WNC_1_8
4 orang WNC_ 1_13
Tabel 1. Daftar Affordances Positif pada Fitur
2 orang WNC_ 1_3
Terdapat Reward Donasi
WNC_ 1_5
1 orang 1 orang
Terdapat Jenis Donasi
WNC_ 1_4
1 orang 1 orang
Penjabaran program Jelas
1 orang 1 orang
4 orang WNC_ 1_6
Publikasi Baik
WNC_ 1_2
1 orang 2 orang
Langkah donasi 1 orang
Penggu na WNC_ 1_1
Jumlah Stakeh older
ID Pernyataan responden yang menyatakan
Donasi
3 orang 1 orang
Terdapat Kontak Yang Jelas
3 orang 1 orang
3 orang WNC_ 1_10
Menjaga Privacy
WNC_ 1_12
1 orang 1 orang
Bukti Nyata Berdonasi
2 orang WNC_ 1_11
1 orang 1 orang
Kemudahan Berdonasi
2 orang 1 orang
2 orang 2 orang
Mendahuluk
2 orang WNC_ 1_9
1 orang 1 orang
Laporan Keuangan Jelas
4 orang WNC_ 1_8
3 orang 1 orang
Terdapat Video Teaser
WNC_ 1_7
3.1.2 Affordances positif dan negatif
situs web IFL adalah mengidentifikasi faktor affordances. Pada langkah ini terdapat dua aktivitas utama yaitu mengidentifikasi komponen dari tampilan untuk antarmuka dari situs web IFL Malang dan mengidentifikasi faktor terkait. Yang terpenting dari langkah ini yaitu bagaimana membuat komponen dapat berasosiasi dengan affordances tertentu sehingga dapat menemukan kelemahan dan kekuatan dari komponen yang akan dievaluasi.
Bahasa Komunikatif
Pastikan untuk membuat tampilan semenarik mungkin
Konten Menggangg u
Memastikan kenyamanan visual Deskripsi
Artikel (0%)
Layout Efektif
Pastikan posisi deskripsi artikel tepat Operasi Nyaman
Sederhanakan tata letak untuk mempermudah pemahaman
Mencermin kan Identitas Organisasi
Menampilkan deskripsi artikel dengan font penulisan yang konsisten
Menampilkan deskripsi artikel dengan font penulisan yang konsisten
Konten Membingun gkan
Mengandun g Iklan Pastikan konten tidak mengandung iklan
Konten Membingun gkan
Menyediakan deskripsi artikel yang mudah untuk dimengerti
Visualisasi Kaku
Pastikan untuk membuat tampilan semenarik mungkin
Postingan Populer
(0%) Layout Efektif
Meletakan Postingan Populer pada tempat yang mudah dilihat oleh pengunjung
Operasi Nyaman
Pastikan besar seluruh konten sesuai
Beri keterangan agar navigasi jelas Visualisasi Kaku
Representa si Akurat Menggunakan sosial media yang benar-benar dimiliki
Sesuai dengan isi konten yang terdapat pada situs web IFL Malang, terdapat 13 komponen yaitu judul, navigasi menu, judul artikel, pencarian, link social media, konten artikel, gambar artikel, deskripsi artikel, postingan popular, tentang IFL Malang , gambar direksi , twitter widget dan navigasi tambahan. Hasil dari pengolahan data pada ASM adalah daftar komponen yang perlu diperbaiki dan tidak perlu diperbaiki, serta nilai affordance dari masing- masing komponen.
Meletakan kolom pencarian pada tempat yang mudah dilihat. Operasi Nyaman
Dari selisih presentase ASM, presentase selisih terbesar berada pada komponen twitter widget yaitu dengan presentase 66%. Karena strategi desain affordances memberi sugesti untuk memperbaiki komponen yang memiliki selisih presentase <= 50%, maka komponen judul, navigasi menu, judul artikel, pencarian, link sosial media, konten artikel, gambar artikel, deskripsi artikel, postingan popular, tentang IFL Malang , gambar direksi dan navigasi tambahan perlu diperbaiki.
Untuk perbaikan antarmuka situs web IFL Malang yang telah mendapatkan daftar komponen yang harus diperbaiki, strategi desain affordances selanjutnya dibuat. Strategi desain bersumber dari penelitian sebelumnya yaitu penelitian Park dan Song (2012) dan beberapa masukan yang diberikan oleh responden saat melakukan wawancara. Untuk fitur donasi, strategi affordances dibuat berdasarkan affordances positif dan negatif yang didapatkan.
Strategi desain untuk setiap komponen perbaikan antarmuka situs web IFL Malang terlampir pada Appendix.
Tabel 6. Strategi untuk Memperbaiki Affordance
Kompone n Situs Web IFL
Malang (%)
Faktor
Affordances
Strategi Pencarian
(0%) Layout Efektif
Pastikan besar navigasi sesuai Bahasa Komunikatif
Sederhanakan tata letak untuk mempermudah pemahaman
Pastikan bahasa yang digunakan pada kolom pencarian mudah dimengerti. Konten Membingun gkan
Berikan konten yang benar tanpa kesalahan Visualisasi Kaku
Pastikan untuk membuat tampilan semenarik mungkin
Konten Menggangg u
Memastikan kenyamanan visual
Link
Sosial Media
(0%) Layout Efektif
Meletakan kolom link sosial media pada tempat yang mudah dilihat
Operasi Nyaman
3.1.4. Mengidentifikasi strategi Affordances
Bahasa Komunikatif
Konten Membingun gkan
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Konten Artikel
(8%) Layout Efektif
Menampilkan konten berdasarkan kategori dan pastikan layout efektif
Operasi Nyaman
Pastikan kenyamanan visual Mencermin kan Identitas Organisasi
Pasatikan setiap konten mencerminkan Organisasi
Bahasa Komunikatif
Pastikan menggunakan Bahasa yang komunikatif dan font konsisten
Representa si Akurat Pastikan bahwa tujan dan visualisasi konten jelas
Menyorot Program
Pastikan untuk membuat program yang dijelaskan pada konten terlihat unggul
Mengandun g Iklan Pastikan tidak mengandung iklan
Pastikan interaksi navigasi sesuai Visualisasi Kaku
Pastikan kenyamanan visual Konten Menggangg u
Pastikan kenyamanan visual Konten Menggangg u
Pastikan layout bersih dan rapih Mengand- ung Aspek Politik
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Tentang
IFL Malang
(8%) Layout Efektif pastikan layout efektif dan letakan deskripsi singkat di halaman utama agar mudah dilihat
Operasi Nyaman
Pastikan kenyamanan visual Mencermin kan Identitas Organisasi
Pasatikan setiap konten mencerminkan Organisasi
Bahasa Komunikatif
Pastikan menggunakan Bahasa yang komunikatif, font konsisten dan menggunakan Bahasa yang rapih
Represen- tasi Akurat Menampilkan keseluruhan layout dengan dikelompokan menjadi beberapa area
Menyorot Program
Pastikan besar gambar sesuai Mengandun g Aspek Politik
Visualisasi Kaku
Pastikan menggunakan tata Bahasa yang rapih dan komunikatif
Visualisasi Kaku
Representa si Akurat Menggunakan isi konten yang sesuai
Konten Membingun gkan
Menggunakan interaksi navigasi yang baik Visualisasi Kaku
Memastikan kenyamanan visual Konten Menggangg u
Menampilkan tiga postingan ter popular Mengandun g Aspek Politik
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Navigasi (0%)
Layout Efektif
Memastikan interaksi navigasi baik Operasi Nyaman
Pastikan besar navisigasi sudah sesuai Representa si Akurat
Pastikan bagian-bagian dari navigasi memiliki tujuan konten yang jelas
Konten Membingun gkan
Pastikan semua fungsi navigasi berjalan dengan baik
Pastikan untuk membuat tampilan semenarik mungkin
Pasatikan setiap konten mencerminkan Organisasi
Konten Menggangg u
Memastikan kenyamanan visual Judul
Artikel (0%)
Layout efektif Pastikan layout bersih dan sederhana
Bahasa komunikatif Pastikan menggunakan Bahasa yang komunikatif, konsisten dan menggunakan Bahasa yang rapih
Menyorot program Pastikan untuk membuat program yang dijelaskan pada konten terlihat unggul
Mengandun g iklan Hal yang ditulis tidak boleh mengandung iklan
Visualisasi kaku Memastikan kenyamanan visual
Mengandun g aspek politik
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Foto Direksi
(8%) Layout Efektif pastikan layout efektif Operasi Nyaman tambahkan interaksi visual
Mencermin kan Identitas Organisasi
Pastikan untuk membuat program yang dijelaskan pada konten terlihat unggul Mengandun g Iklan Pastikan konten tidak mengandung iklan
Konten Membingun gkan
Pastikan menggunakan Bahasa yang komunikatif, konsisten, dan menggunakan tata Bahasa yang rapih
Visualisasi Kaku
Memastikan kenyamanan visual Judul
(42%) Layout Efektif
Ditempatkan di tempat yang mudah dilihat oleh pengguna
Operasi Nyaman
Pastikan warna judul menarik dan besar font sesuai
Mencermin kan Identitas Organisasi
Diharapkan judul yang dibuat memvisualisasikan organisasi
Bahasa Komunikatif
Menyorot Program
Pastikan untuk menampilkan gambar yang membuat aktifitas terlihat unggul
Pastikan untuk membuat hal yang yang gambarkan terlihat unggul
Konten Menggangg u
Pastikan tidak ada konten yang tidak sesuai Mengandun g Aspek Politik
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Tabel 7 menunjukan strategi untuk fitur donasi dapatkan dari affordance positif dan negatif yang telah ditemukan pada tahap sebelumnya. Strategi affordance yang didapatkan berasal dari masukan pengguna dan refrensi penelitian sebelumnya. Berikut adalah stategi desain Affordances untuk fitur donasi :
Ta bel 7. Stategi Desain Affordances Fitur Donasi
ID Faktor
Affordance
Strategi SDD_1_1 Informasi Jelas Mengandung informasi berupa penjelasan program, video yang mencerminkan program, kontak yang jelas, jenis- jenis donasi dan nama pendonasi
SDD_1_2 Konten Dapat Dipercaya
Mengandun g Iklan Pastikan gambar tidak mengandung hal selain dokumentasi dari organisasi
Pastikan tujuan dari gambar jelas Menyorot Program
Pastikan interaksi navigasi baik Visualisasi Kaku
Pastikan membuat visualisasi untuk mencerminkan organisasi
Pastikan kenyamanan visual Konten Menggangg u
Pastikan tidak ada konten yang tidak sesuai Mengand- ung Aspek Politik
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Menu (24%)
Layout Efektif
Dimohon untuk ditempatkan pada posisi yang mudah dilihat pengguna
Operasi Nyaman
Pastikan interaksi navigasi baik dan layout efektif
Mencermin kan Identitas Organisasi
Bahasa Komunikatif
Pastikan posisi gambar tepat Representa si Akurat
Menggunakan Bahasa yang mudah dipahami oleh pengguna
Menyorot Program
Gunakan visualisasi yang membembuat program terlihat unggul
Visualisasi Kaku
Pastikan untuk membuat tampilan semenarik mungkin
Konten Menggangg u
Pastikan tidak ada konten yang tidak sesuai Mengandun g Aspek Politik
Pastikan setiap konten bersifat senetral mungkin sehingga tidak mengarah ke unsur politik
Gambar Artikel
(34%) Layout Efektif
Perlunya transparasi keuangan pada setiap donasi seperti menampilkan laporan keuangan untuk program yang sudah dijalankan untuk menjaga kepercayaan donasi dan juga diberikan bukti saat berdonasi SDD_1_3 Menjaga Privasi Tidak menyalah gunakan data pendonasi dan menjaga data pendonasi tetap aman
SDD_1_4 Mudah Pengoperasian Digunakan yang sederhana
SDD_1_5 Petunjuk yang Memberikan Jelas arahan yang jelas agar pengguna tidak salah mengoperasikan
SDD_1_6 Publikasi Cara untuk
Gambar 1. Halaman Artikel
Menarik berdonasi diletakan di beberapa tempat sebagai sarana publikasi
SDD_1_7 Operasi Nyaman Pastikan kenyamanan visual
SDD_1_8 Visualisasi Navigasi Membingungkan diperjelas
SDD_1_9 Mengandung Menjaga setiap Unsur Politik konten tetap netral
SDD_1_10 Konten Pastikan layout Mengganggu bersih dan rapih
Hasil strategi yang didapatkan akan digunakan untuk rekomendasi tampilan antarmuka pengguna di tahap selanjutnya.
3.2. Hasil Rekomendasi Desain Antarmuka
Hasil strategi desain yang didapatkan pada tahap sebelumnya di terapkan dalam ide desain, dengan mengacu pada beberapa aturan desain juga. Sehingga didapatkanlah hasil rekomendasi perbaikan desain antarmuka situs web IFL dan desain antarmuka fitur donasi sebagai berikut :
Gambar 2. Halaman Home
Gambar 5. Halaman Form Donasi Gambar 3. Halaman About IFL Malang
Gambar 6. Halaman Fitur Donasi
3.3. EVALUASI DESAIN BARU Aspek usability yang dilakukan evaluasi pada penelitian ini yaitu efektivitas, efisiensi dan kepuasan pengguna.
Pada aspek efektivitas, digunakan task Gambar 4. Halaman Rincian Artikel scenario jenis Full Scale Task Scenario. Pada test scenario ini, penulis memberikan beberapa tugas kepada responden yang telah disusun berupa scenario yang harus dilakukan.
Aspek efisiensi diuji dengan cara memberikan task scenario yang sama pada responden. Saat responden melakukan setiap task , penulis mengukur waktu yang dibutuhkan oleh responden untuk melakukan setiap task scenario menggunakan stopwatch. Aspek kepuasan dinilai dengan cara memberikan kuesioner yang berisi 19 pertanyaan.
Nilai efektivitas dari tampilan antarmuka baru yaitu 98,14% dengan nilai maksimal 100%. Nilai rata-rata waktu untuk pengerjaan task pada aspek efisiensi perbedaannya tidak terlalu signifikan. Pada aspek kepuasan pengguna, seluruh item yang terdapat pada kuesioner PSSUQ mendapatkan nilai sangat baik.
Pada menu home, what’s new, dan about
IFL Chapter Malang ditemukan 6 affordances positif dan 5 affordances negatif serta 13 komponen. Hasil analisis affordances pada affordances structure matric (ASM) menghasilkan pernyataan bahwa 12 komponen dari 13 komponen pada situs Web IFL Malang perlu diperbaiki dari aspek affordances. Hasil dari perbaikan rancangan antarmuka pengguna dengan metode Affordance- based design menghasilkan desain baru yang tidak hanya melihat dari sisi positif nya tetapi juga sisi negatif dari suatu affordances dan sangat mencerminkan pengguna. Perancangan desain juga didukung oleh beberapa design guideline dari Research-Based Web Design & Guidelines..
- –239. [pdf] Tersedia di : <https://www.researchgate.net/profile/Jo nathan_Maier/publication/226208751_Af fordacebased_design_methods_for_innov ative_design_redesign_and_reverse_engi neering/links/570baca408aea660813b0cb 5.pdf> [2 Februari 2017].
Pada fitur donasi, ditemukan 7 affordances positif dan 3 affordances negatif. hasil perancangan antarmuka yang didasarkan pada strategi desain yang dihasilkan membuat metode Affordance- based design menghasilkan desain baru yang tidak hanya melihat dari sisi positif nya tetapi juga sisi negatif dari suatu affordances dan sangat mencerminkan pengguna. Perancangan desain juga didukung oleh guideline dari Research-Based Web Design & Guidelines.
- –196. Tersedia di : <http://www.ifets.info/journals/18_3/15. pdf >[2 Februari 2017].
Hasi evaluasi usability pada rekomendasi antarmuka situs web IFL Malang menghasilkan presentase efektivitas 98,14% dari nilai maksimal 100% yang menggambarkan bahwa persentase tersebut bisa dinilai baik. Terdapat dua flow untuk mengerjakan task untuk melihat informasi mengenai IFL Malang. Hasilnya, 1 rensponden menggunakan flow kedua untuk mencapai tujuan tersebut dan 5 responden menggunakan flow pertama. Untuk task melihat langkah donasi, terdapat dua flow juga untuk mencapai tujuan tersebut dan satu responden menggunakan flow kedua dan sisanya menggunakan flow pertama. Untuk penilaian aspek efisiensi, terdapat 9 task yang dikerjakan oleh 6 responden dan waktu masing-masing responden untuk mengerjakan task tidak terpaut jauh. Untuk aspek kepuasan pengguna, semua penilaian item termasuk kedalam katogori sangat baik. Sehingga untuk aspek efektivitas, efisiensi dan kepuasan pengguna mempunyai hasil yang bisa dikatakan baik.
SUMBER PUSTAKA/RUJUKAN Maier, J. R. A., & Fadel, G., M., 2009.
Affordace-based design methods for innovative design, redesign and reverse engineering. Research in Engineering Design, 20(4), 225
4. KESIMPULAN
Maier, J., R., A., 2011. Affordace based design: Theoretical foundation and practical applications. Saarbrücken, Germany: VDM Verlag.
Nielsen,J., 2001. Success Rate: The Simplest Usability Metric. [pdf] <https://www.nngroup.com/articles/succe ss-rate-the-simplest-usability-metric/> [15 Februari 2017] Park, H., & Song,H.,D., 2015. Make E-Learning Effortless! Impact of a Redesigned User Interface on Usability through the Application of an Affordace Design Approach. [pdf] Educational Technology & Society, 18 (3), 185
Jaklevic, M.,C., 2000. Charity finances health care: Donors are opening wallets to pay for million-dollar projects. Modern Healthcare, Vol. 30, pp. 26.