/ Proyek / Website Profil Sekolah - SDI AM FATWA

Website Profil Sekolah - SDI AM FATWA

Repository
DjangoTailwind CSSJazzmin DashboardJavascriptHtml Css
Cover proyek Website Profil Sekolah - SDI AM FATWA

🚩 Latar Belakang

Di era digital, kredibilitas sebuah institusi pendidikan sering kali dinilai pertama kali melalui kehadiran daringnya. SDI AM FATWA, sebuah sekolah dasar yang berfokus pada pendidikan karakter Qur’ani, membutuhkan media informasi terpusat untuk menjangkau wali murid dan calon siswa baru.

Tantangan utamanya adalah menyajikan informasi yang padat (Visi Misi, Kurikulum, Berita) ke dalam antarmuka yang bersih, mudah dinavigasi (user-friendly), dan mencerminkan nilai-nilai Islami yang modern.

🛠️ Solusi & Pendekatan Teknis

Saya merancang website ini dengan pendekatan “Information-First Design”, memastikan orang tua murid dapat menemukan informasi krusial dalam hitungan detik.

1. Visual Identity & UI Design

Menggunakan palet warna dominan Hijau Zamrud dan Emas untuk membangun kesan Islami, tenang, dan berprestasi. Layout dibuat lapang (spacious) dengan whitespace yang cukup agar konten teks tentang kurikulum dan program sekolah nyaman dibaca.

2. Struktur Informasi Terpadu

Saya membagi halaman beranda menjadi beberapa segmen strategis:

  • Hero Section: Pesan utama yang kuat (“Mencetak Generasi Qur’ani”).
  • Profil Singkat: Kartu Visi & Misi yang interaktif.
  • Pojok Berita: Integrasi artikel terbaru untuk update kegiatan sekolah.
  • Statistik: Counter animasi untuk jumlah siswa dan guru guna membangun kepercayaan (Social Proof).

3. Optimasi Konversi (PPDB)

Untuk memudahkan proses Penerimaan Peserta Didik Baru (PPDB), saya menempatkan tombol Call-to-Action (CTA) yang menonjol di bagian bawah (“Daftarkan Putra-Putri Anda Sekarang”) yang terhubung langsung ke API WhatsApp admin sekolah.

🚀 Fitur Utama

  • Responsive Layout: Tampilan otomatis menyesuaikan layar HP orang tua murid yang mengakses informasi secara mobile.
  • Agenda Digital: Fitur untuk menampilkan jadwal kegiatan sekolah mendatang secara real-time.
  • Galeri Kegiatan: Showcase dokumentasi ekstrakurikuler dan prestasi siswa.
  • Fast Loading: Dibangun dengan arsitektur Static Site Generation (SSG) agar website dimuat instan tanpa loading lama.

🎓 Pelajaran yang Didapat

Proyek ini mengasah kemampuan saya dalam menerjemahkan brand value sebuah institusi pendidikan ke dalam desain antarmuka. Saya juga belajar pentingnya hierarki informasi agar pengunjung tidak merasa “dibanjiri” teks saat mencari informasi spesifik tentang sekolah.