Download as PDF, PPTX
Linkage of gulp & sketch
- 1. 1 Linkage of Gulp &Sketch
- 2.
- 3.
- 4. 1. Gulp 4 Linkage ofGulp & Sketch
- 5.
- 6. 6 Gulp & Grunt 競合はGruntというタスクランナー。 どちらも、プラグインを使い、 成果物を求める一連タスクを実行します。 Linkageof Gulp & Sketch 1.Gulp
- 7. 7 Linkage of Gulp& Sketch 1.Gulp タスクランナー 9,806star 2011/9/18 プラグイン多い ビルドシステム 15,271star 2013/6/30 プラグイン少ない Gulp & Grunt
- 8. 2.Sketch 8 Linkage of Gulp& Sketch
- 9. 9 about Sketch2.Sketch BOHEMIAN CODING製の デザイン・グラフィックドローイングツール。 madein LONDON Linkage of Gulp & Sketch
- 10. 10 about Sketch Photoshop,Fireworks &Illustratorのハイブリッド。 マルチデバイスのデザインに特化している。 が、歴史が浅く、脱Adobeとまでは至らない(2015現在) Linkage of Gulp & Sketch 2.Sketch
- 11. 11 about Sketch 安価 軽い 秀逸 全て英語 情報が少ない Windows不可 Merit Demerit Linkageof Gulp & Sketch 2.Sketch
- 12. 4. Linkage 12 x Linkage ofGulp & Sketch
- 13. 13 Todo Linkage of Gulp& Sketch 3.Linkage Sketchで作成したデータから 画像を書き出す！ 書き出した画像を 任意の場所に配置！ やりたいことは？ 画像サイズダウン！
- 14. 14 http://yeoman.io/ Yeoman Linkage of Gulp& Sketch 3.Linkage まずYeomanでテンプレートを作ります。
- 15. 15 Template building // npmを最新にする $sudo npm update -g npm // インストール $ sudo npm install -g yo // generat $ yo -v // 変更を監視 $ gulp watch Linkage of Gulp & Sketch 3.Linkage 前提として node.jsインストール済み
- 16. 16 sketchTool // sketchToolのインストール $ curl-L https://raw.githubusercontent.com/cognitom/dotfiles/ master/lib/sketchtool.sh ¦ sudo sh Linkage of Gulp & Sketch 3.Linkage Sketchのコマンドラインツール
- 17. 17 Sketch setting SketchデータをGulpで書き出すための プラグインを導入します。 // gulpからSketchToolを使えるようにする $sudo npm install gulp-sketch --save-dev // 書き出し画像の軽量化 $ sudo npm install gulp-imagemin --save-dev // Stream上で処理されているファイルを把握する $ sudo npm install gulp-filelog --save-dev Linkage of Gulp & Sketch 3.Linkage
- 18. 18 Run 実行 $ gulp sketch Linkageof Gulp & Sketch 3.Linkage
- 19. 19 フロントエンド開発で実用しているgulpから Sketchを操作出来るなんて激アツです。 フロントエンド業とデザイナー業の境界が 日増しに融解していくのを感じます… Linkage of Gulp& Sketch 3.Linkage Summary
- 20.
- 21. 21 END Linkage of Gulp& Sketch 3.Linkage