1. ガイダンス

増井俊之

https://gyazo.com/1077ecfb9bbbe9bebcbe4e29e93b186a

授業情報

講義情報

関連情報

Scrapbox

クラウド上の情報共有/管理システム

https://i.gyazo.com/7057219f5b20ca8afd122945b72453d3.png

Scrapboxの特長

ブラウザ上で情報編集/共有

ワープロのように使える

ページ間リンクが簡単 (Wiki)

Scrapbox info

Scrapboxサンプル

受講の準備

CNSログインアカウント名を使ってScrapboxプロジェクト作成

sfc-pm2020-(CNSログインアカウント名)

自己紹介

増井俊之

シャープ、ソニー、産総研、Appleなどに勤務

ケータイの予測変換開発

iPhone日本語入力開発

様々なプラットフォームで様々なインタフェースシステムを開発

ユビキタス環境のインタフェースの構想

様々なWebサービス運用中

Apple勤務時

http://gyazo.com/27357dbdc55a68142baee8c5d29ef075.png

POBox: 予測堅テキスト入力システム

https://gyazo.com/43da8e84b189a054393a8288e1d18b80

iPhoneのフリック入力

T-Cube + 予測

https://gyazo.com/1691febad27439d3bf44232c54dcb1e8.png

著書

http://hondana.org/%E5%A2%97%E4%BA%95/4756102816 https://gyazo.com/e64ce9758aa2772b17510d56409e1bfb

http://hondana.org/%E5%A2%97%E4%BA%95/4756146627 http://gyazo.com/d7e6378a56a03c4c183185b475feeacc.png

http://hondana.org/%E5%A2%97%E4%BA%95/4873113784 https://gyazo.com/3ce3843b43354fe5c47909c0debd0f10

http://hondana.org/%E5%A2%97%E4%BA%95/4873114616 http://gyazo.com/a75cf9e2eaaa5fa58e5af9faf705f3f6.png

http://hondana.org/%E5%A2%97%E4%BA%95/4873115043 http://gyazo.com/027dca09083cb76869c874bcdcb01dd9.png

http://www.kobunsha.com/img/sys/book/cover/9784334038458.jpg http://www.pitecan.com/sumaho/

その他の講義

ユーザインタフェース設計論 (春)

次世代Webプラットフォーム論 (秋/大学院)

ビジュアライゼーション (秋)

実世界/全世界インタフェース (研究会)

本講義のねらい

プログラミングについての広い視野を持つ

様々なプログラミング的概念について知る

日常的なプログラミングを考える

開発に役立つコツを知る

授業のメリット

なるべく変わった話題を提供

ググって出ない話題

教科書が存在しない話題

扱わないもの

プログラミングの基礎

ソフトウェア工学

理論計算機科学

計算可能性理論

計算量理論

ラムダ計算

授業の進め方

様々なプログラミングの話題を紹介

試験なし

レポート課題を時々出す

講義時間中にある程度解いてもらう

個人のパソコンでどんどん開発して議論してほしい

Scrapboxでプログラミング

プログラミングとは何か

https://gyazo.com/1868d695312cb9133dd39d8c55849a0c http://www.amazon.co.jp/dp/4121504895

何故プログラムを書くのか

それ自体面白いから

パズル

便利なものを作れるから

アプリ, Webサービス

最近のプログラミング環境

あらゆるハードルが低くなった

ソフトウェアの敷居

誰でもどこでもプログラミング可能

JavaScript, Processing, etc.

全世界通信ライブラリ

ハードウェアの敷居

センサなどの普及

Arduino, RasPi, M5Stack, ...

プログラミング環境の歴史

パソコン以前 (～1980)

プログラミングは専門家のもの

大型計算機, ミニコン

パソコン黎明期 (1980〜1990)

お手軽開発環境

BASIC, HyperCard

日曜プログラマの時代

プログラミング環境の歴史

パソコン普及期 (1990〜2000)

家庭に普及しはじめる

開発環境は高価に

VisualC++, etc.

プログラミングは専門家のもの

オープンソース普及期 (2000〜2010)

プログラミングのハードルがまた下がった

プログラミング環境の歴史

全世界プログラミング(2010〜)

情報共有

いつでもどこでも誰でもプログラミング

テキスト以外でプログラミング

全世界のセンサ利用

http://hondana.org/%E5%A2%97%E4%BA%95/4873113784 https://gyazo.com/3ce3843b43354fe5c47909c0debd0f10

https://gyazo.com/3c963b5324395ddbeeb12f7829af3df7

https://p5js.org/examples/simulate-particle-system.html https://gyazo.com/dc35c16d9d72708a3500035661777339.png

ScrapboxでP5.jsを使う

https://gyazo.com/f3c1bfc01bde8b4a62a1794c6d065699

https://gyazo.com/a786df89364d8a18d1f576758fc1dd5d

狭義のプログラミング

C, Java, JavaScript, ...

