DEVELOP

Contribution & Design Workflow

Move a change from issue to reviewed code while keeping Pencil, generated artifacts, submodules, and evidence synchronized.

Local Developmentv0.214 MIN

Gameplane contributions flow through a design-first cycle for UI changes, a code-only path for backend work, and synchronized submodule updates. This guide covers the complete workflow from planning through PR review.

UI work begins in design.pen before code.

Dashboard changes start in design.pen (Pencil) with maintainer review, then translate to React. Module and public-site work originates in their own repositories before a submodule bump.

Plan the change

Identify component ownership, public contracts, security boundaries, design impact, and the required test tier.

Choose the owning componentIdentify the component and affected public contract.

Pencil pass for UIDashboard changes require a design review in design.pen; backend work does not.

Submodule originsModule and website changes originate in their submodule repositories before bumping the pointer.

Design to implementation

Update and validate the shared visual system first, then translate the approved design result without inventing code-only states.

Reuse componentsReuse existing components and variables; validate layout and state coverage against the design.

Capture Pencil IDsRecord exact Pencil node IDs for the implementation handoff and PR description.

Align across breakpointsKeep React implementations aligned with approved desktop and responsive designs.

Submit and review

Compile and commit focused changes with sign-off; CI verifies the full test, lint, and integration suite.

Every PR requires signed commits.

Use git commit -s to add the Developer Certificate of Origin footer. Include risk, affected test tiers, new tests, docs, and Pencil node IDs in the PR description.

CI VERIFICATION GATE

01 01 Compilation checks (go build ./..., npx tsc --noEmit) — run locally

02 02 make generate && make manifests — if CRD/schema changes

03 03 Full test, lint, e2e suite runs in CI after push

04 04 Pencil exports synced; submodule changes committed separately

Push your branch and create a PR. CI automatically runs the full verification suite (linting, unit tests, integration tests, E2E buckets). Reference the design screens, affected component contracts, and test evidence in the PR body to help reviewers. Once approved and all CI checks pass, the PR merges into master.

Next guide

CI, releases, and signing

NEXT GUIDEWeb Dashboard Development