THE PLATINUM SKILLS MALANG UI/UX- Web Design

The Platinum Skills Malang adalah fasilitas pelatihan bersertifikat yang merupakan cabang perusahaan Platinum Skills yang berpusat di Sidoarjo, Jawa Timur. Platinum Skills menyelenggarakan berbagai jenis pelatihan untuk menunjang keterampilan dan kemampuandi dunia kerja, antara lain: Sumber daya manusia, layanan pelanggan, manajemen, dll.

Tentang Project

• Waktu pengerjaan : Desember 2021

• Role: UI/UX Designer

• Tools : Figma, Photoshop

• Deskripsi: Platinum Skills Malang, ingin membuat suatu perancangan website yang bertujuan untuk pendaftaran pelatihan, informasi dan company profile untuk BEDA Academy. BEDA Academy merupakan produk dari Platinum Skills yang dikhususkan untuk pelatihan soft skill masyarakat. Berbeda dengan Platinum Skills yang hanya untuk area Malang, BEDA Academy ditujukan untuk seluruh Indonesia, karena pelatihannya dilakukan secara online maupun offline.

Problem Statement

Pada hasil wawancara oleh pihak Platinum Skills Malang, mereka ingin membuat suatu perancangan website yang bertujuan untuk pendaftaran pelatihan, informasi dan company profile untuk BEDA Academy. BEDA Academy merupakan produk dari Platinum Skills yang dikhususkan untuk pelatihan soft skill masyarakat. Berbeda dengan Platinum Skills yang hanya untuk area Malang. BEDA Academy ditujukan untuk seluruh Indonesia, karena pelatihannya dilakukan secara online maupun offline.

Maka dari itu, dalam mewujudkan perancangan website pendaftaran pelatihannya, pihak BEDA Academy memberikan amanat kepada tim penulis melakukan perancangan UI/UX website pendaftaran pelatihan di BEDA Academy. Dalam perancangan website tim penulis memiliki tugas untuk melakukan desain user interface. Sebelumnya tim penulis dan pihak BEDA Academy sudah melakukan riset dan diskusi, sehingga tim penulis mengerti apa yang diminta oleh pihak BEDA Academy. Dengan melakukan diskusi tim penulis mengetahui informasi apa saja yang ditampilkan, isi menu yang dibutuhkan, dan bagaimana proses pendaftaran dan pembayaran yang perlu ditampilkan di dalam website. Kemudian untuk benchmarking dari pihak BEDA Academy dan tim penulis berdiskusi mencari referensi dari website kompetitor salah satunya adalah Hana Gemintang. Dengan demikian tim penulis dapat memahami apa saja yang dibutuhkan oleh pihak BEDA Academy.

Objective

1. Menggali permasalahan yang ada pada BEDA Academy melalui wawancara dan diskusi dengan stakeholder (tahap empathize).

2. Mendefinisikan permasalahan utama (tahap define).

3. Menghasilkan solusi berdasarkan permasalahan yang telah didefinisikan, sehingga akan menghasilkan rancangan prototype low-fidelity.

4. Merancang high-fidelity prototype berdasarkan solusi sebelumnya. 5. Melakukan pengujian prototype yang telah dibuat dengan Sistem Usability Scale (SUS).

Design Process

Pada Project ini menggunakan pendekatan Design Thinking. Berikut tahapan dalam perancangan UI/UX pada penelitian ini :

1. Empathize Wawancara User Persona Empathy Map	3. Ideate Sitemap Wireframe (low fidelity prototype) Mockup (high fidelity prototype) Prototype	5. Testing
2. Define	4. Prototype

Empathize

Target & kriteria pengguna

Kelompok pengguna	Kriteria
Mahasiswa	Masih aktif menempuh studi di perguruan tinggi sederajat Dapat menggunakan perangkat elektronik (Komputer/Smartphone) Pernah mengikuti pelatihan
Fresh graduate	Sudah lulus dari perguruan tinggi sederajat Belum bekerja atau sedang bekerja Pernah mengikuti pelatihan Dapat menggunakan perangkat elektronik (Komputer/Smartphone)

Hasil wawancara

No.	Hasil wawancara pengguna Mahasiswa
1.	Mahasiswa mendapatkan informasi mengenai pelatihan dari instagram dan telegram
2.	Informasi yang dibutuhkan dalam website yaitu mengenai latar belakang perusahaan ( email, pemateri/narasumber dan sosial media), kelebihan dan kekurangan mengikuti pelatihan dan tampilan website yang mudah digunakan
3.	Responden tidak mengalami kendala saat mencari informasi mengenai pelatihan.
4.	Fitur - fitur yang dibutuhkan seperti pendaftaran, informasi mengenai pelatihan ( materi yang akan diberikan, testimoni dari orang orang dan kualtias materi ), fitur yang dapat mengunduh sertifikat secara langsung, pendataan peserta, diskon pelatihan dan notifikasi berita terbaru melalui email.
5.	Responden mengharapkan website dapat meningkatkan pelayanan menjadi lebih baik, respon cepat dan memudahkan orang lain dalam mencari informasi mengenai pelatihan

