Kancani

Tahun: 2022

Durasi: 3 bulan - 1 tahun

Stakeholder: Lazuardi Al-Falah GCS Klaten

Teknologi: PHP (CodeIgniter 4), Bootstrap CSS, jQuery, Push Notifications, Progressive Web Apps (PWA)

URL: kancani.id

Kancani merupakan sebuah web yang dirancang untuk menemani siswa-siswi di Indonesia dalam mengenali emosi yang mereka rasakan di kehidupan sehari-hari. Salah satu misi dari Kancani adalah untuk mengedukasi siswa terkait pentingnya keterampilan pengelolaan emosi sehingga diharapkan para siswa mampu untuk tumbuh menjadi pribadi yang tangguh dan cerdas secara psikologis. Kancani bertujuan untuk membantu sekolah dalam memahami kondisi sosial emosi siswa secara lebih baik, serta membantu sekolah untuk merancang pendekatan pembelajaran yang sesuai dengan kebutuhan setiap peserta didik.

Kancani memberikan ruang bagi peserta didik untuk dapat: Mengekspresikan emosi mereka melalui pertanyaan sehari-hari terkait perasaan yang mereka rasakan; Mencari jawaban mengenai emosi yang mereka rasakan melalui video psikoedukasi; Melakukan penjurnalan dan latihan yang akan membantu mereka dalam memahami keyakinan dan perasaan yang mereka alami; Berkomunikasi secara anonim dengan seorang teman yang dapat membantu mereka menemukan solusi untuk permasalahan yang mereka alami; Memiliki pengalaman belajar untuk saling memberikan dukungan satu sama lain.

Konten psikoedukasi yang disajikan dalam aplikasi web Kancani dikembangkan berbasis prinsip REBT (Rational-Emotive Behavioral Therapy) untuk membantu remaja mengganti pikiran irasional mereka menjadi lebih rasional sebagai bentuk upaya mengatasi permasalahan emosional dan kesehatan mental remaja Indonesia.

Kesan Penulis

Proyek ini bermula dari 2 mahasiswa jurusan Psikologi dari proyek sebelumnya yang sudah selesai terlebih dahulu (Sibisa) mendatangi saya untuk bekerja sama lagi dalam proyek baru yang dimiliki Lazuardi Al-Falah GCS Klaten. Proyek tersebut merupakan aplikasi web sosio-emosional yang ditujukan kepada siswa (kala itu SMP) sekolah tersebut supaya lebih mampu mengekspresikan emosinya. Yang membuat proyek ini berkesan bagi saya adalah: (1) pertama kali menerapkan metodologi agile dalam mengerjakan proyek (yang mana rilis dilakukan secara iteratif), (2) memiliki set fitur yang banyak, kompleks, dan menarik, dan (3) mendorong saya keluar dari zona nyaman karena bereksperimen dengan teknologi baru seperti JavaScript Canvas, Google Cloud API, Push Notifications, dan Progressive Web Apps (PWA), serta mengasah kemampuan Frontend saya dengan desain yang dibuat menarik dan seramah mungkin terhadap pengguna.

Karena rilis dilakukan secara iteratif, maka proyek ini mendorong saya sejak awal untuk menerapkan branching model pada version control yang saya gunakan. Model branching yang saya terapkan kala itu masih sederhana, hanya terdiri dari branch utama atau main (untuk diterapkan pada situs production), develop (untuk diterapkan pada situs testing), serta branch tersendiri untuk modul besar yang sedang aktif dikembangkan (untuk nantinya dilakukan merging ke dalam branch develop terlebih dahulu untuk dapat dites oleh tim). Proses migrasi database juga saya lakukan dengan penuh kehati-hatian dengan cara memecah menjadi beberapa versi file SQL yang kemudian nantinya dijalankan bebarengan dengan rilis pembaruan kode.

Fitur-fitur yang ada dalam aplikasi web ini cukup beragam, antara lain: (1) check-in emosi harian dengan intensitas (seperti termometer) beserta alasannya, (2) diary harian pengguna menggunakan mekanisme auto-save, (3) timeline yang memungkinkan pengguna membagikan aktivitasnya kepada pengguna lain dan saling berinteraksi, (4) rekap emosi tahunan yang disajikan dalam bentuk heatmap berwarna dua dimensi, (5) curhat anonim dengan sistem penjadwalan dan appointment, (6) virtual pet yang terinspirasi dari game Pou, memungkinkan siswa untuk merawat, memberi makan, dan kustomisasi hewan peliharaan virtual mereka, (7) daily challenge, quests, dan achievements untuk gamifikasi dan sistem reward kepada pengguna, (8) exercise yang berisi konten edukasi sosio-emosional yang disajikan dalam bentuk latihan interaktif, (9) quote of the day yang mengirimkan quote inspiratif kepada pengguna secara harian, (10) KancaVids yang berisi konten edukasi sosio-emosional yang disajikan dalam bentuk video, (11) KancaMusik yang mana merupakan music player berbasis web dengan memanfaatkan sinkronisasi playlist YouTube. Seluruh fitur tersebut berhasil diselesaikan dalam kurun waktu 3-4 bulan.

Dalam proyek ini saya juga bereksplorasi dengan teknologi yang sebelumnya tidak pernah saya gunakan. JavaScript Canvas berperan dalam pengembangan fitur virtual pet karena membutuhkan pengolahan grafik dalam browser yang cukup intens dan seamless. Kemudian Google Cloud API berperan dalam sinkronisasi playlist YouTube yang digunakan oleh fitur KancaMusik. Lalu Push Notifications digunakan dalam semua kebutuhan pengiriman notifikasi kepada pengguna, seperti quote of the day, pengingat check-in emosi dan mengisi diary harian, notifikasi curhat anonim, serta notifikasi virtual pet dalam keadaan seperti lapar, tidak enak badan, butuh teman, mengantuk, dan kotor. Untuk meningkatkan pengalaman pengguna ketika menggunakan HP, maka aplikasi web ini juga disajikan dalam bentuk Progressive Web App (PWA), serta desain UI yang ramah terhadap pengguna mobile.

Screenshot