Project Icon

Code-Package-p5.js

p5.js创意编码与生成式设计实践项目

Code-Package-p5.js项目为《Generative Design: Creative Coding for the Web》一书提供JavaScript源代码,基于p5.js库实现。该开源项目包含丰富的生成式设计示例,涵盖基础到高级的生成艺术技术。项目提供完整源代码,示例丰富,便于学习和实践。开发者可运行、修改这些交互式示例,学习算法艺术创作,适合对创意编码和生成式设计感兴趣的人士。

生成式设计代码包(适用于 P5.js

你好!这个 GitHub 仓库包含了所有用 JavaScript 在 p5.js 中实现的《生成式设计:网页创意编程》一书的源代码。要开始使用,请按照以下章节的说明进行操作:设置运行草图。祝你使用愉快!


作者:

贡献者:

设置

该设置允许你下载与为项目贡献更改相关的依赖项(例如 generative-design-library.js)。它还允许你使用 node 运行本地 Web 服务器。如果这些听起来太陌生或不感兴趣,你只想运行草图,请直接跳到运行草图部分。

  1. 安装 node.js(选择最新的稳定版本)
  2. 打开终端并导航到你下载到计算机上的 Code-Package-p5.js 文件夹:
$ cd 路径/到/文件夹
# 例如 cd /Users/GG/Documents/Code-Package-p5.js
  1. 运行:
$ npm install

运行草图

虽然大多数草图无需运行本地 Web 服务器即可工作,但有些草图由于使用外部文件2(如图片或数据)来创建和提供可视化信息,因此无法正常运行。要运行草图,你可以使用你喜欢的本地 Web 服务器。

有很多方法可以启动本地 Web 服务器。请参阅以下选项(顺序不分先后)

选项 1

一种方法是使用你选择的本地 Web 服务器(例如简单的 Python Web 服务器),然后在浏览器中打开 localhost:<端口>1

$ cd 路径/到/文件夹
# 例如 cd /Users/GG/Documents/Code-Package-p5.js

$ python -m SimpleHTTPServer
# 检查 localhost:8000

选项 2

如果你已经按照设置部分的说明操作,并且正在使用 Node.js,可以按照以下说明进行操作:

  1. 在终端或命令行中输入以下命令,启动本地 Web 服务器(带有实时重载功能)。这将在新的浏览器窗口中打开 index.html 文件(所有草图的列表)。
$ npm start
  1. 点击列出的任何链接 🔗 以查看和交互草图。
  2. 互动、创作、保存并分享你的作品!🌈#GenerativeGestaltung #generativedesign #p5js

1默认端口是 8000,但你可以通过在命令后指定数字来更改端口号,例如 python -m SimpleHTTPServer 5000

2某些草图只有在文件放置在线上时才能按预期工作,因为它们依赖于"安全"敏感功能,如加载外部文件。如果你尝试在没有运行 Web 服务器的情况下本地查看它们,你会得到某种"跨域"错误 😭(请查看浏览器的控制台)。解决方法是使用所谓的本地 Web 服务器来提供文件。这就是当你运行上面显示的 npm start 或运行你自己的本地服务器时所发生的情况。

许可证

本书的所有源代码均根据 Apache License Version 2.0 授权

项目侧边栏1项目侧边栏2
推荐项目
Project Cover

豆包MarsCode

豆包 MarsCode 是一款革命性的编程助手,通过AI技术提供代码补全、单测生成、代码解释和智能问答等功能,支持100+编程语言,与主流编辑器无缝集成,显著提升开发效率和代码质量。

Project Cover

AI写歌

Suno AI是一个革命性的AI音乐创作平台,能在短短30秒内帮助用户创作出一首完整的歌曲。无论是寻找创作灵感还是需要快速制作音乐,Suno AI都是音乐爱好者和专业人士的理想选择。

Project Cover

有言AI

有言平台提供一站式AIGC视频创作解决方案,通过智能技术简化视频制作流程。无论是企业宣传还是个人分享,有言都能帮助用户快速、轻松地制作出专业级别的视频内容。

Project Cover

Kimi

Kimi AI助手提供多语言对话支持,能够阅读和理解用户上传的文件内容,解析网页信息,并结合搜索结果为用户提供详尽的答案。无论是日常咨询还是专业问题,Kimi都能以友好、专业的方式提供帮助。

Project Cover

阿里绘蛙

绘蛙是阿里巴巴集团推出的革命性AI电商营销平台。利用尖端人工智能技术,为商家提供一键生成商品图和营销文案的服务,显著提升内容创作效率和营销效果。适用于淘宝、天猫等电商平台,让商品第一时间被种草。

Project Cover

吐司

探索Tensor.Art平台的独特AI模型,免费访问各种图像生成与AI训练工具,从Stable Diffusion等基础模型开始,轻松实现创新图像生成。体验前沿的AI技术,推动个人和企业的创新发展。

Project Cover

SubCat字幕猫

SubCat字幕猫APP是一款创新的视频播放器,它将改变您观看视频的方式!SubCat结合了先进的人工智能技术,为您提供即时视频字幕翻译,无论是本地视频还是网络流媒体,让您轻松享受各种语言的内容。

Project Cover

美间AI

美间AI创意设计平台,利用前沿AI技术,为设计师和营销人员提供一站式设计解决方案。从智能海报到3D效果图,再到文案生成,美间让创意设计更简单、更高效。

Project Cover

稿定AI

稿定设计 是一个多功能的在线设计和创意平台,提供广泛的设计工具和资源,以满足不同用户的需求。从专业的图形设计师到普通用户,无论是进行图片处理、智能抠图、H5页面制作还是视频剪辑,稿定设计都能提供简单、高效的解决方案。该平台以其用户友好的界面和强大的功能集合,帮助用户轻松实现创意设计。

投诉举报邮箱: service@vectorlightyear.com
@2024 懂AI·鲁ICP备2024100362号-6·鲁公网安备37021002001498号