Redesigning Del Institute of Technology’s website
~ Redesigning Result
Daftar isi
2.1. TAHAP I: EVALUASI WEBSITE IT DEL
2.1.1. Temuan
2.1.2. Rekomendasi
2.2. TAHAP II: EVALUASI WEBSITE UNIVERSITAS
2.2.1. Institut Teknologi Bandung
2.2.2. Universitas Bina Nusantara
2.2.3. Delf Institute of Technology (TU Delft)
2.2.4. Berkeley University of California
2.3. TAHAP III: MERANCANG ULANG WEBSITE IT DEL
2.3.1 Daftar Masalah dan Rekomendasi Perbaikan
2.3.2 Information Architecture
2.3.3 Prototype Baru Website IT Del
2.3.4 Usability Testing
2.3. TAHAP III: MERANCANG ULANG WEBSITE IT DEL
Pada bagian ini, perancangan ulang akan difokuskan ada halaman Beranda, Tentang Del, dan Program Pendidikan. Namun, pada bagian site map akan dipaparkan hasil desain ulang site map untuk keseluruhan halaman.
2.3.1 Daftar Masalah dan Rekomendasi Perbaikan
Daftar masalah dan rekomendasi perbaikan untuk website Institut Teknologi Del, berdasarkan hasil evaluasi website Institut Teknologi Del, antara lain:
- [H10T02/4] — Memperbaiki tata letak menu/susunan menu.
- [H06T04/3] — Penyajian informasi Fakta dan Angka langsung disajikan dalam 1 halaman (tanpa memisah-misahkannya dengan link).
- [H01T02/3] — Mengubah peletakan fitur Quick Access menjadi dibagian sebelah kanan halaman.
- [H01T01/3] — Mengubah konsep underlined pada judul yang bukan link.
- [H06T01/2] — Memperbaiki peletakan fitur pada sisi kanan atas halaman website sehingga sejajar.
- [H06T03/2] — Meminimalisir hyperlink yang berdekatan ke menu home.
- [H10T01/2] — Mengubah kata pencarian pada fitur pencarian sehingga menjadi lebih simple.
- [H10T03/2] — Menyesuaikan ukuran judul dan sub-judul sehingga perbedaannya terlihat antara judul dan sub-judul.
Beberapa dari daftar masalah yang diuraikan pada bahasan sebelumnya berfokus pada perbedaan penyajian informasi pada kedua bahasa website. Pada kesempatan ini, saya hanya akan berfokus pada halaman bahasa Indonesia.
2.3.2 Information Architecture
Information Architecture (IA) adalah ide untuk menyusun struktur umum dari sekumpulan informasi yang dimiliki. Pada bagian ini, information Architecture yang akan dipaparkan adalah Site Map, Task Flow, dan User Flow.
A. Site Map
Site Map adalah cara visual untuk menampilkan halaman yang representatif dari suatu website. Adapun Site Map Institut Teknologi Del yang telah di rancang ulang dapat dilihat pada Gambar 1.
Pada Site map yang telah didesain ulang, saya telah menghapus beberapa menu, mengubah sub-menu, mengubah beberapa posisi menu, dan menambahkan menu. Pada menu Tentang Del, terdapat penghapusan menu sambutan, keunggulan IT Del, dan Senat Akademik. Pada sub-menu Struktur Organisasi juga dilakukan penghapusan sub-menu level 2 dari Struktur organisasi dikarenakan informasinya akan disajikan dalam 1 halaman saja. Sedangkan pada menu Program Pendidikan dilakukan penghapusan sub-menu Kalender Akademik yang akan dipindahkan pada Beranda dan disematkan pada bagian Quick Access halaman.
B. Flow
Task Flow adalah serangkaian langkah (Flow) yang diselesaikan user untuk tugas tertentu. Sedangkan User Flow adalah jalur yang diikuti user dalam sebuah experience. Task Flow dan User Flow yang digunakan pada hasil redesign website Institut Teknologi Del, dapat dilihat pada Gambar 2.
2.3.3 Prototype Baru Website IT Del
Prototype yang telah dirancang adalah protoype untuk Beranda, menu Tentang Del, dan Menu Program Pendidikan. Tampilan Beranda hasil redesign dapat dilihat pada Gambar 3 dan Gambar 4. Hasil Redesign website IT Del menggunakan 3 warna dominan yang merupakan warna dari logo Institut Teknologi Del, yaitu ungu, biru, dan putih. Sehingga secara tidak langsung menggambarkan Institut Teknologi Del dari warna yang digunakan. Layout header halaman website diubah sehingga Logo, menu, fitur Search sejajar dan satu kolom dengan Social Bar. Fitur search yang digunakan juga telah diubah sehingga minimalis. Kalender akademik yang awalnya disajikan di menu Program Pendidikan tlah dipindahkan ke halaman Beranda pada bagian Quick Access dalam bentuk Google Event Calender.
Testimonial pada awalnya ditampilkan pada bagian quick access, saya pindahkan menjadi disajikan pada halaman utama. Sub menu dari menu Tentang Del dan Program Pendidikan dapat dilihat pada Gambar 5.
Penyajian informasi Fakta dan Angka setelah di desain ulang dapat dilihat pada Gambar 6.
Penulisan judul pada visi misi telah di ubah sehingga tidak seperti link dan menyesuaikan ukuran judul dan sub-judul sehingga perbedaannya terlihat antara judul dan sub-judul seperti pada Gambar 7.
Untuk hasil Redesign website Institut Teknologi Del dapat diakses pada:
Referensi:
- R. Sianturi, “Design Principles,” 2020. [Online]. Available: https://riyanthisianturi.com/design-principles/.
- R. Sianturi, “Wireframe, Annotation and Prototyping,” May 2020. [Online]. Available: https://riyanthisianturi.com/wireframe-annotation-and-prototyping/.
- Hettyats, “Institut Teknologi Del” . [Online]. Available: https://hettyanats.wixsite.com/protoypewebsitedel