System Requirements Document for teknik-sipil

1. Introduction

teknik-sipil adalah aplikasi pembelajaran Android yang menyajikan ilmu pengetahuan teknik sipil dalam bentuk materi yang mudah ditelusuri, dibaca, dan dipelajari kembali oleh pembelajar di Indonesia. Aplikasi ini dirancang untuk dibuka kapan saja — di sela jam kuliah, di kos, atau di lokasi proyek — dan harus berjalan lancar di perangkat Android.

Produk ini menyasar pembelajar ilmu teknik sipil: mahasiswa, siswa SMK, dan praktisi awal yang ingin memahami dasar-dasar teknik sipil (beton, struktur, hidrologi, dan topik terkait) tanpa merasa diintimidasi oleh bahasa buku manual. Nada produk adalah ramah dan membimbing — seperti teman sekelas yang membantu, bukan dokumen institusional.

Ruang lingkup saat ini sengaja sempit: satu aplikasi Android dengan dua permukaan — Landing sebagai halaman pembuka anonim yang menjelaskan aplikasi dan mengarahkan pembelajar ke materi, dan Materials sebagai tempat pembelajar menelusuri, membuka, membaca, dan kembali ke materi. Tidak ada akun, tidak ada backend, tidak ada fitur sosial, kuis, atau sertifikasi dalam lingkup saat ini.

2. System Overview

Aplikasi teknik-sipil adalah aplikasi Android yang berjalan sepenuhnya di perangkat (offline-first, tanpa layanan server). Seluruh materi ilmu teknik sipil dikemas di dalam aplikasi sehingga pembelajar dapat membukanya tanpa koneksi internet dan tanpa hambatan.

Aktor:

• Pembelajar Ilmu Teknik Sipil — satu-satunya persona aktif. Ia membuka aplikasi, menelusuri daftar materi, membuka satu topik, membacanya, dan kembali untuk melanjutkan topik lain.

Perilaku yang diterima:

• Aplikasi berisi ilmu pengetahuan teknik sipil (materi pembelajaran).
• Aplikasi berjalan di platform Android.
• Aplikasi berjalan lancar (sukses berjalan lancar) — tanpa lag, tanpa crash, tanpa hambatan berarti saat menelusuri dan membaca.

Kepemilikan permukaan:

• Landing — permukaan pembuka publik (anonim), dimiliki aplikasi. Menjelaskan aplikasi dan mengarahkan pembelajar ke materi.
• Materials — permukaan kerja utama (anonim), dimiliki aplikasi. Menelusuri, membuka, membaca, dan kembali ke materi.

Pengecualian sempit (di luar lingkup saat ini):

• Tidak ada akun pengguna, login, atau profil.
• Tidak ada backend, API, atau sinkronisasi lintas perangkat.
• Tidak ada kuis, ujian, sertifikat, atau pelacakan nilai.
• Tidak ada unggahan materi oleh pengguna atau fitur komunitas.
• Tidak ada platform selain Android.

2a. Product Interpretation and Delivery Boundary

Aplikasi ini adalah aplikasi Android mandiri yang seluruh materinya dibundel di dalam aplikasi. Pembelajar tidak perlu membuat akun, tidak perlu login, dan tidak perlu koneksi internet untuk membaca materi. Karena tidak ada state yang harus dimiliki secara pribadi, dilanjutkan, atau diikatkan pada peserta tertentu, tidak ada identitas aplikasi yang diperlukan — kedua permukaan (Landing dan Materials) dapat diakses secara anonim.

Batas saat ini adalah: hanya dua permukaan (Landing dan Materials) dengan perilaku yang dijelaskan di dokumen ini. Segala sesuatu yang berada di luar itu — akun, backend, kuis, sertifikasi, komunitas, platform non-Android — adalah batas masa depan dan tidak dibangun sekarang.

2b. Source Content Inventory

Tidak ada direktif referensi dengan content_source yang disuplai untuk proyek ini, sehingga tidak ada Source Content Inventory yang disertakan.

2c. Page Content and Component Coverage

Landing

Informasi dan state:

