Loading image 1...
WebsiteMandiriAutisma
Desain UI/UX dan Implementasi WPBakery Page Builder untuk Pusat Terapi
_khK8dRdJS.png&w=3840&q=75)
Website Mandiri Autisma
Website Mandiri Autisma
Desain UI/UX dan Implementasi WPBakery Page Builder untuk Pusat Terapi
Desain UI/UX dan Implementasi WPBakery Page Builder untuk Pusat Terapi
Mendesain UI/UX lengkap di Figma dan membangun website resmi menggunakan WPBakery Page Builder dalam WordPress. Pendekatan ini memastikan klien dapat dengan mudah mengelola program terapi, pembaruan galeri, dan konten via antarmuka drag-and-drop visual, sekaligus mempertahankan kesesuaian visual tinggi yang ditetapkan dalam desain.
Masalah & Tantangan
Tantangan utamanya adalah menyeimbangkan kredibilitas profesional yang dibutuhkan pusat terapi dengan antarmuka yang hangat dan mengundang, sekaligus memberi klien backend yang andal dan non-teknis (WordPress dengan WPBakery) untuk mengelola pembaruan konten yang sering (program, testimoni, dan jam operasional).
Mengembangkan situs menggunakan tema dasar ringan dan mengimplementasikan logika desain Figma kustom via WPBakery Page Builder. Menggunakan PHP untuk logika backend, termasuk Custom Post Type untuk menyusun kartu "Program" dan galeri, serta membuat elemen WPBakery khusus untuk memastikan kesesuaian visual tinggi dan penyuntingan konten yang mudah bagi klien.
Perjalanan Visual
Showcase Proyek
Loading image 1...
Tangkapan Layar 1
Visualisasi proyek dan desain antarmuka
StackTeknologi
WordPress CMS
CMS
WPBakery Page Builder
Page Builder/Editor Visual
PHP
Bahasa Backend
HTML5 / CSS3
Frontend
Tailwind CSS (via integrasi kustom)
Styling
Figma
Desain UI/UX
FiturUtama
Banner Layanan Gratis Berdampak Tinggi
Banner header menonjol dan berwarna yang mengiklankan "Layanan Terapis GRATIS" dengan jam operasional dinamis dan metode kontak (WhatsApp, Telepon).
Modul Program Terintegrasi WPBakery
Membuat elemen WPBakery kustom yang terhubung ke Custom Post Type WordPress untuk menyusun program unik (Fun Sport, Bina Tani, dll.), memastikan penyuntingan klien yang mudah.
Desain UI/UX yang Mengedepankan Empati
Menerapkan estetika hangat dan profesional (hijau dan kuning) yang dirancang untuk menumbuhkan kepercayaan dan mengurangi kecemasan orang tua yang mencari bantuan.
Showcase Testimoni dan Kepercayaan
Modul khusus (kartu biru) untuk menampilkan liputan media, logo otoritas, dan testimoni klien untuk meningkatkan kredibilitas.
Galeri Fasilitas dan Kepercayaan
Galeri foto fleksibel dan terkelola yang menampilkan fasilitas luar ruang dan ruang terapi pusat, mudah diperbarui via Media Library WordPress.
Aksesibilitas Mobile yang Dioptimalkan
Implementasi desain mobile-first penuh di semua modul, memastikan keterbacaan tinggi dan akses mudah ke kontak terapi di layar kecil.
ProsesKami
Pandangan detail tentang bagaimana kami mewujudkan proyek ini dari konsep hingga kenyataan melalui metodologi kami yang terbukti.
Desain & Strategi Visual (Figma)
Menetapkan persona pengguna utama dan membuat mockup high-fidelity untuk landing page dan kartu program di Figma.
Setup WPBakery & Pembuatan Elemen Kustom
Mengonfigurasi WordPress dan WPBakery. Menulis kode elemen WPBakery berbasis PHP kustom dan CSS yang diperlukan untuk mengimplementasikan desain Figma dan memastikan kesesuaian visual di dalam lingkungan page builder.
Integrasi Konten & Pelatihan Klien
Mengintegrasikan konten awal (program, galeri). Melakukan pelatihan penuh untuk klien tentang penggunaan editor visual WPBakery dan dashboard WordPress untuk pengelolaan mandiri.
QA Akhir & Deployment
Menjalankan QA akhir, memastikan stabilitas lintas browser dan menguji fungsi editor visual. Peluncuran akhir ke lingkungan produksi.
04 Hasil yang diserahkan
- 01Menciptakan desain visual yang empatik dan profesional yang sesuai untuk pusat terapi.
- 02Memberi klien antarmuka WPBakery/WordPress yang intuitif untuk mengelola sendiri semua konten halaman dan detail program.
- 03Berhasil mengorganisir informasi program yang kompleks ke dalam modul WPBakery yang mudah dicerna dan ramah editor.
- 04Menerapkan banner berkontras tinggi yang jelas untuk mendorong pendaftaran program layanan gratis.
Website yang didesain ulang ini hangat dan profesional. Orang tua langsung tahu cara menghubungi kami dan jelas melihat ragam program unik yang kami tawarkan. Backend WordPress-nya intuitif dan sempurna untuk dikelola tim kami.