Company ProfilePersonal2025

Faith Dev Lab: Website Agensi Digital

Faith Dev Lab adalah brand agensi web pribadi yang menaungi jasa web development, desain UI/UX, dan SEO dalam satu identitas, dibangun di sekitar tagline "We feel, we form, we fulfill, so you flourish" yang merangkum janji memadukan desain kuat dengan performa nyata yang benar-benar bekerja. Karena belum punya pekerjaan klien untuk ditunjukkan, situs ini sengaja dibangun agar sekaligus jadi bukti nyata dari apa yang bisa dihasilkan agensinya sendiri.

Kunjungi Website Kembali ke Proyek

Preview

Jelajahi Situsnya

Tampilan situs jadi yang bisa di-scroll, persis seperti yang dilihat pengunjung.

Desktop

Mobile

Tech Stack

Teknologi Penggerak Proyek

Tools dan teknologi yang digunakan untuk mewujudkan proyek ini.

Peran

Rincian per Skill

Tiap proyek memanfaatkan kombinasi berbagai disiplin, begini gambarannya di proyek ini.

Web Development

Membangun situs dengan Next.js 16 App Router, React 19, dan TypeScript.
Menyusun halaman sebagai layout single-page dengan navigasi berbasis anchor melalui Hero, About, dan Services.
Membangun komponen teks typewriter yang bisa dipakai ulang dengan react-simple-typewriter untuk bagian hero.
Mengoptimasi delivery gambar, JS, dan CSS untuk mencapai skor Google PageSpeed hijau di keempat kategori.

Web Design

Merancang layout single-page yang gelap dan minimal, dibangun di sekitar warna brand hitam putih milik agensi sendiri.
Menambahkan latar belakang gradient animasi yang halus di belakang bagian hero.

Graphic Design

Membuat aset gambar situs dan menata ulang logo yang sudah ada agar sesuai dengan situsnya.
Membuat favicon situs.
Mengompres setiap gambar ke WebP dan di bawah 200KB sebelum diunggah, tanpa penurunan kualitas yang terlihat.

Digital Marketing

Menulis meta tag SEO dan data Open Graph untuk merepresentasikan agensi di pencarian dan share sosial.
Menulis copy pembeda agensi (pengerjaan cepat, eksekusi pixel-perfect, budget transparan, konsultasi gratis, kode yang bersih, dukungan berkelanjutan) untuk membedakan positioning-nya dari pitch agensi generik.

Sorotan

Di Balik Layar

Tinjauan lebih dekat soal apa yang ditawarkan produk jadinya, hambatan di sepanjang jalan, dan hasil akhirnya.

Fitur Utama

Desain full responsive di perangkat desktop dan mobile.
Gambar dioptimasi untuk loading cepat.
Tiga layanan inti yang disorot, Web Development, UI/UX Design, dan SEO Optimization.
Layout single-page dengan navigasi berbasis anchor lewat Hero, About, dan Services.
Komponen teks typewriter yang bisa dipakai ulang, menghidupkan bagian hero.
Latar belakang gradient animasi di belakang bagian hero.
Tema gelap dibangun di sekitar warna brand hitam putih milik agensi sendiri.

Tantangan yang Dihadapi

Membangun di Atas Stack yang Baru Saja Rilis

Next.js 16, React 19, dan Tailwind CSS v4 semuanya baru saja dirilis, jadi jauh lebih sedikit contoh dan solusi komunitas yang bisa diandalkan dibanding versi yang lebih mapan. Diatasi dengan mengandalkan langsung dokumentasi resmi dan AI coding assistant.

Mencapai Skor Google PageSpeed Sempurna

Mendapatkan skor hijau di keempat kategori PageSpeed membutuhkan optimasi hati-hati untuk delivery gambar, JS, dan CSS di banyak breakpoint perangkat.

Pelajaran yang Didapat

Membangun situs marketing agensi sendiri juga jadi kesempatan untuk menjajal Next.js 16 dan React 19 sebelum dipakai di pekerjaan klien.
Format single-page dengan cuma tiga bagian inti sudah cukup untuk menyampaikan pitch dengan jelas, tanpa perlu penjelasan berlebihan.
Mengadopsi upgrade versi major (Tailwind CSS v4) di proyek pribadi berisiko rendah dulu membuatnya jauh lebih aman untuk dibawa ke pekerjaan klien nantinya.

Dampak

Masalah yang Terselesaikan Setelah Rilis

Bagaimana proyek ini mengubah keadaan bagi bisnis dan penggunanya setelah rilis.

Kehadiran web yang kredibel

PageSpeed hijau di keempat kategori

Gambar di bawah 200KB

Redesain penuh

Perbaikan Kritis

Agensi Web Tanpa Website Sendiri

Sebelum

Faith Dev Lab tidak punya situs sendiri untuk ditunjukkan ke prospek sambil menawarkan jasa web development ke orang lain.

Sesudah

Sekarang punya situs yang live dan profesional untuk dibagikan langsung ke prospek, mengubah kehadiran web agensi sendiri jadi bagian dari pitch-nya.

Performa

Skor Google PageSpeed di Bawah Target

Sebelum

Performa awal tidak konsisten di keempat kategori Google PageSpeed.

Sesudah

Optimasi berkelanjutan untuk delivery gambar, JS, dan CSS membawa keempat kategori jadi hijau semua.

Performa

Halaman Lambat Akibat Gambar yang Tidak Dioptimasi

Sebelum

Gambar beresolusi tinggi di seluruh situs, bukan cuma satu bagian, berisiko memperlambat setiap halaman.

Sesudah

Setiap gambar di seluruh situs dikompres ke WebP dan dijaga di bawah 200KB, menjaga halaman tetap cepat tanpa penurunan kualitas yang terlihat.

Peningkatan

Tampilan Usang yang Tidak Sesuai Ambisi Agensi

Sebelum

Versi situs sebelumnya terlihat usang dan belum sepenuhnya responsif di berbagai perangkat.

Sesudah

Didesain ulang jadi pengalaman yang modern, elegan, dan sepenuhnya responsif yang lebih mencerminkan kemampuan desain agensi sendiri.