Portofolio pribadi ini dibuat untuk memberi pengunjung, entah calon klien atau recruiter, gambaran jelas soal apa yang saya kerjakan, skill yang saya bawa, dan proses detail di balik setiap proyek yang sudah saya bangun.
Tampilan situs jadi yang bisa di-scroll, persis seperti yang dilihat pengunjung.
Desktop
Mobile
Tools dan teknologi yang digunakan untuk mewujudkan proyek ini.
Tiap proyek memanfaatkan kombinasi berbagai disiplin, begini gambarannya di proyek ini.
Tinjauan lebih dekat soal apa yang ditawarkan produk jadinya, hambatan di sepanjang jalan, dan hasil akhirnya.
Konsistensi Animasi di Seluruh Bagian
Tiap bagian awalnya punya delay animasi yang tidak konsisten, distandarkan jadi satu hierarki delay tunggal: label, lalu judul, lalu deskripsi, lalu konten.
Konflik Hover Framer Motion
Menggabungkan animasi entrance dengan efek hover-lift di elemen yang sama diam-diam merusak hover-nya, karena inline transform style Framer Motion selalu menang atas class hover Tailwind. Diperbaiki dengan memisahkan efek entrance dan hover, masing-masing di elemen luar dan dalam.
Status Bar iOS yang Transparan
Konten sempat bocor ke area status bar di iOS 26, diselesaikan dengan navbar full-width yang menutupi strip paling atas viewport saat scroll.
Kedip Peluncuran PWA di iOS
iOS sekilas menampilkan launch placeholder-nya sendiri sebelum first paint, yang tidak bisa disentuh kode aplikasi, jadi solusinya adalah menerima satu kedip yang bersih alih-alih menumpuk workaround yang justru membuatnya lebih buruk.
Bagaimana proyek ini mengubah keadaan bagi bisnis dan penggunanya setelah rilis.
Kerentanan ditambal
Gambar di bawah 200KB
Pipeline gambar yang lebih cepat
Status bar yang bersih
Showcase skill dan pekerjaan yang detail
Sebelum
Situs berjalan di versi Next.js lama dengan kerentanan keamanan yang sudah diketahui publik.
Sesudah
Diupgrade ke versi yang sudah ditambal tanpa perubahan yang terlihat pada perilaku situs.
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.
Sebelum
Tanpa sharp terinstall, Next.js jatuh ke image processor WASM yang lebih lambat di produksi.
Sesudah
Menginstall sharp mempercepat optimasi dan delivery gambar di setiap halaman.
Sebelum
Di iOS 26, konten halaman sempat bocor sekilas ke area status bar yang transparan.
Sesudah
Navbar full-width yang sadar scroll menjaga area status bar tetap bersih.
Sebelum
Tidak ada satu tempat pun yang menyajikan gambaran lengkap dan detail soal skill dan proses kerja saya untuk pengunjung.
Sesudah
Portofolio ini sekarang jadi studi kasus teknis yang detail dan bisa langsung ditinjau klien dan recruiter.
