Krishnagangwal
精选
CS-Fundamentals
A curated collection of Computer Science fundamentals (PDFs, notes, cheatsheets, interview question banks) for placement preparation, covering seven core subjects plus general resources.
AI 仓库情报摘要
FR-AI / ANALYSIS为什么值得关注
它把具有编辑级质感的 3D 书籍体验全部打包在单个 index.html 中，无需框架或构建步骤，并附带面向 AI 代理的 PROMPT.md 以便重构或二次创作。
适合谁使用
- Three.js/WebGL 开发者
- 交互设计师和前端创意工程师
- 使用 AI 编码代理（如 Codex、Cursor、Claude Code）的实验者
- 对数字书籍或精装书 3D 展示感兴趣的设计师
典型使用场景
- 作为 PROMPT.md 驱动的 AI 代理重建或改版起点
- 作为书架到详情视图确定性 3D 过渡的参考实现
- 作为精装书或产品陈列的 Three.js 复用模式
- 作为交互式 WebGL 设计与材质效果的作品集项目
项目优势
- 整个体验集中在单个 index.html，无需安装或构建
- 包含细致装帧结构：书板、书脊、合页、环衬、书芯、堵头布、书签、烫印和接触阴影
- 在 WebGL 场景上叠加了可访问的 HTML 控件与状态提示
- 确定性的书架到详情过渡确保书籍重新挂载时不出现跳帧
使用前须知
- 需要联网加载固定的 Three.js 模块和 Inter 字体
- 单文件结构对需要模块化开发的团队可能较难维护
- 仅包含七本书和少量翻页曲面，且按设计不含后端、分析或 MCP，若需集成需自行添加
README 快速开始
The Complete Shelf
An original, interactive Three.js library of seven clothbound hardcovers. Browse the continuous shelf, pull a volume into a responsive detail view, orbit the binding, and drag through a small set of physically curved pages.
View the live experience · Read the build prompt
The collection is organized around seven tools for modern creative work:
- Codex
- Claude Code
- Cursor
- Antigravity
- Figma
- Framer
- Xcode
What is inside
- A continuous seven-volume shelf navigated with the wheel, arrow keys, buttons, or position markers.
- Detailed hardcover construction with separate boards, spine, hinges, endpapers, page block, headbands, bookmark, foil, and contact shadows.
- Responsive inspection mode with orbit, pan, zoom, hover-to-crack-open, click-to-open, and drag-to-turn page interactions.
- Book-specific color systems that recolor the scene and editorial detail layout.
- Procedural cloth, foil, paper, page-edge, wood, roughness, normal, and shadow textures.
- Deterministic shelf-to-detail transitions with exact endpoints so reparenting the selected volume never produces a last-frame jump.
- Accessible HTML controls and status announcements layered over the WebGL scene.
How it is made
The entire experience lives in index.html: markup, responsive layout, shaders and materials, book geometry, interaction state, animation, and embedded image atlases. There is no framework, bundler, backend, analytics layer, Mint dependency, or MCP call in the browser.
The render stack uses Three.js with physically based materials and OrbitControls. Cover and wood artwork are stored as embedded WebP atlases; supporting surface detail is generated at runtime with canvas textures. Each book is assembled from reusable geometry, while the front cover and pages use hinged groups and segmented meshes for curved page-turn motion.
Interaction is managed as a small state machine:
shelf -> opening detail -> closed inspection -> open book -> closing -> shelf
Camera, book, shelf, and view-offset transforms share deterministic eased timelines. This keeps the animation continuous when a book moves between the shelf and inspection scene graphs.
Build or remix it with an agent
Start from PROMPT.md, attach a visua
项目描述
An original single-file Three.js library of seven interactive clothbound hardcovers.
相关仓库与替代方案
根据分类、Topic 和编程语言匹配的相似项目。
xiejunjie524
精选
handdraw-story-video
A tool that converts 7–9 hand-drawn story keyframes into a 35–45 second vertical video with progressive line art and color animation, configurable via JSON and renders with HyperFrames and GSAP.
gnipbao
精选
story-to-handdrawn-video
A Remotion-based tool that converts Chinese story text or ordered hand-drawn images into vertical hand-drawn diary-comic animation with handwritten captions, left-to-right reveals, optional page-curl transitions, and silent H.264 output for post-production dubbing.