Web• July 2026•
In-Progress
FlowDesk — Official Website
Next.js 16
TypeScript
Tailwind CSS v4
Framer Motion
Vercel
GitHub API
FlowDesk Official Website
Website resmi untuk aplikasi desktop FlowDesk — sebuah aplikasi produktivitas lokal-pertama (offline-first) yang mendukung macOS, Windows, dan Linux.
Fitur Utama Website
- Hero Section 2 Kolom — Teks di kiri, screenshot aplikasi di kanan dengan slideshow otomatis berganti setiap 5 detik (dark/light mode) menggunakan Framer Motion AnimatePresence
- Halaman Unduh Dinamis — Tombol unduhan (.dmg, .exe, .tar.gz) diambil langsung dari GitHub Releases API secara real-time. Dilengkapi accordion panduan instalasi untuk masing-masing platform
- Halaman Roadmap — Timeline zig-zag interaktif dengan animasi garis gradien yang terisi saat di-scroll. Data dikelola via file
roadmap.jsontanpa perlu menyentuh kode UI - Penghitung Unduhan Global — Animasi angka speedometer yang menampilkan total unduhan dari semua rilis GitHub (.dmg + .exe + .tar.gz)
- Dukungan Dwibahasa — Bahasa Indonesia dan Inggris penuh di seluruh halaman
- Custom Scrollbar & Progress Bar — Scrollbar kustom berwarna ungu, progress bar vertikal di sisi kiri layar mengikuti posisi scroll
- Blur-up Image Loading — Efek skeleton/blur saat gambar preview dimuat
Stack & Arsitektur
Dibangun dengan Next.js 16 (App Router + Turbopack) dan Tailwind CSS v4. Semua data rilis diambil dari GitHub API dengan revalidasi setiap 60 detik. Animasi menggunakan Framer Motion dengan useScroll, useSpring, dan AnimatePresence.