fe711870be
Delivers the distributed fabric's network layer and HTTP cluster surface: **m8p7: tidal-net crate (gRPC transport)** - GrpcTransport implementing Transport trait via tonic 0.12 - Per-peer circuit breaker (Closed/Open/HalfOpen), mutual TLS via rustls - Boxed error types (clippy-clean), graceful mutex recovery, debug_assert against calling block_on from tokio context - Proto: WalShipping service (ShipSegment, StreamSegments stub, Heartbeat) - 19 tests: contract, mTLS, reconnection, multi-node UAT, benchmarks **m8p8: cluster subcommand + HTTP routes** - ClusterState wrapping SimulatedCluster with region name mapping - Routes: /health, /cluster/status, /cluster/promote, /partition, /heal - Data routes: /items, /embeddings, /signals, /feed, /search (region-aware) - Ranking profiles wired through ClusterConfig to all cluster nodes - Topology YAML config, docker/cluster/Dockerfile (ENTRYPOINT+CMD, non-root) **m8p9: scatter-gather query routing** - Entity-sharded writes via Knuth multiplicative hash - Scatter-gather RETRIEVE and SEARCH with deadline propagation (50ms-5ms) - Partial failure: degraded=true with unavailable_shards metadata - 6 tests: distribution, determinism, multi-shard retrieve, degraded partial results, deadline propagation, scatter-gather search **m8p10: gRPC transport integration tests** - 8 tests over real gRPC: replication convergence, idempotent replay, mixed signals, 3-node fan-out, partition/heal, degraded follower, perf - Documented as tier-2 (in-process+gRPC); tier-3 multi-process pending
85 lines
3.6 KiB
Markdown
85 lines
3.6 KiB
Markdown
---
|
|
name: aeries-design-architect
|
|
description: Design and build Aeries chat interface components, design system, and conversational UX
|
|
---
|
|
|
|
# aeries-design-architect
|
|
|
|
## When to Use
|
|
|
|
- Designing or iterating on the Aeries chat interface
|
|
- Building new UI components for the companion experience
|
|
- Establishing or updating the design system (colors, typography, spacing)
|
|
- Prototyping conversational flows or interaction patterns
|
|
- Reviewing UI for consistency, accessibility, or dark-theme correctness
|
|
|
|
Invoked via: `/aeries-design-architect` or delegated from `/aeries-fullstack-engineer`
|
|
|
|
## Delegation
|
|
|
|
This skill delegates to **@kaya-osei** — the Aeries product designer. All design decisions, component architecture, and visual implementation go through her lens.
|
|
|
|
## Step Back
|
|
|
|
Before implementing any design work, ask:
|
|
|
|
1. **Is this the simplest version?** Chat UI has infinite scope. What's the minimum that makes the conversation feel good? Strip everything else.
|
|
2. **Does this work on pure black?** Test on `oklch(0.00 0.000 0)`. If the contrast fails, the color is wrong.
|
|
3. **What happens during streaming?** Every component must have a streaming state. If it flickers, jumps, or reflows during token arrival, it's broken.
|
|
4. **Would you notice this in a 30-minute conversation?** If the user would stop noticing a design element after 2 minutes, it's either perfect or unnecessary. If it keeps drawing attention, it's wrong.
|
|
5. **Does this respect the user's attention?** The conversation is the content. Every pixel of chrome competes with it.
|
|
|
|
## Workflow
|
|
|
|
### Phase 1: Context
|
|
- Read `applications/iknowyou/vision.md` for product principles
|
|
- Read existing components in `applications/iknowyou/components/`
|
|
- Check `applications/iknowyou/app/globals.css` for current design tokens
|
|
|
|
### Phase 2: Design
|
|
- Define component API (props, variants, states)
|
|
- Establish visual specs using the OKLCH color system
|
|
- Identify streaming/loading states
|
|
- Consider keyboard navigation and focus management
|
|
|
|
### Phase 3: Build
|
|
- Implement with React + Tailwind v4
|
|
- Use CSS custom properties from `globals.css` — never hardcode colors
|
|
- Test on black background, dark surface, and elevated surface
|
|
- Verify streaming behavior with mock SSE data
|
|
|
|
### Phase 4: Verify
|
|
- Run through Done Gate checklist
|
|
- Screenshot on dark background
|
|
- Test keyboard-only navigation
|
|
- Verify responsive behavior (mobile breakpoint: 640px)
|
|
|
|
## Quick Reference
|
|
|
|
| Path | Purpose |
|
|
|------|---------|
|
|
| `applications/iknowyou/app/globals.css` | Design tokens, OKLCH colors |
|
|
| `applications/iknowyou/components/chat/` | Chat-specific components |
|
|
| `applications/iknowyou/components/ui/` | Shared UI primitives |
|
|
| `applications/iknowyou/lib/theme.ts` | Theme utilities |
|
|
| `applications/iknowyou/vision.md` | Product principles and design philosophy |
|
|
| `.Codex/agents/kaya-osei.md` | Designer agent — constraints and patterns |
|
|
|
|
## Standards
|
|
|
|
- All colors use OKLCH via CSS custom properties
|
|
- Contrast ratio ≥ 7:1 for body text on dark backgrounds (WCAG AAA)
|
|
- No decorative animations — every transition communicates state
|
|
- Components are keyboard-navigable with visible focus rings
|
|
- Streaming states tested with progressive token rendering
|
|
|
|
## Done Gate
|
|
|
|
- [ ] Component renders correctly on pure black background
|
|
- [ ] OKLCH colors used throughout — no hex, no rgb
|
|
- [ ] Keyboard navigation works (Tab, Enter, Escape)
|
|
- [ ] Streaming state looks natural (no flicker, no reflow)
|
|
- [ ] No visual competition with message content
|
|
- [ ] Mobile responsive (≤ 640px) if applicable
|
|
- [ ] Matches existing design language (check `globals.css` tokens)
|