DES-01 — Day 1 — Kickoff, reference audit & Claude Design setup
Audit the 16 client reference screens and brand assets, define principles, create the Claude Design project structure, page naming and status conventions.
| Field | Details |
|---|---|
| Task code | DES-01 |
| Phase | P0 — Foundations (cadrage, UX/UI, architecture & contract) |
| Product scope | V1 |
| Status | Planned |
| Start | Sun 18 Oct 2026 |
| Due | Sun 18 Oct 2026 |
| Responsible | Akram — UI/UX designer |
| Co-responsible | — |
| Effort | 1 person-day(s) planned · 1.25 from scratch · size S |
| Area · app | Design system · design |
| Depends on | — |
| Unblocks | DES-02, DES-05 |
| Milestones | — |
Summary
Audit the 16 client reference screens and brand assets, define principles, create the Claude Design project structure, page naming and status conventions.
Description
Day 1 of the 21 design days, which are the first third of the three-month V1 frame. Akram takes in the cahier, the 16 client reference screens and the binding product decisions of 17 Oct (AUTHORING §1b: three customer-type prices, guest mode with price lock, availability-only stock, advanced filters, regional WhatsApp, after-sales and returns in V1, manual order confirmation, live order status). Akram also attends HOCO's cadrage workshop (PRJ-03) and sets up a Claude Design project that Imad and Anis can follow through its shared link for 21 days. Scope boundary: no tokens and no screens today. The output is the file structure, the naming and status conventions, the reference audit, the brand-asset request and the design principles. Everything here feeds DES-02 (tokens) and DES-05 (inventory freeze), and every later frame follows the naming rule ID · Name · state set today.
Subtasks
| # | Subtask | Owner |
|---|---|---|
| 1 | Read cahier §1–§2, §5–§5.5 (reseller app), §6–§6.9 (delegate app), §7.3 (offline), §12 (acceptance) and §14.1/§14.2 (V1/V2), and list every point the 17 Oct decisions override: points/loyalty, stock counts, quantity tiers, automatic order confirmation | Akram |
| 2 | Audit the 16 references (reseller-01…06, delegate-01…10) as a keep / fix / postpone table. Postpone: the reseller-01 « Points » quick-access tile and « Points de fidélité » card (V2). Fix: three money formats become 1 250,00 DA; red « Terminer la visite » on delegate-05 becomes primary; one delegate navigation model; one back-button style; one input style (labels above) | Akram |
| 3 | Create the Claude Design project and its 10 pages: Cover, Foundations, Components-Mobile, Components-Web, Reseller App, Delegate App, Back-office, Reseller Web, Prototypes, Archive. Add one section per screens.json section (RA · Onboarding & account, RA · Shopping, DA · Tour, BO · CRM…) | Akram |
| 4 | Cover page: the frame naming rule (RA-17 · Cart · error-min-amount), the status legend (WIP, Ready for review, Client review, Approved, Changed after approval), the reviewer per app (Imad for RA/DA, Anis for BO/RW) and links to /docs/design and the screen inventory | Akram |
| 5 | Annotation kit: screen-id tag, state label, data-source note (API op id such as cart.checkout), requirement tag (ORD-14), Decision pending sticker linking the decision register, spec callout, accessibility note | Akram |
| 6 | Create the empty token groups Primitives, Semantic, Status, Spacing, Radius, Elevation, plus a placeholder status-pill component with 8 tones, so Day 2 only fills in values | Akram |
| 7 | Send the brand-asset request to HOCO, due Day 2: vector logos of HOCO, ACEFAST and BOROFONE (SVG/AI) with their usage rules; 20–30 product photos of at least 1 000 px on white; any HOCO brand guide; the legal mentions on today's invoices (NIF, NIS, RC, AI) for DQA-09 | Akram |
| 8 | Workshop follow-up: log the design-impacting open questions in /docs/srs/open-decisions (prices visible before or after validation, TTC display, enabled payment methods, week start day, delivery fees, fate of BO-31) | Anis |
| 9 | Confirm the five principles of /docs/design/design-system#principles and pin them on the Cover. They include French-first/RTL-ready, WCAG 2.2 AA, and that HOCO alone styles the interface (ACEFAST and BOROFONE never recolour the chrome) | Akram |
| 10 | 15-minute review of file structure and naming | Anis |
Deliverables
- Claude Design project « HOCO B2B — Design » with 10 pages and a Cover (naming rule, status legend, reviewers), shared by link with Anis and Imad
- Reference audit (keep / fix / postpone per reference screen) in Claude Design › Archive › References, mirrored on /docs/design/reference-screens
- Annotation kit and empty token groups in Claude Design › Foundations
- Brand-asset request emailed to HOCO; design open questions logged with ids in /docs/srs/open-decisions
Acceptance criteria
- All 10 pages exist, and the Cover shows the naming rule, the 5 statuses and a reviewer for each app
- Anis and Imad have opened the shared Claude Design project and can inspect its frames
- Each of the 16 references has keep/fix/postpone decisions. Every V2 element in them (points, loyalty card, packs) is marked postpone, and no kept element contradicts AUTHORING §1b
- The asset request has gone out with a Day-2 due date, and a received/missing list is tracked on the Cover
- Every open question has a decision-register id and an owner
- Token groups and sample names follow the convention
color/status/success/bg
Requirements covered
| Requirement | Title | Release |
|---|---|---|
| NFR-07 | Accessibility: readable contrast, reachable buttons, consistent text sizes, explicit messages | V1 |
Test measures
- 15-minute walkthrough with Anis: structure and naming judged OK or OK with notes
- Name three sample frames by the rule and check that they sort by screen id in the layers panel
- Cross-check the audit against AUTHORING §1b: no stock quantity, no quantity tier, no auto-confirmation and no loyalty UI kept for V1
Risks
- Brand assets or product photos arrive late — use placeholders cut from the reference screens and temporary traced logos, flagged on the Cover, and replace them before the DES-21 exports.
- The cadrage workshop changes scope — record every change as a decision, not as an ad-hoc frame; the inventory still freezes on Day 5 (DES-05).
KPI
- Delivered by Sun 18 Oct 2026 within 1 person-day(s).
- Every acceptance criterion above demonstrated before hand-off; linked requirements' acceptance criteria pass.
- Zero open critical defects, permission gaps or data-integrity regressions at sign-off.
Generated from content/plan/tasks.json by scripts/generate-team-tasks.mjs. Dates are computed by the scheduler (Sunday–Thursday weeks, holidays excluded) — change the plan, not this page.
Akram — UI/UX designer
Every task assigned to Akram, with dates, dependencies and briefs.
DES-02 — Day 2 — Foundations & design tokens
Colour (brand, neutral, semantic, one colour per lifecycle status), typography (Latin + Arabic pairing), spacing, grid, radii, elevation, icons; tokens exported as JSON for Flutter and Tailwind.