Typeface
gerobak

Gerobak, in its own design.

Mockups v3: the GitHub app design for all P0 screens, with stronger headings. One phone per state (Android 360 × 800); iOS differs only at sign-in.

Mockups v3 · 1 Nov 2026
PRD v2.0.1.1 · D29–D41
Design from the GitHub app
Example data only
Gerobak · mockups v3

The app you already have.
Now easier to read.

Every P0 screen rebuilt from the GitHub app design: same blue, same rounded white cards, same map sheet and BUKA disc. Changes so far: titles, headings and labels no longer blend into the background, and the typeface is now Manrope instead of Plus Jakarta Sans (D32).

Start with the buyer mapSee before / after
What changed from GitHub
  • Screen titles: weight 500 → 800, navy, 26 px
  • Small section labels (“DIIKUTI · 3”): 11 px light grey → 12 px bold dark grey
  • Secondary text: #8C949F (2.9:1) → #4F5B6B (6.9:1)
  • Seller Beranda gets a visible title with the shop name
  • D30: every title sits on its own white surface (header band, sheet head, cart title block), not on the grey ground
  • D31: section headings (“Menu”, “Hari ini”, “7 hari terakhir”) get their own white bands
  • D32: the typeface is Manrope; use the Typeface switch to compare with Plus Jakarta Sans, Inter, DM Sans and Nunito Sans
  • Scope follows PRD v1.8: Toko saya, Tampil ke pembeli, Pantau visibilitas, seller-owned info
  • Left out from GitHub: dark mode (not in the PRD)
01 / PEMBELI

Masuk + setuju

Google sign-in at the first action, consent, Tolak, Apple on iOS.

02 / PEMBELI

Peta

Map, Di sekitar Anda, search, no account, no location, empty.

03 / PEMBELI

Halaman gerobak

Menu, ulasan, Habis, closed, old position, follow and location.

04 / PEMBELI

Diikuti & Profil

Followed list, one alert switch, blocked alerts, “near” push.

05 / PENJUAL

Masuk & isi toko

Phone number, code, seller fills in their own shop.

06 / PENJUAL

Beranda

BUKA / TUTUP disc, location off, hidden by admin.

07 / PENJUAL

Penjualan

Three-tap sale, 7 days with a day opened per menu, no signal, closed.

08 / PENJUAL

Toko saya

Profile, photos, followers, menu editing.

09 / ADMIN

Penjual

Read-only details, one Tampil ke pembeli switch.

10 / ADMIN

Pantau visibilitas

Problems first, day timeline, WhatsApp draft.

12 / SISTEM

Design system

The app’s colours, type and parts, plus the heading fix.

F / TYPE

Font lab

The same screens in five typefaces: Plus Jakarta Sans, Inter, Manrope, DM Sans, Nunito Sans.

Static mockups (no scripts). All names, numbers, prices, places and times are example data. Maps are illustrations, not real streets. Design: the GitHub app (komangagent/discovergerobak) with the D29–D32 heading and typeface work, and D33–D36. Scope: PRD v2.0.1.1. iOS uses the same screens; only sign-in differs (Sign in with Apple).