blog
Hello Sketch 3 シリーズSketch 3でピクセルスナップ(Round)を制御する
この記事は書かれてから1年以上経過しており、内容が古い場合があります。
Sketch 3ではパスを描こうとするとデフォルトでピクセルスナップ(Round: Full Pixels)が有効になっています。 アイコンを作る際の微妙な調整には邪魔な機能ですがどこで制御するのかやっとわかったので私のように意外としらない人もいるんじゃないかと思ってメモとして残しておこうと思います。
ちなみにPhotoshop/Illustratorユーザーにはスナップの方がわかりやすいかなと思ってますが、正式にはRound(丸め)で端数切り捨てとか、四捨五入みたいな感覚でしょうか。
ピクセルスナップはパス毎に制御できる
Sketch 3ではパス毎にピクセルスナップのオン/オフを制御することができます。
中央のアンカーポイントがずれているのがわかりますか?本当は黒い部分にぴったり合わせたいけど、有効化されていると細かな調整ができません。
ピクセルスナップをオフにする
ピクセルスナップをオフにするにはインスペクタにあるRoundの項を変更します。
スナップの選択肢
項目 | 内容 |
---|---|
Don’t round to nearest pixels | スナップをオフ |
Round to half pixels | 0.5px間隔でスナップする |
Round to full pixels edges | ピクセルの端にスナップする |
ちょっとしたTipsの紹介でした。
シリーズ
- Hello Sketch
- Sketch 3を使いこなすためリンクやメモ
- 複数のHexからカラーパレットを自動生成するSketch 3プラグイン「Swatches」
- Sketch 3でマテリアルデザインベースのオレオレアイコンデザインテンプレートを作ってみた
- Sketch 3でピクセルスナップ(Round)を制御する
- iOSデバイスでデザインをチェックできるSketch MirrorやSkala Previewとか
- Modular ScaleとVertical Rhythmを使ったタイポグラフィとレイアウト
- Sketch 3.3 でできるようになったこと
- Sketch 3のページ・レイヤーを自在に操るショートカット