BugOSC, an OSC controller based on WeChat Mini Program

OSC is a commonly used data protocol when transferring data between software and devices. The most common usage scenario is to install an OSC sending software on the mobile phone, install a receiving module on the computer, and then start your performance with hands: In the past, when using OSC on a mobile phone, you must install an app (such as TouchOSC). And if you are using WeChat now, BugOSC is an OSC controller

Transmitting OSC data via WebSocket

Sometimes I meet situations where I need OSC but cannot use UDP.  Such as sending OSC message from browser-based p5js to Processing / MaxMSP / Unity.And I’m developing a OSC controller called BugOSC. It is a WeChat Mini Program, which also does not support UDP. However, although the web guys usually don’t support UDP, they support WebSocket – another network transmission protocol. So I built some examples about transmitting OSC data through

p5.we – develop WeChat Mini Game using p5.js

p5.js is a wonderful JavaScript library that starts with the original goal of the also wonderful Processing. p5.we is a boilerplate to develop Wechat Mini Game (微信小游戏) using p5.js. What is WeChat: WeChat is more than a messaging and social media app – it is a lifestyle for one billion users across the world. What is WeChat Mini Game: The Mini Game is a brand new game application developed on

Max QRCode Generator

“Node for Max” is a new future of Max8. Official introduction and tutorial:“With support for the vast NPM library, Node for Max connects your patches to thousands of possibilities.”https://www.youtube.com/watch?v=PmyPdmujYQQhttps://www.youtube.com/watch?v=qSZH6fjOcXE Easy to use:In Max: use [node script] object.In js: I made a QRCode generator using Node for Max: Max patch and NodeJS source code download:https://www.patreon.com/posts/24123843


本次周末DEMO,是一个互动触摸墙原型。 器材: 导电墨水笔 Makey Makey 画纸 投影仪 程序:Adobe Animate 视觉:PS 手绘 + AE —- 导电墨水 —- 关于墙体的互动方案,雷达,家里玩太贵;摄像头CV识别,缺少触摸感;最终选用了导电墨水: Bare Conductive这一款导电墨水笔,淘宝一支百元左右: 为保护家里墙面,拿白板+画纸代替。 第一层纸,画好导电线路: 再铺一层纸,触摸位置挖个简单粗暴的洞: —- Makey Makey —- 图自http://makeymakey.com 图自http://makeymakey.com Makey Makey直接映射的就是键盘,所以接好线路即可: —- 程序 —- 控制及呈现的程序,平台选用 Adobe Animate,看着眼生?它以前叫 Flash 。 在 Animate 里所见即所得的做 Layout,以及导入动画序列帧。 代码部分,用 Javascript API,而非as3,这样可将项目发布成 HTML5+Canvas 的 Web 形式,而非传统的 swf Flash。 发布成 Web,就非常灵活了。Web 页面托管在开发机上,而连接 Makey Makey 和投影的是另一台更轻便的笔记本,联局域网打开页面网址就行。 调试时,若另一头开发机有了修改,这边直接刷新页面即可更新。 最后将做好的画面投影到墙(画纸)上,触摸区与画纸上挖的洞对准(可以先投影,再挖洞,方便校准): 最终效果即如开头视频所示。 ** —- 项目分工 —-** 花婶:采购 + 画导电线 + 布展 +