37. デザインエンジニアのワークフロー

trkwとmiyaokaとoligin020の3人で、RIA、フレームワーク、デザインシステム、Figmaなどについて話しました。## Show Notes

soussune、今日も収録してます。菅原( @oligin020 )さんのオフィスにおじゃましてますー #soussune pic.twitter.com/Ya3NpVAY77

— みやおか (@miyaoka) 2018年1月17日

菅原さんの自己紹介

• 株式会社ファームノート - クラウド牛群管理システム
• 牧場の営業管理ツール
• デザイナーとプログラマをやっている
• 管理画面がまるでリアルなダビスタ

エンジニアとしてどうやってきたか

• 中村勇吾さんへのあこがれ
• UI デザイン
• 派手な EC サイト作り。コンペ向きな演出
• RIA: リッチインターネットアプリケーション - Wikipedia
• フレームワークが無いので自作

ビジュアル表現

• Flash はドキュメントではなくアプリケーション
• 最近のフロントはマイクロインタラクション
• 作り手のエゴイズムは満たされにくい

データビジュアライゼーション

• Visual Data 〜データや映像で体感：日本経済新聞

• Vue と React Native で D3 を動かす
• DOM 操作を D3 ではやらない
• D3 はサンプルが豊富

アニメーション

• CSS Transition
• React Native はアニメーションが大変

SVG の面白さ

• コードで生成した SVG をファイル化してエディタに持っていく
• Introduction · react-sketchapp
• Sketch のプラグインで React Component を Sketch のシンボル化

Lint 話

• eslint-config-airbnb
• Editorial: Add Automatic Semicolon Insertion hazard clause by bmeck · Pull Request #1062 · tc39/ecma262
• Prettier · Opinionated Code Formatter
• How to change tab size on GitHub? - Stack Overflow

フレームワーク

• The PureMVC framework
• MVVM のはしり、Windows Vista の XAML
• XAML とは
• XML ベースでデータバインディング

• Mobile App Development & App Creation Software - Xamarin
• Unity - Services - Cloud Build

メディアアートの世界

• 群衆リファレンス ① - nisshi.yugop
• 群衆リファ