DevDiary〜脳みそだだ漏れToday
脳みそのだだ漏れ雑多なメモ
2026/04/15
機械学習手法
・線形回帰
・ロジスティック回帰
・k-NN(K-Nearest Neighbor algorithm)
・SVM(Support Vector Machine)
・Random Forest
・LightGBM → 勾配ブースティング決定木
・MLP(Multi-Layer Perceptron)
・CNN(Convolutional Neural Network)
2026/04/08
Figma
オートレイアウト
アノテーション機能
コンポーネント
Figma MCPとかPencilとかあるにせよ、元データ(Figmaデザインデータ構造)がクソ雑だったら、うまく実装できないね
再設計し直しますか…
横スクロール・ティッカー
「実際に動かさず、意図だけ伝える」
Frameに Clip content をON
中に横長コンテンツを配置
Prototypeで「Horizontal scrolling」を設定
2026/04/07
WebDesign:モバイル・ファースト
デザインによってはけっこういいかもしれないな…
Design Tokens
・Color Tokens
・Typography
・Spacing Rule
/icons/hr.icon
2026/03/17
テクノロジーって何だろうを読んでる
一般書っぽい感じ
まず章の末尾に要約がついてる
第1章は概念整理の感じ?
概念整理ではなく、小林さんテクノロジーに対してどう思ってんの?のお気持ちを知りたいと思って 読み進めます
第1章 と第2章は技術哲学 というものの紹介?
エルンスト・カップ「技術 哲学」
身体の器官が外に投影されたもの(器官投影 organ projection)
拡張的な?オーグメンテーションとは違うのかな?ニュアンス。
なんか どんどん目が滑るようになったな
語源をこねくり回すようなラテン語教養主義 みたいなものに対して未だに腹落ちしていない。
前は腹落ちせずとも かっこいいと思っていたから ついて行ってたけど今はもうそういうこともない。
ただ目が滑るだけ。
寂しいね。
なんか 真面目な本だなー
何なんだろう…もっと面白い話ししてほしい
第1章すっと終わった
第5章 パラパラ 見ると何か面白そう!
ここ読むか
あんまし なんか ポスト現象学とか宇宙 技芸とかベルクソンとかあんま 興味を惹かれないんだよな…
2026/03/12
さすがにかっこよすぎる、シンプルに。
その道のWebデザイナーの人からみたら、あるある、なんだろうけど、素人からしたら、「なんかすげー」って感じ?
Aviutl勢からみたAdobeみたいな感覚。
たしか、なんかかっこいい映像があっても、「Adobe」で作っていたら、なんだ「Adobe」かよ。っていってた、あの中学生コミュニティ感を思い出した。
/icons/hr.icon
2026/03/11
Arduinoを買うときのスペックを見る選定ポイント
1. I/O電圧(周辺デバイスの選定に関わってくる)
2.プロセッサーのモデルと周波数
3.搭載メモリ容量
4.無線・有線通信機能の有無
5.アナログ機能の有無
6.ディジタルI/Oのピンに流せる最大電流
SPI通信のSPIモード(0-3)の仕様書での調べ方が、なかなか暗号解読か、パズルに近い
マイクロチップ、アナログデバイセズ、STマイクロ
文字表記の場合は以下
(CPOL, CPHA)=(0, 0):SPIモード0
(CPOL, CPHA)=(0, 1):SPIモード1
(CPOL, CPHA)=(1, 0):SPIモード2
(CPOL, CPHA)=(1, 1):SPIモード3
図表記の場合、読み解きが発生する
D-A変換の簡単なしくみとして
抵抗ラダー回路+出力バッファ(ボルテージ・フォロワ)を組み合わせる方法がある
アナログシンセ(MiniMoog)の回路とかでなんか見たことある…?
よくわかってはいない
プルアップ抵抗とかプルダウン抵抗とか、いまだに知らん
グラウンドが浮くからとか、電流制限抵抗だとかなんとか?
ふむ…?
もはや実際にやって慣れていくしかないかな
PWM信号出力での制御
たとえばRCサーボモーター
パルス幅(時間)によって、回転角度を制御するもの
Arduinoなどで簡単にプログラムして制御できるが、プログラムが複雑になってきて、他のプログラムによる「割り込み処理」でCPU処理が遅くなったりすると精度ががくんと落ちる。
Servoライブラリのような制御用のライブラリを使うか、
根本的には、Arduinoとは別でタイマーを用意して、CPUと独立してタイマーを駆動させれば、PWM出力に関しては手間取らない
ソフトウェア制御(CPU)ではなく、ハードウェア制御に切り分ける考え方
回転数センサ
円盤に穴が一つ開いていて、その片側に光源、反対側に受光素子。
円盤が回転して、穴が開いているところから光りが通ったら1回転した、とみなす
透過型フォトインタラプタ
精度は低め
計測するには、たとえば理想的にはタイマー(パルスを数える)を使ってカウントしていく
or
パルス”H”のタイミング外部割り込みを読んで、トリガーでCallBackでパルス数+1みたいな
フェナキスティスコープ、みたいな
https://gyazo.com/fa373c6499d95a7e3c791c5fb9a7ccbd
/icons/hr.icon
2026/03/08
MCP
AntiGravityでフロントエンド開発(WebAppなど)をビジュアル編集でデバッグしたい
現段階ではCursorを使えばいいとも思う。試してみてダメだったら、Cursorです。
Requirements:Node.js v20.19 or a newer latest maintenance LTS version.
Node.jsのバージョンアップ
node -v
現在のバージョン確認して
nvm list available
アップデートできるバージョンを調べて、LTSの最新版をインストールすればいい
nvm install 24.14.0
nvm use 24.14.0
※nvm = node version manager : Node.jsのバージョン管理ツール
入れれたっぽい?
パッケージ管理マネージャー yarn, npmなど…
corepack は、Node.js のプロジェクトで利用されるパッケージマネージャー(yarn, pnpm, npmなど)のバージョンを管理する公式のツール。Node.js v16.9.0 以降から標準搭載。
code:corepack
corepack enable
で有効化できる
・プロジェクトの package.json に設定されているパッケージマネージャー(例:"packageManager": "yarn@1.22.19")を読み取り、手動でインストールしなくても、自動的に適切なバージョンをダウンロードして実行
・バージョンの固定(再現性の確保) チーム開発を行う際、全員が全く同じパッケージマネージャーの同じバージョンを使うことを強制できる。これにより「自分の環境では動くけど、他の人の環境では動かない」といった問題(依存関係の解決方法の違いによるバグなど)を防ぐ。
・グローバルインストールの不要化 npm install -g yarn のようにグローバル環境を汚すことなく、プロジェクトごとに適切なツールを使うことができる。
git において、フォークしたプロジェクトに対してリモートリポジトリのエイリアス(ニックネーム)が変更されてなくて、コードを変更してリモートプッシュしようとすると、フォーク元のプロジェクトの方にプッシュしようとする
エイリアスを変更する
まず現状確認
git remote -v
そこでたいてい、オリジナルのプロジェクトを指している
みたいに指定すると、OK
ビルドしてGithub Pages公開
Vue + Typescriptの場合、ビルドする必要があり、それはたいてい ./distにindex.htmlが出力される。これをGithub Pagesで公開するには人てま必要
Github Actionsのpeaceiris/actions-gh-pages@v4を用いて、gh-pagesブランチが作成(ビルドされた./dist/index.htmlの内容をgh-pagesブランチそのまま移す)され、それをGithubPagesの設定からDeploy from a branch→gh pages設定にすればいい
/icons/hr.icon
2026/02/26
グラフィック印刷でフライヤーを多めに見積もって 2万部くらい?
/icons/hr.icon
2026/02/24
Arturia MiniFuse2の内部スペック(基板から)
/icons/hr.icon
2026/02/19
SVGってアニメーションできんの…!?
とはいえWebとか対応しているものだけか~
Illustratorとかで開いても動かなかった
一生TIPS
よくゲームとかアプリのロード画面で、ユーザーの待ち時間を紛らわせるために、そのアプリの使い方とか、TIPSとか、コツとかが流れてくるのがある。タップしたら次のTIPSへ、次のTIPSへとうつるが、時間がたってもたってもTIPSは終わらず、ついにゲームは存在しなかったんだ…
一生TIPS
/icons/hr.icon
2026/02/17
ふつうにこのサイト自体が良すぎる
フォントかわいい
https://gyazo.com/c46e40f60558a4689a013d2376551f1f
欲しい.5000 yen / 1 weight
https://youtu.be/RojR3tHVtMo?si=lGxPcNHT4uhnY_4r
批評…電波を受信する
偏見や偏り。
電波を受信するAIがでたら怖いな(小川さん)
→電波を受信するAIは面白そう
ある意味批評をぶんなぐる批評装置になりうる?
もちろん、現時点でもLLMの学習によって偏りをもたせることは可能だが、常にもとのデータセットから抜け出せるかどうかが鍵
これが電波を受信するということにつながる
可能性の海に溺れるようなこと
これはいまのところ身体があるということによって担保されてるので…
どうやって、電波を受信させるか
みんな直感として、AIに広がりがないように思われる
つまり、プロンプトしないといけないのだ
AIに身体をもたせたい
複合的な意味における身体をもたせる
https://gyazo.com/d41933e3caaf20e062028c17dc050ba8 https://store.steampowered.com/app/3349980/_/?l=japanese
ブレビマン発売されてた
買っとこ
いま現在、非常に手がまわらないのでできないけど、買う
/icons/hr.icon
2026/02/16
ASIO
ASIO=音楽制作向けの低遅延オーディオ規格
DAWと音声機器を直接つなぐ仕組み
v2.16
オーディオインターフェースなくても、仮想出力で複数のドライバにべつべつに音声出力分けれる
ドライバのタイプをASIOにして
ハードウェア設定からダイアログを開いて、必要なものだけONにする(UIが古くっておしづらい…)
おそらくこのダイアログで並んでいる上から順に割り当てられるっぽい
出力設定で必要な分だけONにする
トラックのAudio ToでExt. Outにして 1/2 とか 3/4とか割り当てる
音確認して、割当たってるか聞いてみる
あと副産物で、
ASIOにしたら、CPU処理率が若干減った…軽いのかな。助かりすぎる
2026/02/15
Ableton Live デバッグ
Alt押しながら起動で、VSTプラグイン読み込みなしでAbleton起動
VST落ちてしまう
Abletonエフェクト
位相、周波数シフト
歪みを与えるエフェクト
Audio Effect RackでL/R分岐
・元の音が鳴っているトラックに Audio Effect Rack を挿す
・Rackの Chain を2本作る(例:L と R)
・それぞれのChainの先頭に Utility を挿す
・L側 Utility:Input Channel = Left / Output Balance 50L
・R側 Utility:Input Channel = Right / Output Balance 50R
・各Chainに好きなエフェクトを挿す(L用 / R用)
・Rackの出力で自動的に合流して、そのまま Main Out
Illustratorでパス数カウント
ウィンドウ>ドキュメント情報>(サブメニュー)オブジェクト
カウントしたいパスを選択しておく必要あり
2026/02/16 6:47
よく考えたら「限界に突入」って面白い言葉だ
なんか「限界」がリミットではなく、液体みたいにおもえる
レトリック・リキッド
/icons/hr.icon
2026/02/14
→Ableton Liveでライブセットを保存したときに、なんか処理が重すぎてセット自体がまったく開けなくなったという事が起きたため
Projucerのプロジェクト設定で別ビルド版としてAbletonに認識させるために
Plugin CodeやPlugin Nameを変更、
Exporters > Visual Studio 2022 (Debug / Release)のBinary Nameを変更する
/icons/hr.icon
2026/02/11
無は力である
無は、技術負債がないから、ホッピングできる
それが世代交代ということの源泉では?
慣れたやり方や、過去のメモリがあるから、そこから抜け出せなくなる
デジタルガーデニングをやること、ガーデニングを定期的に荒らすこと、ぬか漬けを定期的にこねくり回すように
新しい機能とか、便利とかの次元ではない
AIコーディングの世界
SEたちの欲望…ぼっとうする時間が失われた?寂しい
そこにポエティックが介入して手触りを導入する
ポエトリーということばがなんか交渉なので、うまく擬態できれば、欲望にリーチできそう
なるたき:ボロピッケルは、やはり単に悪質なものでは?
そうともいえるけど、ハイデガー的な、ものが壊れる、あるいは不調を起こすときにこそ立ち現れてくるものがあるような感覚を狙えないか
そういうものは豊かさであるんだけど、豊かさを享受するために、まず豊かでなければいけないかも
デザインはよくもわるくも詐術
なるたき:純粋なものはグロテスクなので、デザインでマイルドにしていく必要がある
悪質なデザインと、抜け道としてのデザインは何が違うの?
一方でボロピッケルは危険だが、他方でボロピッケルはものの出現にもなる
DIYやメイカームーブメント(雑につくること)の反対としての、雑に壊すこと
ぷるぷるさせる
浮動小数点のエラー
理論上は無限の連続なのに、有限性がぷるぷるさせる
ほんとうは無限なんだけど
人間ってなに?
有限なの?無限なの?
やるとはなにか?
やるとする
やるはオープンエンド
するは合目的性、計画性
Codeにおけるオープンエンドの、古典はクワイン
やる詩
ペンプロッタ
逆に、絵から、テキストへの逆コンパイルは?
やる、とはなにか?
オープンエンド性と過程における生成変化を目的とした具体的な行為の継続、賭け、であること…
例えば「実行」とは何が違うのか?
実行は、事前に計画を立てている
2026/02/10
グラフィックでの推奨カラープロファイル
RGB Adobe RGB(1998)
CMYK Japan Color 2011 Coated
仮想オーディオドライバー VBCABLE
→AbletonLiveにルーティングすると音が一定間隔で途切れてしまうな…
検討
・サンプルレートが一致しているか確認
AbletonLive:44100
VBCABLE : 48000 → 44100にしました(Windowsサウンドコントロールパネルから)
かわんない…
・オーディオバッファ不足問題
Abletonのデフォルト設定が8192くらい(?)だったけど、これを適当に調整したら途切れなくなった(!)
AbletonLiveでのリモートスクリプト、なんかプラグインみたいなものかなと思ったら結構、原始的というか、コンソール的な感覚だ
Ableton OSCのテスト用スクリプト
run-console.pyを実行するとき
pyreadline3が必要なので
pip install pyreadline3
でインストールする。
うまくいかない場合(複数のPythonバージョンがインストールされていたりしたらうまくいかなかったりする)
py -3.11 -m pip install pyreadline3
でバージョン指定してインストールする
(この場合ver.3.11)
原始的に確認していきますよ~(run-console.pyを実行)
https://gyazo.com/5535a979f9fd6512d412c0047c662f24
まずAbleton Liveの1番目のトラックの1番目のエフェクトのパラメータを制御したい
基本1番目=IDは0である
code:device_idの確認
>> /live/track/get/devices/name 0
0, Space Tank, Auto Filter
と返ってくる
最初の0は、単に引数に渡したものをそのまま吐き出してるなので無視
1番目のSpace Tank (ID は一番目なので0)
code:parameter_idの確認
>> /live/device/get/parameters/name 0 0
0, 0, Device On, P.Dly Sync, P.Dly Time, P.Dly 16th, P.Dly Fb Time, P.Dly Fb 16th, Algo Type,
Algo Delay, Freeze, Freeze In, Decay, Size, Damping, Diffusion, Modulation, DH Shape, DH BassMult, DH Bass X, Sh Shimmer, Sh Pitch Shift, Ti Tide, Ti Rate, Ti Waveform, Ti Phase, Qz Low Damp, Qz Distance, Pr High Mult, Pr Low Mult, Pr X Over, Pr Sixth, Pr Seventh, EQ On, EQ Pre Algo, EQ Low Type, EQ Low Freq, EQ Low Gain, EQ Low Slope, EQ P1 Freq, EQ P1 Gain, EQ P1 Q, EQ P2 Freq, EQ P2 Gain, EQ P2 Q, EQ High Type, EQ High Freq, EQ High Gain, EQ High Slope, Send Gain, Routing, Blend, Vintage, Width, Bass Mono, Dry/Wet
最初の0,0は無視して、各パラメータ名が返ってくる
たとえば Device On はparameter_idは0である
制御したいパラメータが何番目にあるか数えてIDを特定する
コマンドでパラメータ名を指定して、IDを取得するコマンドは用意されてなさそう…?
今回はDry/Wetを制御したくて、運がいいことに末尾である
なので、パラメータ総数を数えるコマンド
code:パラメータの数を数える
>> /live/device/get/num_parameters 0 0
0, 0, 54
で54個パラメータがあることがわかる
0番目から数えるので、末尾は53番目である。
次に一応現在の値を確認してみる(ほんとうにID 53がDry/Wetなのか)
code:parameterのvalue確認
>> /live/device/get/parameter/value 0 0 53
0, 0, 53, 0.4699999988079071
たしかにこのときAbletonでは47%と設定しており
0.46999…と取得できたのでそれっぽい。
次にこれをコマンドで制御してみる
10%にしてみるとすると 0.1で指定してあげる
code:set parameter
>> /live/device/set/parameter/value 0 0 53 0.1
https://gyazo.com/f2b81ff0e61f93a2c31220a63f9201bc
みごと変わりました
/icons/hr.icon
2026/02/09
p5.jsの開発について考える。TypeScript…
Webに組み込むときの「インスタンスモード」ね~なるほど
p5.jsをヴィジュアルプログラミング的にできるDEMOか。面白い。完成度は未完成だけど。参考にできそう。
そもそもノードみたいにちゅるちゅるさせるのどうやるんだ?
ノード形式のWebAppとか探してみよう。WebUIのお話。
動きと音
AbletonでOSC
AbletonLiveってスクリプト(Python)拡張いけるんだ…?
リモートスクリプトに限られるのかな?
/icons/hr.icon
2026/02/08
OSC回り確認
我が家の開発環境で同一ネットワーク内にある機器で送受信テストをしたい(ローカルホストではなく)
→Windowsが一台しかないので、Windows-Android間でひとまず試す
いま初めて知りましたけどTouchDesignerのOSC INでLocal Addressの欄、受信に際しては必須ではないんだ…
https://gyazo.com/70990740fc94a34fb6ef433e131ac118
Network Portだけ合わせておけばいい
逆に送信のときに、その受信先のIPアドレスを指定する必要があるというわけで。
普段はそのPCが接続されているIPアドレスすべてから受信するようになっており、任意でIPアドレス指定する場合は、全受信ではなくその特定のIPアドレスかつポートが一致した送信元からきたOSCを受け取るようになるだけ
「Protokol」アプリで試していたら、受信側のIPアドレス指定どうやってやるんだろう?と思っていたら、そういうことだったのか。全受信です。
OSC送受信アプリで、Androidがない(TouchOSC)というものがあるらしいが、3000円…(2026/02/08確認時点))
Android App開発環境準備する→やっぱ時間がない。めんどうだ…
VCV OSCプラグイン
VCVの使い方
関係ないWebサーフィン
神のp5.jsシンセサイザー
/icons/hr.icon
2026/02/07
コードエディタのワークスペースごとに色を変えたかった
p5.jsで別ウィンドウを開くような実装
ローカルで動かすなら、これがシンプル?
MediaPipeをJavascript(p5.js)で使う
p5.jsで使う前提ならml5.jsを使えばよさそう
package.jsonがあるディレクトリでyarn buildを実行してml5.jsをビルドする
yarnがインストールされてなければ yarn install
BodyPose's BlazePose model predicts a set of 33 keypoints
Nose, Left Eye Inner, Left Eye, Left Eye Outer, Right Eye Inner, Right Eye, Right Eye Outer, Left Ear, Right Ear, Mouth Left, Mouth Right, Left Shoulder, Right Shoulder, Left Elbow, Right Elbow, Left Wrist, Right Wrist, Left Pinky, Right Pinky, Left Index, Right Index, Left Thumb, Right Thumb, Left Hip, Right Hip, Left Knee, Right Knee, Left Ankle, Right Ankle, Left Heel, Right Heel, Left Foot Index, Right Foot Index, Body Center, Forehead, Left Thumb, Left Hand, Right Thumb, Right Hand
https://gyazo.com/c5a5d0f39169ca388e66a895cebf7363
function preload() {
// Load the bodyPose model
bodyPose = ml5.bodyPose("BlazePose");
}
に変更するとBlazePoseデモでSkeltalConnectionできる
VCV Rack
オープンソース
ただしフリー版のみか
VCV RackでOSC受信
/icons/hr.icon