Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Processing.jsによるデータの可視化と生成的表現
Search
Atsushi Tadokoro
June 19, 2014
Technology
1.9k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Processing.jsによるデータの可視化と生成的表現
Atsushi Tadokoro
June 19, 2014
More Decks by Atsushi Tadokoro
See All by Atsushi Tadokoro
デザイン言語総合講座 - クリエイティブ・コーディング
tado
0
2.8k
Tumblrを使う4 - Webサイトを構成する、固定ページとタグ
tado
0
1.8k
Tumblrを使う3- カスタムHTMLテーマの作成
tado
0
470
Tumblrを使う2 - テーマをカスタマイズする
tado
0
380
Touchéの仕組みを理解 - ProcessingとArduinoの連携
tado
0
2.4k
Github Pagesで作品を公開、Automatic Page Generatorでサイトを生成
tado
0
1.6k
TumblrでWebサイトを作成
tado
0
730
bmaw14 第2回: Touchéセンサーを使う1 Touchéセンサーを作成する
tado
0
2.2k
Webサーバーの準備 - Github PagesでWebサイト開設
tado
0
1.5k
Other Decks in Technology
See All in Technology
なぜ、あなたのAPIは使われないのか? AX時代の設計原則、ガードレール、運用体制
yokawasa
1
200
探索・可視化・自動化を一本化 Amazon Quickでデータ活用スピードを上げる方法
koheiyoshikawa
0
170
AI時代におけるエンジニアの新たな役割──FDEとクオリアの探求/登壇資料(戸井田 裕貴)
hacobu
PRO
0
290
PHPで作って学ぶリアルタイム音声対話AIとWebSocket入門 by ムナカタ
munakata
0
120
事業成長とAI活用を止めないデータ基盤アーキテクチャの設計思想
hiracky16
0
330
GoでCコンパイラを作った話
repunit
0
150
文字起こし基盤の信頼性
abnoumaru
0
110
プロダクト開発組織の現在地(Ver.2026/07) / product-organization
kaonavi
0
340
”AIを使う” から ”AIに任せる” へ ─ 開発プロセスを再設計してAIを組織標準にするまで
cyberagentdevelopers
PRO
1
130
Vポイント分析基盤におけるデータモデリング20年史
taromatsui_cccmkhd
4
700
生成 AI 時代にいま一度「問い合わせ」について考えてみる
kazzpapa3
1
120
SRENEXT_2026_Chairs__Talks_in_Tamachi.sre.pdf
srenext
1
130
Featured
See All Featured
Building AI with AI
inesmontani
PRO
1
1.1k
A better future with KSS
kneath
240
18k
Making the Leap to Tech Lead
cromwellryan
135
10k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Introduction to Domain-Driven Design and Collaborative software design
baasie
1
910
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
We Have a Design System, Now What?
morganepeng
55
8.2k
4 Signs Your Business is Dying
shpigford
187
22k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4.2k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
333
23k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
helenjbeal
1
260
Transcript
ใฤू 8FC 1SPDFTTJOHKTʹΑΔσʔλͷՄࢹԽͱੜతදݱ ݄ ౦ژज़େֶܳज़ใηϯλʔ ".$ ୲ɿాॴ३
ʮՄࢹԽ 7JTVBMJ[BUJPO ʯͱ
ʮՄࢹԽ 7JTVBMJ[BUJPO ʯͱ ‣ ՄࢹԽ7JTVBMJ[BUJPO ‣ ਓ͕ؒʮݟΔʯ͜ͱͷͰ͖ͳ͍ݱࣄɺ͋Δ͍ؔੑΛɺʮݟΔʯ͜ͱͷ Ͱ͖Δͷʹ͢Δ͜ͱ ‣ ݟΔ͜ͱͷͰ͖Δͷˠը૾ɺө૾ɺάϥϑɺਤɺදͳͲ
‣ ࢹ֮Խҙ֎ͷํ๏ ‣ ՄௌԽԻʹΑͬͯௌ͘͜ͱ͕Ͱ͖ΔΑ͏ʹ͢Δ ‣ Մ৮Խ৮ΕΔ͜ͱʹΑͬͯදݱ͢Δ
ࢀߟॻɿʮϏδϡΞϥΠδϯάσʔλʯ ‣ ϏδϡΞϥΠδϯάɾσʔλʕ1SPDFTTJOHʹΑΔใࢹ֮Խख๏ ‣ #FO'SZ ஶ ૿Ҫढ़೭ ༁ म
Ճ౻ܚ ༁ ‣ ΦϥΠϦʔδϟύϯ
ใͷࢹ֮Խͷεςοϓ ‣ #FO'MZʹΑΔɺใࢹ֮Խͷεςοϓ ‣ ʮϏδϡΞϥΠδϯάɾσʔλʯΑΓ ‣ σʔλऩू BDRVJSF ‣
ղੳ QBSTF ‣ ϑΟϧλϦϯά pMUFS ‣ ϚΠχϯά NJOF ‣ දݱ SFQPSFTFOU ‣ ਫ਼៛Խ SFpOF ‣ ΠϯλϥΫγϣϯ JOUFSBDU ‣ ͍ͭɺશͯͷεςοϓ͕ඞཁͱ͍͏Θ͚Ͱͳ͍
ใͷࢹ֮Խͷεςοϓ ‣ σʔλऩू BDRVJSF ‣ σʔλΛऩू͢Δ ‣ σΟεΫ্ͷϑΝΠϧ ‣
ωοτϫʔΫ্ͷσʔλ
ใͷࢹ֮Խͷεςοϓ ‣ ղੳ QBSTF ‣ σʔλͷҙຯΛͱʹߏΛՃ͢Δ ‣ σʔλΛΧςΰϦʹ͚Δ ‣
σʔλͷݸʑͷ෦ͷܗ͕ࣜ໌֬ʹͳΔ
ใͷࢹ֮Խͷεςοϓ ‣ ϑΟϧλϦϯά pMUFS ‣ ༻్ʹ͋Θͳ͍෦Λআڈ͢Δ ‣ σʔλͷதͰඞཁͱͳΒͳ͍ϨίʔυΛআڈ ‣
ཧϞσϧΛ͋ͯΊ ‣ ਖ਼نԽ ‣ ֶతͳॲཧ
ใͷࢹ֮Խͷεςοϓ ‣ ϚΠχϯά NJOF ֶతͳॲཧʹΑͬͯɺύλʔϯΛΈ͚ͭͩ͢ ‣ සग़ύλʔϯநग़ߴසͰൃੜ͢Δಛతͳύλʔϯ ‣ ྫɿຊ̖Λങ͏ਓɺޙʹຊ̗Λങ͏͜ͱ͕ଟ͍ ‣
Ϋϥεྨ༩͑ΒΕͨσʔλʹରԠ͢ΔΧςΰϦΛ༧ଌ ‣ ྫɿༀͷԽ߹ͷσʔλ͔ΒɼͦͷԽ߹ʹༀޮ͕͋Δɾͳ͍ͱ͍ͬͨΧςΰϦΛ༧ଌ ‣ ճؼੳ༩͑ΒΕͨσʔλʹରԠ͢Δ࣮Λ༧ଌ ‣ ༵ɺ߱ਫ֬ɺࠓͷച্͛ͳͲͷσʔλΛݩʹ໌ͷച্͛ͱ͍͏࣮σʔλΛ༧ଌ ‣ ΫϥελϦϯάσʔλͷू߹ΛΫϥελͱݺͿάϧʔϓʹ͚Δ ‣ 8FCͷӾཡύλʔϯͷσʔλ͔Βɺྨࣅͨ͠ͷΛ·ͱΊΔ͜ͱͰɺӾཡͷ͕ಉ͡ར ༻ऀͷάϧʔϓΛൃݟ͢Δ
ใͷࢹ֮Խͷεςοϓ ‣ දݱ SFQSFTFOU ‣ جຊతͳදࣔͷܗࣜɺࢹ֮ԽͷϞσϧΛܾఆ͢Δ ‣ άϥϑ ‣
Ϧετ ‣ ߏFUD
ใͷࢹ֮Խͷεςοϓ ‣ ਫ਼៛Խ SFpOF ‣ άϥϑΟοΫσβΠϯͷख๏Λ͔ͭͬͯදݱΛ͞Βʹ໌շʹ ‣ ΑΓັྗతͳදݱ ‣
৭ɺܗ ‣ ಛఆͷσʔλʹҙΛҾ͖͚Δ ֊ͷಋೖ
ใͷࢹ֮Խͷεςοϓ ‣ ΠϯλϥΫγϣϯ JOUFSBDU ‣ ରతͳػೳΛՃ ‣ ϢʔβʹΑΔσʔλͷ୳ࡧ੍ޚ ‣
αϒηοτͷબ ‣ ࢹͷΓସ͑ ‣ ͜ͷतۀͰͷɺωοτϫʔΫͱͷ࿈ܞ 5XJUUFS1BDIVCF ΠϯλϥΫγϣϯͷҰ ͱߟ͑ΒΕΔ
ใͷࢹ֮Խͷεςοϓ ‣ σʔλऩू BDRVJSF ‣ ղੳ QBSTF ‣
ϑΟϧλϦϯά pMUFS ‣ ϚΠχϯά NJOF ‣ දݱ SFQPSFTFOU ‣ ਫ਼៛Խ SFpOF ‣ ΠϯλϥΫγϣϯ JOUFSBDU
༷ʑͳՄࢹԽͷख๏ʹ৮ΕΔ ‣ 7JTVBM$PNQMFYJUZҎ্ͷϓϩδΣΫτΛհ ‣ http://www.visualcomplexity.com/vc/
4JNJMBS%JWFSTJUZ ‣ 1IJMJQQ4UFJOXFCFS "OESFBT,PMMFS ‣ ੈքେफڭͷయΛੳ͠ɺफڭͱ৴ڼʹ͍ͭͯࢹ֮Խ͍ͯ͠Δ ‣ http://similardiversity.net/
7JTVBMJ[JOHJOGPSNBUJPOqPXJOTDJFODF ‣ .PSJU[4UFGBOFS ‣ จͷҾ༻ͷωοτϫʔΫΛࢹ֮Խ ‣ http://well-formed.eigenfactor.org/
0QUF1SPKFDU ‣ #BSSFUU-ZPO ‣ Πϯλʔωοτͷਤ ‣ http://www.opte.org/
5IF3FNPUFTUQMBDFPO&BSUI ‣ +PJOU3FTFBSDI$FOUSF &VSPQFBO$PNNJTTJPO 8PSME#BOL ‣ ʮ࠷ԕ͍ॴͲ͔͜ ʯ ‣ ੈքͷओཁͷࢢ͔ΒҠಈʹ͔͔Δ࣌ؒ
‣ http://www.newscientist.com/gallery/small-world
TVCCMVF 'SBDUBM-BC ‣ 5PN#FEEBSE ‣ ੜతͳख๏Λۦͨ͠ܗଶΛࢹ֮Խ ‣ http://www.subblue.com/ ‣ http://fractal.io/
1BSUJUVSB ‣ 2VBZPMB ‣ ԻڹΛࢹ֮Խ WWWW ‣ http://www.quayola.com
ੜతͳදݱ ‣ ੜత (FOFSBUJWF ͳදݱʹ͍ͭͯߟ͑Δ ‣ ੜతͳදݱ (FOFSBUJWF"SU ‣
ίϯϐϡʔλͷιϑτΣΞʹΑΔΞϧΰϦζϜ͔Βੜ͞ΕΔදݱ ‣ ͋ΔجຊݪଇࣜςϯϓϨʔτͳͲͷૉࡐΛઃఆ͠ɺͦ͜ʹແ࡞ҝ·ͨແ࡞ ҝͷϓϩηε͕࡞༻͢ΔΑ͏ઃఆ͢Δ
ੜతͳදݱ ‣ ੜతͳදݱͷྫɿϧϑϥϜͷ࣍ݩηϧɾΦʔτϚτϯ ‣ ͋Δಛఆͷ࣌ࠁ U ʹ͓͚Δɺࣗࣗͱͦͷࠨӈͷηϧͷঢ়ଶʹΑͬͯɺ࣍ͷ࣌ࠁ U ͷঢ়ଶ͕ܾ·Δ
‣ ηϧͷPOP⒎ΛɺͱͰදݱ͢ΔͱՄೳੑͭ ‣ ‣ ͦΕͧΕͷঢ়ଶͰͷ࣍ͷΛϧʔϧͱͯ͠ఆΊΔ ‣ ϧʔϧͷՄೳੑશ෦ͰݸͱͳΔ ͷɺCJU ‣ ྫɿϧʔϧ ࣍
ੜతͳදݱ ‣ 1SPDFTTJOHͰɺϧϑϥϜͷ$"Λࢼͯ͠ΈΔ ‣ 1SPDFTTJOHͷαϯϓϧ ‣ ʮ5PQJDTʯˠʮ$FMMVMBS"VUPNBUBʯˠʮ8PMGSBNʯ ‣ ϓϩάϥϜͷϧʔϧηοτΛมߋͯ͠ΈΔ ‣
TFUVQ ؔͷҎԼͰఆٛ͞Ε͍ͯΔ ‣ JOU<>SVMFTFU\ ^
ੜతͳදݱ ‣ ϧʔϧ\ ^
ੜతͳදݱ ‣ ϧʔϧ\ ^
ੜతͳදݱ ‣ ϧʔϧ\ ^
ੜతͳදݱ ‣ ϧϑϥϜͷΫϥεྨ ‣ Ϋϥεઢܗܥ ‣ ୯Ұͷฏߧঢ়ଶʹऩଋ͢Δɽͭ·Γɼશͯͷηϧ͕ɼ·ͨʹͳͬͯ͠·͏ɽ ‣ Ϋϥεඇઢܗܥ पظղ
‣ ࣶ༷ͷΑ͏ͳɼपظతʹແݶʹ܁Γฦ͢ύλʔϯʹऩଋ͢Δɽ ‣ Ϋϥεඇઢܗܥ ΧΦε ‣ ୯Ұͷঢ়ଶʹɼपظతͳঢ়ଶʹऩଋͤͣɼΧΦεతͳৼ͍Λ͢Δɽ ‣ Ϋϥεඇઢܗܥ ͦͷଞ ‣ ༧ଌ͕͍ͨ͠ɼෳࡶͳύλʔϯͰɼपظɼඇपظ͕ަޓʹݱΘΕͨΓɼύλʔϯ͕ফ͑ͨΓ͢ Δɽ
ੜతͳදݱ ‣ ίϯΣΠͷϥΠϑήʔϜ ‣ ࣍ݩͷ$"ϧʔϧ ‣ ੜ ‣ ࢮΜͰ͍Δηϧͷपғʹͭͷੜ͖͍ͯΔηϧ͕͋Ε࣍ͷੈͰੜ͖Δʢੜ͢ Δʣɻ
‣ ҡ࣋ ‣ ੜ͖͍ͯΔηϧͷपғʹ͔ͭͭͷੜ͖͍ͯΔηϧ͕͋Ε࣍ͷੈͰੜ͖Δɻ ‣ ࢮ ‣ ্Ҏ֎ͷ߹ʹ࣍ͷੈͰࢮ͵ɻ
ੜతͳදݱ ‣ ίϯΣΠͷϥΠϑήʔϜ
(FOFSBUJWF(FTUBMUVOH ‣ େͳͷੜతͳΞʔτͷ࣮ྫΛհͨ͠ॻ੶ ‣ IUUQXXXBNB[PODPKQEQ ‣ αϯϓϧશͯ1SPDFTTJOHͰ࡞͞Ε͍ͯΔ ‣ શͯμϯϩʔυՄೳ
(FOFSBUJWF(FTUBMUVOH ‣ ΦϑΟγϟϧαΠτ ‣ http://www.generative-gestaltung.de/
(FOFSBUJWF(FTUBMUVOH ‣ (FOFSBUJWF(FTUBMUVOHͷαϯϓϧΛΈͯΈΔ ‣ ͍͔ͭ͘ڥઃఆ͕ඞཁ ‣ ·ͣશͯͷαϯϓϧίʔυͷύοέʔδΛμϯϩʔυ ‣ IUUQXXXHFOFSBUJWFHFTUBMUVOHEFEPXOMPBET(FOFSBUJWF%FTJHO $PEF1BDLBHF[JQ
‣ μϯϩʔυͨ͠ύοέʔδΛల։ͯ͠ɺd%PDVNFOUT1SPDFTTJOHҎԼʹίϐʔ ͢Δ
(FOFSBUJWF(FTUBMUVOH ‣ (FOFSBUJWF(FTUBMUVOHڥઃఆ͖ͭͮ ‣ ඞཁͱͳΔϥΠϒϥϦΛΠϯετʔϧ ‣ Generative Design Lib 1.0.3
‣ controlP5 ‣ Geomerative ‣ treemap
(FOFSBUJWF(FTUBMUVOH ‣ ͭͷϥΠϒϥϦ (FOFSBUJWF%FTJHO-JCɺDPOUSPM1ɺ(FPNFSBUJWFɺ USFFNBQ ͷϑΥϧμΛɺ1SPDFTTJOHϑΥϧμͷMJCSBSZʹίϐʔ͢Δ
(FOFSBUJWF(FTUBMUVOH ‣ ΦϑγϟϧαΠτͷʮ$PEFTʯ͔ΒɺؾʹͳͬͨαϯϓϧΛબͼɺରԠ͢ΔίʔυΛ ىಈͯ͠ΈΔ ‣ IUUQXXXHFOFSBUJWFHFTUBMUVOHEFDPEF ‣ ͍Ζ͍Ζىಈͯ͠ɺࣗͷ͖ͳίʔυΛબ
(FOFSBUJWF(FTUBMUVOHͰͷੜతදݱ ‣ (FOFSBUJWFੜత ‣ (FTUBMUVOHܗଶ ήγϡλϧτ ‣ ༷ʑͳཁૉΛ༻͍ͨੜతදݱ ‣
৭ $PMPS ‣ ܗ 'PSN ‣ จࣈ 5ZQF ‣ ը૾ 1JDUVSF ‣ ཚͱϊΠζ 3BOEPN/PJTF ‣ ൃৼɺৼಈ 0DJMMBUJPOpHVSFT ‣ ৫Խ 'PSNVMBUFECPEJFT ‣ ΞτϥΫλʔ "UUSBDUPS ‣ ߏ 5SFFTUSVDUVSF
(FOFSBUJWF(FTUBMUVOH ‣ ྫɿ.@@@@500-
ࢀߟॻ੶ɺͦͷ ‣ '03. $0%&σβΠϯʗΞʔτʗݐஙʹ͓͚Δɺ͔ͨͪͱίʔυ<୯ߦຊʢιϑτ Χόʔʣ>
'03. $0%&Ͱͷྨ ‣ 'PSN $PEFͰͷཧ ‣ ෮ 3FQFBU ‣
มܗ 5SBOTGPSN ‣ ύϥϝʔλԽ 1BSBNFUFSJ[F ‣ ՄࢹԽ 7JTVBMJ[F ‣ γϛϡϨʔτ 4JNVMBUF
ࢀߟॻ੶ɺͦͷ̏ ‣ ϏδϡΞϧɾίϯϓϨΩγςΟʕใύλʔϯͷϚοϐϯά
ࢀߟॻ੶ɺͦͷ̏ ‣ ϏδϡΞϧɾίϯϓϨΩγςΟ࣍ ‣ c5IF5SFFPG-JGFੜ໋ͷथ ‣ c'SPN5SFFTUP/FUXPSLTπϦʔ͔ΒωοτϫʔΫ ‣ c%FDPEJOH/FUXPSLTωοτϫʔΫͷղಡ ‣
c*OpOJUF*OUFSDPOOFDUFEOFTTແݶͷ૬ޓଓੑ ‣ c5IF4ZOUBYPGB/FX-BOHVBHF৽͍͠ϏδϡΞϧݴޠͷߏจ ‣ c$PNQMFY#FBVUZෳࡶੑͷඒ ‣ c-PPLJOH"IFBEະདྷͷߦํ