見出し画像

About Cables

ブラウザ上でノードベースのプログラミングを行い、エクスポートしたものをwebへ実装できるというなかなか面白い環境が、2019年よりベータ版でリリースされました。

使い慣れるまでは、少し癖はあるのですが、面白い開発環境なので紹介していきます!

【最初に訪れるべきWEB SITE】

Cables.gl公式ページ

cablesのアカウント登録や開発を行う基本となるweb siteです。

開発元:undev(Berlin)

made with cables

cablesを実際に使って開発されたwebサイトなど事例が公開されてます。


【特徴】

cablesの特徴は、「ノードベース」「3Dモデルやマテリアル、テクスチャを活用できる」「開発環境がブラウザ」「エクスポートしたものがそのまま実装できる」あたりが、特に強みだと感じています。

ノードベースのプログラミング

テキストでコードを書くのではなく、「ノード」と呼ばれている一つ一つの機能を持ったプログラムの塊をつなぎ合わせることでプログラムを書いていきます。
cablesでは、Ops(オプス)と呼ばれています。

3Dモデルやマテリアル、テクスチャを活用できる

すごーく雑な言い方をすると、3Dモデルの質感を操るのが比較的平易です。通常であれば、ライティングやマテリアルなどの質感に関わる部分をプログラムで書くためには、準備がかなり必要なのですが、Opsを2-3つ繋ぐだけで質感を得ることができます。

ノードベースやマテリアルやテクスチャの感じは、以下の画像がイメージです(シリアル)

画像2

Cablesの開発画面

開発環境がブラウザ

Chromeをはじめとしたwebブラウザで開発ができるので、インターネット環境があるPCであればどこからでも開発ができます。これは、開発環境を整える時間が必要とせず、WindowsでもMacでも同様に開発ができることや、プログラムにどこからでもアクセスできるので、とても特徴的な環境かと思います。(ネット環境がないと開発ができないのはデメリットです。泣)

エクスポートしたものがそのまま実装できる

開発したものをエクスポートすると、htmlとjsのパッケージとして書き出されます。そのままパッケージとしてサーバーにもあげられますし、NEROTのようなデジタルアートの投稿のプラットフォームにもすぐに投稿することができます。

その他の特徴

MIDIとの連携、各種ブラウザのAPIの活用、シェーダーの書き込みやWebVRも使える。あとは、Code Editorもあるので、Opsを開発することもできます。

画像2

Features:公式websiteよりキャプチャ

【誰が使うと良いの?】

ノードベースのプログラミング言語は、デザイナーでも比較的触りやすい開発環境であり、エンジニアも追加開発ができるように作られており、コラボレーションを円滑にすることができます。

Cablesも同様の環境が構築されており、
デザイナーやアーティストは、コーディング無しでのプログラミングを楽しむことができる!
エンジニアは、プロトタイピングと独自開発を楽しむことができる!

そして、コラボレーションが円滑にできる!!ので、プロジェクトにおいて共通の開発環境として使えると良さそうですね!

画像3

cables for...(公式websiteよりキャプチャ)

【Inspiration】

cablesは、Toolsとvvvvにインスピレーションを得て開発が行われたようです。vvvvユーザーとしては、嬉しいばかりです。これを機に日本のvvvvユーザーも増えて欲しい。笑

画像4


【学習環境】

おすすめの学習方法

公式のトップページより、様々なパッチファイルが公開されています。

スクリーンショット 2020-03-21 22.22.08

気になるパッチファイルをクリックすると、以下のような画面になります。右下の「Open In Editor」からパッチファイルを開きます。

スクリーンショット 2020-03-21 22.21.43

パッチファイルを開き、「Save As」から名前をつけて保存すると自分のパッチとして使えるので、編集してパッチ内でのデータの流れなどを知ると良いです。

スクリーンショット 2020-03-21 22.26.03

これだけだとわからない部分も多いと思うので、以下のリソースから情報を得ると良いかと思います!

Youtube

Opsリファレンス

ドキュメンテーション

Slack


【日本のCablesコミュニティ】

Twitter:
「#cables_jp」のハッシュタグで、情報交換を行っています!

Slack:
cables_jpのチャンネルを作りました!
先日作ったばかりで、試運用しているので、興味がある方は僕に連絡ください!近い将来、オープンにする予定です。

連絡先:
Twitter DM もしくは、メール( yoshioka@nodemedical.co.jp )に一度連絡いただけたらSlackの招待URL送ります!

日本語リファレンスの作成:
日本語の情報がほとんどないので、これから情報をまとめていこうと思っています。基本操作、ワークフローなどは近々書こうと思いますが、他にもこの辺の情報知りたい!とかあれば、優先的に調べて見たり、記事書いたりしますのでお気軽に連絡ください!!


Cablesやろうぜーーーーーー!!



病院にデジタルアートを届けたり、3Dプリンタを使ってケアの現場を支える実践や研究をしています。 Digital Hospital Art / FAB Nurse/ vvvv Japan Community