109 lines
2.2 KiB
Markdown
109 lines
2.2 KiB
Markdown
|
```
|
||
|
|
· · ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· ·
|
||
|
|
· · ·
|
||
|
|
```
|
||
|
|
|
||
|
|
# PIVOINE.ART
|
||
|
|
|
||
|
|
> Technology and sound, creating massive beats to push the boundaries of audio perception.
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## About
|
||
|
|
|
||
|
|
An immersive audio experience. Electronic music meets WebGL visualization.
|
||
|
|
5000 particles react to every frequency. The logo breathes with the beat.
|
||
|
|
|
||
|
|
Dark. Minimal. Precise.
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## Features
|
||
|
|
|
||
|
|
```
|
||
|
|
▸ WebGL Visualizer 5000 particles · 512 FFT · bass/mid/high reactivity
|
||
|
|
▸ Reactive Logo Canvas-based · audio-driven · mouse-aware
|
||
|
|
▸ Persistent Player Play · seek · volume · progress
|
||
|
|
▸ Web Audio API Real-time frequency analysis
|
||
|
|
▸ SPA Navigation htmx · smooth transitions · Alpine.js state
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## Stack
|
||
|
|
|
||
|
|
```
|
||
|
|
Hugo ─────────────── Static site generation
|
||
|
|
Tailwind CSS 4 ───── Utility-first styling
|
||
|
|
Alpine.js ────────── Lightweight reactivity
|
||
|
|
Three.js ─────────── WebGL rendering
|
||
|
|
Web Audio API ────── Frequency analysis
|
||
|
|
pnpm ─────────────── Package management
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## Development
|
||
|
|
|
||
|
|
```bash
|
||
|
|
# Install dependencies
|
||
|
|
pnpm install
|
||
|
|
|
||
|
|
# Development server
|
||
|
|
pnpm dev
|
||
|
|
|
||
|
|
# Build for production
|
||
|
|
pnpm build
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## Deploy
|
||
|
|
|
||
|
|
```bash
|
||
|
|
# Build image
|
||
|
|
docker build -t pivoine-art .
|
||
|
|
|
||
|
|
# Run container
|
||
|
|
docker run -p 8080:80 pivoine-art
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## Structure
|
||
|
|
|
||
|
|
```
|
||
|
|
├── assets/
|
||
|
|
│ ├── css/ # Tailwind source
|
||
|
|
│ └── js/ # Visualizer · Logo · Main
|
||
|
|
├── config/ # Hugo configuration
|
||
|
|
├── content/ # Markdown content
|
||
|
|
├── layouts/ # Hugo templates
|
||
|
|
└── static/ # Compiled assets
|
||
|
|
```
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## Author
|
||
|
|
|
||
|
|
**Valknar**
|
||
|
|
valknar@pivoine.art
|
||
|
|
|
||
|
|
---
|
||
|
|
|
||
|
|
## License
|
||
|
|
|
||
|
|
All audio content © Valknar. All rights reserved.
|
||
|
|
Code: MIT
|