# Aigro v3 application standards

Version: 2026-10-29. These are design specifications, not proof of a live feature.
The interactive and illustrated reference is /branding, chapters 10–15.

## Files and editing

Eleven self-contained editable SVG compositions live in templates/. Original
mascots are embedded unchanged. Official wordmarks embed PNG and are not vector
masters. Install Noto Sans HK for editable text. Open in an SVG-capable editor,
replace sample text and export PNG/JPEG at the original artboard size. Proof CJK
font substitution, glyphs, wrapping, contrast and crop before use. This delivery
supplies SVG masters; no claim is made of Figma, Canva or raster export support.
Rebuild compositions with python3 scripts/build-brand-templates.py, then rebuild
the complete ZIP with python3 scripts/build-brand-press-kit.py.

## Social media

- Portrait feed / carousel: 1080x1350, square: 1080x1080, landscape: 1200x630.
- Story: 1080x1920; reserve 250px at top/bottom. Check actual platform crop/UI.
- Feed margins: 72px; headline about 12 Chinese characters, two lines maximum.
- Single message, one next step; add original source and date where factual.
- Carousel: portrait cover -> numbered body -> closing action. Keep order in
  filenames; update page labels when adding pages. No invented statistics.
- Caption: short premise, three useful steps, original source, one action.
  Write alt text. Essential content must also be accessible outside the image.
- Formal evening campaign: navy and cream with sand/honey detail, no mascots.
  Replace event name/date/venue placeholders only with confirmed information.

## Headers and footers

64px site navigation, wordmark >=80px, 44px interactive targets. Main container
1152px with 24px mobile gutters. One page heading and one main CTA. Desktop
navigation collapses before labels collide. Drawer traps focus, Escape closes,
and focus returns to trigger. Footer groups sources, product and brand links;
use real legal/support destinations when available, never placeholder URLs.
Forms retain labels/errors. Fixed mobile bars must not obscure inputs or footer.
The /branding specimens illustrate composition; the app's actual navigation is
still owned by Navbar/Footer and uses existing routes and availability flags.

## Instructor profiles

Public person label: 導師 / Instructor. AI label: AI 分身 / AI twin.
Use an authorised portrait, square >=800px preferred; preserve identity and
headroom. Missing portrait -> initials, never a generated lookalike. Cover:
1600x600, central focal subject and safe mobile crop, no credentials baked in.
Content order: name -> expertise -> short bio -> confirmed role -> one primary
CTA -> authorised sources and update dates. Directory card: short name and
expertise; detail page: full bio, evidence and knowledge scope. Never invent
learner counts, ratings, client marks or availability. Missing data says unknown.

## Badges and presence

Identity checked: completed identity verification only, no quality endorsement.
Instructor: approved role. AI twin: machine-generated assistance and scoped
knowledge. Achievement: recorded completion of explicit criteria. Profile
pending: review incomplete. Human online: reliable current presence only;
when presence cannot be read use unknown, not offline or online by assumption.
Use icon + text. Colour must never be the only distinction. Expose explanations
with keyboard-accessible text; do not hide material claims behind hover.
No specimen or downloadable composition grants a real credential.

## Chat

Welcome -> drafted message -> sending/thinking -> answer with real source.
Also specify failure/retry, human offline, unavailable knowledge, stopped response
and human handoff requested/confirmed as separate states. Never imply a handoff
succeeded until acknowledged. Distinguish AI from human at header and reply.
Keep composer reachable above keyboard; wrap long words/URLs, preserve drafts on
failure and prevent duplicate submits. Cancellation must stop the pending send;
no silent retry loop. Announce new status politely, not every streaming token.
Do not fabricate citations or human typing. Show limitations when sources are
insufficient. A human response-time promise needs an operating service agreement.

The local guide provides deterministic welcome/thinking/answer/error/offline
specimens, draft retention, retry, reset and a canned sample reply. Nothing is
sent, persisted, booked or handed to a human. It does not activate live chat.

## Component states

Buttons: primary navy/cream, secondary outline, text link underlined, disabled
explicit. Inputs: visible label, help, validation, submitting, success, failure
and recovery. Loading is not empty; unreadable data is not zero. Keep successful
content visible while refreshing. Use reduced-motion support and visible focus.
Growth motifs are decorative; an achievement-seal drawing is not an earned award.

## Release QA

Check both languages, both themes, desktop/tablet/390px, keyboard focus, 200%
zoom, long copy, missing photo, unknown presence, source availability and actual
downloads. Confirm all facts, likeness permissions and badge claims before use.