UX Case Study — Gamification Feature For Campaign #ForChange

Disclaimer

Proyek ini merupakan bagian dari UI/UX Training Program yang diadakan oleh Kementerian Komunikasi dan Informatika dengan Skilvul dan Campaign #ForChange sebagai Challenge Partner. Kami tidak bekerja atau diikat dalam kontrak professional oleh Campaign #ForChange.

Latar Belakang

Gamifikasi adalah metodologi pelatihan yang disukai karena meningkatkan daya tarik proses pembelajaran, inovasi, kesenangan, produktivitas, kemampuan untuk mempertahankan pengetahuan dan memperoleh keterampilan baru.

Teknik ini terdiri dari penggunaan teknik pemikiran dan permainan dalam pengaturan non-hiburan, seperti pendidikan atau pekerjaan . Dengan meminta pengguna bekerja sama untuk mencapai tujuan atau pengakuan, mereka merasa lebih terintegrasi dan terlibat dalam proyek bersama.

Ketika diterapkan pada sumber daya manusia perusahaan, itu menjadi strategi baru dan kuat melalui teknik permainan yang diperkenalkan ke dalam proses bisnis untuk meningkatkan pengambilan keputusan, konsentrasi, motivasi, usaha, loyalitas dan nilai-nilai bersama lainnya sepanjang permainan.

Mengapa ini merupakan strategi yang menarik bagi sebuah perusahaan?

Menurut sebuah studi oleh American Psychology Association , 50% dari mereka yang disurvei mengatakan bahwa mereka tidak merasa usaha mereka dihargai atau dihargai dan karena itu akan mencari pekerjaan baru tahun ini.

Gamifikasi diterapkan pada sumber daya manusia adalah solusi yang sangat baik untuk situasi ini karena menawarkan alternatif motivasi baru kepada karyawan untuk tumbuh dan terlibat dalam perusahaan dan karir mereka, sehingga membuat mereka merasa lebih dihargai.

Ini adalah cara yang bagus untuk mengoptimalkan potensi tenaga kerja karena keserbagunaannya memungkinkan untuk diterapkan dalam perekrutan staf, aktivitas loyalitas, pelatihan keselamatan, dan pengembangan profesional berkelanjutan. Teknik ini meningkatkan keterampilan pekerja pada tingkat profesional, sosial dan transversal.

Hal ini sangat berguna untuk inisiatif pelatihan seperti memperoleh pengetahuan baru atau memperkuat keterampilan tertentu. Menurut grafik di bawah ini, partisipasi implisit dalam alat gamifikasi merupakan 80% dari proses pembelajaran. Telah terbukti bahwa pembelajaran berbasis partisipasi meningkatkan jumlah pengetahuan yang dipertahankan sebesar 50% dibandingkan dengan strategi tradisional seperti membaca atau mendengarkan.

Tujuan Penelitian

1. Untuk mencari tahu pengalaman pengguna dalam menggunakan aplikasi Campaign #ForChange
2. Untuk mencari tahu motivasi user menggunakan aplikasi Campaign #ForChange
3. Untuk mencari tahu tingkat keberhasilan dari SUS untuk improvisasi fitur gamification pada aplikasi Campaign #ForChange
4. Untuk mencari tahu tingkat kegunaan,kemudahan dan kepuasan dari solusi ide yang ditawarkan pada alur proses memilih fitur flash challenge, fitur hunting challenge, fitur tracking progress dan fitur insight poin.

Kriteria Responden

1. Berusia 18–25 tahun
2. Berprofesi sebagai pelajar, mahasiswa dan freshgraduate
3. Berdomisili di Indonesia
4. Memiliki kemampuan Bahasa Indonesia sebagai native language
5. Memiliki kemampuan yang baik dalam berbahasa Inggris
6. Memiliki ketertarikan mengikuti kegiatan sosial baik secara offline atau online
7. Memiliki kemampuan komunikasi yang baik
8. Mudah beradaptasi dengan lingkungan maupun orang baru
9. Memiliki kemampuan yang baik dalam mengoperasikan ponsel
10. Memiliki kualitas internet yang memadai

