Skip to content

Capability 001: Basic Page

Status: Accepted

Context

The Superordinate Controller provides a rudimentary API for remote control and inspection, the Remote Control API. The Web App provides a convenient web interface to it for the Robot Operator: it shows the state of the robot and steers it with a simple navigation model of translation and rotation.

The first step is a single-page web app without any function beyond showing its title. It establishes the build, the tests, and the container image that later capabilities build on.

References

Details

Element Content
Document title (browser tab) Kiwi Robot Supervisor
Heading of the page Kiwi Robot Supervisor

The user interface is in English.

Functional Requirements

  1. Opened at /, the Web App shows its title as given under Details.

Non-Functional Requirements

  1. The page needs no horizontal scrolling at viewport widths from 320 px to 1920 px, measured in the browser at 320 px, 768 px, and 1920 px.
  2. The heading meets WCAG 2.1 AA: its contrast ratio against the background is at least 4.5:1, computed from the rendered colors.

Technical Requirements

  1. The Web App is built with React, TypeScript, and Vite.
  2. Styling is plain CSS, without a CSS framework.
  3. The container image serves the static build with nginx on port 8080.
  4. The Web App runs in the browsers and on the form factors of ADR-001.

Error Handling

None.

Out of Scope

  • Any connection to the Remote Control API: driving, rotating, stopping, health
  • Telemetry of the robot
  • Further pages and navigation
  • Authentication
  • Visual design beyond legibility, such as a logo, a color theme, or a dark mode
  • Languages other than English

Acceptance Criteria

  1. Opened at /: the document title and the heading are Kiwi Robot Supervisor.
  2. Opened at / at viewport widths of 320 px, 768 px, and 1920 px: the page is not wider than the viewport.
  3. Opened at /: the contrast ratio of the heading against the background is at least 4.5:1.
  4. Opened at /: the browser console shows no error.
  5. The release image started with port 8080 published: a browser opened at / shows the page as in Acceptance Criterion 1 (manual test test/manual/image.md).

Decisions

  1. Plain CSS instead of a CSS framework. The page holds a title only; a framework would add a technology without benefit. Consequence: a later capability that needs one decides on it then.
  2. React renders the heading, despite the directive "core functionality without JavaScript". Every later capability needs React, which renders in the browser; a static heading would duplicate the title for no use. Consequence: without JavaScript, the page shows only the document title.