返回 UI
流星音潮-Meteor Soundwave
组件灵感来源番茄代理人的博客(https://fqzlr.com/music), 很喜欢他里面的3D音频可视化的效果, 于是去学习了Web Audio API, Three.js, 还有很多相关联的技术, 然后使用Ai实现了效果. 因为GLSL里面无法使用JS上的SimplexNoise库, 所以用的是原生数学算法.上传音频后再次点击屏幕即可开始播放, 再次点击暂停
3D Audio Visualizer
METEOR SOUNDWAVE
♫ 许嵩 - 幻听.mp3
Paused
Click: Play / Pause · Drag: Rotate · Scroll: Zoom · Tap Block: Ripple
Nihilistic Hero 虚无实用主义左右布局 Hero
从网图中收到启发,GPT-Image2抠像人物成png图片,经过实验室测试后收录的 16:9 Hero 海报布局, 使用左右分栏构图、衬线标题、装饰分割线、人物透明 PNG 和紫橙裂纹 SVG, 并按明暗主题切换虚无实用主义/理想完美主义。
Shiro的导航栏
组件来源于Innei在24年写的Shiro主题的博客, 博客开源, 读了下源码使用的是Motion库, 用到了layout和layoutId两个关键属性完成这个效果, 当然还有Innei大佬那神级UI的审美, 我很喜欢, 收录了进来, 想要进一步复刻可以使用DropdownMenu