Peran dalam Tim

Dalam proses ini dilakukan secara tim. Sebagai UX Designer yang berkolaborasi dengan 2 anggota tim, Maria Fihudamien & Vivi. Dalam tim ini, tanggung jawab saya adalah

1. Brainstorming ide
2. Menentukan pain points user dan How-Might We pada tahap define
3. Menentukan solution idea, affinity diagram, prioritization idea serta menggambar crazy-8’s pada tahap Ideate
4. Membuat Wireframe
5. Membuat Design System
6. Membuat UI Design dan Prototyping
7. Melakukan User Research serta Usability Testing
8. Melakukan Iterasi UI Design

Tools

• Figma
• Zoom dan Google meet
• Google Docs
• Google Spreadsheets

Design Process

source: https://www.ozassignments.com/solution/u101-the-design-thinking-proof-reading-and-paper-editing-services

Dalam kasus ini saya memilih menggunakan Design Thinking sebagai pendekatan design process yang saya lakukan. Yang saya tahu, Design Thinking adalah “framework” dalam pola pikir kita atau bagaimana pendekatan kita dalam menyelesaikan sebuah permasalahan.

“Design Thinking berfokus pada mengintegrasikan kebutuhan user, kapabilitas teknologi, dan bisnis”

Design Thinking melibatkan seluruh pihak dalam prosesnya, hal ini menjadi kelebihan Design Thinking dimana kita menyelesaikan masalah dengan melihatnya dari berbagai sisi.

Secara teknisnya, saya percaya Design Thinking dapat diterapkan dalam banyak bidang. Tidak hanya dalam membuat aplikasi tapi juga untuk keperluan engineering, arsitektur, advertising, organisasi, atau bahkan kehidupan sehari-hari.

Dalam metode Design Thinking, dikenal 5 fase yaitu Empathy, Define, Ideate, Prototype, lalu Test. Harus digaris bawahi, kelima proses ini tidak selalu bersifat linear. Alur proses dapat disesuaikan dengan kasus spesifik tertentu.

1. Empathize

Tujuan pada tahap Empathize adalah membantu designer dalam mencari tahu pandangan & kebutuhan dari target usernya dengan research sebelum mendefinisikan problem statement dan melakukan ideation.

Adapun hal hal yang dilakukan dalam tahap empathize:

• Menganalisa data analitis
• Membandingkan aplikasi serupa (Competitor Analysis)
• Melakukan survey pengguna
• melakukan In-depth Interview (IDI)
• Melakukan FGD

Setelah menentukan kriteria atau target pasarnya maka selanjutnya adalah melakukan In-depth interview yang kemudian dengan melakukan itu saya bisa menjabarkan apa yang user butuhkan ataupun keluhkan pada tahap define.

2. Define

Selanjutnya adalah tahap define. dalam tahap ini yang dilakukan adalah:

• Mendefinisikan permasalahan user (Pain Points) dari hasil empathize
• Membuat How-Might We sebagai opportunity

Pertama yang akan saya bahas adalah berikut adalah hasil bagaimana saya dan tim saya melakukan brainstorming ide untuk menentukan pain points dari user

Pain Points User

