自分とコーダーさん(orコーディングをする自分)双方の手間が最小限になる段取りを模索中です。
あと忘れがちな設定作業とかの備忘リスト。随時追記します
デザイン前
◆やる
・カラーモードをRGBに
・単位関係をすべてpixelに
・表示を「ピクセルプレビュー」モードに
・オブジェクトの線設定を「内側」に
∟「新規オブジェクトに基本アピアランスを適用」設定をオフ
↑↑↑※毎度やるのは面倒だしヒューマンエラーが怖いので、設定をまるごとテンプレートに保存してしまうとラク！（方法は後日記載）
・デフォルトのフォントをfont-familyで使う予定のものに変えておく
∟大体はメイリオ or MSゴシック or 游
デザイン中
◆やる（気を付ける）
・線(border)単体を表現するときは「(borderの太さ)pxの塗」で表現する
∟奇数幅pxの線を引きたい時、デフォルトだと線の中心がピクセルに整合するのでにじんでしまう
・素材画像を使う時は「ccライブラリ」で管理する
∟他ファイルでバリエーション作る時もラク
∟Adobe Stockの画像とかワンクリックで購入→置き換えまでできちゃうので最高
∟画像だけじゃなくて書式や色コードも管理できてほんとに最高
・要素はこまめに「ピクセルグリッドに整合」
∟オブジェクトの位置やサイズを微調整しているとき、何かの拍子に小数点ができてしまうことがわりとよくある
にじみで印象変わるとわかりづらいので、「なんかぼやっとしてるな」と思ったらこまめに整合アイコンを1クリック
◆やらなくていい
・レイヤー整理
∟デザインを試行錯誤してる時にいちいちレイヤー構造まで見なくちゃいけないのは手間
・マージンや文字サイズ等の数字を設計
∟大まか(印象が変わらない程度。誤差1~5px以内)に合わせるなどの管理は都度必要だが、ピッタリ合わせる必要はない。なぜならデザインの試行錯誤中に結局何度でもずれるから
∟数字で管理する癖をつけるのもいいが、最初から数字ありきでやっているとデザインが固くなる気がする。バウンドボックス使って感覚的にいじって、デザインが決まってから数字で整えていく方が柔軟なデザインになる…私は
デザイン提出時
◆やる
・数字まわりの設計
∟マージン系は「整列と分布」パネルで細かな誤差を修正し、端数を切上げor下げして管理しやすい近似値に
∟文字サイズは16pxを基準に「em」で管理しやすい近似値に
◆やらなくていい
・レイヤー整理
∟直しが入る可能性があるから、作業スペースは片付けないでおく
∟使わなかったデザインパーツとかもまだとっとく
デザイン後(Fix時)
◆やる
・非表示オブジェクトを削除
∟オブジェクト→すべてを表示 で非表示だったものだけ選択された状態になる
・飾り文字をアウトライン化(ウェブフォント使用予定のもの除く)
・SVG吐き出し予定オブジェクトの軽量化処理
∟パスのアウトライン化、合体、アピアランスの分割
∟吐き出した後のコード編集も忘れずに
◆やる（コーダーさんに引き継ぐ場合）
・レイヤー整理
・画像やリンクファイルの埋め込み(or納品ファイル用にリンク再設定)