円形ローディング
Photoshop CC の画像アセット
Adobe CC ようやく導入した。
これまでSlicy.app つかってたけど、画像アセットに移行しよ。
## 画像アセットとは
psdのレイヤーから画像書き出しするやつ、スライスいらず。
### 手順
#### 1. レイヤーをグループ化
レイヤーを選択して、`Command + g` で書き出したい画像単位でグループ化
(単体レイヤーの場合は省略)
#### 2. レイヤー/レイヤーグループに以下のルールで名前をつける
特に指定がない場合、PNGは32-bit(フルカラー24-bit + 透明部分)、JPEGは画質90%で、`[psdファイル名]-assets` ディレクトリに保存される
– JPEG 画質40%で保存したい場合は `button1.jpg4` もしくは `button1.jpg40%` とする
– PNG-8bitで保存したい場合は `button1.png8` のように、拡張子の後ろに数字を付ける
– `[subfolder]/Ellipse_4.jpg` のようにすることでサブディレクトリ指定ができる
*高解像度版の画像も必要な場合レイヤー名にカンマ( , )を入れ、「200%」のように高解像度版の倍率と、
「button1@2x.jpg」高解像度版画像のファイル名も書いておくことで、PDFファイルを保存した際に高解像度版も出力される
ex. レイヤー名を `btn.png, 200% btn@2x.png, 300% btn@3x.png`
#### 3. 生成
Photoshopで、`ファイル > 生成 > 画像アセット` をチェック、すると、psd更新ごと(保存しなくてよい)に画像が書き出される。
### 初期設定の指定
生成されたアセットに対してドキュメント全体の初期設定を指定できる。
#### 1. 空のレイヤーをつくる
#### 2. レイヤーの先頭に `default 〜` で画像アセットの書き出し方法を定義
`default [拡大率] [サブディレクトリ名]/[ファイル名の接頭詞]`
#### 3. 一度に複数書き出す場合はルールを ` + ` でつなげる
#### ex. `default 1x/ + 200% 2x/@2x`
– `[psd name]/1x/` に等倍画像を保存
– `[psd name]/2x/` に200%画像をファイル名末尾に`@2x`をつけて保存
## 無効にする
すべてのドキュメントの画像アセット生成を無効にするには
1. 編集/環境設定/プラグインを選択します。
2. 「Generator を有効にする」の選択を解除します。
3. 「OK」をクリックします。
## 拡張
### SVGファイルを書き出す
[Photoshop CCの画像アセット機能でSVGを書き出す裏技 | Stocker.jp / diary](http://stocker.jp/diary/photoshop-generator-svg/) を参照
## 参考:
– [PhotoshopCCで劣化しない@3x対応 – Qiita](http://qiita.com/nofrmm/items/9ff3967a38f7a45aa898)
– [Photoshop ヘルプ | レイヤーからの画像アセットの生成](http://helpx.adobe.com/jp/photoshop/using/generate-assets-layers.html)
– [使い方・活用法 – スライスより便利!画像アセット機能でWeb用にパーツを保存する | Adobe Creative Station](http://www.adobe.com/jp/jos/creativestation/howto/plusone/photoshop09.html)
SublimeText3 に SimpleClone いれた
同一ファイルを別タブで開くプラグイン → [mikefowler/simple-clone](https://github.com/mikefowler/simple-clone)
Mac版のショートカットは以下
– 横タブに開く = `Shift + Command + →`
– 下に分割して開く = `Shift + Command + ↓`
bootstrap – 非デザイナーエンジニアが一人でWebサービスを作るときに便利なツール32選 – Qiita
UICloud | User Interface Design Search Engine, UI, UX, GUI, Inspiration, Resources, Elements, User Experience, Free Downloads, Freebies
UI関連のデザインいろいろ
TeamPage.io
会社紹介とかでよくあるStaffとかMemberとかのプロフィールページ専用のサービス。
coveloping | Speed Up Your Development
CSS animationとかPricingTablesとかWebサイトのちょっとしたモジュールジェネレータ
Pixelapse – Visual version control for designers
デザイナ向けgithub、らしい / 保存するとpushされるタイプか
もみじ市2014
もみじ市いってきた。
– 11:00スタートで11:30には会場ついたのだけど大行列
– 30分ぐらい並んで入場できたが、入ると意外に空いてて物販は普通に見れる(食べ物屋は例外で大行列)
– 14:00前には引き上げたけどそれくらいの時間になると普通に入れる
### 収穫
– [HITOHARI](http://hitohari.com/) のトートのポーチ( 2014-10-15時点ではまだオンライン上にない)
– [chappo](http://www.geocities.jp/chappo_ssk/index.html) の帽子
HITOHARIのポーチはすごい調子よくて、パソコン関連用品携帯するのにつかってるが、ネット上にまったく情報ない。
もうひとつほしいぐらいだ。
> もみじ市とは?
> 陶芸家、布作家、料理家、音楽家、農家、イラストレーター、エッセイスト、カフェなどさまざまな “ものづくりびと” が集い、青空の下 (希望)、2 日間だけのマーケットを開く「大人の文化祭」。2006年の11月に第1回のもみじ市を開催して以来、秋はもみじ市、春は花市の名称で、年に2回開催してきましたが、2009年より年に1回、もみじ市のみの開催に。今回で、10回目の開催となります。
> [もみじ市2014 | もみじ市|2014年9月27日(土)→ 28日(日) at 調布市多摩川河川敷](http://momijiichi.com/2014/)
