完整汉化：将所有用户可见文本翻译为简体中文
- index.html: 页面标题、meta 标签、按钮文字/提示、状态栏 - docs.html: 完整文档页面 9 个章节 - js/main.js: 模式名称、分区标题、滑块标签、toast 消息、按钮文字 - js/ui.js: 新种子按钮、随机化提示 - js/modals.js: 导出对话框标题/选项/标签、套装生成器文本 - js/exporter.js: 渲染进度文本、完成/错误 toast 消息 - js/palettes.js: 16 种调色板名称 - README.md: 项目说明全文
This commit is contained in:
@@ -1,54 +1,54 @@
|
||||
# LUMEN, the generative shader studio
|
||||
# LUMEN 生成式着色器工作室
|
||||
|
||||
**[Try it live →](https://lumenshaders.vercel.app/)**
|
||||
**[在线体验 →](https://lumenshaders.vercel.app/)**
|
||||
|
||||
A self-contained web tool that generates looping abstract shader art: liquid chrome, silk ribbons, soft gradient blooms, aura rings, light rays, halftone fields, data glyphs, reeded glass and pixel mosaics. Everything is rendered in real time with WebGL2 and every animation is a mathematically perfect loop.
|
||||
一个自包含的 Web 工具，用于生成循环抽象着色器艺术：液态铬、丝带、柔和渐变绽放、光环、光线、半调场、数据字形、罗纹玻璃和像素马赛克。所有内容均通过 WebGL2 实时渲染，每段动画都是数学上的完美循环。
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
## Run it
|
||||
## 运行
|
||||
|
||||
No build step, no dependencies.
|
||||
无构建步骤，零依赖。
|
||||
|
||||
- **Live demo:** [lumenshaders.vercel.app](https://lumenshaders.vercel.app/)
|
||||
- **Local:** double-click `index.html`, or run `npx http-server . -p 8080`
|
||||
- **在线演示：** [lumenshaders.vercel.app](https://lumenshaders.vercel.app/)
|
||||
- **本地：** 双击 `index.html`，或运行 `npx http-server . -p 8080`
|
||||
|
||||
Requires a browser with WebGL2 (Chrome, Edge, Firefox).
|
||||
需要支持 WebGL2 的浏览器（Chrome、Edge、Firefox）。
|
||||
|
||||
## Controls
|
||||
## 控制
|
||||
|
||||
- **Randomize** (or press `R`): new style, palette, form, lighting and seed, tuned per art style so results stay good. Sometimes it invents a brand-new synth style.
|
||||
- **Style**: 9 art modes, each with its own renderer. "Keep style" locks the mode while randomizing.
|
||||
- **Generated styles**: "New style" runs a 12-gene style synthesizer (6 field types x 5 domain geometries x 4 color mappings x 4 shading models x 4 overlays) that produces standalone styles which do not exist in the base set, like FLUX, RIDGE, WAVE, RING, CELL and FLOW archetypes. "Save style" keeps favorites in your browser as one-click chips.
|
||||
- **Gradient sets**: the Set button renders 4 to 12 variations of the current design (same style and palette, different seeds) and downloads them as a ZIP of PNGs, ideal for using consistent art across one website.
|
||||
- **Color**: 16 curated palettes plus a harmonic palette generator, 4 editable colors + background, hue / saturation / exposure.
|
||||
- **Form**: seed, zoom, fbm detail, domain warp, turbulence, anisotropic stretch.
|
||||
- **Lighting**: intensity, gloss, light angle, iridescence, glow, contrast.
|
||||
- **Texture**: film grain, halftone/glyph density, ridge count, chromatic aberration, vignette, softness.
|
||||
- **Motion**: loop length and travel distance. Loops are seamless by construction (the noise field is sampled along a closed circle).
|
||||
- **Share**: every design serializes to a compact code (`LMN1.…`). Copy it, send it to anyone, and pasting it into the Share box recreates the exact design: style, colors, seed, all parameters. "Copy link" produces a URL that loads the design directly.
|
||||
- `Space` pauses, `S` saves a PNG.
|
||||
- **随机化**（或按 `R`）：新风格、调色板、形态、光照和种子，按艺术风格调校，确保结果始终出色。有时会发明全新的合成风格。
|
||||
- **风格**：9 种艺术模式，每种都有独立的渲染器。"随机化时保持风格"在随机化时锁定模式。
|
||||
- **生成风格**："新风格"运行 12 基因风格合成器（6 种场类型 × 5 种域几何 × 4 种色彩映射 × 4 种着色模型 × 4 种表面叠加），产生基础集合中不存在的独立风格，如 FLUX（通量）、RIDGE（脊线）、WAVE（波）、RING（环）、CELL（细胞）和 FLOW（流）原型。"保存风格"将收藏保存在浏览器中，以一键标签形式显示。
|
||||
- **渐变套装**：套装按钮渲染当前设计的 4 至 12 个变体（相同风格和调色板，不同种子），并下载为 PNG 的 ZIP 文件，非常适合在网站上使用一致的视觉艺术。
|
||||
- **色彩**：16 种精选调色板加和谐调色板生成器，4 个可编辑颜色 + 背景，色相/饱和度/曝光。
|
||||
- **形态**：种子、缩放、fbm 细节、域扭曲、湍流、各向异性拉伸。
|
||||
- **光照**：强度、光泽、光照角度、虹彩、辉光、对比度。
|
||||
- **纹理**：胶片颗粒、半调/字形密度、脊线数量、色差、暗角、柔和度。
|
||||
- **运动**：循环长度和行程距离。循环在构造上是无缝的（噪声场沿闭合圆采样）。
|
||||
- **分享**：每个设计可序列化为紧凑代码（`LMN1.…`）。复制它，发送给任何人，粘贴到分享框即可重建完全相同的设计：风格、颜色、种子、所有参数。"复制链接"生成直接加载设计的 URL。
|
||||
- `空格`暂停，`S` 保存 PNG。
|
||||
|
||||
Full guide: [docs page](https://lumenshaders.vercel.app/docs.html).
|
||||
完整指南：[文档页面](https://lumenshaders.vercel.app/docs.html)。
|
||||
|
||||
## Export
|
||||
## 导出
|
||||
|
||||
Every export button opens a dialog with a live preview and its settings before downloading.
|
||||
每个导出按钮打开一个带有实时预览和设置的对话框，确认后下载。
|
||||
|
||||
- **PNG** up to 3840×2160, rendered offscreen at full quality.
|
||||
- **Video** (WebM VP9/VP8) encoded offline with **WebCodecs** (`VideoEncoder`) and muxed by a built-in dependency-free WebM writer: no `MediaRecorder`, no realtime capture, no tab crashes. Configurable fps (24/30/60), resolution (720p–1440p) and exact length (1–8 loops or 5–60 seconds).
|
||||
- **GIF** rendered deterministically frame by frame, encoded in-page with a dependency-free GIF89a encoder (median-cut palette + ordered dithering). Loop forever or play once.
|
||||
- **PNG** 最高 3840×2160，离屏全质量渲染。
|
||||
- **视频**（WebM VP9/VP8）使用 **WebCodecs**（`VideoEncoder`）离线编码，由内置无依赖 WebM 封装器封装：无 `MediaRecorder`，无实时捕获，无标签页崩溃。可配置帧率（24/30/60 帧/秒）、分辨率（720p–1440p）和精确时长（1–8 个循环或 5–60 秒）。
|
||||
- **GIF** 逐帧确定性渲染，使用无依赖 GIF89a 编码器（中值切割调色板 + 有序抖动）在页面内编码。永久循环或播放一次。
|
||||
|
||||
## Files
|
||||
## 文件
|
||||
|
||||
- `index.html` / `styles.css`: app shell and design system
|
||||
- `js/shaders.js`: the uber fragment shader with all 9 modes
|
||||
- `js/engine.js`: WebGL2 engine and render loop
|
||||
- `js/gifenc.js`: GIF encoder (quantizer + LZW)
|
||||
- `js/webmmux.js`: WebM/Matroska muxer for WebCodecs output
|
||||
- `js/exporter.js`: PNG / video / GIF pipelines
|
||||
- `js/palettes.js`, `js/ui.js`, `js/main.js`: palettes, control builders, state and randomizer
|
||||
- `index.html` / `styles.css`：应用外壳和设计系统
|
||||
- `js/shaders.js`：包含全部 9 种模式的超级片段着色器
|
||||
- `js/engine.js`：WebGL2 引擎和渲染循环
|
||||
- `js/gifenc.js`：GIF 编码器（量化器 + LZW）
|
||||
- `js/webmmux.js`：WebCodecs 输出的 WebM/Matroska 封装器
|
||||
- `js/exporter.js`：PNG / 视频 / GIF 管线
|
||||
- `js/palettes.js`、`js/ui.js`、`js/main.js`：调色板、控件构建器、状态和随机化器
|
||||
|
||||
Reference in New Issue
Block a user