• Judul hero besar tiga baris: "Belajar Teknik Sipil" / "dari pondasi" / "sampai jembatan", dengan kata "jembatan" diberi garis bawah tangan berwarna terracotta.
• Label kecil di atas judul: "MODUL 01 — PENGANTAR" dengan garis tipis mustard.
• Satu kalimat body copy yang menjelaskan aplikasi.
• Ilustrasi adegan konstruksi: karakter berhelm terracotta-teal berdiri di atas tumpukan blok beton bergaris ink, dengan jembatan kecil dan crane di belakangnya.
• Rail horizontal "geser silabus" berisi kartu mata pelajaran.
• Grid kategori 2-up (mobile) / 4-up (desktop) berisi kartu subjek berilustrasi.
• Band CTA ramah di bagian bawah.

Aksi utama:

• Menekan tombol pill "Mulai Belajar" (terracotta, garis ink, offset shadow) untuk masuk ke Materials.

Aksi pendukung:

• Menggeser rail silabus secara horizontal untuk melihat kartu mata pelajaran.
• Menekan kartu kategori untuk masuk ke Materials dengan konteks kategori tersebut.
• Menekan kartu di rail untuk masuk ke Materials dengan konteks topik tersebut.

Entitas domain:

• Mata pelajaran teknik sipil (kategori).
• Topik/materi (judul, ilustrasi spot, pill tingkat kesulitan, progress ring).

Tanggung jawab komponen:

• Hero — menampilkan judul tiga baris, kalimat body, dan CTA; ilustrasi karakter beranimasi melambai sekali saat dimuat.
• Syllabus Rail — rail horizontal yang dapat digeser; setiap kartu adalah "sticker card" (putih, garis ink 1.5px, offset shadow 4px datar, miring 1° bergantian kiri-kanan); petunjuk mustard "→ geser" yang memudar setelah geser pertama.
• Category Grid — grid kartu subjek berilustrasi dengan karakter/objek spot per kategori.
• CTA Band — band ajakan ramah menuju Materials.

State:

• Loading: kerangka kartu dengan outline ink dan offset shadow, tanpa blur atau gradien.
• Empty: tidak berlaku — konten dibundel di dalam aplikasi.
• Success: hero, rail, grid, dan CTA tampil penuh; ilustrasi melambai sekali.
• Error: tidak berlaku untuk pemuatan konten lokal; jika ilustrasi gagal dirender, frame ilustrasi tetap menampilkan blok warna datar tanpa merusak tata letak.
• Recovery: tidak ada pemulihan yang diperlukan; konten selalu tersedia secara lokal.

Materials

Informasi dan state:

• Header lengket (sticky) berisi kolom pencarian bulat dan chip filter.
• Daftar vertikal kartu topik; setiap kartu berisi ilustrasi spot kecil, judul topik, pill tingkat kesulitan, dan progress ring.
• Setiap kategori diperkenalkan oleh karakter pemandu dua-warna datar (surveyor, structural engineer, hydrologist, site manager) dengan satu baris intro bergaya bicara.
• Tampilan detail: header ilustrasi, lalu ukuran baca 68ch dengan kartu diagram inline (pembebanan balok, lapisan tanah, hidrologi) dalam gaya garis ramah yang sama.

Aksi utama:

• Mengetik di kolom pencarian untuk menyaring daftar topik.
• Menekan chip filter untuk menyaring berdasarkan kategori atau tingkat kesulitan.
• Menekan kartu topik untuk membuka tampilan detail materi.
• Membaca materi dan menggulir melalui kartu diagram inline.
• Menekan tombol kembali untuk kembali ke daftar topik.

Aksi pendukung:

• Menggulir daftar topik.
• Melihat progress ring yang menganimasikan strokenya saat muncul.

Entitas domain:

• Topik/materi (judul, kategori, tingkat kesulitan, isi bacaan, diagram inline).
• Kategori (surveyor, structural engineer, hydrologist, site manager).
• Progress ring (persentase dalam Baloo 2 di dalam ring).

Tanggung jawab komponen:

