9a58a03284
* feat(context): Add project intelligence system - Add project-intelligence.md standard (what & why) - Add project-intelligence-management.md guide (how to manage) - Add project-intelligence/ folder with 6 context files: - navigation.md (quick overview & routes) - business-domain.md (business context, users, value) - technical-domain.md (stack, architecture, decisions) - business-tech-bridge.md (business → technical mapping) - decisions-log.md (decision history with context) - living-notes.md (active issues, debt, questions) - Update standards navigation with new entries - Register all new contexts in registry.json This enables projects to document and maintain business + technical context for quick onboarding and lasting project understanding. * fix(registry): Add project-intelligence to profiles - Add context:project-intelligence/* to developer, business, full, and advanced profiles - Ensures project intelligence contexts are included when these profiles are selected This complements commit c731328 which added the context entries. * docs(core): refine project intelligence system and deprecate legacy context * feat(claude): simplify Claude Code integration with unified installer - Create single install-claude.sh script that auto-converts and installs - Remove redundant bootstrap-install.sh and install.sh scripts - Delete stale plugin/ directory (now auto-generated from .opencode/) - Add Claude Code documentation (agent-skills, create-subagents, hooks, plugins) - Add installation profiles (essential, developer, business, full, advanced) - Update README with Claude Code beta feature documentation - Add component-planning.md workflow context - Clean up demo files (assets/, src/) - Update registry with new context entries - Add gitignore rule for converter/generated/ The new installer: - Converts agents automatically from .opencode/agent/ - Installs fresh converted agents to ~/.claude/plugins/ - Single command: ./integrations/claude-code/install-claude.sh * fix: update README to use new install-claude.sh script The Claude Code integration now uses the unified install-claude.sh script instead of the removed bootstrap-install.sh and install.sh scripts. * fix(context): Add frontmatter to context files with missing metadata - Add YAML frontmatter with description to system-builder-templates - Add frontmatter to ui/web/design context files - Fixes validation warnings in validate-component.sh * fix(registry): Remove orphaned context entries for deleted files - Remove copywriting-frameworks entry (file moved to content-creation/principles/) - Remove tone-voice entry (file moved to content-creation/principles/)
83 lines
2.1 KiB
Markdown
83 lines
2.1 KiB
Markdown
---
|
|
description: "Advanced web UI patterns - scroll animations, visual effects, and interactive design"
|
|
---
|
|
|
|
# Web Design Patterns
|
|
|
|
**Purpose**: Advanced web UI patterns - scroll animations, visual effects, and interactive design
|
|
|
|
**Last Updated**: 2026-01-07
|
|
|
|
---
|
|
|
|
## Quick Navigation
|
|
|
|
### Concepts
|
|
| File | Description | Priority |
|
|
|------|-------------|----------|
|
|
| [scroll-linked-animations.md](concepts/scroll-linked-animations.md) | Scroll-synced image sequences (scrollytelling) | high |
|
|
|
|
### Examples
|
|
| File | Description | Priority |
|
|
|------|-------------|----------|
|
|
| [scrollytelling-headphone.md](examples/scrollytelling-headphone.md) | Full Next.js scroll animation example | high |
|
|
|
|
### Guides
|
|
| File | Description | Priority |
|
|
|------|-------------|----------|
|
|
| [building-scrollytelling-pages.md](guides/building-scrollytelling-pages.md) | Complete implementation guide | high |
|
|
|
|
### Lookup
|
|
| File | Description | Priority |
|
|
|------|-------------|----------|
|
|
| [scroll-animation-prompts.md](lookup/scroll-animation-prompts.md) | AI prompts for generating animation sequences | medium |
|
|
|
|
### Errors
|
|
| File | Description | Priority |
|
|
|------|-------------|----------|
|
|
| _(No error files yet)_ | | |
|
|
|
|
---
|
|
|
|
## Loading Strategy
|
|
|
|
**For scroll animation work**:
|
|
1. Load `concepts/scroll-linked-animations.md` (understand technique)
|
|
2. Load `lookup/scroll-animation-prompts.md` (generate image sequences)
|
|
3. Load `examples/scrollytelling-headphone.md` (see full code)
|
|
4. Reference `guides/building-scrollytelling-pages.md` (step-by-step)
|
|
|
|
---
|
|
|
|
## Scope
|
|
|
|
This subcategory covers:
|
|
- ✅ Scroll-linked animations (scrollytelling)
|
|
- ✅ Canvas-based rendering
|
|
- ✅ Framer Motion patterns
|
|
- ✅ Image sequence generation
|
|
- ⏳ CSS animations (future)
|
|
- ⏳ SVG animations (future)
|
|
- ⏳ WebGL effects (future)
|
|
|
|
---
|
|
|
|
## Related Categories
|
|
|
|
- `ui/web/` - Core web UI patterns (parent directory)
|
|
- `ui/web/animation-patterns.md` - CSS animations and transitions
|
|
- `development/` - General development patterns
|
|
|
|
---
|
|
|
|
## Used By
|
|
|
|
**Agents**: frontend-specialist, design-specialist, animation-expert
|
|
|
|
## Statistics
|
|
- Concepts: 1
|
|
- Examples: 1
|
|
- Guides: 1
|
|
- Lookup: 1
|
|
- Errors: 0
|
|
- **Total**: 4 files
|