佐賀でふらふり

佐賀をうろつくWebデザイナーのブログ

キッチンアイコン作ってる(2日目)
これ作ってみた

キッチンアイコン作ってる(2日目)


昨日に引き続きキッチンアイコン作ります。

まだ下書き段階だったので、今回からガシガシ描いていきます。

目次

  1. イラレでパスを描く
  2. 塗りで確認
  3. ちょっとずらす
  4. 動きをつける
  5. ミスに気づく…
  6. 線の太さを調整
  7. 今回できたところ

イラレでパスを描く

まずはIllustratorに下書きを読み込んでパスを描いていきます。
今回も前回のお天気アイコン同様、48x48pxを基本としてるんですが、細めのアイコンもあったりするので、その辺は横幅を16pxとか良い感じの数字にしています。
イラレでパスを描く - キッチンアイコン作ってる(2日目)

ナイフとかフォーク、スプーンは横幅16px。

さっさとナイフが出来上がり、続けてフォークを描いていきます。
フォークを描く - キッチンアイコン作ってる(2日目)

塗りで確認

フォークはそれなりに見えるんだけど、描いてみた後に「う~ん」って感じがしたので、一旦塗りで確認。
塗りで確認 - キッチンアイコン作ってる(2日目)

フォークの刃?の両脇が真ん中と同じ高さになってるのが気になるんですよね。
実物はどうか知りませんけど、角を1pxだけ落とすことにしました。
フォークの角を落とす - キッチンアイコン作ってる(2日目)

ちょっとずらす

つづけてスプーンを描きます。
スプーンを描く - キッチンアイコン作ってる(2日目)

単純にフォークの柄の部分に楕円を加えただけです。
これでもスプーンっぽいことはぽいんですが、両脇のアンカーポイントを数ピクセル下にずらしてみます。
ちょっとずらす - キッチンアイコン作ってる(2日目)

よりスプーンっぽくなった感じ。

動きをつける

更に続けて、今度はお箸を描きます。
お箸を描く - キッチンアイコン作ってる(2日目)

四角描いて、下の方の幅を寄せたものを2つ並べただけという、なんとも簡単な作り。
このままでもいいんですが、ちょっとさみしかったので動きをつけてみます。
動きをつける - キッチンアイコン作ってる(2日目)

実サイズが48x48pxなので、こういうのもありかなと。

ミスに気づく

調子に乗って、次は菜箸。
菜箸を描く - キッチンアイコン作ってる(2日目)

と、ここまで来てあることに気づきます。

線の太さが「0.5pt」になってる…

実際にパソコンの画面で見ると0.5なんてないわけですよ。
サイズも48x48pxになってるんですが、それは線の太さ0.5pxを上下にオーバーしてるので、実際は49pxになっているわけです。

線の太さを調整

線の太さを2pxと1pxで試してみましたが、モノが小さいので今回は1pxでいくことに。
実寸表示だと
線の太さを調整 - キッチンアイコン作ってる(2日目)

包丁以外は0.5ptの線なので細いです。
ってか、やっぱちっちゃい…

今回できたところ

その他の線も調整して、今回はここまで。
今回はここまで - キッチンアイコン作ってる(2日目)

途中、線の太さをミスってましたが、早めに気づいて良かったです。

ほぼ四角と丸で作ってるので、意外と多くできました。
完成をお楽しみに~

そいぎ~。


返信する

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

CAPTCHA