• Search Bar — kolom pencarian bulat lengket di bagian atas.
• Filter Chips — chip filter yang muncul dengan stagger 60ms.
• Topic List — daftar vertikal kartu topik dengan ilustrasi spot, pill kesulitan, dan progress ring.
• Category Guide — karakter pemandu per kategori dengan intro satu baris.
• Detail View — header ilustrasi, ukuran baca 68ch, kartu diagram inline.
• Progress Ring — ring bulat tebal dengan stroke terracotta dan persentase Baloo 2 di dalamnya.

State:

• Loading: kerangka kartu dengan outline ink dan offset shadow.
• Empty: saat pencarian/filter tidak menghasilkan topik, tampilkan pesan ramah "Belum ada topik yang cocok — coba kata kunci lain" dengan ilustrasi karakter pemandu.
• Success: daftar topik tampil; detail materi terbuka dan dapat dibaca.
• Error: tidak berlaku untuk pemuatan konten lokal; jika ilustrasi gagal dirender, frame ilustrasi tetap menampilkan blok warna datar.
• Recovery: pembelajar dapat menghapus kata kunci pencarian atau melepas chip filter untuk kembali ke daftar lengkap.

3. Functional Requirements

FR-01 — Materi ilmu teknik sipil tersedia di dalam aplikasi

• As a Pembelajar Ilmu Teknik Sipil I should dapat mengakses materi ilmu pengetahuan teknik sipil yang dibundel di dalam aplikasi so that saya dapat mempelajarinya kapan saja.
• Provenance: explicit
• Trigger/input: Pembelajar membuka aplikasi.
• Observable result: Materi teknik sipil tersedia dan dapat dibuka.
• Access state: Anonim (tanpa akun).
• Failure/recovery: Tidak berlaku — konten lokal selalu tersedia.
• Continuation: Pembelajar dapat menelusuri dan membuka topik.

FR-02 — Aplikasi berjalan di platform Android

• As a Pembelajar Ilmu Teknik Sipil I should dapat menjalankan aplikasi di perangkat Android so that saya dapat belajar dari ponsel saya.
• Provenance: explicit
• Trigger/input: Pembelajar memasang dan membuka aplikasi di perangkat Android.
• Observable result: Aplikasi terbuka dan berjalan di Android.
• Access state: Anonim (tanpa akun).
• Failure/recovery: Jika perangkat tidak kompatibel, aplikasi tidak dapat dipasang; tidak ada pemulihan dalam lingkup ini.
• Continuation: Pembelajar menggunakan aplikasi.

FR-03 — Aplikasi berjalan lancar

• As a Pembelajar Ilmu Teknik Sipil I should mengalami aplikasi yang berjalan lancar tanpa lag atau crash so that saya dapat belajar tanpa hambatan.
• Provenance: explicit
• Trigger/input: Pembelajar menelusuri, membuka, dan membaca materi.
• Observable result: Navigasi dan pembacaan materi berjalan mulus tanpa lag atau crash.
• Access state: Anonim (tanpa akun).
• Failure/recovery: Jika terjadi lag atau crash, aplikasi harus dapat dibuka kembali dan kembali ke keadaan stabil.
• Continuation: Pembelajar melanjutkan belajar.

FR-04 — Halaman pembuka menjelaskan aplikasi dan mengarahkan ke materi

• As a Pembelajar Ilmu Teknik Sipil I should melihat halaman pembuka yang menjelaskan aplikasi dan mengarahkan saya ke materi so that saya tahu harus mulai dari mana.
• Provenance: required_inference
• Trigger/input: Pembelajar membuka aplikasi.
• Observable result: Halaman Landing tampil dengan judul hero, penjelasan singkat, rail silabus, grid kategori, dan CTA "Mulai Belajar".
• Access state: Anonim (tanpa akun).
• Failure/recovery: Jika ilustrasi gagal dirender, frame ilustrasi tetap menampilkan blok warna datar tanpa merusak tata letak.
• Continuation: Pembelajar menekan CTA atau kartu untuk masuk ke Materials.

FR-05 — Pembelajar dapat menelusuri materi

