julian
17c08e6392
- Nx 22.7 monorepo (pnpm 11.1, TypeScript 5.9, Node 24) - apps/api: NestJS 11 (CJS conforme CODING-RULES.md PGD-DB-004) - apps/web: React 19 + Vite 8 (ESM) - libs/shared/api-interface: Zod contract base - Docker Compose dev: Postgres 18, Valkey 8, MinIO, Mailpit - WDS artifacts: - design-artifacts/A-Product-Brief/ (5 docs canônicos + 16 dialogs) - design-artifacts/B-Trigger-Map/ (hub + 4 personas + feature impact) - Stack canon: STACK.md v2.2 + CODING-RULES.md v2.0 + brand.md - AGENTS.md + README.md como entrada para devs/agentes Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
136 lines
3.2 KiB
Markdown
136 lines
3.2 KiB
Markdown
# Lightweight Page Template
|
|
|
|
Template for generating page placeholder documents in page-init-lightweight workflow.
|
|
|
|
---
|
|
|
|
## File Location
|
|
|
|
`C-UX-Scenarios/{{scenario_path}}/{{page_number}}-{{page_slug}}/{{page_number}}-{{page_slug}}.md`
|
|
|
|
---
|
|
|
|
## Template
|
|
|
|
```markdown
|
|
{{#if previous_page != "none"}}
|
|
← [{{previous_page}}](../{{previous_page_slug}}/{{previous_page_slug}}.md)
|
|
{{/if}}
|
|
{{#if next_page != "none" and next_page != "TBD"}}
|
|
| [{{next_page}}](../{{next_page_slug}}/{{next_page_slug}}.md) →
|
|
{{/if}}
|
|
{{#if next_page == "TBD"}}
|
|
| Next: TBD
|
|
{{/if}}
|
|
|
|
|
|
|
|
{{#if previous_page != "none"}}
|
|
← [{{previous_page}}](../{{previous_page_slug}}/{{previous_page_slug}}.md)
|
|
{{/if}}
|
|
{{#if next_page != "none" and next_page != "TBD"}}
|
|
| [{{next_page}}](../{{next_page_slug}}/{{next_page_slug}}.md) →
|
|
{{/if}}
|
|
|
|
# {{page_number}} {{page_name}}
|
|
|
|
**User Situation:** {{user_situation}}
|
|
|
|
**Page Purpose:** {{page_purpose}}
|
|
|
|
---
|
|
|
|
## Status
|
|
|
|
⚠️ **PLACEHOLDER** - This page needs:
|
|
- [ ] Sketch or screenshot
|
|
- [ ] Section breakdown
|
|
- [ ] Object specifications
|
|
- [ ] Component links
|
|
- [ ] Interaction definitions
|
|
- [ ] States and variants
|
|
|
|
---
|
|
|
|
## Navigation Context
|
|
|
|
{{#if previous_page != "none"}}
|
|
**Previous:** {{previous_page}}
|
|
{{else}}
|
|
**This is the first page in the scenario**
|
|
{{/if}}
|
|
|
|
{{#if next_page == "TBD"}}
|
|
**Next:** TBD (to be defined)
|
|
{{else if next_page != "none"}}
|
|
**Next:** {{next_page}}
|
|
{{else}}
|
|
**This is the last page in the scenario**
|
|
{{/if}}
|
|
|
|
---
|
|
|
|
## Open Questions
|
|
|
|
<!--
|
|
Auto-populate questions based on page characteristics.
|
|
Reference: instructions/open-questions.instructions.md
|
|
|
|
Check for:
|
|
- Responsive breakpoints
|
|
- Loading/Error/Empty states
|
|
- SEO (if public)
|
|
- Accessibility
|
|
- User permissions
|
|
- Time-sensitive behaviors
|
|
- Form validation
|
|
- Navigation/back behavior
|
|
-->
|
|
|
|
_No open questions at this time._
|
|
|
|
---
|
|
|
|
## Next Steps
|
|
|
|
To complete this page specification:
|
|
|
|
1. **Add a sketch**: Place your sketch in `sketches/` folder
|
|
2. **Run Page Process Workshop**: Analyze your sketch
|
|
3. **Specify sections**: Define all page sections
|
|
4. **Specify objects**: Define all interactive elements with Object IDs
|
|
5. **Link components**: Connect to design system components
|
|
6. **Document states**: Define loading, error, success, empty states
|
|
7. **Review open-questions.instructions.md**: Add relevant questions to Open Questions section
|
|
8. **Generate prototype**: Create interactive HTML preview
|
|
|
|
---
|
|
|
|
{{#if previous_page != "none"}}
|
|
**Previous Step**: ← [{{previous_page}}](../{{previous_page_slug}}/{{previous_page_slug}}.md)
|
|
{{/if}}
|
|
{{#if next_page != "none" and next_page != "TBD"}}
|
|
**Next Step**: → [{{next_page}}](../{{next_page_slug}}/{{next_page_slug}}.md)
|
|
{{/if}}
|
|
|
|
---
|
|
|
|
_Placeholder created using Whiteport Design Studio (WDS) methodology_
|
|
```
|
|
|
|
---
|
|
|
|
## Key Principles
|
|
|
|
### ✅ **Navigation is Critical**
|
|
- Appears three times (above sketch, below sketch, document bottom)
|
|
- Links to previous/next pages
|
|
- Creates navigable flow
|
|
- Essential for comprehension
|
|
|
|
### ✅ **Open Questions Ready**
|
|
- Section included from start
|
|
- Reference `open-questions.instructions.md` during spec creation
|
|
- Auto-populate based on page characteristics
|
|
- Ensures no edge cases are missed
|