テキストベースの汎用計算機言語を利用

計算手順を記述

広い領域で利用

広義のプログラミング

簡単な設定

計算を定義

制約の記述

段取りの記述

データの流れを指示

動作を例示

簡単な設定

目覚まし時計

炊飯器タイマー設定

録画予約

制約の設定

表計算ソフト

数式を記述

Cynderella

幾何制約を記述

論理回路

Cinderella

https://www.youtube.com/watch?v=9bEFCPwMWyE

http://pitecan.com/Cinderella/Kempe/ https://gyazo.com/2e7e705c07fd081b840c2417dee733e6.png

論理回路

https://gyazo.com/9dd28f7a1d641c4522b723c0fde59400

https://gyazo.com/d4bdb12896f82ffdad6cf0cf77ba65be.png

論理回路のテキスト表現

code:logic.rtl

library ieee;

use ieee.std_logic_1164.all;

entity T_FF1 is

port( R,T : in std_logic;

Q,QB : out std_logic);

end T_FF1;

-------------------------------------------------

architecture RTL of T_FF1 is

signal NODE : std_logic;

begin

Q <= NODE;

QB <= not NODE;

process(R,T)

begin

if (R = '0')then

NODE <= '0';

elsif (T 'event and T ='1')then

NODE <= not NODE;

end if;

end process;

end RTL;

各種の段取り

ルーブ・ゴールドバーグ・マシン

aka ピタゴラマシン

レシピ

楽譜

ルーブ・ゴールドバーグ・マシン

https://gyazo.com/210eaff521cdc11af3bbb37592f054c5.png

Video: The Way Things Go

https://www.youtube.com/watch?v=GXrRC3pfLnE

小室の音楽

code:komuro.abc

K:B

M:4/4

Q:1/4=150

%%score {1|2|3}

V:1

g2|f6g2|f6g2|f3f2edc-|cfd4g2

V:2

V:3 cleff=bass

z2|E,,E,,E,,E,, E,,E,,E,,E,,|E,,E,,E,,E,, E,,E,,E,,E,,|D,,D,,D,,D,, D,,D,,D,,D,,|G,,G,,G,,G,, G,,G,,F,,F,,

例示プログラミング

Dynamic Macro

予測システム

Demo: Dynamic Macro

キーボードマクロを自動生成

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

https://gyazo.com/87b08f3210ea5ba803981f6bc47e7584.png

将来のプログラミング

どこでも/いつでも/誰でも

人間の能力の拡大

知的処理に活用

計算機を何につかうか

計算

証明

検索

通信

計算機を何につかうか

ゲーム

お絵描き

楽器

シミュレーション

アート

計算機を何につかうか

生活全般

知能

生命

まだまだ面白い話がありそう!

講義内容

文芸的プログラミング

予測/例示プログラミング

文字列プログラミング

状態遷移プログラミング

並列プログラミング

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

インターネットプログラミング

実世界プログラミング

進化的プログラミング

インタフェースのプログラミング

エクストリームプログラミング

人力活用プログラミング

その他プログラミングパラダイム

全世界プログラミング

富豪的プログラミング

技術的な分類

手続き型プログラミング

構造化プログラミング

データフロープログラミング

オブジェクト指向プログラミング

関数型プログラミング

宣言型プログラミング

制約プログラミング

論理型プログラミング

アスペクト指向プログラミング

Beautiful code

http://www.amazon.co.jp/dp/0596510047 https://gyazo.com/4aabc8c3b3a0ad378923e7986d0221ec.png

美しいプログラム

簡潔な記述

エレガントなアルゴリズム

読みやすい

理解しやすい

汎用

汚いプログラム

code:dirty.js

if(window!=top)top.location=location.href;

-1)location="html/nocookies.html";document.cookie=c+";expires=Thu, 01 Jan 1970 00:00:00 GMT";if(agt.indexOf("msie")!=-1&&document.all&&agt.indexOf("opera")==-1&&agt.indexOf("mac")==-1)eval('try{new ActiveXObject(agt.indexOf("msie 5")!=-1?"Microsoft.XMLHTTP":"Msxml2.XMLHTTP")}catch(e){location="html/noactivex.html"}')})()

スパゲッティコード

https://gyazo.com/ba6a0d78000d76428b935d3a1d63c4af.png

プログラミングの王道

駄目なものを使わない

フローチャートなど

駄目な本を読まない

イディオムを知る

美しいプログラムを読む

ハードウェアとプログラミング

フォンノイマンアーキテクチャ

CPU+メモリ

機械語実行

指令された処理を順番に実行

演算とデータ移動の繰り返し

フォンノイマンアーキテクチャ

https://gyazo.com/87eea7384aa3b9b0a2aa8ab65af15cc3.png

異なるハードウェア

連想メモリ

データが100個でも10000個でも検索時間は同じ

量子コンピューティング

計算量が根本的に変わる可能性

研究会

実世界のセンサとWebを融合するインタフェースを考える