Available for Hire
ZB

Memuat...

Gerbang Semar — MAN 1 Kota Malang
Kembali
Full Stack 2025 Featured

Gerbang Semar — MAN 1 Kota Malang

Portal layanan digital terpadu MAN 1 Kota Malang — gerbang akses cepat ke 19+ layanan madrasah mulai dari legalisasi ijazah, pengaduan, hingga akademik dengan fitur aksesibilitas inklusif.

Tentang Projek

Gerbang Semar adalah portal layanan digital yang dibangun untuk Madrasah Aliyah Negeri 1 Kota Malang, salah satu madrasah unggulan di Jawa Timur. Platform ini menyatukan seluruh layanan madrasah ke dalam satu pintu akses yang elegan dan mudah digunakan. Terdapat 3 kategori layanan utama: PTSP (13 layanan seperti legalisasi ijazah online, PMBM, aplikasi surat masuk), Aduan & Informasi (Sukasam, PPID, Pengaduan Masyarakat/WBS), dan Akademik (CAT, DIGILAB, Buku Digital). Yang membuat portal ini istimewa adalah fitur aksesibilitas inklusif — pengguna dapat mengatur ukuran teks, kontras tinggi, dan spasi baris untuk memastikan semua orang dapat mengakses layanan dengan nyaman. Didesain dengan pendekatan mobile-first dan progressive web app untuk performa optimal di semua perangkat.

Tech Stack

Laravel Vite TailwindCSS

Tantangan

  • Merancang arsitektur portal yang mengakomodasi 19+ layanan dengan navigasi yang intuitif
  • Mengimplementasikan fitur aksesibilitas inklusif (teks scaling, high contrast, line spacing) tanpa mengorbankan estetika
  • Mengintegrasikan berbagai layanan online dan offline dalam satu antarmuka yang kohesif

Solusi

  • Layout berbasis card grid dengan kategorisasi layanan yang jelas dan visual hierarchy yang kuat
  • Custom accessibility panel dengan CSS variables untuk real-time font scaling dan contrast adjustment
  • Progressive disclosure pattern — pengguna melihat ringkasan layanan terlebih dahulu, lalu detail saat dibutuhkan