Redesign Open source community landing page UI/UX case study
Sebuah website merupakan sarana yang sangat mudah digunakan untuk memperkenalkan suatu produk, kegiatan maupun identitas. Sarana website / landing page sangat efektif digunakan untuk menarik para pengunjung karena gratis dan mudah diakses.
Pendahuluan
DOSCOM merupakan sebuah komunitas yang berfokus pada produk, software serta kegiatan open source, Open source adalah sistem pengembangan yang tidak dikoordinasi oleh suatu individu / lembaga pusat, tetapi oleh para pelaku yang bekerja sama dengan memanfaatkan kode sumber yang tersebar dan tersedia bebas untuk tujuan tertentu.
Design website www.doscom.org (lama)
Menentukan Poin & Target
Suatu website memiliki berbagai tujuan untuk pihak terkait, misalnya untuk memperkenalkan suatu produk. Dalam hal ini suatu produk harus dapat menarik hati user serta membuat betah untuk melihat-lihat website tersebut.
Elemen yang penting pada website produk yang baik:
1. Memiliki “Tipografi” yang baik sehingga mudah dibaca serta dibedakan tiap topik yang sedang dibahas tiap section-nya.
2. Adanya CTA (Call To Action) yang jelas untuk pengunjung.
3. Testimonial / customer story juga diperlukan untuk website yang memperkenalkan suatu produk sehingga memberikan rasa pengunjung (customer trust).
4. Gambar dengan kualitas (High definition) yang bagus untuk memberikan profesionalitas pada produk terkait.
Target pengunjung utama adalah dari kalangan remaja 17–23 tahun area kota semarang dan sekitarnya, diharapkan dapat mengenal open-source serta dapat bergabung dengan komunitas.
Tantangan
Saya diberikan kesempatan mengerjakan project ini secara menyeluruh dalam hal UI/UX dan perancangan, sedangkan deadline pengerjaan memakan waktu 1 bulan dari identifikasi masalah, perancangan hingga proses desain.
Komunitas ini memiliki beberapa poin untuk disampaikan kepada pengunjung di website nantinya, diantaranya :
1. Pengenalan tentang apa komunitas ini dan bagaimana jalan kegiatanya.
2. Memiliki banyak kegiatan yang diadakan setiap tahunya serta beberapa kegiatan yang dapat diadakan sewaktu-waktu, misalnya kerja sama atau kolaborasi sesama komunitas atau pihak tertentu.
3. Pengenalan produk open source yang dikembangkan oleh komunitas.
4. Artikel serta dokumentasi kegiatan yang telah diikuti atau diselenggarakan komunitas.
5. Dokumentasi kegiatan komunitas.
Website ini diharapkan dapat menarik minat pengunjung sehingga kenal dengan dunia open source, linux dan paham makna serta cara berkontribusi pada sebuah project open source lewat komunitas DOSCOM.
Metode riset
Survey
Sebelum melanjutkan ketahap perancangan saya memerlukan beberapa informasi dasar yang akan menjadi acuan dalam menentukan desain landing page nantinya.
Survei saya lakukan secara manual dengan memberikan beberapa pertanyaan yang berkaitan dengan pemahaman open source serta linux dan komunitas ini.
Target
Pemilihan narasumber survei saya lakukan secara acak dari beberapa mahasiswa karena target komunitas ini merupakan kalangan mahasiswa (mahasiswa jurusan IT / SI khususnya), karena goal komunitas adalah mengajak para mahasiswa untuk bergabung.
Pertanyaan
Beberapa pertanyaan yang diajukan diantaranya :
- Pernahkah anda mendengar linux?
- Apa yang anda ketahui tentang open source?
- Apa yang anda ketahui tentang Doscom?
- Pernahkah mengikuti kegiatan yang diselenggarakan Doscom?
- Pernahkah mendengar tentang Tealinux OS?
- Pernahkah membaca artikel atau blog tentang open source / linux?
- Lebih suka membaca pada website yang banyak warna atau bersih?
Hasil Survey
Setelah melakukan survei, saya mendapatkan beberapa informasi yang cukup berguna dalam menentukan perancangan kedepanya, berikut hasilnya :
Setelah melakukan survei, saya mendapatkan beberapa informasi yang cukup berguna dalam menentukan perancangan kedepanya, berikut hasilnya :
Kesimpulan
1. Banyak dari target survei belum mengetahui apa itu open source.
2. Narasumber kurang begitu tahu kegiatan doscom sehingga kurang berminat mengikuti kegiatan tersebut.
3. Pengguna tealinux OS masih terhitung sedikit.
4. Topik bacaan tentang open source dan linux masih cukup banyak digemari kalangan tertentu.
5. Pembaca cenderung lebih suka membaca website yang banyak warna dan ilustrasi sebagai pemanis ketika membaca suatu artikel atau blog.
Perancangan
Setelah melakukai survei dan mendapatkan beberapa informasi, saya memisahkan struktur website (lama) dan memilahnya sehingga menemukan ide-ide lain yang harus ditampilkan diwebsite yang baru nantinya.
Riset visual
Moodboard
Saya membuat moodboard untuk menyelaraskan inspirasi dari beberapa ilustrasi dan visualisasi website nantinya.
Sketsa
Langkah ini dapat mempermudah saya dalam membuat gambaran visualisasi ide dari website.
Wireframe
Hasil dari sketsa diimplementasikan dan disusun berdasarkan elemen yang sudah ada dalam sketsa. Tahap ini berfokus pada fungsi dan susunan layout keseluruhan website.
Final Design
Thanks
Get in touch @tomeskates
