DesignTool

Sketchのファイルサイズを節約する方法

2017.08.26

Sketchする人

Sketchはとても動作が軽快で直感的に操作できるUIツールです。画像の書き出しが行いやすく、マスクの取り回しも便利なのでメインツールとして使っています。ページ機能もあるので1プロジェクト1デザインファイルで行いたいところです。となるとファイルサイズを無駄に肥大させない工夫が必要です。

Flatten Selection to Bitmap画像サイズの最適化

Sketchは画像ファイルを読み込んだ状態で維持していますので、無駄に大きな画像を読み込むとファイルサイズに大きく影響します。そんな時は画像の大きさを適切なサイズにしたのちLayer>Flatten Selection to Bitmapでビットマップ化しファイルサイズを節約します。

当サイトのデザインカンプです。

デザインカンプ

ファイルサイズ

ファイルサイズは約49MBこの状態で3888×2592の大きな画像を読み込むと

デザインカンプに画像読み込み

ファイルサイズが増えた

約59.9MBに!かなり肥大しました。

適切にリサイズを行いLayer>Flatten Selection to Bitmapでビットマップ化すると

デザインカンプとリサイズ画像

ファイルサイズ節約

51.3MBに!かなり節約できました。

デザインもサイトもパフォーマンスは塵も積もれば

画像毎にこの作業を行うのは地味に面倒だったりしますが、塵も積もれば山となる精神で取り組めば結果的にビットマップ化を行わないよりも作業効率化が図れるかもしれません。

WEBSITE DESIGN REQUEST

ホームページ制作依頼について

W・D・Sでホームページ制作をご希望の方はお気軽にご相談ください。
制作内容、ご予算、納期をお知らせいただくとスムーズです。

ホームページ制作を相談する