Berdasarkan gambar diatas dapat disimpulkan kebanyakan pain points user adalah mereka kurang termotivasi untuk menggunakan aplikasi campaign. Setelah menentukan apa saja pain points dari user, selanjutnya saya dan tim saya menggunakan pain points dengan mengajukan pertanyaan spesifik yang dimulai dengan: “How Might We” (bagaimana Kami Mungkin/Dengan Cara Apa kita Mungkin”.

“How Might We” dapat memicu sesi ide dalam brainstorming.

How Might We

Dari How-Might We di atas yang terpilih adalah:

• Meningkatkan motivasi user agar tidak jenuh dalam mengerjakan challenge

3. Ideate

Pada tahap ideate hal yang selanjutnya dilakukan adalah:

• Memulai brainstorming ide berdasarkan How-Migh We
• Brainstorming ide solusi yang akan diberikan
• Membuat gambaran kasar (wireframe) dengan Crazy-8's

Kemudian saya akan menjelaskan mengenai brainstorming ide berdasarkan How-Might We. Setelah menentukan HMW nya selanjutnya maka setiap anggota kelompok menuliskan ide nya apa berdasarkan HMW nya.

Solution Idea

Selanjutnya melakukan pada affinity diagram melakukan pengelompokan atau pengkategorian berdasarkan fitur fitur yang telah dituangkan pada solution ide. Proses pengelompokan tersebut ditentukan berdasarkan diskusi kelompok.

Affinity Diagram

Kemudian selanjutnya adalah prioritization idea, artinya kami membagi ide ide pada solution ide berdasarkan prioritasnya. Pada prioritization terdapat 4 kuadran antara lain:

• Yes, do it now
• Do next
• Do last
• Later

Prioritization Idea

Pada prioritization idea yang saya dan kelompok saya pilih adalah kuadran”Do it now” karena pada kuadran 1(do it now) terdapat 3 main feature andalan kelompok kami.

Selanjutnya langkah yang akan dilakukan adalah crazy-8'

Crazy 8

Pada tahap crazy-8’s maka setiap anggota kelompok melakukan gambaran kasar mengenai aplikasi kami. Hal ini dilakukan dengan mengambil kertas hvs kemudian dilipat menjadi 8. Dan hal tersebut dilakukan selama 8 menit. Dari hasil crazy-8’s maka saya dan kelompok saya melakukan voting untuk gambar ide yang telah kami gambar. Untuk voting tertinggi maka desain seperti itulah yang nanti akan diturunkan pada tahap prototyping.

4. Prototyping

Kemudian yang dilakukan pada tahap prototype adalah:

• Mendesain interface dari hasil Crazy-8's
• Menyusun UI menjadi sebuah flow proses yang sesuai dengan ide solusi
• Membuat prototype yang dapat digunakan untuk Testing

Hal pertama yang kelompok saya adalah membuat userflow. Userflow adalah langkah-langkah yang sudah divisualisasikan dan dapat diikuti pengguna melalui aplikasi untuk menyelesaikan satu atau beberapa tugas.

Langkah-langkah ini memberikan sebuah alur yang dapat membawa pengguna dari titik masuk menuju hasil yang sukses serta tindakan akhir. Berikut ini adalah userflow yang telah kelompok saya buat:

Userflow

Selanjutnya saya membuat wireframe, wireframe merupakan cara desainer UI/UX membuat rancangan website maupun aplikasi pada level struktural. Merancang sebuah wireframe berarti merencanakan kerangka garis besar sebuah aplikasi atau website.

Wireframe

Kemudian saya membuat design system, design system adalah sebuah komponen yang dapat digunakan kembali untuk keperluan perancangan & pengembangan produk baik dari sisi desain maupun code programming. Tujuan dibuatnya design system adalah

• Agar hasil desain UI dan code Frontend konsisten
• Untuk mempercepat proses kerja UI Design&Developer
• Dapat mengakomodir kebutuhan product design di masa depan

Terdapat 3 susunan komponen atomic design system yaitu:

• Atom : Palet warna, typography, Icon Style, Input Field, Button Style
• Molecule : Header bar, tabbing, notification bar, action list
• Organism : Action sheet, pop up, notification stacked

Berikut contoh design system pada komponen atom:

Design System Atom Component

Setelah itu maka saya mulai membangun ui design saya.

UI Design

Setelah selesai maka saya menambahkan interaksi dari 1 frame ke frame lainnya yang biasa disebut sebagai proses prototyping.

Coba prototype disini:

Prototyping

5. Testing

Setelah prototyping selesai langkah selanjutnya adalah Testing. Pada tahap testing yang saya lakukan adalah:

• Mengevaluasi setiap ide solusi dengan testing
• Melalukan interview untuk testing

Pada kesempatan ini saya menggunakan usability testing untuk menguji UI Design yang telah saya lakukan sebelumnya dan untuk satuan ukurannya menggunakan SUS (System Usability Scale). Usability testing adalah merupakan salah satu cara untuk mengetahui apakah user dapat mudah menggunakan aplikasi , seberapa efisien dan efektif sebuah aplikasi dapat membantu user mencapai tujuannya dan apakah user puas dengan aplikasi yang digunakan. SUS dilakukan dengan terdapat 10 satuan ukuran yang diurai menjadi 10 pertanyaan dan dihitung dengan skala Likert(1–5). Metrik ini sudah mencakup dari sisi kepuasan, kemudahan hingga efektivitas.

Proses Usability Testing dengan Responden

Dalam proses usability testing tersebut responden melalukan 4 task yaitu:

1. [TASK 1] Meminta pengguna untuk memilih fitur Flash Challenge dan observasi apa yang dilakukan oleh responden
2. [TASK 2] Meminta pengguna untuk memilih fitur Hunting Challenge dan observasi apa yang dilakukan oleh responden
3. [TASK 3] Meminta pengguna untuk memilih fitur Tracking Progress observasi apa yang dilakukan oleh responden
4. [TASK 4] Meminta pengguna untuk memilih fitur Insight Poin dan observasi apa yang dilakukan oleh responden

Dari hasil tersebut didapatkan penilaian untuk UI Design yang telah saya lakukan adalah sebagai berikut

Hasil Pengujian SUS TASK 1

Hasil Pengujian SUS TASK 2

Hasil Pengujian SUS TASK 3

Hasil Pengujian SUS TASK 4

Setelah melakukan pengumpulan data dari responden, kemudian data tersebut dihitung. Dalam cara menggunakan System Usability Scale (SUS) ada beberapa aturan dalam perhitungan skor SUS. Berikut ini aturan-aturan saat perhitungan skor pada kuesionernya:

1. Setiap pertanyaan bernomor ganjil, skor setiap pertanyaan yang didapat dari skor pengguna akan dikurangi 1.
2. Setiap pertanyaan bernomor genap, skor akhir didapat dari nilai 5 dikurangi skor pertanyaan yang didapat dari pengguna.
3. Skor SUS didapat dari hasil penjumlahan skor setiap pertanyaan yang kemudian dikali 2,5.

Berdasarkan hasil perhitungan menggunakan SUS menunjukkan bahwa acceptability status yang kelompok saya dapatkan adalah acceptable.

Iterasi UI Design

Selanjutnya setelah mendapat masukan dari user, kelompok kami melakukan iterasi ui sesuai dengan permasalahan yang dihadapi user saat mencoba mengakses prototype kelompok kami

Kesimpulan

Design Thinking merupakan pola pendekatan penyelesaian sebuah masalah. Proses nya tidak harus linear. Design Thinking bertujuan untuk memvalidasi ide lebih cepat dan lebih sering, dengan begitu kita bisa gagal lebih cepat dan memperbaiki diri lebih cepat.

Setelah menguraikan tahapan design thinking anda bisa melihat kalau prosesnya dilakukan secara bertahap. Tapi dalam praktiknya, design thinking bisa dilakukan dengan cara yang lebih fleksibel. Misalnya tim yang terdiri dari berbagai kelompok melakukan lebih dari satu tahap secara bersamaan. Atau hasil dari tahap pengujian mengungkapkan wawasan tentang pengguna yang pada akhirnya menuntun pada fase ideate dan lain sebagainya.