• As a Pembelajar Ilmu Teknik Sipil I should dapat menelusuri daftar materi berdasarkan pencarian dan filter so that saya dapat menemukan topik yang saya butuhkan.
• Provenance: required_inference
• Trigger/input: Pembelajar mengetik di kolom pencarian atau menekan chip filter di Materials.
• Observable result: Daftar topik tersaring sesuai kata kunci atau filter.
• Access state: Anonim (tanpa akun).
• Failure/recovery: Jika tidak ada topik yang cocok, tampilkan pesan ramah dan ilustrasi pemandu; pembelajar dapat menghapus pencarian atau melepas filter.
• Continuation: Pembelajar menekan kartu topik untuk membukanya.

FR-06 — Pembelajar dapat membuka dan membaca materi

• As a Pembelajar Ilmu Teknik Sipil I should dapat membuka satu topik dan membacanya so that saya dapat memahami materi teknik sipil.
• Provenance: required_inference
• Trigger/input: Pembelajar menekan kartu topik di Materials.
• Observable result: Tampilan detail terbuka dengan header ilustrasi, ukuran baca 68ch, dan kartu diagram inline.
• Access state: Anonim (tanpa akun).
• Failure/recovery: Jika ilustrasi gagal dirender, frame ilustrasi tetap menampilkan blok warna datar.
• Continuation: Pembelajar menggulir materi dan menekan kembali untuk kembali ke daftar.

FR-07 — Pembelajar dapat kembali ke materi yang dipelajari

• As a Pembelajar Ilmu Teknik Sipil I should dapat kembali ke daftar materi dan membuka kembali topik yang pernah saya pelajari so that saya dapat mengulang dan melanjutkan belajar.
• Provenance: required_inference
• Trigger/input: Pembelajar menekan tombol kembali dari tampilan detail.
• Observable result: Daftar topik tampil kembali; progress ring menunjukkan kemajuan.
• Access state: Anonim (tanpa akun).
• Failure/recovery: Tidak berlaku — daftar selalu tersedia secara lokal.
• Continuation: Pembelajar memilih topik lain atau membuka kembali topik sebelumnya.

4. User Personas

Pembelajar Ilmu Teknik Sipil

Konteks produk: Pembelajar adalah mahasiswa, siswa SMK, atau praktisi awal di Indonesia yang ingin memahami dasar-dasar ilmu teknik sipil. Ia membuka aplikasi di sela jam kuliah, di kos, atau di lokasi proyek, sering kali dengan waktu terbatas dan perhatian yang mudah teralihkan. Ia tidak ingin merasa diintimidasi oleh bahasa buku manual atau tampilan institusional.

Tujuan utama: Mengakses materi ilmu teknik sipil dan memahaminya dengan lancar di perangkat Android.

Tanggung jawab yang diterima:

• Membuka aplikasi dan melihat halaman pembuka.
• Menelusuri materi melalui pencarian dan filter.
• Membuka satu topik dan membacanya.
• Kembali ke daftar materi dan membuka kembali topik yang dipelajari.

Input dan keputusan:

• Memilih kategori atau topik dari rail silabus dan grid kategori di Landing.
• Mengetik kata kunci pencarian atau memilih chip filter di Materials.
• Memutuskan topik mana yang akan dibuka dan dibaca.
• Memutuskan kapan kembali ke daftar untuk melanjutkan ke topik lain.

Interaksi dengan peserta lain: Tidak ada peserta manusia lain dalam lingkup saat ini. Pembelajar berinteraksi hanya dengan aplikasi dan kontennya.

Keberhasilan yang dapat diamati: Materi teknik sipil dapat diakses dan dipelajari dengan lancar di perangkat Android; pembelajar dapat menemukan topik, membacanya, dan kembali lagi tanpa hambatan.

Yang membedakan peran ini: Pembelajar adalah satu-satunya aktor manusia; fokusnya adalah pemahaman materi, bukan pengelolaan sistem, penilaian, atau administrasi. Ia tidak memiliki akun, tidak memiliki peran administratif, dan tidak berinteraksi dengan peserta lain.

5. Core User Flows

Flow 1 — Membuka aplikasi dan memulai belajar

