【Sketch初心者必見！#04】テンプレート活用で素早くUIデザイン

UIデザイン
2015.10.14
by Rina Nomura

Sketch UIデザイン初心者

こんにちは！アシスタントディレクターの野村です。

前回はSketchのプラグインツールをご紹介するとともに、UIデザインならSketch！の理由をお話ししました。
（前回の記事はこちらから→【Sketch初心者必見！#03】UIデザインならSketch！の理由）

今回は、多くの画面を作成する必要のあるUIデザインをSketchでスマートに、素早く作成できる理由と方法をお教えいたします！

スマートに作成できる理由は
【アートボードを並べて、全体を見ながらデザインできる】

スマートに作成できる方法は
【テンプレートを活用して、綺麗で素早くデザインできる】
です！

以下で詳しくご紹介いたしましょう！

アートボードを並べて、全体を見ながらデザイン

SketchはPhotoshopと違い、アートボードを複数並べて作成できることはお話ししましたのでお分かりかと思います。
アートボードを複数並べられる強みは、やはりUIデザインの際に活きてきます！

UIをデザインする際、PCスマホ関係なくサイトやアプリなどは多くの画面から成り立っているものがほとんどです。
なので、Photoshopのようにアートボードが１ファイル１つで、複数のファイル（アートボード）を１つのフォルダーなどで管理する・・・ということを行っている方が多いのではないでしょうか？

しかし、どれがどの画面ファイルか、新しいものか古いものか、複数の人とファイルを共有するのはとても大変です。
ファイル名を考えるのも一苦労ですよね・・・。

しかし、Sketchならアートボードを複数並べて作成でき、それを一つのファイルとして扱うことができるので、とっても楽です！

それに、サイトのデザイン全体を見ながら作成すれば、途中でデザインルールがブレることもなく、常に他のページを参照しながら作成できます。

たくさんのアートボードになってしまっても、前回ご紹介したプラグインツール「Sort Lauyers」を使用すれば並び替えることもできます！

また、ページごとにわけることもできますので、大量のアートボードの管理も楽にできますね！

「Sketch App Sources」のテンプレートを活用して、綺麗で素早くデザイン

今回は綺麗で素早くスマートにUIデザインを作成する方法として、この「Sketch App Sources」というポータルサイトをご紹介いたします！

「Sketch App Sources」とは、Sketch.app向けの素材ポータルサイトです。UIデザインはもちろん、作例などもあり種類が豊富です。
多くの方がUIデザインをアップしているので、様々な雰囲気のデザインを参考にデザインを考えることができます。
もちろん使用することもできます！
入りはスピードが命となってくるので、Sketch App Sources内のテンプレートを使用し、多くの案を考えてみましょう！
もしかしたら、自分がこれまでデザインしてこなかったようなデザインが思い浮かぶかもしれません！

素材は、PCだけでなくスマートフォンや様々なデバイスの素材がアップされています。
トップ画面だけやボタン、フォントだけの素材もアップされていますので様々な場面で使うことができます。