SketchというUIデザインツールはご存知ですか?SketchはUI特化型のデザインツールとして、多くのプロダクト開発の現場で使われています。

Sketchは誰でも簡単に使いこなせるようになるということが特徴の1つですが、それでも全ての機能を使いこなせるようになるためにはある程度時間が必要になります。

今回は、Sketchの使い方を効率よく勉強するための方法をご紹介したいと思います。

Sketchとは

sketch
Sketchは、Webサイトやアプリ開発の画面設計などを行うためのUIデザインツールです。その使いやすさや機能の豊富さから、多くの企業で導入されており、様々なプロダクトの設計がSketchを使って行われています。

デザインツールと言えばPhotoshopやIllustratorを連想しがちですが、SketchはUIデザインに特化したデザインツールなので、より効率よくUIデザインを作成することができます。

Sketchのおすすめ勉強法

Sketchを使いこなせるようになるまでをステップ形式でまとめました。Sketchはとてもシンプルなツールですが、しっかりと使い方を覚えることで効率よくデザイン制作ができたり、より複雑なデザインを作れるようになります。すでにSketchを使ってデザイン制作を行われている方も、一度確認してみてはいかがでしょうか。

  1. 書籍で学ぶ
  2. チュートリアルを見て学ぶ
  3. プラグインの使い方を覚える
  4. UIキットやデザイン素材を使って学ぶ
  5. プロトタイプを作ってみる

1. 書籍で学ぶ

シンボルやスライスなど、始めてデザインツールを触るような人にはよく分からない機能も色々とあります。そんな時は、まずデザインツールの基本を学ぶという意味でも、1冊書籍を読んで勉強することをおすすめします。

Sketchは比較的新しいデザインツールなので、日本語で書かれた書籍はずっとありませんでしたが、2017年にようやく発売されました。この本を使ってSketchの使い方を学ぶことで、基本から応用までしっかりとした知識を身につけることができます。内容もとてもしっかりしているので、すでにSketchを使ってデザイン制作を行われている方も、改めて読んでみると新しい発見があるかもしれません。

2. チュートリアルを見て学ぶ


PhotoshopやIllutratorなど、Adobe製のデザインツールは使い方が難しかったり、複雑な機能があるため様々なチュートリアルが公開されています。Sketchはそれに比べると使い方も分かりやすいためチュートリアルを見て勉強するという文化があまりありませんが、基本的な機能や使い方をチュートリアルで効率よく学ぶことができます。

チュートリアルには基本的な使い方を説明するようなものから、難しいテクニックを紹介しているようなものもあります。ご自身のレベルに合わせてチュートリアルを選んでみてください。

3. プラグインの使い方を覚える


Sketchが優れたツールである理由の1つがプラグインの豊富さです。プラグインを使うことによって、作業効率が向上したり、面倒な作業を一瞬で終わらせることができたりします。プラグインは日々新しいものがリリースされているため、ぜひ最新のプラグインをインストールして、Sketchでのデザイン制作を効率よく行えるようにしておきましょう。

4. UIキットやデザイン素材を使って学ぶ

ある程度Sketchの使い方が分かってきたら、色々なUIキットやデザイン素材をダウンロードして触ってみることをおすすめします。プロのデザイナーの人たちが作ったSketchファイルを触ることで、それぞれのパーツがSketchのどんな機能を使って作られているのか、またレイヤーの名前の付け方やグルーピングの方法など、色々なことを学ぶことができます。

5. プロトタイプを作ってみる


デザインを作れるようになったら、次はプロトタイピングツールを使って作成したデザインを確認するための環境を整えましょう。プロトタイピングツールで有名なのはProttやinVisionなどがありますが、おすすめはinVisionです。Sketch上で画面遷移を設定し、inVisionの画面上に反映させることができるので、面倒な画面遷移をSketch上で設定してしまうことができます。海外のサービスなので表示は英語ですが、簡単な英語が読めれば特に難しい知識は必要ありません。普段Prottを使っているという方も、ぜひ一度inVisionを使ってプロトタイプを作ってみてください。

まとめ

Sketchは日々アップデートによって新しい機能が追加され続けており、今後も様々な機能が追加されていく予定です。もしかしたらWebサイトがSketchだけで作れるような時代も来るかもしれませんね。

Webサイトからアプリ制作、さらには資料制作など様々な場面でSketchが使われています。ぜひSketchの使い方を覚えて、デザイン制作に活かしてください。