p5.js

手绘VS码绘-2

使用的工具与上次相同，为VSCode编辑器和p5.js库，不再赘述。这次我想在上次的静态蜘蛛的基础上绘制一个可以与鼠标互动，自身也有动画的小蜘蛛出来。
冥愿愿愿·2020-08-17 03:20

手绘VS码绘-1

使用的工具为VSCode编辑器和p5.js库，关于此语言的一些具体信息和使用说明可以到文后附上的链接中学习
冥愿愿愿·2020-08-17 03:20

基于Unity简单绘图系统

拿到题目的时候有些纠结，手头上能做到可视化的语言有C++的OpenGl，matlab的GUI，课程中学习到的p5.js，还有C#的Unity。显然，选择何种语言取决于我
冥愿愿愿·2020-08-16 23:15

使用p5.js创意编程

前言第二份作业的要求是具象化地描绘自己的形象，也可以是任何形式表现自己的兴趣、追求、特色、经历等。在构思时某崩X3游戏出了新角色耗费了我大量的资源去抽取，突然就有了将这件事画下来的想法。实验结果（这里鼠标按下后出现黄色光圈是动图录制软件的问题，实际并没有）绘制过程脸部绘制脸部的绘制选择了arc（）画圆弧和rect（）画长方形建构大致轮廓stroke(0);strokeWeight(0.2);fil
预见的遇见·2020-08-15 20:42

码绘与手绘——第一次使用p5.js

正巧我最近也在学习使用p5.js，我虽然没有这么厉害的脑洞，但是模仿，应该还是可以的吧！
waittingUyou·2020-08-15 19:02

手绘VS码绘（一）：静态图绘制(码绘使用P5.js)

码绘我是用的P5.js的网络编辑器（附上网址：https://editor.p5js.org/）先来看看效果图，然后再一部分一部分的来看绘图过程吧！还是挺像的对吧！！！
0MLM0·2020-08-15 19:20

p5.js制作绘图工具

