The world of VPL

By Nobkz

# CHAPTER 2

花田  恒一(はなだ のぶかず)

  • 生粋のボードゲーマー
  • プログラマー
  • Lisp,Haskell, TypeScript, Rust,OCaml, Shenを普段書く
  • プログラミング言語オタク
  • VPLを仕事でも趣味でも作る
  • ハウスダンス3年ぐらい

流れ

VPLとは？

VPLについて紹介する。

1.

2.

VPLにおける誤解と、難しさ、可能性

 

3.

私の仕事について

 

# CHAPTER 2

VPLとは何か？

# PRESENTING CODE

VPL(Visual Programing Language)とは、プログラムを視覚的に表現し、視覚的なオブジェクトを直接操作することによって、プログラミングができる言語のことを言う。

VPL(Visual Programing Language)とは、プログラムを視覚的に表現し、視覚的なオブジェクトを直接操作することによって、プログラミングができる言語のことを言う。

VPL(Visual Programing Language)とは、プログラムを視覚的に表現し、視覚的なオブジェクトを直接操作することによって、プログラミングができる言語のことを言う。

VPLには沢山の言語が存在しているが、いくつか種類に分けられる

  • 手続き型言語
  • データフロー型言語
  • 高度ビジュアライズ言語

手続き型言語

Scratchに代表されるVPLであり、一つのブロックが一つの手続きに対応している。

 

まず、みんなが思い浮かぶのがこれ。

データフロー言語

MaxやQuartz Composerなどのデータの流れを記述していく言語。テキストにおける関数型言語との相性が非常に良い。

高度ビジュアライズ言語

プログラミング自体を高度にビジュアライズしており、

テキスト言語にモデル化できない言語

手続き言語のVPLとテキスト言語比較

# PRESENTING CODE

前に進む(10);

右に曲がる(90);

色を変える(255,0,0);

前に進む

10

右に曲がる

90

色を変える

255

0

0

手続き言語のVPLは、手続き言語のテキスト言語を一対一対応したものが多い。

  • 構文エラーが起きにくい
  • 視認性は高い
  • キーボード操作に慣れている人には不評
  • 一つの処理はサイズが大きくなりがち
  • 配置が自由なため、以外と書ける。

 

コード配置について

# PRESENTING CODE

function main(){
  func1(10);
  func2(20);
  func3(3);
 }
 
 
function main2(){
  func1(10);
  func2(20);
  func3(3);
 }

function main3(){
  func1(10);
  func2(20);
  func3(3);
}

テキストは縦に

func1

10

func2

90

func3

3

function

main

func1

10

func2

90

func3

3

function

main2

func1

10

func2

90

func3

3

function

main3

VPLは平面（立体的）に伸びていく

データフローと関数型言語

# PRESENTING CODE
main = mapM_ putStrLn (map show [1..10])

1

10

Range

show

map

putStrLn

mapM

main

データフローは関数型言語を非常に相性が良く、

関数型言語における構造の把握に難しさを緩和してくれる。

線の色で、データ型を表現できる。

Viscuitはどうテキストにする？

# PRESENTING CODE

手続きVPL vs データフローVPL

# PRESENTING CODE
  • 手続き言語はビジュアライズの一対一になりがちで、テキスト言語の薄い抽象化でしかなく、ユーザにとってはやりやすい一方、VPLの学者から嫌われがち
  • データフローは関数型のビジュアライズともいえるが、大きく構造を抽象化できており、VPLの学者が好む

VS 高度ビジュアル言語

# PRESENTING CODE
  • 手続きでも、データフローでも、結局は計算モデルとして、テキスト言語に近い関係になるので、新しいプログラミング体験のVPLを作りたい人にとってはつまらない。
  • 一方、Visuitのような、ビジュアルプログラミング言語ならではの発想、記述など、プログラミング自体を上手く抽象化した言語を作りたがる人は多い。

VPLの誤解

# CHAPTER 2

文字で書いた方が整理しやすい！

比較になっていない

# PRESENTING CODE

テキストも酷い例沢山ある

誤解2:　構造化機能がない

# PRESENTING CODE

確かに一部のビジュアル言語(scratchなど)では、関数にするなど、構造化機能がない言語もありますが、ビジュアル言語全体に構造化機能がないわけではありません。

 

 

VPL開発の難しさ

# PRESENTING CODE

テキスト言語の場合

ビジュアル言語の場合

コードエディタ

実行環境

コードエディタ+実行環境

VPLの難しさ2

# PRESENTING CODE

言語仕様を記述するのが大変。

ドキュメントを作るのが大変

 

Git管理できないこともある

# PRESENTING CODE

ビジュアル言語の課題点として、バージョン管理をどうするか？という課題があります。

  • テキスト表現を用意してgit管理する？
    • ビジュアル言語の意義は？
  • 自前でバージョン管理つくる？
    • 差分をどうするか？
    • DAGビジュアライザをつくる？

ビジュアル言語の可能性

# PRESENTING CODE

テキスト言語との合流

  • ブロックやデータフローにスクリプトが書ける(Node-RED)など
  • テキスト言語において、可視化および、Direct Manipulationを行う

テキスト資産の活用

  • VPLとテキスト言語の相互変換によって、プログラミングに習熟していないユーザが開発に参画できたり、開発効率の向上

プログラミングの表現力や、周辺技術、など

Live Coding、 Auto Refactoring、さらなる計算モデルの開発

可能性2

# PRESENTING CODE

新しいUIにたいする良い、プログラミング体験

  • タッチパネルやVR環境上で、プログラミングを可能に、容易にする可能性

ファイルベースOSではなくオブジェクトベースでのプログラミング環境

私の最近の仕事

# PRESENTING CODE
  • TSとRustに出力できる汎用VPLの開発
    • ジェネリクスなどの型レベルプログラミンングの ビジュアライズ
    • ラムダ計算ビジュアライズ
    • ライフタイムや所有権の制約
  • 処理系とコードを変形できるVPL(sighex）の開発

Code

By Nobukazu Hanada

Made with Slides.com

Code

  • 133

More from Nobukazu Hanada