WordPress 今どきの効率的な制作フロー
•
8 j'aime•3,251 vues
WordBench宮崎 Vol.04で話したPhotoshopでのデザイン〜コーディングまでの流れ。 WordPressの勉強会ですが、WordPress的な内容はほとんでないです。
Recommandé
Contenu connexe
Tendances
Tendances (18)
Similaire à WordPress 今どきの効率的な制作フロー
Similaire à WordPress 今どきの効率的な制作フロー (20)
WordPress 今どきの効率的な制作フロー
- 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」等に出演
- 13. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. Guide Guideを使うと便利
- 18. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. レイヤー選択のテクニック 右クリックを活用する 移動ツールでカンバス上のオブジェクトを クリックする。 ※［移動ツール］のオプション［自動選択］は あまり使用しない。 もしくは必要に応じて使用・不使用を切り替える。
- 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] を押しながら 左右にドラッグ ブラシプリセット スポイト ブラシの硬さ サイズの変更
- 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 使う
- 40. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. エレメント、フォーマット エレメント フォーマット シンボル化 or リンク リンク
- 43. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. 画像の書き出し Photoshopの 機能を使う アプリを使う プラグインを使う Webサービス を使う 画像アセット Slicy PNG Hat , Cut and Slice Me Project Parfait
- 46. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. Photoshop CCのバージョン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 } }
- 50. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. CSSの書き出し Photoshopの 機能を使う プラグインを使う プラグインを使う2 Webサービス を使う CSSをコピー CSS Hat CSS3Ps Project Parfait
- 54. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. Emmet Hayaku AutoFileName SFTP WordPress Emmet LiveStyle 各種スニペット パッケージによる拡張
- 57. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. CSS プリプロセッサ CSSをより簡単、効率的に書ける Rubyが必要 Sassとは？
- 63. WordBonchMIYAZAKI,Vol.04 2014.5.24 Sat. 仮想マシンの作成や環境構築を 自動化するツール ようするにローカルに開発用サーバーを 簡単に作れる コマンドでインストール VirtualBox or VMwareが必要 Vagrantとは？