laser-mlbb

bytown 888

Buatkan saya script 1 hit mlbb

No preview

Comments (0)

No comments yet. Be the first!

System Requirements

System Requirements Document for laser-mlbb

1. Introduction

laser-mlbb is an Android application (APK) and companion website for teaching young Indonesian children to read. The product is a legitimate home-literacy tool: a parent or guardian sets up and monitors a child's reading practice, while the child works through letters (huruf), syllables (suku kata), and words (kata) in short, repeatable sessions on a phone.

The product intent is derived from the user's final and controlling request — "Bikinkan saya apk belajar anak membaca" — which supersedes all earlier requests in the thread. The earlier requests for a "1 hit MLBB" script, an MLBB APK tool, a rank-match boot-opponent tool, a Township card-sending tool, an Indonesian PPTP VPN server, and Tenda W15E v1 firmware are explicitly rejected and out of scope; they are not part of this product in any form.

The audience is Indonesian families: a companion/parent who prepares material and watches progress, and a child roughly ages 4–8 who practices reading. The tone is warm, safe, playful, and encouraging — a friendly picture-book object, never clinical, never gamer-cheaty, never cold enterprise.

Page 1 of 28

2. System Overview

laser-mlbb is delivered as a first-party application with its own identity and custom UI. It consists of:

  • A public entry surface (Landing) that explains the reading app, its audience, and its practice function before any protected data is reached.
  • Identity access surfaces (Sign Up, Login) that let a companion register themselves and let both companion and child verify themselves again before reaching saved practice or progress.
  • Authenticated working surfaces (Dashboard, Learning Path, Reading Practice, Progress) where the child continues and completes reading sessions and the companion reviews results.

The application owns its own identity because durable, actor-specific state must persist: a child's practice progress must remain bound to the correct child, and a companion must be able to return and see that child's results. The child–companion relationship is established so that practice results are recorded against the right child.

Actors. Two accepted human personas: Orang Tua / Pendamping Anak (parent/companion) and Anak Pembelajar (child learner). The application backend is a non-persona system actor.

Narrow exclusions. No game-cheat or hack capability of any kind (no "1 hit", no boot-opponent tool, no card-sending tool). No PPTP VPN server. No Tenda W15E v1 firmware — official firmware must be obtained from Tenda's official site. No dark mode as the default surface. No blue-indigo primary on a white ground.

Page 2 of 28

2a. Product Interpretation and Delivery Boundary

The product is a children's reading-practice application. Its whole purpose is repetition of letters, syllables, and words in a calm, encouraging loop, with a companion able to see how the child is doing.

Delivery and access ownership. The Landing page is publicly reachable and carries no protected data. Sign Up and Login are the anonymous entry boundaries where identity is established and verified. Dashboard, Learning Path, Reading Practice, and Progress require a verified identity; Learning Path and Reading Practice are the child's working surfaces, and Progress is the companion's review surface. Identity is application-owned because progress must persist and remain bound to the correct child across sessions.

Current vs. future. Everything described in this document is current. No future-horizon features are accepted. The rejected requests (game cheats, VPN server, router firmware) are permanently out of scope and are not future work.

2b. Source Content Inventory

Not applicable — no reference directive in this project declares content_source.

2c. Page Content and Component Coverage

Page 3 of 28