看了很多csdn上的大神做的绘图工具深感惭愧以下是我做的简易的绘图工具界面干净整洁左侧图案表示当前画笔的图形与颜色右侧图案表示当前画笔的大小图案包含三种基本图形下面介绍一下代码部分首先是图形functiongui(){ui.fill(255,255,255)ui.rect(0,windowHeight-100,100,100)ui.rect(windowWidth-100,windowHeight
qq_42208866·2020-08-15 19:12

码绘：使用p5.js创作简单的货车运动动画

使用工具VisualStudioCode+p5.js下载地址VisualStudioCode：https://code.visualstudio.com/Downloadp5.js:https://p5js.org/zh-Hans/download/目标在网页上画出一辆货车，通过运用循环、条件分支、函数等流程控制方法来达到动态的效果。具体流程首先我们建立一个index.html文件（主页）和一个c
流水别野·2020-08-15 19:12

Learn JavaScript with p5.js 免积分下载

图书说明：使用编程库p5.js中非常流行的JavaScript，以高度引人入胜的方式从头开始学习编码。
qq_41845555·2020-08-15 19:39

p5.js实现动态码绘（3d旋转、2d旋转基础）

p5.js实现动态码绘（3d旋转、2d旋转基础）一.在开始前遇到的编译器问题p5有一套自己的绘图框架，并且有一个非常易用的离线网页版编译器，免除了新的编译器带来的烦恼。
yc今天吃芋圆了吗·2020-08-15 19:07

p5.js 动态的表达与趣味

码绘是一个挺有争议的东西。很多人觉得它很麻烦，难度很大，门槛很高。其实想想，也许只是因为陌生。与码绘相对应的是手绘，很多人包括之前的我，都觉得用笔画不需要什么基础都可以，笔随心动，不受束缚，而且人人都会几个简笔画。可是在手绘方面，每个人或多或少都是下过功夫的，因为，我们都学过怎么握笔，在一定程度上，做到让笔听自己的话。所以，我们首先要打破对于码绘的心理恐惧。在上一篇博文中，我也介绍了自己初试码绘绘
qq_40301536·2020-08-15 19:29

Processing.js和P5.js的功能简介和区别

什么是ProcessingProcessing是关于数字艺术的编程语言，支持跨平台，语言本身是一个类Java语言，程序文件的后缀为.pde。通过编写processing程序，教师可以将复杂的物理、化学、数学原理形象的展示给学生。比如绘制各种曲线图，波线，粒子，绘制分子结构，当然在生理卫生课上还可以绘制一群小蝌蚪在游泳等动态的图形。具体介绍见：https://blog.csdn.net/liuxia
赶路人儿·2020-08-15 18:11

简介-P5.JS，JAVASCRIPT和STRING

我们将在此课中探讨的第一件事是git，github和github页面。绝不是托管项目所需的github页面。它是免费且快速的，可以在github上使用。因此，至少在作业/实验阶段/项目中，有理由考虑使用它们。这里有一些入门资源。GitandGithubSteveKlise的Git和命令行介绍初学者的Git工作流程“尝试”Git教程Github页面：Github页面指南JavaScript该课的核心
国外课栈·2020-08-15 18:40

动画&交互&P5.js

一、背景编程语言：p5.js，p5.js是JavaScript的程式库，它起源于processing的原旨。
REDswag·2020-08-15 18:25

p5.js 互动媒体技术 创意编程作品

创意编程作品基于p5.js实验要求：一件编程创意作品，实现动态效果。
STAmbition·2020-08-15 18:10

用P5.js绘制创意作品

要求主题：用编程方式创作一幅介绍自己的作品作品:一件编程创意作品，必须实现动态效果或交互效果；作品录制一段一分钟内的视频；作品可以是具象化地描绘自己的形象，也可以是任何形式表现自己的兴趣、追求、特色、经历等；最终作品绘制过程主要是用了bezier曲线进行函数，首先在ps里计算了bezier曲线所用到的各点坐标。函数如下：beginShape();strokeWeight(5);stroke(0);
Harley Buu·2020-08-15 18:50

伴随 P5.js 入坑创意编程

一想到所有坑都被填了（如果还有啥是我不记得的，请千万不要提醒我），就觉得真是业界良心，倍感轻松。于是古柳某日点开图像检索（一）：因缘际会与前瞻一文，回顾“佳作”之余，也找了下里面清华美院向帆老师的作品集网站zeelabProjects。PS：如果你没看过这个演讲，推荐一看，古柳至今难忘：【一席】向帆：如果把每年的春晚都像蚊香一样卷起来的话，它就是这样的而在这些作品中，古柳更中意且也想实现下类似网页
【weixin-sjk6070】·2020-08-15 17:59

融入动画技术的音乐可视化交互技术——Fun Beats

是我们大创项目正在研究的一款培养乐感的交互式小程序，在原有的框架上，我结合《代码本色》中的知识，添加了动态特效，融入动画技术，用户不仅可以选择歌曲，调整节奏、频率等，还可以自行选择喜欢的动画特效，体验到具有“形象”的乐曲~开发环境：p5
吴粤·2020-08-09 01:31

运用p5.js实现王一博q版形象

创意编程——卡通自画像设计展示成果创作灵感交互代码生成动态代码所有代码展示成果静态：gif：创作灵感这次题目是自画像、自己喜欢的事物，所以我选取了自己喜欢的一个q版形象进行模仿。以下是原图：因为要加上动态和交互，于是我给人物的眼睛、手脚加上动态效果，鼠标点击改变衣服颜色进行交互。交互代码//Whentheuserclicksthemouseletangle1=0;letangle2=0;letsc
SIRP·2020-08-05 15:42

手绘与码绘————用代码表现出花瓣飞舞的效果

这些图片是怎么做出来的，笔者也不是很清楚，不过笔者最近正好在学习p5.js，里面的有些技术正好可以实现这种效果，让我们一起来看看吧；其实笔者一开始想做的并不是花瓣，而是雪花，首先通过p5.js，绘制出雪花的一部分
waittingUyou·2020-08-04 19:28

使用p5.js画一幅简单的风车动态效果图

使用p5.js画一幅简单的动态风车图因为大三互动媒体技术课程需要使用p5.js画图显示动态效果，并和自己手绘作品进行对比，查了查网上好像没有做风车相关的教程，就在这里简单介绍下吧。
爱吃鱼的萌萌·2020-08-03 14:40

交互媒体设计之交互喷泉

创作背景本次使用P5.js作为交互作品的创作平台，以《NatureofCode》这本书里面介绍的三种技术为基础展开创作，分别是‘向量’、‘力’和‘粒子系统’，将这三种技术融合在一起创作出粒子的运动效果，
我不是猪头饼·2020-07-28 21:17

“码绘”第二集————编程创意作品

“码绘”第二集——编程创意作品一、概述：实验工具：P5.js创意作品结果：{主体罗小黑，背景的星星【借鉴学习的他人代码】，点击生成花，键盘控制改变表情}步骤讲述。
爱喝鸡汤的懒颖·2020-07-13 01:00

Doodle Board（p5.js实现互动画板）

目标编写一个“绘画系统”，提供一系列绘画材料（例如画笔/颜料/滤镜）给用户操作，以创作出动态/交互的绘画作品。这个绘画系统是对“绘画”的概念的扩展，但仍然体现出与传统绘画系统的相似性；在材料/交互方式/作品呈现/作画者四个方面中，至少有两方面要体现出与通常的国画/水彩/油画/素描/数位板+电脑作画/钢笔画等大家熟知的绘画形态有较高相似性；在材料/交互方式/作品呈现/作画者四个方面中，至少要有一方面
Sugar_me_·2020-07-07 00:07

【Processing学习笔记】安装与入门

最早基于java开发，几年来同时推出了JavaScript版本p5.js,以及python版本processing.py。同时对于安卓机和树莓派也有了针对性的支持。
hitrjj·2020-07-05 18:22

p5.js新手上路第一关——动图临摹+拓展

p5.js实现对动图的临摹准备临摹的动图利用软件对动图的各帧进行分析保存观察分析利用电脑上的看图软件，将动图的每一帧都保存下来，然后对动图规律进行观察，得到以下结论：1、整个图形是由八个半径不同的半圆弧组成的
%_小菜鸟_·2020-07-05 09:05

p5.js新手上路第二关——码绘创作

ps.js新手上路第二关——代码绘画实现效果图…如何添加文本添加文本的主要函数：textSize(88);//设置字符大小fill(0);//填充字符的颜色text('需要显示的字符',x,y);//xy为字符显示的坐标添加文本的主要代码：functiondrawWords(x){fill(0);text('Would',x,530);fill(0);text('you',x+175,530);f
%_小菜鸟_·2020-07-05 09:05

p5.js入门教程(1) p5.js简介 与 基本形状绘制

一、什么是p5.js最近接触了一门数字媒体艺术类的课程，名为Interactivity，教的是p5.js。主讲老师就是开发者之一……还是挺激动的。
西河某人·2020-07-05 03:40

“静止”的龙猫

码绘作品是p5.js写的，编辑器用的是Brackets，Brackets编辑器非常实用，可以实时浏览，虽然p5.js有网页编辑器，但是在网页上写会很慢。
REDswag·2020-07-04 09:31

动画交互应用——神秘力量

一个跷跷板场景三——一座滑滑梯四应用创意1视觉独特的故事背景2真实的物理系统模拟3简单的画风及操作五关键技术1随机游走2力（1）橡皮绳系统（2）跷跷板系统（3）滑梯系统3向量4粒子系统参考资料博文推荐1、基于p5
一千克欣喜·2020-07-01 06:57

基于p5.js的物理学模拟小游戏

一、效果//游戏效果动图该游戏模拟了自治智能体的群体运动和物体间的引力。玩家可通过鼠标操控小球群运动，鼠标移动越快，球体之间的距离越大，反之粒子会趋向于聚集到一起。游戏过程中会随机出现大小位置不同的吸引子，对群体粒子产生引力，小球一旦被吸引子吸入则消失。游戏通过操控群体粒子到达目标点来计分，所有粒子被吸引子吸入则游戏结束。二、实现1、粒子群的实现单个粒子小球会跟着鼠标的移动转换运动方向，当小球离鼠
酒心巷里的可乐兔子·2020-06-27 13:21

互动媒体设计课程作业_2018-11-24

要求手绘：至少有一幅作品；允许采取纸面绘画或电脑绘画两种方式；可以结合速写课作业来完成；可以完成多幅作品，形成组图，以尝试不同的表现”动感“的手法；码绘：编程工具默认包括p5.js,processing
Yon遠·2020-06-27 13:35

p5.js之Q版人物绘制

头上不知是鹿角还是蝴蝶的Q版小人：完整代码：functionsetup(){createCanvas(800,700);}functiondraw(){background(255);//背景粉红色fill(255,134,128);ellipse(403,419,600,500);//脸部大体颜色strokeWeight(0);fill(254,224,178);ellipse(415,243,
qq_43594855·2020-06-26 02:38

互动媒体——自画像+简单音乐可视化

本次律老师布置的作业是一幅自画像，上一次用P5.js绘制动态图形就让我收获到编程与艺术结合的快乐！
卷卷卷不动·2020-06-26 01:30

基于p5.js的简单绘画系统

本次实验的主题是编写一个绘画系统，提供一系列绘画材料例如画笔、颜料、滤镜等给用户操作，以创作出动态、交互的绘画作品。这个绘画是对传统绘画概念的拓展，但仍然要体现出与传统绘画的相似性。注意：目标可以理解为：创作一个app,看起来比较像绘画工具，但又不是重复已知的绘画行为，而要体现出绘画出不来的效果：动态/UI或者意图，传统绘画是创作的一个平面视觉图像，这个app可以创作其他东西。设计思路：首先，三个
Azure.·2020-06-25 13:31

151128-processing 与 p5.js的区别

P5.js通过将画布从一个单一的桌面应用扩展到浏览器的方式，开启了Processing的强大能力。
wenchaohe·2020-06-22 23:06

p5.js作品集（2）：彩旗

效果图.png作品链接https://codepen.io/SampleTape/full/baGbjE/主要方法arc()triangle()translate()rotate()push()pop()草图草图.png过程分解初始化：新建一块画板functionsetup(){createCanvas(windowWidth,windowHeight);background(255);//设置背
SampleTape·2020-06-22 22:29

[Processing和P5.js]简单动态图形临摹和拓展

[Processing和P5.js]简单动态图形临摹和拓展在这里先说一下，本篇里做的两张动态图形，分别用了processing和p5.js，两者之前差异不大，所以明白了一种之后另一种也就比较好掌握了，但是
二十个石榴·2020-06-22 09:54

码绘——我的自画像

用的还是p5.js来编程，向日葵分为三个模块来编写，一是脸部：functiondrawface(x,y){//backfacefill(230,140,0);stroke(255,102,0);stroke
嗯，是我·2020-06-21 17:45

本周学习总结

p5.js是一个画图的工具angular的基本使用angular.json"scripts":["./node_modules/p5/lib/p5.min.js",".
房东家的猫·2020-05-08 18:00

p5.js作品集（4）：蜜蜂和蜂巢（下）

效果图.png作品链接https://codepen.io/SampleTape/full/baNzjP/主要方法beginShape()endShape()vertex()quadraticVertex()translate()rotate()push()pop()ellipse()过程分解（蜜蜂）一、绘制蜜蜂的一对触角绘制蜜蜂的一对触角.pngstroke(0);//设置轮廓颜色为黑色noFi
SampleTape·2020-04-06 19:11

Learn JavaScript with p5.js中文版 第一章 导学

总目录第一章导学：对写代码和编程进行概述第二章准备工作：学习JavaScript命令和操作的基础来开启p5.js的学习之旅第三章p5.js中的颜色：这一章是针对p5.js的，将学习如何在p5.js中定义颜色
矢寸心·2020-01-08 12:38

不会P5.js的程序猿不是好设计狮

image我们生活在一个飞速发展的时代，计算机为人类前进提供了强大的推动力，编程在其中的重要地位不言而喻。各种电子产品、手机应用让我们的生活越来越便捷，人类的的行为习惯正在被这些计算机语言悄悄改变着。如果你有能力又恰好有资源，学习编程真的是一个值得投资的潜力股。作为一个工科狗，大学时候就已经被C#、C++虐的体无完肤，从此对编程留下了难以磨灭的心理阴影。毕业后转投到了视觉设计，本来以为这辈子都与代
视觉派Pie·2020-01-02 19:59

iOS《JS在线编辑》

本APP分别支持HTML5开发、jQuery开发、p5.js开发、React.js开发，后续还会提供更多的JavaScript的开发框架的支持。本APP还提供了极为丰富的demo、
木子才·2019-12-31 16:18

深度学习零基础?没关系——面向艺术家的RNN教程

这篇文章适用于没有任何机器学习背景的读者，目标是向艺术家和设计师展示如何使用一个预训练的神经网络并使用简单的Javascript和p5.js库生成交互式的数字作品。
阿里云云栖号·2019-12-16 23:08

PixelShank 像素度量标注App

10分钟小Logo数月前用P5.js，Electron学习编程，写了这么个像素测量小工具。支持导入本地图片，通过鼠标点击在图片上标注像素尺寸，然后另存为一张.png图片。
witmin·2019-11-29 21:32

伴随 P5.js 入坑创意编程

上一篇文章：填坑！完结娱乐圈明星关系图谱发布后，古柳印象里过往留下的坑貌似只剩下图像检索（一）：因缘际会与前瞻的后续实践代码（原文里给了参考代码链接）和在豆瓣Top250电影海报上的尝试效果了。一想到所有坑都被填了（如果还有啥是我不记得的，请千万不要提醒我），就觉得真是业界良心，倍感轻松。于是古柳某日点开图像检索（一）：因缘际会与前瞻一文，回顾“佳作”之余，也找了下里面清华美院向帆老师的作品集网站
古柳_Deserts_X·2019-11-29 04:17

p5.js 我的第一幅码绘——小丑

p5.js我的第一幅码绘——小丑码绘相比较于手绘肯定是要繁琐，但优势在于可以做一些有意思的动态效果和交互。效果图小交互——癫狂状态的小丑DC漫画里，小丑是个癫狂的角色，令人战栗。
我也没办法啊·2019-10-31 16:21

p5.js 绘制创意自画像（互动媒体技术作业）

p5.js绘制创意自画像LittlePrince（互动媒体技术作业）作品展示代码&创意点分析1.设置工具类以获取坐标点：本次实验最有用的东西就是这个了2.眼睛跟随鼠标运动：3.披风跟随鼠标飘动：4.背景动态星球
好端端的hhhhhh·2019-10-27 21:19

p5.js关于互动媒体技术的实例

我认为艺工结合其实并不是一个新兴的产物，它在自然科学和艺术美学诞生的时候，这个概念就出现了。自然科学的目的是探索万物，发现事物的本质，认识我们的世界。艺术美学的目的是将一切的东西都像着美的方向发展，实现真正的美好。二者最终都会回馈自然，回馈人类群体的寻常生活。所以说，艺术和科学并不是对立的，他们一直都处于一个你中有我我中有你的状态。而现在，最能体现艺工结合的方面，大概是设计领域，凡是最终作用于人，
代数恒等定理·2019-10-20 15:38
上一页 1 2 3 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他