早いもので、Vue Fes Japanまで残すところ２週間程度となりました。

で。

何はおいてもsdrasさんですよ。来日です。

このブログの読者はSVG漬けの毎日を送っていると思うのですが、 SVGアニメーションといえば自分の中ではこの方です。

Sarah Drasner(sdras)さんは、VueConf 2017（katashinさんによるVueConf 2017 参加レポート）のトリでSVGアニメーションのプレゼンを行い、注目を浴びたことが記憶に新しいです。

この方がVue Fes Japan登壇のために来日します。SVG界震撼です。

発表では「なぜアニメーションが必要なのか。そしてどのように実装すればいいのか」が楽しく解説されています。アニメーションの制御にはTweenMaxとVue.jsが利用されています。

私もこの発表に影響されてSVGを始めたので思い入れがあります。皆さんも未見であればぜひスライドだけでも見てください。スライド内のSVGはインタラクティブに動かせます。

スライド：slides.com

sdrasさんのCodepenは楽しいぞ

ウォーリーがマウスカーソルを追ってグリグリ動きます。

ホームボタンを押すといい感じのSVGアニメーションが展開されます。

聞くところによるともともとFlasherだったそうで、このへんの作品はFlashっぽいですね。

Vue.js Londonのトップアニメーションもsdrasさん作です。

sdrasさんのバックグラウンド

sdrasさんのバックグラウンドは「フロントエンドエンジニア」かつ「サイエンスイラストレーター」だそうです。イラストレーターとしての作品は下記サイトで見ることができます。

どのイラストも緻密で圧倒されます。

もともと数学とアート両方に興味が強かったようで、一旦はアート方面で教鞭をとっていたそうです。

などなど、アートの人という感じですが、その後フロントエンドエンジニアとして働くようになり、現在に至ります。

デザインと実装両面をやっているという点では、Vue.jsの作者のEvanさんと似たものがありますね。（Evanさんも元々デザインを学んでいて、エンジニアとしてGoogleに入っています）

現在の肩書はMicrosoftのDeveloper Advocateです。これはEvangelistに近いものだそうで、アニメーションやサーバレスアーキテクチャ（Azure Functionsなど）を啓蒙する立場です。

sdrasさんはVue.js core teamメンバーでもあります。主にドキュメント周りに貢献されていて、目立ったところでは、公式ドキュメント内の「The Cookbook」をリードしました。

クックブックはExampleよりも実用的な例を提供するためのドキュメントで、今年から導入されたものです。内容は重厚かつ実用的で、一見の価値ありです。

オライリーのSVG Animationsの著者です。
CSS-Tricksの著者の一人です。記事一覧
Array Explorer, Object ExplorerというJSの解説サイトを作っています。
- Array Explorer
- Object Explorer
vue-directory-treeという、Vue.jsコアのディレクトリ構造を解説付きで表示してくれるサイトを作っています。これVue.jsのコアのコードを読む取っ掛かりにいいかもしれません。
- vue-directory-tree
SVG Workshopというリポジトリを公開しています。中身を全部見れてませんが、D3やMo.jsなどを利用しているようです。ワークショップに使ったスライドやコードなどが含まれています。
- SVG Workshop