2014-07-18

#frontrend 行った

勉強会

フロントエンドエンジニア養成読本 [HTML、CSS、JavaScriptの基本から現場で役立つ技術まで満載! ] (Software Design plus)

作者: 斉藤祐也,石本光司,加藤賢一,水野隼登,谷拓樹,泉水翔吾,原一成,平木聡,佐藤歩,杉本吉章
出版社/メーカー: 技術評論社
発売日: 2014/07/02
メディア: 大型本
この商品を含むブログを見る

正確には「フロントエンドエンジニア養成読本出版記念イベント」に行った。行く前に買わないと、読まないと、と思って気づいたら当日だった。会場にこの本を持ってきている人が結構居たが、ムック本にしてはかなりの分厚さだった。

ちょっと昔（4,5年前）に比べて、HTML/CSS/JS自体・開発環境の複雑さが増してきて、エンジニアの自分でさえ「難しいなー」とか「ちょっと追い切れないなー」と思うのだから、デザイナーでHTML/CSS/JSを書いていたような人は本当に大変な思いをしてるんだろうなーと最近よく思う。そういうデザイナーの方はスマフォにおけるUI/UXの磨きこみや、LeanUX等の仮説・検証、インタビュー方法の検討・実践とか、GrowthHack的なログ設計とか、ログ取った後のビジアライズとか、設計や分析のフェーズも結構深くなっていると思うのでそちらに注力して、ややBE寄りでPHPとか書いてたようなエンジニアがフロントエンド側に手を伸ばしていくようになる（もうなっている）のかなーと思った。やらなきゃいけないこと・覚えないといけないことが増えている昨今、スタートアップでフルスタックエンジニアが求められているのはすごくよくわかるし、大企業でもメンバー間での知識の差が結構出ているのではないだろうか、と本とは全く関係ないことを考えてた。

以下、メモ。（※語尾はその時の気分で変えているので、実際のお話されていた雰囲気と多少異なります）

パネルディスカッション

モデレータ：斉藤さん（株式会社リッチメディア、元CA）
- フロントエンドはやることが増えてきたので、「地図」になるような本を書いた
自己紹介タイム
- 谷さん
  - CAではHTML, CSSの設計、UIデザインなど
  - 9章とWebComponent
- ひらきさん
  - CAではJSでソシャゲ開発
  - 10章のテスト、13章の品質管理
- みずのさん
  - 5章のマークアップ
- かとうさん
  - 4章
- 原さん
  - スマフォPFをやってる
  - 8章のモバイルマルチメディア