1. Pembelajar membuka aplikasi teknik-sipil di perangkat Android.
2. Aplikasi menampilkan halaman Landing secara anonim (tanpa akun).
3. Pembelajar melihat judul hero tiga baris "Belajar Teknik Sipil / dari pondasi / sampai jembatan", kalimat penjelasan singkat, dan ilustrasi karakter berhelm yang melambai sekali.
4. Pembelajar menekan tombol pill "Mulai Belajar".
5. Aplikasi membuka halaman Materials dengan daftar topik lengkap.
6. Lanjutan: Pembelajar melanjutkan ke Flow 2.

Flow 2 — Menelusuri materi

1. Pembelajar berada di halaman Materials.
2. Pembelajar mengetik kata kunci di kolom pencarian bulat, atau menekan chip filter kategori/tingkat kesulitan.
3. Daftar topik tersaring secara langsung.
4. Jika tidak ada topik yang cocok: aplikasi menampilkan pesan ramah "Belum ada topik yang cocok — coba kata kunci lain" dengan ilustrasi karakter pemandu; pembelajar menghapus kata kunci atau melepas filter untuk kembali ke daftar lengkap.
5. Lanjutan: Pembelajar menekan kartu topik untuk membukanya (Flow 3).

Flow 3 — Membuka dan membaca materi

1. Pembelajar berada di halaman Materials dengan daftar topik.
2. Pembelajar menekan satu kartu topik.
3. Aplikasi membuka tampilan detail dengan header ilustrasi, ukuran baca 68ch, dan kartu diagram inline (pembebanan balok, lapisan tanah, hidrologi).
4. Pembelajar menggulir dan membaca materi.
5. Jika ilustrasi gagal dirender: frame ilustrasi tetap menampilkan blok warna datar tanpa merusak tata letak; pembelajar tetap dapat membaca teks.
6. Lanjutan: Pembelajar menekan tombol kembali (Flow 4).

Flow 4 — Kembali ke materi yang dipelajari

1. Pembelajar berada di tampilan detail materi.
2. Pembelajar menekan tombol kembali.
3. Aplikasi menampilkan kembali daftar topik di Materials; progress ring menunjukkan kemajuan.
4. Pembelajar memilih topik lain atau membuka kembali topik sebelumnya.
5. Lanjutan: Pembelajar melanjutkan belajar dari Flow 2 atau Flow 3.

6. Visuals Colors and Theme

Muse: Pablo Stanley — bahasa visual modular, karakter ilustrasi, warna hangat, bentuk bulat, dan copy yang berbicara langsung kepada pembelajar.

Headline arah: Friendly modular construction — teknik sipil yang berbicara seperti mentor, bukan buku teks.

Token warna (light mode)

Aturan kontras: Jangan pernah menaruh teks putih di atas mustard. Terracotta dan teal lolos AA terhadap putih dan terhadap ink.

Tipografi

• Heading: Baloo 2, weight 700–800, terminal bulat, tracking rapat (-0.01em), sentence case. All-caps hanya untuk label chip 11px dengan letterspacing 0.08em.
• Body: Nunito.
• Skala modular 1.25, mobile-first:
  • Display: 40px → 72px desktop (clamp(2.5rem, 6vw, 4.5rem))
  • H2: 28 → 40px
  • H3: 22 → 26px
  • Body: 16 → 17px, line-height 1.65
  • Caption: 13px
  • Chip: 11px bold uppercase

Bahasa bentuk

• Kartu: radius 20px, garis ink 1.5px, offset shadow 4px datar (efek stiker, bukan blur).
• Tombol dan chip: pill penuh (999px).
• Frame ilustrasi: radius 28px.
• Tile ikon: kotak bulat 44px dengan satu warna datar.
• Aksen blob dan squiggle di belakang heading.
• Tanpa hairline, tanpa glass, tanpa gradien.

Tata letak

• Mobile-first satu kolom dengan gutter 16px pada 375px.
• Desktop: grid 12 kolom dengan gutter 24px dan max-width 1120px pada 1280px.
• Landing: hero ilustrasi full-bleed → rail kartu "geser silabus" horizontal → grid kategori 2-up (mobile) / 4-up (desktop) → band CTA ramah.
• Materials: pencarian bulat lengket + chip filter → daftar vertikal kartu topik dengan ilustrasi spot, pill kesulitan, dan progress ring.
• Detail: header ilustrasi → ukuran baca 68ch dengan kartu diagram inline.
• Judul, meta, dan kontrol setiap kartu tetap sepenuhnya di dalam kontainernya pada 375, 768, dan 1280.

