Download to read offline
![WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat.
ブラシツール選択時の挙動
右クリック ［option］キー
[option]+
[control]
を押しながら
上下にドラッグ
[option]+
[control]
を押しながら
左右にドラッグ
ブラシプリセット スポイト ブラシの硬さ サイズの変更](https://image.slidesharecdn.com/slide-140624025524-phpapp02/85/WordPress-25-320.jpg)
Uploaded byTsuzurahara Tohru
WordPress 今どきの効率的な制作フロー
WordBench宮崎 Vol.04で話したPhotoshopでのデザイン〜コーディングまでの流れ。 WordPressの勉強会ですが、WordPress的な内容はほとんでないです。
![[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性](https://cdn.slidesharecdn.com/ss_thumbnails/uxux-211214103138-thumbnail.jpg?width=640&height=640&fit=bounds)
WordPress 今どきの効率的な制作フロー
- 1.
- 2. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. 黒原 道 （つづらはらとおる） eaterTohru Tsuzurahara 大阪出身、宮崎在住 後藤修氏とのデザインユニット「eater」にて、 Webデザイン・構築 / グラフィックデザインを行っています。 http://29eater.com/portfolio 講師やセミナー開催、イベントなどもしてます。 ・Word Bench宮崎運営 ・セミナーイベント「Design Pledge」運営など http://29eater.com/activity CSS Nite in MIYAZAKI, Vol.1 CSS Nite LP, Disk 22「Webデザインで使うPhotoshop」 CSS Nite LP, Disk 34「Webデザインで使うPhotoshop」 dot-Ai Vol.2「ネタ祭り2013」等に出演
- 3.
- 4.
- 5.
- 6.
- 7.
- 8.
- 9.
- 10.
- 11.
- 12.
- 13.
- 14.
- 15.
- 16.
- 17.
- 18. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. レイヤー選択のテクニック 右クリックを活用する 移動ツールでカンバス上のオブジェクトを クリックする。 ※［移動ツール］のオプション［自動選択］は あまり使用しない。 もしくは必要に応じて使用・不使用を切り替える。
- 19.
- 20.
- 21.
- 22.
- 23. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. レイヤーマスク 白で塗りつぶし黒で塗りつぶし グレー 表示 非表示 半透明
- 24. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. レイヤーマスク グラデーションツールを使う ブラシツールを使う その他、白・黒で塗り分けできれば何でも ［］+［delete］ ［option］+［delete］ ［shift］+［delete］ 背景色で塗りつぶし 描画色で塗りつぶし 塗りつぶしのダイアログ
- 25. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. ブラシツール選択時の挙動 右クリック［option］キー [option]+ [control] を押しながら 上下にドラッグ [option]+ [control] を押しながら 左右にドラッグ ブラシプリセット スポイト ブラシの硬さ サイズの変更
- 26.
- 27.
- 28.
- 29.
- 30.
- 31.
- 32.
- 33.
- 34.
- 35. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. ダミーテキスト Photoshopの機能を使うネットのサービスを使う スクリプトの活用 書式メニューの Lorem Ipsum ダミーテキストで検索 JSXを作るor 使う
- 36. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. ダミーテキスト Photoshopの機能を使うネットのサービスを使う スクリプトの活用 書式メニューの Lorem Ipsum ダミーテキストで検索 JSXを作るor 使う
- 37.
- 38.
- 39.
- 40. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. エレメント、フォーマット エレメントフォーマット シンボル化 or リンク リンク
- 41.
- 42.
- 43. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. 画像の書き出し Photoshopの 機能を使う アプリを使うプラグインを使う Webサービス を使う 画像アセット Slicy PNG Hat , Cut and Slice Me Project Parfait
- 44.
- 45.
- 46. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. PhotoshopCCのバージョン14.2以降 generator.jsonを［ホームフォルダ］に作成 Windowsの場合、ユーザーフォルダ（ユーザー 名のフォルダ） Photoshop CCを起動し（既に起動していた場 合は再起動し）、カスタムシェイプのレイヤー 名の最後に.svgをつけます。 画像アセット機能で書き出し 画像アセットを使いSVGを書き出す
- 47. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. generator.jsonの中身 画像アセットを使いSVGを書き出す { "generator-assets":{ "svg-enabled": true } }
- 48.
- 49.
- 50. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. CSSの書き出し Photoshopの 機能を使う プラグインを使うプラグインを使う2 Webサービス を使う CSSをコピー CSS Hat CSS3Ps Project Parfait
- 51.
- 52.
- 53.
- 54. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. Emmet Hayaku AutoFileName SFTP WordPress EmmetLiveStyle 各種スニペット パッケージによる拡張
- 55.
- 56.
- 57. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. CSSプリプロセッサ CSSをより簡単、効率的に書ける Rubyが必要 Sassとは？
- 58.
- 59.
- 60.
- 61.
- 62.
- 63.
- 64.
- 65.
- 66.
- 67.
- 68.
- 69.