- リンクを取得
- ×
- メール
- 他のアプリ
Q: アプリ内アイコンを作成する際、ベクターの点を動かすとX,Y の値が小数点になってしまってめんどくさいね。なんとかならないの?
A:
1pxごと/0.5pxごとに点を動かせる設定欄がSketchにあります。
この機能、一見してなんだかわからず使っていない人が多いようです。
ここで描いたような複雑な図案のアイコンの微調整に使うと大変便利です。
Round: None( Don't round to nearest pixels) を選択している状態でベクターの点を動かすと自由に移動させることができます。 デフォルトだとこの状態です。
好きな位置へ移動できる自由度があるものの、X, Yの値が小数点第2位まである扱いにくい数値になるというデメリットもあります。
メガホンの両端を等しく広げたい/狭めたい、というような場合にそれだとかえって不便です。
(キーボードの矢印キーではなく、マウスでベクターの点をドラッグして移動。)
図のように両端を等しく広げたい/狭めたい というような場合は、Round: Half PixelsかRound: Full Pixelsに 変更してからベクターの点を移動すると作業しやすくなります!
ところで、「このボタンなに?押してもなにも起こらないけど」と聞かれたことがありました。
これだけじゃ何ができるのかわからないですよね。。
機能をアイコンで表現することの限界を見せつけられる瞬間ですね。
Sketch WebサイトのPixel Precisionにはさらに詳しく記載されていますので、しっかり習得したい方は是非そちらを読んでみてください。
A:
1pxごと/0.5pxごとに点を動かせる設定欄がSketchにあります。
この機能、一見してなんだかわからず使っていない人が多いようです。
ここで描いたような複雑な図案のアイコンの微調整に使うと大変便利です。
Round: None
好きな位置へ移動できる自由度があるものの、X, Yの値が小数点第2位まである扱いにくい数値になるというデメリットもあります。
メガホンの両端を等しく広げたい/狭めたい、というような場合にそれだとかえって不便です。
Round: Half Pixels : ベクターの点を0. 5pxづつ移動させます。
Round: Full Pixels : ベクターの点を1pxづつの移動させます 。
0.5px / 1pxごとにぴたっ、 ぴたっと吸着するので扱いやすくなります。
ところで、「このボタンなに?押してもなにも起こらないけど」と聞かれたことがありました。
これだけじゃ何ができるのかわからないですよね。。
機能をアイコンで表現することの限界を見せつけられる瞬間ですね。
このボタンは、ベクターの点を複数選択したいときに押してください。
アウトライン化したあとで「メガホンの柄をもう少し伸ばしたい」なんていうときに使うと楽です。
マウスでドラッグして選択範囲を描くと、その範囲内のポイントがいっぺんに選択できます。
Sketch WebサイトのPixel Precisionにはさらに詳しく記載されていますので、しっかり習得したい方は是非そちらを読んでみてください。
余談: アイコンの世界を深堀りしたい方におすすめの書籍
私が一番好きなのは左の SIGN, ICON and PICTOGRAM です。
質の高い事例が多く掲載されているばかりか、歴史、記号学、制作方法など読み応えある充実の内容です。
コメント
コメントを投稿