Landing

  • Information/state: Public, no identity required. Explains that this is an app for children learning to read; names the two audiences (child learner and parent/companion); describes the practice function (letters, syllables, words) and that progress is tracked.
  • Primary action: "Mulai Belajar" pill CTA in teal (#1F6E6A) with white text, leading to Sign Up (new companion) or Login (returning).
  • Supporting actions: Right-aligned Jost uppercase nav row linking to Login and Sign Up; small wordmark "laser-mlbb" in Jost uppercase with 0.16em tracking at top-left.
  • Domain entities: none persisted; static explanatory content only.
  • Component responsibilities: Asymmetric two-panel hero — left cream type panel (5/12) with oversized Jost 800 headline "Belajar Membaca, Satu Huruf Setiap Hari" (word "Membaca" in tomato #E24B2E), CTA, and a small ruled parent-reassurance line in Literata; right teal (#1F6E6A) colour block (7/12) bleeding off the right edge holding three overlapping letter tiles — 'B' in cream, 'A' in mustard (#E0A32E), 'C' in tomato (#E24B2E) — each a rounded square with a 4px offset solid shadow, plus one small illustrated child silhouette reading at the bottom corner. A thin ruled baseline in muted (#C9B79C) runs the full width beneath both panels.
  • States: Loading — static content, no loading state required. Empty — not applicable. Success — page renders fully. Error — not applicable (no data fetch). Recovery — not applicable. On mobile the two panels stack: headline first, then the teal block with letter tiles scaled to fit, CTA pinned beneath the headline.
Page 4 of 28

Login

  • Information/state: Anonymous entry surface. Verifies a returning companion or a returning child before granting access to saved practice or progress.
  • Primary action: Submit credentials to verify identity and continue to Dashboard.
  • Supporting actions: Link to Sign Up for users without an account; link back to Landing.
  • Domain entities: Account identity (companion or child), session.
  • Component responsibilities: Credential input fields, submit control, error messaging region, navigation links.
  • States: Loading — submit control shows in-progress state during verification. Empty — fields empty on first render. Success — verified identity proceeds to Dashboard. Error — invalid credentials show an inline message and keep the user on Login. Recovery — user may retry entry or navigate to Sign Up.
Page 5 of 28

Sign Up

  • Information/state: Anonymous entry surface. Self-service registration for a companion starting to use the app to prepare and monitor a child's learning.
  • Primary action: Create the companion account and continue to Dashboard.
  • Supporting actions: Link to Login for existing users; link back to Landing.
  • Domain entities: Companion account identity, session.
  • Component responsibilities: Registration input fields, submit control, validation and error messaging region, navigation links.
  • States: Loading — submit control shows in-progress state during account creation. Empty — fields empty on first render. Success — account created, companion proceeds to Dashboard. Error — invalid or incomplete input shows an inline message and keeps the user on Sign Up. Recovery — user may correct input and resubmit, or navigate to Login.
Page 6 of 28

Dashboard

  • Information/state: Authenticated hub. Routes the companion toward the child's progress and the child toward practice or continuation of learning.
  • Primary action: Select a destination — Learning Path (child), Reading Practice (child), or Progress (companion).
  • Supporting actions: Sign out; return to Landing.
  • Domain entities: Companion account, child profile, child–companion relationship, current practice position.
  • Component responsibilities: Modular tile grid (2 cols mobile, 3 cols tablet, 4 cols desktop) where each tile is a category — Huruf (teal), Suku Kata (mustard), Kata (tomato), Kemajuan (walnut #6B4A2E) — in its own flat colour.
  • States: Loading — tiles render with placeholder state while the child's current position is fetched. Empty — a newly registered companion with no child linked yet sees the setup prompt to establish the child relationship. Success — tiles show current categories and continuation point. Error — fetch failure shows a retry control. Recovery — retry re-fetches; user may sign out and return.
Page 7 of 28

Learning Path

  • Information/state: Authenticated, child-facing. Shows the ordered sequence of exercises and the continuation point so the child can resume the next learning session.
  • Primary action: Select the current or next exercise tile to enter Reading Practice.
  • Supporting actions: Scroll the track; return to Dashboard.
  • Domain entities: Exercise sequence (letters, syllables, words), completion state per exercise, current continuation point.
  • Component responsibilities: Horizontal, scrollable film-strip track of numbered tiles on a ruled baseline; the current tile is marked by a tomato accent fill. Under prefers-reduced-motion the track becomes a wrapping grid.
  • States: Loading — track renders with placeholder tiles while sequence and completion state are fetched. Empty — no exercises available shows a calm explanatory state. Success — track shows numbered tiles with the current tile accented. Error — fetch failure shows a retry control. Recovery — retry re-fetches; user may return to Dashboard.
Page 8 of 28

Reading Practice

  • Information/state: Authenticated, child-facing working surface. The child follows and completes a reading session of letters, syllables, and words.
  • Primary action: Choose one of three answer tiles beneath the displayed letter/syllable/word.
  • Supporting actions: Advance to the next item after a correct answer; return to Learning Path.
  • Domain entities: Current exercise item, answer options, correctness result, session progress.
  • Component responsibilities: Single centred stage — one giant letter/syllable/word in Jost 700–800 at large size (never below 32px) with three answer tiles beneath; a parent strip pinned at the bottom. Letter tiles press down 2px with their shadow collapsing; a correct answer gets a single warm pulse of the tomato accent.
  • States: Loading — stage renders with placeholder while the exercise item is fetched. Empty — no exercise available shows a calm explanatory state. Success — correct answer pulses tomato and advances to the next item. Error — incorrect answer shows a gentle non-punitive indication and allows retry; fetch failure shows a retry control. Recovery — child may retry the item or return to Learning Path.
Page 9 of 28

Progress

  • Information/state: Authenticated, companion-facing. Shows the child's reading results and progress.
  • Primary action: Review the child's results and progress.
  • Supporting actions: Return to Dashboard.
  • Domain entities: Child profile, session results, progress over time, category breakdown (letters, syllables, words).
  • Component responsibilities: Calm editorial report — ruled rows, aligned label/value pairs in Jost uppercase labels beside Literata values, and one warm mid-century chart in teal/mustard/tomato. No cards, no gauges, no blue.
  • States: Loading — report renders with placeholder rows while results are fetched. Empty — a child with no completed sessions shows a calm explanatory state. Success — report shows results and progress. Error — fetch failure shows a retry control. Recovery — retry re-fetches; user may return to Dashboard.
Page 10 of 28

3. Functional Requirements

FR-1 — Public explanation of the reading app As a visitor (parent/companion or child), I should see a public Landing page that explains the reading app, its audience, and its practice function, so that I understand what the product is before any identity or protected data is involved. (provenance: required_inference; lifecycle: initiator = visitor, participant = none beyond initiator, result = informed visitor, failure/recovery = not applicable, continuation = proceed to Sign Up or Login)

FR-2 — Companion self-registration As a parent/companion, I should be able to register myself on the Sign Up page before preparing and monitoring my child's learning, so that my child's practice and progress are bound to my account. (provenance: required_inference; lifecycle: initiator = companion, participant = application (creates account), result = companion account created and session established, failure/recovery = invalid input shows inline error and allows correction, continuation = proceed to Dashboard)

FR-3 — Returning verification for companion and child As a returning companion or child, I should be able to verify myself on the Login page before accessing saved practice or progress, so that my saved state remains bound to the correct participant. (provenance: required_inference; lifecycle: initiator = companion or child, participant = application (verifies identity), result = verified session, failure/recovery = invalid credentials show inline error and allow retry, continuation = proceed to Dashboard)

Page 11 of 28

FR-4 — Child–companion relationship establishment As a parent/companion, I should be able to establish the relationship between my child and myself, so that practice results are recorded against the correct child. (provenance: required_inference; lifecycle: initiator = companion, participant = child (whose practice will be recorded), result = child linked to companion, failure/recovery = incomplete setup shows prompt to complete, continuation = proceed to prepare practice)

FR-5 — Post-login routing hub As a verified companion or child, I should see a Dashboard that routes the companion toward the child's progress and the child toward practice or continuation of learning, so that each participant reaches their working surface. (provenance: required_inference; lifecycle: initiator = companion or child, participant = application (routes), result = destination selected, failure/recovery = fetch failure shows retry, continuation = enter Learning Path, Reading Practice, or Progress)

FR-6 — Ordered exercise sequence and continuation point As a child learner, I should see a Learning Path that displays the ordered sequence of exercises and my continuation point, so that I can resume the next learning session. (provenance: required_inference; lifecycle: initiator = child, participant = application (provides sequence), result = current exercise identified, failure/recovery = fetch failure shows retry, continuation = enter Reading Practice)

FR-7 — Reading practice session As a child learner, I should be able to follow and complete a reading session of letters, syllables, and words on the Reading Practice page, so that I practice reading repeatedly. (provenance: explicit; lifecycle: initiator = child, participant = application (presents items and evaluates answers), result = session items completed, failure/recovery = incorrect answer allows retry; fetch failure shows retry, continuation = advance to next item or return to Learning Path)

Page 12 of 28

FR-8 — Progress persistence and continuation As a child learner, I should have my session progress saved so that I can continue the next practice session, and my companion can see my results. (provenance: required_inference; lifecycle: initiator = child, participant = companion (who will view results), result = progress persisted and continuation point updated, failure/recovery = save failure shows retry, continuation = resume from Learning Path)

FR-9 — Companion progress review As a parent/companion, I should be able to view my child's reading results and progress on the Progress page, so that I can monitor how my child is learning to read. (provenance: required_inference; lifecycle: initiator = companion, participant = child (whose results are shown), result = results and progress displayed, failure/recovery = fetch failure shows retry, continuation = return to Dashboard)

FR-10 — Legitimate literacy product only As a parent/companion, I should be assured that this product is a legitimate literacy application and not a cheat or hack tool, so that I can trust it for my child. (provenance: explicit; lifecycle: initiator = companion, participant = none beyond initiator, result = trust established, failure/recovery = not applicable, continuation = proceed to use the app)

4. User Personas

Page 13 of 28

Orang Tua / Pendamping Anak (Parent / Child Companion)

Product context. An Indonesian parent or guardian who wants their child to learn to read at home. They use the app on a phone, often sitting next to the child. They are the one who sets up the app, establishes the child's profile, and checks on progress.

Primary goal. To have their child read fluently through repeated, guided practice, and to be able to see that the child is making progress.

Distinct accepted responsibilities. Registering themselves on Sign Up; verifying themselves on Login; establishing the child–companion relationship so results are recorded against the correct child; reviewing the child's results and progress on Progress; preparing and monitoring the child's learning.

Relevant inputs or decisions. Their own account credentials; the decision to link a specific child to their account; the decision of when to check progress.

Interactions with other accepted participants. They are the initiator of the child–companion relationship and the viewer of the child's results. The child is the participant whose practice produces the results the companion reviews.

Observable success. The companion can log in, see their child linked, and view the child's reading results and progress on the Progress page.

What makes this role different. The companion's work is setup and oversight — establishing identity, linking the child, and reviewing outcomes. They do not perform the reading exercises themselves; their value is in preparing the conditions and monitoring the result.

Page 14 of 28

Anak Pembelajar (Child Learner)

Product context. A young child, roughly ages 4–8, who uses the app to practice reading. They interact with large, clear letter/syllable/word displays and simple answer tiles. They may be sitting next to a parent.

Primary goal. To be able to read fluently through repeated practice of letters, syllables, and words.

Distinct accepted responsibilities. Verifying themselves on Login to continue saved practice; following and completing reading sessions of letters, syllables, and words on Reading Practice; resuming the next session from Learning Path.

Relevant inputs or decisions. Choosing an answer tile for each displayed letter/syllable/word; deciding to continue to the next item or return to the Learning Path.

Interactions with other accepted participants. The child's practice produces the results that the companion reviews on Progress. The child is the participant whose state is recorded against the companion-established relationship.

Observable success. The child completes reading sessions, sees a warm pulse on correct answers, and can resume from where they left off.

What makes this role different. The child's work is the practice itself — engaging with letters, syllables, and words in a calm, repeatable loop. They do not manage accounts or review reports; their value is in the repeated practice that builds reading fluency.

5. Core User Flows

Page 15 of 28

Flow 1 — Companion registers and sets up the child

  1. The companion opens the app and lands on Landing. They read the explanation of the reading app, its audience, and its practice function.
  2. The companion selects the "Mulai Belajar" CTA and proceeds to Sign Up.
  3. On Sign Up, the companion enters their registration details and submits.
  4. The application creates the companion account and establishes a session. The companion proceeds to Dashboard.
  5. On Dashboard, because no child is linked yet, the companion sees the setup prompt to establish the child relationship.
  6. The companion establishes the relationship between their child and themselves. The child is now linked, and practice results will be recorded against the correct child.
  7. Continuation: the companion can now hand the device to the child for practice, or proceed to review progress later.

Failure/recovery: if registration input is invalid or incomplete, an inline message appears and the companion corrects the input and resubmits, or navigates to Login if they already have an account.

Page 16 of 28

Flow 2 — Child practices reading

  1. The child (or the companion on the child's behalf) opens the app and proceeds to Login.
  2. On Login, the child verifies themselves. The application verifies the identity and establishes a session.
  3. The child proceeds to Dashboard and selects the practice destination.
  4. On Learning Path, the child sees the ordered sequence of exercises and their continuation point. The current tile is marked by a tomato accent fill.
  5. The child selects the current or next exercise tile and enters Reading Practice.
  6. On Reading Practice, the child sees one giant letter/syllable/word with three answer tiles beneath. The child chooses an answer tile.
  7. On a correct answer, the tile gets a single warm pulse of the tomato accent and the child advances to the next item. On an incorrect answer, a gentle non-punitive indication appears and the child may retry.
  8. The child continues through the session items.
  9. Continuation: the child's session progress is saved, and the child can return to Learning Path to resume the next session later.

Failure/recovery: if the exercise item fails to load, a retry control appears; the child may retry or return to Learning Path.

Page 17 of 28

Flow 3 — Companion reviews the child's progress

  1. The companion opens the app and proceeds to Login.
  2. On Login, the companion verifies themselves. The application verifies the identity and establishes a session.
  3. The companion proceeds to Dashboard and selects the Kemajuan (walnut) tile.
  4. On Progress, the companion sees the child's reading results and progress — ruled rows, aligned label/value pairs, and one warm mid-century chart in teal/mustard/tomato.
  5. The companion reviews the results and progress.
  6. Continuation: the companion returns to Dashboard and may hand the device to the child for the next practice session.

Failure/recovery: if results fail to load, a retry control appears; the companion may retry or return to Dashboard. If the child has no completed sessions yet, a calm explanatory state appears instead of the report.

Page 18 of 28

Flow 4 — Returning child resumes saved practice

  1. The child opens the app and proceeds to Login.
  2. On Login, the child verifies themselves. The application verifies the identity and establishes a session.
  3. The child proceeds to Dashboard and selects the practice destination.
  4. On Learning Path, the child sees their continuation point — the current tile marked by a tomato accent fill.
  5. The child selects the current tile and resumes Reading Practice from where they left off.

Failure/recovery: if the sequence or completion state fails to load, a retry control appears; the child may retry or return to Dashboard.

Page 19 of 28

6. Visuals, Colors, and Theme

Muse and headline. Warm mid-century modernism for a child's first reading steps — after Charles & Ray Eames. The design is a friendly picture-book object: honest materials, joyful colour inside order, and a calm pace that rewards repetition.

Colour tokens (light mode).

RoleHexUsage
Background#F6EFE2Cream ground — the paper of the picture-book
Surface#FFFBF3Card/tile stock
Text#2E2A26Ink text for all reading copy
Primary#1F6E6ADeep mid-century teal — buttons, active states, progress fills
Accent#E24B2ETomato red — the "next" CTA, current syllable highlight, the child's star
Muted#C9B79CHairlines, disabled states, secondary metadata
Mustard#E0A32ESupporting harmony — Suku Kata category, illustration
Walnut#6B4A2ESupporting harmony — Kemajuan category, illustration
Sage#7C9A6DSupporting harmony — illustration

Never pure white ground; never a blue-indigo primary; colour is used in flat blocks, not gradients.

Category colour-coding (runs through the whole product). Huruf = teal (#1F6E6A), Suku Kata = mustard (#E0A32E), Kata = tomato (#E24B2E), Kemajuan = walnut (#6B4A2E), used as flat blocks and small filled circles, never as gradients.

Typography.

Page 20 of 28
  • Headings: Jost (Futura-class geometric sans) at medium weight for headings and UI labels. Parent-facing headings use Jost 500–600 with wide tracking and sentence case. All-caps only for small category labels (HURUF / SUKU KATA / KATA) with 0.12em letterspacing.
  • Child-facing display: Jost at 700–800 weight, set very large with tight tracking so a single "B" or "MA" fills the card. Child-facing reading targets never below 32px.
  • Body: Literata.
  • Scale: 1.333 modular scale on a 4px baseline — display 64px mobile → 128px desktop (clamp(4rem, 12vw, 8rem)) for the hero and letter cards; h1 40 → 64; h2 28 → 40; h3 22 → 28; body 17 → 19 (Literata, 1.6 line-height); label 12 → 13 (Jost, uppercase, 0.12em).

Shape language. Organic-modern mid-century shapes: generous corner radii (16px cards, 24px hero panels, pill buttons), modular panels that slot together like Eames storage units, and a few soft "molded plywood" curves as section dividers. Letter tiles are rounded squares with a 4px offset solid shadow (no blur), like physical wooden blocks. Progress is shown as a row of small filled circles and a continuous ruled bar. No glassmorphism, no blobs, no neon glow.

Layout. Gallery-like sequences on a strict 12-column grid with generous margins (24px mobile / 64px desktop). Landing hero is an asymmetric two-panel composition: a large cream type panel on the left, a colour-blocked "reading card" panel on the right, with a thin ruled baseline running the full width. Dashboard is a modular tile grid (2 cols mobile, 3 cols tablet, 4 cols desktop) where each tile is a category (Huruf, Suku Kata, Kata, Kemajuan) in its own flat colour. Learning Path is a horizontal, scrollable sequence of numbered tiles on a ruled track — like a film strip. Reading Practice is a single centred stage: one giant letter/syllable/word with three answer tiles beneath, and a parent strip pinned at the bottom. Progress is a calm editorial report: ruled rows, aligned label/value pairs, one warm chart.

Page 21 of 28

Imagery. Warm, hand-drawn flat illustration in the Eames palette: modular letter blocks, a friendly reading child silhouette, simple animals and objects (a ball, a cat, a house) as flat shapes with a paper-grain texture. Photographic warmth is reserved for one hero still-life — a stack of wooden letter blocks and an open picture book on a walnut surface, shot in natural light. No 3D renders, no stock-photo children, no clip-art icons; every illustration is built from the same geometric vocabulary.

Readable text and controls. Headlines, wordmarks, labels, numbers, cards' text and controls stay entirely inside the viewport and their container at 375px, 768px and 1280px, wrapping or scaling (for example font-size: clamp(...) with its mobile size) to fit, and no other element covers any part of them. Imagery, decoration and motion may be cropped, bled off an edge, rotated, overlapped or cut exactly as the direction asks, as long as it covers no readable text or control. Moving and scrollable content may cross the viewport or container edge by design; every item becomes fully readable as it passes. With prefers-reduced-motion, provide a usable static arrangement: wrap items into rows or allow horizontal scrolling so each item can be brought fully into view.

Page 22 of 28

7. Signature Design Concept

The public entry (Landing) is built as two unequal flat colour panels — a cream type panel and a teal block bleeding off the right edge — with three oversized letter tiles arranged like physical blocks mid-fall.

  • Left panel (5 of 12 columns): an oversized Jost 800 headline "Belajar Membaca, Satu Huruf Setiap Hari" set at clamp(4rem, 12vw, 8rem), stacked in three lines, flush-left, in ink (#2E2A26) with the word "Membaca" in tomato (#E24B2E). Beneath it a single pill CTA "Mulai Belajar" in teal (#1F6E6A) with white text, and a small ruled line of parent reassurance in Literata.
  • Right panel (7 of 12 columns): a solid teal (#1F6E6A) colour block that bleeds off the right edge, holding three overlapping letter tiles — a huge "B" in cream Jost 800, an "A" in mustard, and a "C" in tomato — each a rounded square with a 4px offset solid shadow, arranged like physical blocks mid-fall, with one small illustrated child silhouette reading at the bottom corner.
  • Ruled baseline: a thin ruled baseline in muted (#C9B79C) runs the full width beneath both panels.
  • Wordmark and nav: the wordmark "laser-mlbb" is set small in Jost uppercase with 0.16em tracking at the top-left, and nav is a single right-aligned row of Jost uppercase labels.
  • Mobile: the two panels stack — headline first, then the teal block with the letter tiles scaled to fit, CTA pinned beneath the headline. Nothing is centred; nothing resembles a generic SaaS hero.

This concept only recomposes accepted content, states, and controls. It introduces no new behaviour, page, or destination.

Page 23 of 28

8. Interaction Model & Motion Direction

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

Landing Hero Motion Brief

  • Focal subject: the three overlapping letter tiles (B/A/C) in the teal block, arranged like physical blocks mid-fall, with the small illustrated child silhouette reading at the bottom corner.
  • Input → transformation → outcome thesis: as the visitor arrives, the hero's reading-card panel performs a slow 8-second horizontal pan across the letter tiles; the tiles settle into their mid-fall arrangement. The outcome is a composed, calm first frame that reads as a picture-book object — no bounce, no particles, no parallax storm.
  • Motion vocabulary: gentle, film-like and slow — 400–600ms ease-out reveals, a soft crossfade between letters, and a slow 8-second horizontal pan across the hero's reading-card panel. Micro-interactions are tactile but not bouncy: a letter tile presses down 2px with its shadow collapsing (like a real block), and a correct answer gets a single warm pulse of the tomato accent.
  • Composed first frame: the cream type panel with the oversized headline and teal CTA on the left; the teal block bleeding off the right edge with the three letter tiles in their mid-fall arrangement; the ruled baseline running the full width beneath both panels.
  • Reduced-motion state: all transitions become instant, the hero pan stops, and the Learning Path becomes a wrapping grid.
Page 24 of 28

9. Non-Functional Requirements

NFR-1 — Legitimate product only. The product must be a legitimate literacy application. It must not contain any game-cheat or hack capability, including "1 hit" MLBB scripts, MLBB APK tools, rank-match boot-opponent tools, or Township card-sending tools. (provenance: explicit; rationale: explicit hard constraint in the authoritative user evidence)

NFR-2 — No VPN server. The product must not include a PPTP VPN server for Indonesia. (provenance: explicit; rationale: explicit hard constraint in the authoritative user evidence)

NFR-3 — No router firmware. The product must not provide or create Tenda W15E v1 firmware; official firmware must be obtained from Tenda's official site. (provenance: explicit; rationale: explicit hard constraint in the authoritative user evidence)

NFR-4 — Child-facing readability. Child-facing reading targets must never be below 32px. Headlines, wordmarks, labels, numbers, cards' text and controls must stay entirely inside the viewport and their container at 375px, 768px and 1280px. (provenance: explicit; rationale: creative direction and readability requirement)

NFR-5 — Reduced-motion support. With prefers-reduced-motion, all transitions become instant, the hero pan stops, and the Learning Path becomes a wrapping grid. (provenance: explicit; rationale: creative direction accessibility requirement)

NFR-6 — Durable progress state. Session progress must be persisted so that a child can continue the next practice session and a companion can view results. (provenance: required_inference; rationale: required to make the accepted journey executable)

Page 25 of 28

NFR-7 — Identity continuity. Application-owned identity must bind saved practice and progress to the correct participant across sessions. (provenance: required_inference; rationale: required to make the accepted journey executable)

NFR-8 — No dark mode default. Dark mode must not be the default surface; the picture-book warmth requires the cream ground. (provenance: explicit; rationale: creative direction)

NFR-9 — No blue-indigo primary. The primary must not be blue-indigo on a white/near-white ground (no #2563EB, #4F46E5, #7C3AED or neighbours). (provenance: explicit; rationale: creative direction)

NFR-10 — Font restrictions. Inter, Roboto, Arial, Helvetica, Open Sans, Lato, Poppins or system-ui must not be used for headings or body. (provenance: explicit; rationale: creative direction)

10. Tech Stack

  • Frontend: React (web companion surfaces) and React Native (Android APK), preserving the source-specified APK delivery.
  • Backend: Python / FastAPI, extending a single shared backend process for identity, child–companion relationships, exercise sequence, session results, and progress.
  • Storage: appropriate persistent storage for accounts, child profiles, exercise sequences, session results, and progress.
  • Deployment: Docker / docker-compose for the runnable services. Kubernetes only if deployment requires it.
Page 26 of 28

11. Assumptions and Constraints

Assumptions.

  • The child learner is roughly ages 4–8 and uses the app on a phone, often sitting next to a parent. (narrow, labeled assumption consistent with the creative direction)
  • The companion is the one who registers and establishes the child relationship; the child verifies themselves to resume saved practice. (narrow, labeled assumption consistent with the accepted journeys)
  • Exercise content covers letters (huruf), syllables (suku kata), and words (kata). (narrow, labeled assumption consistent with the accepted practice function)

Constraints.

  • No game-cheat or hack capability of any kind. (explicit)
  • No PPTP VPN server. (explicit)
  • No Tenda W15E v1 firmware; official firmware must be obtained from Tenda's official site. (explicit)
  • The product is a legitimate literacy application, not a cheat or hack. (explicit)
  • No dark mode as the default surface. (explicit)
  • No blue-indigo primary on a white/near-white ground. (explicit)
  • No Inter, Roboto, Arial, Helvetica, Open Sans, Lato, Poppins or system-ui for headings or body. (explicit)
  • No gradient-blob heroes, glassmorphism, or a grid of identical hover-lift cards. (explicit)
  • No neon or candy-pop colour. (explicit)
  • No bouncy, springy or particle-heavy motion. (explicit)
  • No photographic stock children or 3D renders. (explicit)
Page 27 of 28

12. Glossary

  • APK — Android application package; the delivery format for the child-facing app.
  • Anak Pembelajar — Child learner; the persona who practices reading.
  • Huruf — Letter; the first category of reading practice.
  • Kata — Word; the third category of reading practice.
  • Kemajuan — Progress; the companion-facing category and page.
  • Orang Tua / Pendamping Anak — Parent / child companion; the persona who sets up and monitors learning.
  • Suku Kata — Syllable; the second category of reading practice.
  • Pendamping — Companion; the parent or guardian who accompanies the child.
  • prefers-reduced-motion — A user accessibility preference that reduces or removes motion.
Page 28 of 28

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View app explanation
Landing: Select Mulai Belajar
Login: Sign in
Dashboard: Select practice destination
Learning Path: 1. View exercise sequence
Learning Path: 2. Retry failed load
Reading Practice: 3. Choose answer tile
Reading Practice: 4. Advance after correct answer
Reading Practice: 5. Retry after incorrect answer
Dashboard: Return to dashboard

No completed page designs yet.

Completed design pages will appear here when they are ready to preview.

Landing: View app explanation
Landing: Select Mulai Belajar
Login: Sign in
Dashboard: Select practice destination
Learning Path: 1. View exercise sequence
Learning Path: 2. Retry failed load
Reading Practice: 3. Choose answer tile
Reading Practice: 4. Advance after correct answer
Reading Practice: 5. Retry after incorrect answer
Dashboard: Return to dashboard