Lo-Fi Wireframe Demo
16 halaman
Demo Wireframe Klien

Peta Halaman
TuturBangsa.id

Kumpulan wireframe lo-fi seluruh halaman platform literasi Indonesia. Klik setiap kartu untuk membuka halaman yang ingin ditinjau.

16
Wireframe
4
Sesi Build
2026
TuturBangsa.id

Beranda

2 halaman
beranda
Homepage + Blueprint Sections
Halaman muka platform: hero utama, grid kanal, kurasi editorial, section audio, program, dan dual CTA. Termasuk blueprint wireframe yang menampilkan anatomi section secara keseluruhan.
lofi + blueprint →

Artikel & Arsip

4 halaman
single-pages
Halaman Artikel
Layout 2 kolom: konten artikel + sidebar penulis, populer, newsletter sticky.
article-wireframe→
arsip
Arsip Umum
Halaman arsip lintas kanal, tag, penulis, dan hasil pencarian.
arsip-wireframe→
arsip-kanal
Kanal + Switcher
Halaman kanal dengan tab switcher antar topik dan filter artikel.
kanal-wireframe→
kanal-kategori
Arsip per Kategori
Arsip artikel difilter per kanal atau kategori spesifik.
arsip-kategori-wireframe→

Podcast & Audio

1 halaman
podcast
Kanal Audio & Arsip Podcast
Hero gelap dengan player bar sticky, about host, filter season, daftar episode per season dengan animasi playing. Platform links (Spotify, Apple, YouTube).
audio-wireframe→

Terbitan & Buku

2 halaman
buku
Arsip & Detail Buku
Cover stack hero, grid buku 5 kolom, filter genre, halaman detail buku dengan cover 3D dan buy card.
terbitan-wireframe→
checkout
Checkout Buku via WA
Form 3-step: data pemesan → pengiriman → konfirmasi. Preview pesan WA otomatis, pilih kurir, metode bayar, state berhasil.
checkout-wireframe→

Program & Kelas

2 halaman
program-online
Program Online
Arsip program menulis online: hero, filter level/status, card program, halaman detail dengan enroll card dan kurikulum.
program-wireframe→
program-offline
Kelas Offline
Arsip kelas tatap muka per kota: filter kota/tanggal, detail kelas dengan instruktur, venue, dan kuota tersisa.
kelas-offline-wireframe→

Panel Pengguna

2 halaman
panel
Dashboard Pembaca & Penulis
Tab dashboard pembaca & penulis, statistik, tabel artikel, pengaturan profil, preferensi notifikasi.
dashboard-profil-wireframe→
panel
Editor Artikel Frontend
Editor 3 kolom: nav draft, canvas tulis, sidebar meta. Tab SEO, komentar redaksi, riwayat versi, mode pratinjau, state review/terbit.
editor-artikel-wireframe→

Notifikasi & Newsletter

1 halaman
notifikasi-newsletter
Notifikasi & Newsletter
Dropdown bell notifikasi, halaman semua notifikasi dengan filter tab, pengaturan preferensi per saluran (surel/situs/push), halaman newsletter publik dengan arsip edisi, dan halaman kelola langganan member.
notifikasi-newsletter-wireframe→

Onboarding & Reading Mode

1 halaman
←
58%
readingmode
Onboarding Member Baru & Reading Mode
Welcome screen → pilih topik (chip) → ikuti penulis → pilih newsletter → preferensi baca. Reading Mode 3 tema: Terang, Sepia, Gelap. Toolbar kontrol font, lebar, progress baca, text-to-speech.
onboarding-readingmode-wireframe→

Tentang & Autentikasi

1 halaman
tentang
Tentang + Login & Register
Halaman tentang: manifesto, stats, filosofi, timeline, tim, kontak. Halaman auth: login, register 3-step, lupa sandi, reset sandi.
tentang-auth-wireframe→