Gaya citra

Karakter dan objek vektor datar modular dalam semangat Open Peeps / Humaaans Pablo Stanley: site engineer berhelm dengan clipboard, tumpukan I-beam, concrete mixer, theodolite di tripod, bentang jembatan, diagram aliran air. Isian dua-warna datar dari palet dengan garis ink, tanpa gradien, tanpa fotografi. Setiap kategori subjek mendapat karakter atau objek spot sendiri; diagram balok, lapisan tanah, dan hidrologi digambar dalam gaya garis ramah yang sama.

7. Signature Design Concept

Konsep: "Papan gambar yang dipaku" — halaman pembuka terasa seperti papan pin tempat kartu-kartu silabus ditempel miring, dengan seorang insinyur kecil berdiri di atas tumpukan blok beton.

Komposisi hero (Landing):

• Latar cream #FFF6E9 penuh.
• Kiri (atas di mobile): headline Baloo 2 tiga baris ragged — "Belajar Teknik Sipil" / "dari pondasi" / "sampai jembatan" — pada clamp(2.5rem, 6vw, 4.5rem) warna ink, dengan kata "jembatan" diberi garis bawah tangan terracotta.
• Di atas headline: garis tipis mustard dan label "MODUL 01 — PENGANTAR".
• Di bawah headline: satu kalimat body copy dan tombol pill "Mulai Belajar" terracotta dengan garis ink dan offset shadow.
• Kanan (bawah di mobile): adegan ilustrasi 320–460px — karakter terracotta-teal berhelm berdiri di atas tumpukan blok beton bergaris ink, dengan jembatan kecil dan crane di belakang, meluber keluar tepi kanan pada 1280px.
• Di mobile, ilustrasi dipotong ke torso karakter dan blok sehingga tidak ada teks yang tertutup.

Signature moves:

• Headline hero tiga baris oversized dengan garis bawah tangan terracotta di bawah satu kata.
• Sticker cards: setiap kartu topik putih dengan garis ink 1.5px dan offset shadow 4px datar, miring 1° bergantian kiri-kanan di rail.
• Rail "geser silabus" horizontal di 375px yang menjadi grid 4-up di 1280px, dengan petunjuk mustard "→ geser" yang memudar setelah geser pertama.
• Karakter ilustrasi sebagai pemandu seksi: setiap kategori Materials diperkenalkan oleh karakter dua-warna datar berbeda (surveyor, structural engineer, hydrologist, site manager) dengan intro satu baris bergaya bicara.
• Progress ring bulat tebal dengan stroke terracotta dan persentase Baloo 2 di dalamnya.

8. Interaction Model & Motion Direction

Interaction Model: Animated Motion Tempo: expressive Hero Dimensionality: layered_2d

Landing Hero Motion Brief

• Focal subject: Karakter insinyur berhelm terracotta-teal yang berdiri di atas tumpukan blok beton bergaris ink, dengan jembatan kecil dan crane di belakangnya.
• Input → transformation → outcome: Saat halaman dimuat, karakter melambai sekali (input: pemuatan halaman; transformasi: lengan karakter berayun dalam satu gerakan pegas; outcome: karakter kembali ke pose diam dan halaman siap dijelajahi). Saat pembelajar menekan tombol "Mulai Belajar", tombol menskalakan 1.02 dengan cubic-bezier(0.34, 1.56, 0.64, 1) 160ms sebelum navigasi ke Materials.
• Motion vocabulary: Pegas dan ringan — kartu menskalakan 1.02 dengan 160ms cubic-bezier(0.34, 1.56, 0.64, 1) saat hover/tap; chip muncul dengan stagger 60ms; progress ring menganimasikan strokenya.
• Composed first frame: Latar cream penuh, headline tiga baris di kiri (atas di mobile), ilustrasi karakter di kanan (bawah di mobile) dalam pose diam sebelum melambai, label "MODUL 01 — PENGANTAR" di atas headline, tombol "Mulai Belajar" di bawah body copy.
• Reduced-motion state: Semua animasi runtuh menjadi perubahan state instan; ilustrasi hero menjadi frame statis; rail silabus menjadi grid yang membungkus sehingga setiap kartu dapat dibaca sepenuhnya.

