vvvvで始めるビジュアルプログラミング

32
Makoto Hirahara vvvvで始めるビジュアルプログラミング 1.16 2016 CREATORS MEETUP36

Upload: makoto-hirahara

Post on 11-Feb-2017

2.432 views

Category:

Technology


5 download

TRANSCRIPT

Page 1: vvvvで始めるビジュアルプログラミング

Makoto Hirahara

vvvvで始めるビジュアルプログラミング

1.16 2016

CREATORS MEETUP36

Page 2: vvvvで始めるビジュアルプログラミング

2

平原 真新潟県生まれ。長岡造形大学造形学部卒業。

コンピューターや電子回路を用いたインスタレーション、照

明や玩具などのプロダクトデザイン、スマートフォンのアプ

リ開発などを行う。近年は教育機関との関わりから、デザイ

ン・アート・教育の連携を模索している。

慶應義塾大学SFC非常勤講師

早稲田大学非常勤講師・長岡造形大学非常勤講師

@HR2 ( Hirahara Makoto )

技術的なトピックのブログ

ポートフォリオサイト http://makotohirahara.com/

http://hrhrblog.blogspot.jp/

Page 3: vvvvで始めるビジュアルプログラミング

vvvv

Page 4: vvvvで始めるビジュアルプログラミング

4

クリエイティブコーディングの為の ビジュアルプログラミング言語。

デザイナーやアーティストが、グラフィック、インタ

ラクション、デバイス制御などを行うための環境。

いろいろな機能を持った部品を線で繋いで、視覚的

にプログラムをするスタイル。

Page 5: vvvvで始めるビジュアルプログラミング

5

こんな感じ

Page 6: vvvvで始めるビジュアルプログラミング

Flow powered by Mercedes-Benz

Page 7: vvvvで始めるビジュアルプログラミング

Tesela Interactive Paper Sculpture

Page 8: vvvvで始めるビジュアルプログラミング

8

布多天神社あかり計画

東京都調布市にある布多天神社でのプロジェクション

Page 9: vvvvで始めるビジュアルプログラミング

9

vvvv ≠ vvvウイルス

昨年末に流行ったvvvウイルスとは、全く無関係。

インストールしても拡張子は.vvvになりません。

≠ .vvv

Page 10: vvvvで始めるビジュアルプログラミング

10

1998年、ドイツのメディアインスタレーション制作

スタジオMESOによって内部ツールとして開発を開

始。現在はオープンソースで、ドイツのvvvv Group

が開発を引き継いでいる。

http://www.meso.net/start

出自

Page 11: vvvvで始めるビジュアルプログラミング

11

公式な読み方は無い

国内では、「ブイフォー」「フォーブイ」「ヴイヴ

イヴイヴイ」などが一般的。

ドイツ語読みだと「ファオフィア」「ファオファオ

ファオファオ」

https://goo.gl/RTy1VB

Page 12: vvvvで始めるビジュアルプログラミング

12

動作環境

現在はbetaでWindowsのみ。

今年予定されているメジャーアップデートで、

Version1.0となり、Mac版も提供される模様。

Page 13: vvvvで始めるビジュアルプログラミング

DEMO

Page 14: vvvvで始めるビジュアルプログラミング

14

デモ

https://youtu.be/hTFXHvUpKC0

Page 15: vvvvで始めるビジュアルプログラミング

15

グレーのアイコンをクリックすると...

Page 16: vvvvで始めるビジュアルプログラミング

16

グレーのエディット画面...

Page 17: vvvvで始めるビジュアルプログラミング

17

Renderノードで画面を表示

Page 18: vvvvで始めるビジュアルプログラミング

18

Quadノードを繋げば矩形が表示される

Page 19: vvvvで始めるビジュアルプログラミング

19

HSVノードで色を変える

Page 20: vvvvで始めるビジュアルプログラミング

20

Transformノードで大きさを変える

Page 21: vvvvで始めるビジュアルプログラミング

21

Spread系ノードで複数の要素を扱う

Page 22: vvvvで始めるビジュアルプログラミング

22

LFOノードでアニメーション

Page 23: vvvvで始めるビジュアルプログラミング

REVIEW

Page 24: vvvvで始めるビジュアルプログラミング

24

粘土をこねるように

あらかじめ完成形を決め

ずに、その場のノリや見

た目のフィードバックを

最大限活かして、「粘土

をこねるように」作品を

作ることができます。

Page 25: vvvvで始めるビジュアルプログラミング

25

プログラミングスキルの向上

異なるパラダイムのプロ

グラミング言語を学習す

ることで、全体のスキル

が向上すると言われてい

ます。

Page 26: vvvvで始めるビジュアルプログラミング

26

プログラム初心者へ

各機能の繋がりが視覚的

に分かり、変更した結果

が即座に反映されるので、

初心者が試行錯誤を取り

組みやすい。

Page 27: vvvvで始めるビジュアルプログラミング

DOCUMENT

Page 28: vvvvで始めるビジュアルプログラミング

28

書籍vvvvook

プロトタイピングのための

ビジュアルプログラミング入門

伊東 実 (著), 星 卓哉 (著)

Page 29: vvvvで始めるビジュアルプログラミング

29

動画

https://www.youtube.com/playlist?list=PLqjkdWFcBMk8gVdbGuSqwi4q1ihr7LcaWvvvv講座

Page 30: vvvvで始めるビジュアルプログラミング

30

vvvv Japan Community

日本のvvvvコミュニティ。定期的

に初心者向け講座などを開催して

いる。

http://vvvv-jp.tumblr.com/http://vvvv-jp.tumblr.com/

Page 31: vvvvで始めるビジュアルプログラミング

THANK YOU :)

Page 32: vvvvで始めるビジュアルプログラミング

32

平原真展 -Nonscale-

会 期 : 2016年 3月5日(土) ‒ 3月7日(月)

時 間 : 10時 ‒ 19時 ※最終日は17時閉場

会 場 : HALO SPACE03

      東京都渋谷区恵比寿1-23-21 ヤマトハイツ1F

在廊日 : 会期中は常に在廊しています

入場料 : 無料

W e b : http://makotohirahara.com/nonscale-exhibition/