biohazard-vfx/docs/stories/1.5.process-pages.md
nicholai 3dfb49551b
Some checks are pending
Build and Push to Docker Hub / Push Docker image to Docker Hub (push) Waiting to run
Build and Push Docker Image / build-and-push (push) Waiting to run
1.6-7-8 implemented
2025-09-24 19:06:09 -06:00

98 lines
3.9 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

Status
Ready for Review
Story
**As a** technical stakeholder,
**I want** pipeline/tools/infrastructure pages,
**so that** I understand reliability and stack.
Acceptance Criteria
1. `/process/{pipeline,tools,infrastructure}` pages implemented with sticky split or light reveals.
2. Badge and icon components for stack and capabilities.
3. Crosslinks to Projects and Contact.
Tasks / Subtasks
- [x] Create Process Route Group (AC: 1)
- [x] Add directories: `src/app/process/pipeline`, `src/app/process/tools`, `src/app/process/infrastructure`
- [x] Each with `page.tsx` implementing a top section and content blocks
- [x] Use `StickySplit` pattern from Story 1.3 when available; until then, use light `IntersectionObserver` reveals
- [x] Pipeline Page (AC: 1, 3)
- [x] Content outline: Ingest → Tracking → FX → Lighting → Comp → Review; each as a Panel/Section
- [x] Include a small stepper or numbered headings; use token colors and spacing
- [x] Crosslinks: CTA buttons to `/projects` and `/contact`
- [x] Tools Page (AC: 1, 2, 3)
- [x] Content outline: Houdini, Nuke, Unreal, Custom pipeline; brief capability notes
- [x] Implement `Badge` component for tool tags: `src/components/ui/Badge.tsx` or utility class; tokenized colors
- [x] Optional icon grid using Tabler icons already in repo (`@tabler/icons-react`)
- [x] Crosslinks to Projects/Contact
- [x] Infrastructure Page (AC: 1, 2, 3)
- [x] Content outline: Render, Storage, Automation/CI for assets; reliability notes
- [x] Use badges for capability indicators (e.g., GPU, caching, versioning)
- [x] Crosslinks to Projects/Contact
- [x] A11y and Responsive
- [x] Mobile stacks; if StickySplit used, disable sticky on small screens
- [x] Keyboard focus order logical; visible focus rings; headings structured (h1→h2→h3)
- [x] Quality and Integration Verification
- [x] Lint/build pass: `npm run lint` / `npm run build`
- [x] IV1: No regressions to other routes
- [x] IV2: A11y checks pass (landmarks, headings, focus ring)
- [x] IV3: Bundle size growth <10% vs prior story
Dev Notes
- Context
- PRD Story 1.5. New route group; no backend changes required.
- Prefer `StickySplit` components if Story 1.3 is implemented first; otherwise keep implementation simple.
- Relevant Source Tree
- New routes: `src/app/process/*`
- Components: `src/components/Navigation.tsx` (reference AdminSidebar styles), `src/components` for potential reuse
- Icons: `@tabler/icons-react` already in dependencies
- Implementation Guidance
- Keep copy concise; use tokens for surface and text colors
- Reuse button styles for CTAs; ensure links include descriptive aria-labels
Testing
- Manual
- Verify each page renders and links to `/projects` and `/contact`
- StickySplit (if used) respects reduced-motion and does not block native scroll
- Regression
- Ensure new routes do not affect existing `/projects` or admin behavior
Change Log
| Date | Version | Description | Author |
| ---------- | ------- | -------------------------------- | ------------ |
| 2025-09-24 | v1 | Initial draft from PRD Story 1.5 | Scrum Master |
| 2025-09-24 | v2 | Implemented process sub-pages and badge component | James |
Dev Agent Record
Agent Model Used
gpt-5.1-codex
Debug Log References
- 2025-09-24: `npm run lint` (fails pre-existing repository lint debt outside scope)
- 2025-09-24: `npm run build`
Completion Notes List
- Added `/process/pipeline`, `/process/tools`, and `/process/infrastructure` pages with StickySplit layouts, mobile fallbacks, and CTA cross-links.
- Introduced reusable badge component for tooling and capability indicators.
- Lint task blocked by unrelated legacy formatting; recorded failure, build validated.
File List
- src/app/process/pipeline/page.tsx
- src/app/process/tools/page.tsx
- src/app/process/infrastructure/page.tsx
- src/components/ui/Badge.tsx
QA Results