フラットアイコンの簡単な作り方 #016

フラットデザインのマナーでは，基本的にはその名の通り「平らなデザイン」を表現します．しかし平らなだけではデザインが単調になりがちです．単調さを嫌って，さりげない陰影をデザインに加えるのは非常によく採用される手法です．今回のチュートリルでは斜め45度の光源を想定した影をアイコンに加えたフラットデザインを作成します．

これを見ればすぐに！

デザインの幾何学

InkscapeではCtrlキーを使用することで，多くの機能を思い通りに制御することができます．このチュートリアルでも多くの機能とCtrlキーを組み合わせて使用していますが，中でもベジェツールとCtrlキーの組み合わせについて簡単に解説しましょう．

ベジェツールでは，Ctrlキーを押すことによって15°ごとに固定された線を引くことができます．0度， 15度， 30度， 45度， 60度， 75度， 90度という具合です．今回のチュートリアルでは45度の線を多用しています．

なぜ幾何学が重要？

45度の線がデザインを構成する基本的な直線として重要なのは，図形的に単純で明快であること以外にも理由があります．それは「ラスタライズに強い」ということです．ここに明快な説明を引用します．

45度の角度にアンチエイリアスを施すと均一な段になるので、輪郭がくっきりします。また、この角度の完璧に斜めな状態は認識されやすいパターンであり、人間が見た時にとても好まれるのです。
6つの簡単なステップで改善するアイコンデザイン | POSTD

Inkscapeでは15度ずつの斜め線を引くことができますが，それは根拠のない仕様ではありません．上記のブログでも15度ずつの角度の斜め線は推奨されています．イラストを描く際に，適当に線を引くのではなくその角度にまで注意を払うことは，いいデザインへの近道です．下記に引用するように，使用が推奨される斜め線の角度は次のようなものです．

45度の斜め線
15度単位の斜め線 (15度，30度，60度，75度)
45度の半分(= 22.5度) ，または更にその半分 (= 11.25度)

このルールを破らざるを得ない場合は、私は半分ずつの角度（22.5度、11.25度など）か、15度の倍数の角度にするようにしています。45度の半分ずつの角度を使うメリットは、アンチエイリアシングの段がやはりかなり滑らかになることです。
6つの簡単なステップで改善するアイコンデザイン | デザイン | POSTD