- (名前よく聞きとれなかった）
  - パフォーマンス改善、FE推進
  - 16章Ecma6
- すぎもとさん
  - ゲーム、コミュニティをつなげる回遊SDK
  - 14章セキュリティ、17章WebRTC
- さとうさん
  - キュレーションメディア
  - 11章パフォーマンス
Q:担当した章で伝えたかったこと
- 谷さん：１・2章
  - Webブラウザの内部挙動を知らんといかんで
  - HTML5Rocksに書いてあるようなことを書いてると思う
  - 2章目ちょっと取っ付きづらいかなー
- いしもとさん：3章→今日居ないからわからん
- 加藤さん：4章HTML・CSS・JSの基礎
  - 割とベーシックなこと書いている − 5章：ぽこたｎ
  - 具体的なとこ
  - HTML5の構文とコーディングスタイルについて
  - 最近のツール事情とか、広く浅く
  - 伝えたかったこと
    - なるべく理由つけてるんでそのあたり汲み取れや
- 6章CSS実践
  - レイアウトパターン、設計など実践的なところ
  - 普段やってる時に、どれが正解かというより、パターンを知って適材適所が重要やで
- 7章JavaScript実践
  - 何を気にしたらいいのか？複数で複雑な感じの時
  - 破綻しやすいので、どういうとこを気にすべきか
  - ライブラリについても少し。
- 8章モバイルとマルチデバイス対応
  - モバイルの普及、それ向けのUIとか
  - レスポンシブ
- 9章開発環境→今日居ないいしもとさん
  - 自動化しないとやること増えすぎてつらいよね
- 10章テスト
  - なんで俺がアサインされんねん。
  - やってない人ってハードル高いんじゃないかな−と思って網羅的に全般的に書きましたよん
- 11章パフォーマンス
  - ネットワークとかJSの話とかいろんな基礎知識の組み合わせやろ
  - そういう基礎知識をなるべく網羅的に、どうやって検証できるとか描いたねん
  - パフォーマンスを左右する要因とか
  - どこを速くしたいのかごっちゃになってること多い気がするねん
  - やけん、初期化とランタイムみたいなフェーズで分けて書きましたねん
  - ここがページ数一番多い（モデレータ）
- 12章gitバージョン管理
  - 自分が便利/重要だと思ったところを中心に
  - この本もプリリクで書いた！
- 13章品質管理
  - パフォーマンス、ドキュメント、コードカバレッジ
- 14章セキュリティの基本
  - まさかり怖いよね
  - セキュリティもあたりまえだよね
  - XSSとか基本的なこととか、CORSとか
  - サーバサイドの設定周りも少し書きましたわ
- 15章-17章最新トレンド的なところ
  - Web Components
    - CSSまわりとか
  - Ecma6
  - WebRTC
    - WebRTCおじさん
    - NAT超えの話とか
Q:フロントエンド開発者になったきっかけは？
- たにさん
  - デザイナーから。
  - ベンチャーだったから、自分しか居なかった
- さとうさん
  - 前の会社ではPHPだった
  - 小さい会社だったので、なんでもやってたよねー
  - 盛り上がってそうだったから山貼って勉強した
- はらさん
  - CAでは初エンジニア採用世代（2008）
  - HTML/CSSしか書きたくなかった
  - BBSとかそういうのでホームページすげえの世代
Q:今注力してるところ・今後やりたいところ
- かとうさん
  - Angularとずっと格闘しとるよ
  - CAの取り組みでWGがある
  - フィジカル・コンピューティング→アルディーノとか
- ぽこたん
  - 業務に追われておる。そんな暇はない！
  - もし次なんかやるなら、Vue.js、Nativeライクなものを（WebGLとか）
  - GPUレイヤの可視化とか
Q:これから目指す方にアドバイス
- ひらきさん
  - もともとディレクターだった
  - まず書籍買えよ
  - フロント・サーバーで分けて考えると厳しい時代やで
    - キャリア的に厳しいかもね
  - 浅くてもいいから勉強しろ
Q:参加者からの質問
- Q:パフォーマンス改善におけるモチベーションの保ち方
  - 各PJで問題・知識がまちまち
  - ツールで計測、ランキング化。
    - パフォーマンスがいいところにインセンティブ（ルンバとか肉とか
- Q:次にくるフレームワークなんやと思う？
  - すまん、興味ないんやわ
    - 順当にPolymer来てほしいなー
  - 僕と一緒に作りましょう（キリッ
- Q:テストとリファクタリングについてどういうとこに気にしてるか？
  - 「テストしやすいコード」が大事
  - 表裏一体。両方同時にやっていく。
- Q:どこまでモバイル対応してるの？
  - まずモバイルから作ってる
  - そこからPCに向けて作りなおす
  - できるだけ軽く工夫する
- Q:フロントエンドに長けてない人が気にすること
  - 片手間JS案件かよ
  - 難しい物をそもそも書かないこと
    - Single Page Applicationとか
  - 無理すんなよ
終わりに
- 啓文堂書店23時まで空いてるから買って帰れ、そしてレビュー書けや

2014-07-04

Socket.IO meetup行った

勉強会

http://connpass.com/event/6911/

html5dayで告知された時に運良く申し込めたので行ってきた。

AudioデータをSocket.IOで送るっていうLTのデモが面白かったのでソースを読もうと思う。

https://docs.google.com/presentation/d/1Bt-G2Mrwr-guvAO75HbTcuPXmYZlYoMLmbekqEG5b3A/edit#slide=id.p https://github.com/kuu/WebMTR

寿司は食わずに帰りました。以下、メモ

Key Note by Guillermo + 質問タイム

おじさん、英語全然わからんかったからほとんどわからんかった。。。

「MQTT.IO」 @hakobera

Quipper
MQ Telemetry Transport
- Pubsubに特化した軽量プロトコル、バイナリ
- IBM
- v3.1.1から国際標準化
- 軽量、バイナリ
- Quality of Service
M2M(IoT)向け
MQTT.IO作ったで
- 標準でWebSocket上で通信がある
- Socket.IOv1.0でバイナリ対応したのでできた
MQTT.IOいいとこ
- ワイルドカード送信
- 他の言語のバインディングあるで
センサーデータをブラウザで見たりとか
MQTT meetupが来月あるで！きてや！
- http://connpass.com/event/6911/

「Socket.IO on Smartfx」@takeshy

smartfxにおける導入事例
ルール
- オブジェクトごとにネームスペース
- イベントはルームを通して
ルールに沿ったミドルウェア作った
Socket.IO-ReqEv
- https://github.com/takeshy/socket.io-reqev

「Web-based multitrack recording」 @mayazaqui

audio data をSocket.IOで送る
ブラウザ側でaudio dataをキャプチャして送って、サーバでMixする
USBマイクをMBPにつないでWeb Audio APIでaudio dataを撮ってsocket.ioでAWSのexpressに送る
getUserMediaでマイクに接続
8byteのchunkで送る, 10回/秒
サーバ側でSoXで複数のaudio dataを結合するで
- http://sox.sourceforge.net/

「Socket.IO 1.0 Client For Java」 @nkzawa

github.com/nkzawa/socket.io.java
Android対応
1.0のアップデートで既存のクライアントが使えなくなったので作った
Nodeのclientとほぼ同じインタフェース
- Node clientの新機能が乗せやすい
- 逆もしかり
シングルスレッドってとこも一緒やで

2014-06-14

Tokyo WebGL meetup行った #webgl_tokyo

勉強会 javascript webgl

http://tokyowebglmeetup.github.io/

行ってきた。半年間仕事でThree.js使ってたし、WebGL自体もすごく注目してたので楽しみに品川へ。

個人の意見だけどWebGLってとっつきにくいし（Three.js使えば楽だけど）、他のHTML5技術に比べるとサービスに活かしにくいので、なんとなく気になってるけど実際ガッツリ使ったことがない人が多いのかなと予想してたけど、最初のほうで「仕事orプライベートで3Dプログラミングやってる人いますか？」ってスピーカーの人が質問したら、結構な人が挙手しててビビった。

GLSLってシンプルでアウトプットもgl_Positionとgl_FragColorだけだと思うんだけど、そのシンプルさで複雑な3Dができるのはやっぱりすごい。でも、人が書いたGLSLを見ても何をやってるのか理解するのって結構難しくて、みんなどうやって勉強してるのかなってちょっと思った。あと、水面が揺れているかのようなフィルターとか、そういうのをGLSLで表現するって本当にクリエイティブな作業だなと思う。

あと、スポンサーがMicrosoftだったからIEのゲームとかIE11の話があったけど、普段Mac使ってるしあんまり調べないから、すごく興味深かった。でもなんでMicrosoftがWebGLに力を入れてるのは未だによくわからない。

iOS8からMobile SafariにもWebGLがのるし、今後が楽しみ。WebGLのデモって初音ミクとか車とかの3Dモデルをゲーム的に動かすか、すごい派手なグラフィックかの2種類くらいしか見ないから、それ以外でもなんか面白いのがもっとでるといいなー。例えば、プロジェクションマッピングとか。プロジェクションマッピングとか！！

以下、メモです。

WebGLことはじめ@edo_m18

WebGLことはじめ from Kazuya Hiruma

比留間さん、カヤック、@edo_m18
- 2月からiOSやってるで、Lobiってやつ作ってるで
- マイQiitaってのも作ってるで
- 作ったもの
  - Canvas 2D、CSS3D、WebGLで色々やってるで
  - サイコロ給のデジタルサイネージ
今日のゴール
- WebGLやってみようかなって思うことやで
アジェンダ
- 何ができる？なにしてるの？
何ができる？
- OpenGL ES 2.0のバインディングやで
- GPU使った高速のレンダリング
iOS8からWebGL使えるで
- カヤックのページにアクセスや！
何をしてるの？
- パイプライン処理
  - ラスタライズ
    - 2次元のピクセルに変換や
  - Vertex Shader, Fragment Shader
GLSL
- GPUを直接操作する言語や
- 意外と簡単やで
- が、結構長い
だいたいみんなライブラリ使う
- Three.js

WebGL on IE@yomotsu

おやまださん＠PixelGrid
- よもつさん
- MMDのやつとか作っとるで
//build/ 2013
- MSのカンファレンス
- IEにWebGLに乗る！IE11から
IE10ではWebGLがのらなかった
- セキュリティ的要因、直接ハードウェア触るからやで
- Typed Arrayだけサポートしててわろた
- Vineに公式動画を上げたりしとったんや
DirectX上で動かすで。GLSLでな！
- GLSLをコンパイルしてDirectXで動かす
Surface上のIE11でデモや！
- FPS結構出てるで
MSが結構デモ出してる
- www.rethinkie.com
- http://photosynth.net/
- MSもthree.jsを推奨してる
- バビロン.jsはMSが積極的にやってる
WebGLの0.92と1.0の違いは？
- IE11は0.92や
- WebGLのサポートテストがちょっと通ってない
- ほとんど一緒
Macの人はVMWare使うと思うけど、ちょっと動かないかもな

iOS, Ejecta & WebGL@allyogilvie

@allyogilvie

実はiOS6でも作れるで！Ejectaなら！
- JS -> JSCore.framework -> OpenGL
- https://github.com/phoboslab/ejecta
Three.jsそのままやっても動かないｗ
- DOMが触れないから
- constructorとOrbitControls
- window.ejectaで判定して、修正コードぶちこむ
iOS5.1.1でも動いとる！すごい！すごい！

GLSL ray marching

すぎもとまさひろさん
- @h_doxas
- wgld.org
- サンデープログラマ
GLSLでray marchingを実装
レイトレーシングとは？
- オブジェクトがどのように見えるはずか、視点から逆算する
ray marchingとは？
- レイトレーシングの技法の一つ
- rayを段階的に飛ばす
- 最短距離が十分に小さくなった時点で衝突したか判定
distance function
- レイの先端とオブジェクト間での最短距離を返す
raymarchingのメリット
- ポリゴンという概念がない
デメリット
- モデリングツールなどとの連携が難しい
- 難易度高め、重い！
参考資料
- www.iquilezles.org
- demoscene.jp
- shadertoy
- GLSL sandbox

2014-05-28

Webアプリの正しいUIテストの方法が決定されなかった

勉強会

今夜、Webアプリの正しいUIテストの方法が決定されますに行ってきた。正しいUIテストの方法は決定されなかった（ディスカッション終わって帰ったからその後に決定したのかもしれないけど）

感想

Androidが端末毎に違うバグがあったり、IE時代よりテストが大変な時代にみんなどうやって効率的にUIテスト（自分のイメージでは、実機を触ったりSeleniumでエンドユーザの動きを出来る限り再現するテスト）やっているのかなーってのが気になって参加してみたけど、あんまりそういう話はなかったｗまだ「これだ！」っていう解答は見つかってないのかもしれない。

講演パート

前半の講演のところは事例的なのが2つで、あと3つはテスト製品の紹介だった。

サイボウズ宮田さんのkintone開発で受け入れテストをSeleniumを使って自動化している話はいいところ・悪いところ両方聞けてすごく参考になったが、自動化するコストはやっぱり高そうで、テスト数が多いとテスト実行時間もやっぱりすごくかかるみたい。

DeNA沖田さんの話は、Domain Agent Patternっていう言葉が出てきたけど、それをSeleniumでどういう風に実装しているのかもっと具体的に聞きたかった。

ディスカッションパート

後半のディスカッションは、すごく美味しそうな食事（銀のさらとビール！）が出てきたのに自分の席からは取りづらく、空腹ですごくイライラしてしまいほとんど聞いてなかったｗ（テーブルの周りの人ばかり食ってずるい！！スタッフの人、もっとテーブルの配置ちゃんと考えてほしい！！！）

その中でも印象に残った話は、Oracle榑松さんが「イノベーションはUIテスト（というか製品）の敵。次々と新しい技術が出ると製品開発が追いつかない。」っていうことを言っていて、その流れで「GoogleグラスのUIテストってどうしますかね？」っていう話に発展してDeNA沖田さんが「そういうテストまで考えられた製品が売れる時代になるのでは」って言ってのが面白かった（間違ってたらすいません）。

Androidの話も開発者が開発しやすい端末でいいサービスがリリースされて、バグが多いような悪い端末にコンテンツが不足して売れなくなれば理想なのかなと思った。が、ビジネス的にはより多くの人にリーチできた方がいいので、なかなか難しいだろうなーとも思う。

以下、メモ

講演「UIテストの自動化は何が良いのか、どのように実現するのか？」

Oracle 榑松氏「OracleのTestingToolsのご紹介」

自己紹介
- 元エンピレックス株式会社、Oracleに買収される
- 林業好きらしいｗ
Oracle Application Testing Suite
Application Replay
- 本番環境のユーザ動作をキャプチャして、それをTest環境で実行とかできる
本番データをテスト環境にクローンして、マスキングして個人情報を殺す
まぁ、全部ライセンス料必要やけどねｗ

サイボウズ宮田氏「kintoneチームを支える Seleniumテスト」

自己紹介
- B2Bサービス「kintone」開発チーム所属
- FEからBEまで
実際のSeleniumの運用事例
- BE:Java 22万行
- FE:JavaScript 20万行
Seleniumって大変じゃない？
- 安定しない、UI変更で死、実行時間が長い、ブラウザ対応大変etc
- kintoneでもメンテ不能になったことも
なぜ自動化するの？なにを自動化するの？とチームで議論
受け入れテストが自動化の効果が高そうという結論
自動化しないと。。
- 大きな変更での動作確認ができない
- 不具合の原因調査できない
目標「高品質かつ高速な開発を行う」
kintoneチームのSeleniumテスト
- プログラマーが自動化
- WebDraiver + Grid
- 本番コピー環境で試験
- 700のテストケース！
- 全部で24並列で20分もかかる
CI → Jenkins + Pipeline Plugin
- 全部通るのに40、50分
- 落ちた時はメンション飛ぶで
安定運用に関してはブログ見ろや
メリット
- 安心感
- 怪しい変更がすぐわかる
- 自動化中に実装漏れに気づくことも
- チーム全体の品質への意識が変わるで
- 早期発見することで修正のコストを最小限にする
課題
- Selenium Gridのノード管理つらい
- ブラウザ・WebDriverのバージョンアップでテストが不安定になることも
- 効果の見える化
自動化する前に戻りたいとは思わない！自動化最高！
まとめ
- Seleniumは結構大変（もしかしたらSeleniumじゃなくても大変
- でも、受け入れテストが手動なのはリスク高いでござる

Xenophy 佐川氏「UIテストどうやるか」

エンタープライズよりの話ですまん！ほとんど営業や！
自己紹介
- Knockoutjs Japan UGなどなど
エンタープライズは結局顧客中心
- Excel作ったりとか。。
Siestaの紹介や！

DeNA 沖田氏「Selenium in Mobage Platform」

自己紹介
- @okitan
- WebDB+Pressに記事寄稿しとるで
- 会社：SWETグループ（Software Engineer in Test）
正しいUIテスト？→わからんぜよ。何をUIテストと呼ぶべきなのか
Selenium RC + WebDriver
WebDriver APIはw3c標準になろうとしてる
8月にSelenium3が出るかも。→モバイルより
Mobage Platform
- End User, OpenID Connect, SAP, SocialAPI etc
システムテスト
- 本番同様にデプロイしてやる
- テストデータも出来る限り本来のやり方で作成
ユーザ間のインタラクションが主
ユーザを意識をしないでテストを書く
- ID/Passwordでログインしてとか辛い
デバイスも意識させない
- 隠蔽してる
- PCでもスマフォでも共通化できるように
Domain Agent Patternや！
- UAがセッションデータを持ってて、単体で機能実行が可能
- 複数ユーザ、異なるデバイスのテストが書きやすい
まとめ
- UIはスコープ外にして、Seleniumテスト
- Domain Agent Patternの活用や！

日本IBM 金元氏「」

打鍵テスト自動化のソリューション（RTW）、品質の可視化し継続的に品質改善（MQA）

2014-04-22

今使いたい技術一覧

毎日コードを書くこと

html5 japan cupを意識しすぎるがあまり、別に興味ない物を作ろうとしつつある。自分はやっぱり使いたい技術ベースで考えた方がモチベーションが続く気がするので、使いたい技術のメモ。この中から組み合わせながら適当に作って、調子いいやつでタイミングがいいものを提出しようっと。

Vue.js
- いいないいなーと思いつつ、特に使ってない
- ディレクトリ構成をどうするといいかとか、Angular.jsのbootstrapみたいな初期化をどのタイミングで行うといいかとか使いながらじっくり考えたい
- Angular.jsは十分使ったので、2.0が出るまではもう触らなくてもいい気がする
polymer.js、Web Component
- ロゲ会長タグ作りたい
SVG
- SVGをThree.jsのGeometryに変換するスクリプト書きたい
D3.js, Snap.svg − SVG使ってなんかいい感じのグラフとか書きたい
Golang
- 最近流行ってるな−くらいで何ができるかわからないから
- Webアプリケーションが書けるらしい
chef
- 入門chef solo読んで何もやってないからサーバ構築したい
Web Audio API
MicIO.js
- Web Audio API使ってイヤフォンジャックからの入力を取るやつ
- どのメーカーのリモコン付きイヤフォンにも対応したBGMサイト作りたい
WebGL
- Three.jsはだいぶ書いたので、生WebGL, Away3D TypeScript, Unityのどれかで
Chrome Web App
- USBとかBluetooth使ったやつにしたい
- PCとAndroid、両方で動くやつも作ってみたい
yeomanのgenerator自作
- JavaScript以外のプロジェクトをgenerateするやつ。例えば、dotfileとか。
gulp
- 「Gruntでええやん」とおもっていたけどこの記事読んでたら感化された
- 普通にyeomanのgeneratorあったｗこれでええやんｗ

たぶん新しいものならなんでもいいのかもｗネイティブアプリもいつか作りたいなーと思いつつも、足が遠のきますなー

2014-04-20

第47回HTML5とか勉強会　（データビジュアライゼーション） #html5j

JavaScript 勉強会

金曜だけど、第47回HTML5とか勉強会　（データビジュアライゼーション）に行ってきた。ニフティーが駅から結構遠くてびびった。

以下、メモ（後半のメモがひどかった。。）

データの可視化について

@muddydixon

可視化の目的

情報を明確かつ効率的に伝え、それによって目的を達成すること。
- Badの事例集
まず、何のために可視化するのかっていう目的をきっちりと定めましょう
可視化によってできること
- メトリクスの監視
- トレンド、関連性の把握
- 属性の分析
- 事実の発掘・活用
それによって改善行動を促進する

可視化とは？

明確かつ効率的に情報を伝えること
なぜ可視化するとよいのか？
- 経験的・認知的な既存知識を活用できる
  - 大小、短長、色、とかを使ってデータを伝えるとピンときやすい
「認知」が「把握」を加速する

可視化の理論

対になっている概念
- 「データ・セット」と「可視化」
- 「データ」と「視覚記号」
- 「データ変数」と「視覚変数」
データ変数の尺度
- 比較なのか、大小なのか、減算できるのか
この辺りは↓に書いてるらしい
- http://shop.oreilly.com/product/0636920022060.do

Webで可視化するといいこと

共有が楽
多くの人に届けることもできる
- 税金はどこにいった？
インタラクティブ性
- マウス・キーボード
- アニメーション
  - 時間軸を利用することで、表現できることが1つ増える
SVGやD3.jsが非常にええで。使いなはれや。

データ・ビジュアライザーションの現況と実際

矢崎裕一
- http://visualizing.jp/
  - CEREVO、CODE for JAPANのロゴ作っとるで
  - 世界防災・減災ハッカソンのビジュアルデザイン
  - Nasa ハッカソンのデザイン

背景

Open Data
Creative Coding
Visualization Practitioner

Open Data

イギリスが早かった
- 2004~ UK
- 2009~ USA
- 2012 JAPAN
オープンガバメント
- Wiredカンファレンス
- オープンガバメントシンポジウム

Creative Coding

Visualization Practitioner

Practitioner=実践者
d3.unconf@GitHubなどデータビジュアライゼーション系のカンファレンスが多い
- お互いどういうふうにやってるかってのをシェア
- 結構手探り状態
料理と似ている
データはどこにある
- カタログサイト、国際機関、Wkipedia、SNS、専門家に聞く、書籍etc
- 「データは街に溢れている」
自分のアクティビティデータは意外とオープンデータではない
- Quantified Self
- Fuelの非公式APIがあるらしい
  - SXSWのHackathonで
  - 結構Hackが必要だけど、取れるらしい
人間ドッグのデータをXMLでくれる病院があるらしい
- 公立昭和病院
データのクレンジング
- そのままのデータだと扱いづらい事が多い
- Open Refine データを綺麗にするツール
ビジュアライズ＝ものの見方
- 何を見出すかは個人の経験や世界観に依存
- 時間軸変形地図
  - 視点によって見え方が違うという例
Objective vs Subjective
- データがベースだけど主観入るよねーそれはいいことか？
- 解釈する余白を残してあげるといいんじゃね？
ワークフロー
- 「Data Visualization」本
- 収集→解析→フィルタリング→マイニング→表現→精義化→インタラクション
- Data Journalism Handbook

感想

もうちょっとD3.jsの話とか、実際業務でどんなデータをビジュアライゼーションしてるのかとか聞きたかった。
後半の話は、面白かったけど深い話だったので1時間で全部は理解しきれなかった気がする。
自分の主観（何を伝えたいか）をうまく表現できる、ツールや図の選定ができると、プレゼンとか誰かを説得したりするときにいいのかなと思った。
Creative Codingって言葉を初めて聞いた。もうちょっと調べてみたい。

2014-04-15

テスタブルJavaScript読んだ

JavaScript book

テスタブルJavaScript

作者: Mark Ethan Trostler,牧野聡
出版社/メーカー: オライリージャパン
発売日: 2013/09/21
メディア: 大型本
この商品を含むブログ (2件) を見る

後半はペラペラと読んだ程度だが。前半はテストしやすいコードをどう書くか、なぜそう書かないといけないのか、書くとどういういいことがあるのか、という話だったが、後半は複雑度を出すツールはこういうのあるよとか、自動化する時はこういうツールがあるよ、デバッグするのはこのブラウザだとこうだよっていうツール中心の話だった。「広く浅く」という感じで、別に読まなくてもよかったかもしれない。