No.	Hasil wawancara pengguna Fresh graduate
1.	Informasi tentang pelatihan didapat dari instagram, website, google dan rekomendasi teman.
2.	Informasi yang dibutuhkan dalam website yaitu informasi mengenai pelatihan (materi yang akan diajarkan dan jam tayang/jadwal) dan informasi alur menggunakan website
3.	Fitur fitur yang dibutuhkan yaitu informasi mengenai pelatihan seperti materi yang akan diberikan dan preview materi agar bisa melihat kualitas materi.
4.	Fitur fitur yang dibutuhkan yaitu informasi mengenai pelatihan seperti materi yang akan diberikan dan preview materi agar bisa melihat kualitas materi.
5.	Website dengan tampilan lebih simpel yang mempunyai informasi lengkap mengenai pelatihan dan memudahkan orang lain dalam mencari informasi mengenai pelatihan

User Persona

Empathy Map

Devine

Point of View (POV)

No	Point of view (POV) pengguna fresh graduate
1	Memberikan informasi kisi-kisi materi pelatihan yang akan dilakukan.
2	Informasi umum tentang kelas pelatihannya untuk mengetahui gambaran dari pelatihan yang akan diikuti
3	Memberikan diskon harga menggunakan voucher, untuk mengurangi harga pelatihan.
4	Notifikasi berita terbaru tentang pelatihan maupun update sesuatu yang bermanfaat, supaya pengguna tidak terlewat berita terbaru.
5	Membutuhkan testimoni dari peserta pelatihan yang sudah pernah mengikuti pelatihan agar pengguna baru dapat mengetahui kualitas pelatihan.
6	Setelah pengguna menyelesaikan tugas pelatihan dapat mengunduh langsung sertifikat.

​No	Point of view (POV) pengguna mahasiswa
1	Membutuhkan informasi tentang alur dari pelatihan sampai selesai mengikuti pelatihan.
2	Mengetahui materi pelatihan yang akan dilakukan agar mendapat gambaran dari pelatihan yang diikuti.
3	3 Dapat melihat preview materi agar dapat menyesuaikan dengan kebutuhan serta harapan calon pendaftar.
4	Membutuhkan tampilan yang simpel tapi mengandung informasi yang penting mengenai pelatihan.

Ideate

Sitemap

Desain Solusi

Wireframe

Mockup

Testing

Partisipan

Kategori	Usia	Jumlah
Mahasiswa	20 - 25	4 Orang
Pekerja	20 - 25	2 Orang

Daftar task scenario

No	​Task	Flow
1	Pendaftaran	Pada Homepage, user memilih button login/daftar User memilih button daftar. User mengisi formulir yang tersedia dan memilih button daftar. Sistem mengarahkan ke halaman login User mengisi form login.dan memilih button masuk.
2	Pengambilan kelas	Pada Homepage, user memilih menu kursus pada header. Sistem menampilkan halaman kursus. User memilih kursus yang tersedia. Sistem menampilkan halaman detail kursus. User memilih button “pesan sekarang”. Sistem menampilkan halaman metode pembayaran. User memilih metode pembayaran lalu menekan button Checkout. Sistem menampilkan detail pembayaran. User memilih button “lihat nomor rekening” Sistem menampilkan nomor rekening.
3	Mengubah Profile	Pada Homepage, user memilih foto/nama profil pada header. Sistem menampilkan dropdown berisi edit profil & daftar kelas. User memilih menu edit profil. Sistem menampilkan halaman edit profil. User merubah informasi yang tersedia pada form dan memilih button ubah. Sistem menampilkan notifikasi berwarna hijau yang berarti data berhasil disimpan.
4	Daftar kelas	Pada Homepage, user memilih foto/nama profil pada header. Sistem menampilkan dropdown berisi edit profil & daftar kelas. User memilih menu “kelas saya”. Sistem menampilkan halaman “kelas saya”. User memilih menu kategori pembelian, progres kelas dan daftar sertifikat. Sistem menampilkan halaman menu kategori pilihan user.
5	Membaca artikel	Pada Homepage, user memilih menu artikel. Sistem menampilkan halaman artikel User memilih topik/judul artikel Sistem menampilkan halaman dari artikel keseluruhan.

Hasil Kuisioner SUS

Hasil perhitungan skor SUS menunjukkan nilai terendah yang diberikan oleh partisipan kesatu yaitu 47.5 dan nilai tertinggi diberikan oleh partisipan ketiga yaitu 90 dengan nilai rata-rata adalah 76. Hasil tersebut kemudian dikonversi ke dalam kategori skor SUS dari setiap partisipan.

Pada tabel tersebut menunjukkan hasil dari user experience dari prototype website BEDA Academy dengan tingkat acceptability yang tinggi dengan grade scale B serta adjective rating good yang berarti prototype website BEDA Academy telah memenuhi aspek kepuasan pengguna. Dokumen Lengkap