Design system v0.1

Warm, cozy and readable on small, cheap phones. Every screen uses only these colors, sizes and parts. Game text is in Bahasa Indonesia.

Colors

Background
#FFF8EE
Ink (text)
#2B2A33
Muted text
#6E6A7C
Primary action
#E07A2F
Money / success
#2F9E6A
Gold coins / paid
#F2B705
Danger / late
#D64545
Info / level
#3B7DD8
Plot ground
#BFE3A4
Room tile
#FCE3C4
Facility tile
#CFE7F5
Stairs tile
#DDD5EC

Type

Phone system font (no download, fast on cheap phones).

28 · Big numbers, celebrations
22 · Screen titles
18 · Card titles
15 · Body text (minimum for reading)
13 · Details, list rows
11 · Tile labels and chips only

Spacing and touch

4
8
12
16
24
32

Every button and tile is at least 44 px tall so it is easy to tap with a thumb.

Buttons

BangunPrimary
Tagih sewaMoney
⚡ 🪙 15Gold / ad reward
BatalSecondary
LanjutText
TolakDanger
BangunDisabled
PilihSmall

Header pills

Rp 3.450.000🪙 45★ 3,8Lv 4

Grid tiles (all states)

🙂🛏️Occupied
😐!🛏️Rent late
3🛏️Empty
🔧🛏️Needs repair
🚧Building
🛏️Garden🌳+
🍳Facility
🌳Garden
🪜Stairs
+ Empty
+ Can build
Selected
Blocked

Cards, chips, bars, messages

Card

Default list item

Highlighted card

Selected or recommended

Muted card

Locked or done
NeutralWi-Fi ✓AC ✗Sifat: Rapi+13%
+Rp 1.750.000 sewa masuk 🎉
Pembayaran gagal

Pop-ups: bottom sheet for choices about one thing (room, build, confirm); centered dialog for reports and events. Both dim the game behind.

Bottom navigation