9. Non-Functional Requirements

NFR-01 — Platform Android (explicit) Aplikasi harus berjalan di platform Android. Tidak ada platform lain dalam lingkup saat ini.

NFR-02 — Kelancaran (explicit) Aplikasi harus berjalan lancar: tanpa lag, tanpa crash, tanpa hambatan berarti saat menelusuri, membuka, dan membaca materi. Ini adalah hard constraint dari sumber.

NFR-03 — Offline-first (required_inference) Karena materi dibundel di dalam aplikasi dan tidak ada backend, aplikasi harus dapat digunakan tanpa koneksi internet.

NFR-04 — Aksesibilitas visual (required_inference) Teks dan kontrol yang dapat dibaca harus tetap utuh di dalam viewport dan kontainernya pada 375px, 768px, dan 1280px. Judul, label, angka, dan kontrol tidak boleh terpotong atau tertutup elemen lain. Gambar, dekorasi, dan animasi boleh dipotong atau meluber sesuai arah kreatif selama tidak menutupi teks atau kontrol yang dapat dibaca.

NFR-05 — Reduced motion (required_inference) Di bawah prefers-reduced-motion, semua animasi harus runtuh menjadi perubahan state instan dan rail silabus harus menjadi grid yang membungkus sehingga setiap kartu dapat dibaca sepenuhnya.

NFR-06 — Kontras warna (required_inference) Terracotta #E4572E dan teal #2A9D8F lolos AA terhadap putih dan terhadap ink #1F2A37. Teks putih tidak boleh diletakkan di atas mustard #F2B705.

10. Tech Stack

• Platform: Android (aplikasi native/Android-first).
• UI: Komponen UI kustom sesuai arah kreatif — kartu stiker, pill, progress ring, rail horizontal.
• Konten: Materi ilmu teknik sipil dibundel di dalam aplikasi (offline-first, tanpa backend).
• Font: Baloo 2 (heading), Nunito (body).
• Tidak ada backend, API, atau layanan server dalam lingkup saat ini.

11. Assumptions and Constraints

Asumsi:

• A-01: Materi ilmu teknik sipil disediakan sebagai konten yang dibundel di dalam aplikasi; tidak ada mekanisme pengunggahan atau pembaruan konten dari server dalam lingkup saat ini. (required_inference)
• A-02: Aplikasi tidak memerlukan akun, login, atau identitas pengguna karena tidak ada state yang harus dimiliki secara pribadi atau dilanjutkan lintas sesi. (required_inference)
• A-03: Progress ring menunjukkan kemajuan belajar yang tersimpan secara lokal di perangkat. (required_inference)

Batasan:

• C-01: Aplikasi ditujukan untuk platform Android. (explicit)
• C-02: Aplikasi harus berjalan lancar. (explicit)
• C-03: Hanya dua permukaan yang dibangun: Landing dan Materials. (explicit — page contract)
• C-04: Tidak ada akun, backend, kuis, sertifikasi, komunitas, atau platform non-Android dalam lingkup saat ini. (explicit — batas lingkup)

12. Glossary

• Pembelajar Ilmu Teknik Sipil — persona aktif tunggal; pengguna yang mempelajari ilmu teknik sipil melalui aplikasi Android.
• Landing — halaman pembuka anonim yang menjelaskan aplikasi dan mengarahkan pembelajar ke materi.
• Materials — halaman kerja utama tempat pembelajar menelusuri, membuka, membaca, dan kembali ke materi.
• Sticker card — kartu putih dengan garis ink 1.5px dan offset shadow 4px datar, miring 1° bergantian di rail.
• Progress ring — ring bulat tebal dengan stroke terracotta dan persentase Baloo 2 di dalamnya.
• Rail silabus — baris kartu mata pelajaran yang dapat digeser horizontal di Landing.
• Offline-first — aplikasi dapat digunakan tanpa koneksi internet karena seluruh materi dibundel di dalam aplikasi.