Sketchの使い方・スキルが学べる動画チュートリアルまとめ

※ アフィリエイト広告を利用しています。
human-tv

こんにちは、デザイナー・ブロガーの
ゆっきー(@elcielo_design)です。

今回は、動画で学べるSketchの
チュートリアルをまとめた記事になります。

スポンサーリンク

Sketchのチュートリアルの前に

Sketchといえば、Web・IT業界では
今やスタンダードなWebやアプリの
UIデザインに特化しているツールです。

また、Adobe DXと同じくらい利用される
人気であるUIデザインツールでもあります。

使い方もシンプルなので、初心者の方でも
ある程度のUIデザインを作成できますが、
色んな機能やテクニックを使いこなせれば、
更にレベルの高いデザインを作成できたり、
効率よく制作に取り組めることでしょう。

そこで、この記事ではSketchの使い方が
動画を見て学べるチュートリアルの中から、
おすすめのものをまとめてみました。

Sketchのシンボルやライブラリ等を
まだ使いこなせない状態のような人は、
チュートリアルを参考にしてみましょう。

特に、次のような人は読んでみて下さい。

  • 動画で学べるSketchの
    チュートリアル
    が知りたい。
  • UI/UX系のデザインを学びたい。

  • UI/UXデザイナーを目指している。

なお、その他にもUIデザインツールは
多数あるので気になる方はこちらの記事を。

スポンサーリンク

Sketchの動画チュートリアルまとめ

「Sketchの動画チュートリアルの一覧」

Sketchで利用できる
優れた機能ベスト10

 タイトル  Sketch App Awesomeness
 -Top 10 Feature
 系統  優れた機能
 特徴 ・Sketchの優れたポイント10の紹介動画。
・少し動画時間は長め。
・Sketchを使い始めた人は見ておきたい内容
 その他  

Sketchを用いた
ランディングページのデザイン方法

 タイトル  Design a Website Landing Page in Sketch
 (Tutorial)
 系統  ランディングページ
 特徴 ・Sketchを使いWebのランディングページを
 デザインする方法が学べる。
・内容は簡単なものだが、基本テクニックが
 きちんと紹介されている。
 その他  

Sketchのシンボルを用いた
ボタンシステムの作成方法

 タイトル  Creating a Button System with Nested
 Symbols on Sketch App
 系統  ボタンシステム
 特徴 ・Sketchでのボタンデザインをシンボルを
 上手く使い効率よく作業できるようになる。
 その他  

Craftを用いた
プロトタイプの作成方法

 タイトル  Prototype in Sketch using Craft from 
 Invision
 系統  プロトタイプ
 特徴 ・Invisionが提供するプラグインである
 Craftを利用してプロトタイプを作成する
 方法が学べる。
 その他 プラグインを用いれば、実質Sketchのみで
 プロトタイプが作成可能。

プロデザイナーのように
シンボルを使いこなす方法

 タイトル  USE SKETCH SYMBOLS LIKE A PRO!!
 系統
 シンボル
 特徴 ・シンボルを用いてボタンデザインを
 柔軟に行うための方法が学べる。
 その他  

Sketchで作るグラフデザイン

 タイトル  Working with Graphs in UI Design・
 Sketchapp・Tutorial / Sketch 4 Tutorial
 系統
 グラフ
 特徴 ・Sketchを用いてグラフを表示するアプリの
 UIを作成する様子を学べる。
 その他  

Sketchで作成するアプリデザイン

 タイトル  Design Your Own App in Sketch (Tutorial)
 系統
 アプリ
 特徴 ・Sketchで作れるアプリデザインを学べる。
 その他  

フードアプリの
デザインチュートリアル

 タイトル  Food App UI・Sketchapp Tutorial /
 Sketch 4 Tutorial
 系統
 アプリ
 特徴 ・フードオーダリングアプリのUIデザイン
 制作を通してSketchの使い方が学べる。
 その他  

SketchとPrincipleを用いた
デザインとアニメーション

 タイトル  Book App Design – UI/UX Design and
 Animations Tutorial with Sketch & Principle
 系統
 アニメーション
 特徴 ・Principleというデザインツールと合わせて
 Sketchで作成したデザインに動きをつける
 方法が学べる。
 その他 ・近年はインタラクションデザインを
 Webやアプリデザインに取り入れるのが
 普通になってきているので押さえておきたい
 チュートリアルになります。

SketchでiPhoneX向けの
デザインを制作する方法

 タイトル  The first UI Design for the iPhone X
 in Sketch・Sketchapp Tutorial / Sketch  Tutorial
 系統
 iPhoneX向けデザイン
 特徴 ・画面サイズが広く画面上部に凹みがある
 iPhone X向けのデザインを作成するための
 方法が学べる。
 その他  

Sketchで作る
NIKEのWebデザイン

 タイトル  Sketching & Designing a Nike Web Design
 (Sketch 4 Tutorial)
 系統
 NIKE
 特徴 ・NIKEのWebデザインを通しSketchの
 使い方が学べる。
・手書きのラフ状態からデザインを作成する
 様子がわかるので操作方法が覚えやすい。
 その他  

NIKEのアプリデザインから学ぶ
Sketchの使い方

 タイトル  Nike App UI Design・Sketchapp Tutorial /
 Sketch 4 Tutorial
 系統
 NIKE
 特徴 ・基本的なアプリUIの使い方を学べる。
・シンプルな初心者向けチュートリアル
 その他  

Sketchを用いてFlexboxの
デザインを作成する方法

 タイトル  Flexbox for Sketch App: Stacks Auto
 Layout Plugin
 系統
 Flexbox
 特徴 ・Sketchでレスポンシブデザインに対応した
 Flexboxを用いたデザインを作成する方法を
 学べる動画。
 その他  

まとめ

以上がSketchの動画 (YouTube) で学べる
チュートリアルのまとめでした。

Adobe IllustratorやPhotoshopと比べて、
シンプルで直感的に使うことができるのが
Sketchというデザインツールになりますが、
作業効率を上げたり難しいデザイン制作には
ある程度の上級者テクニックが必要です。

Sketchの一通りの操作が理解してきたなら、
次はチュートリアルを見て参考にしながら、
スキルアップに是非挑戦してみてみましょう。

なお、その他のSketchの関連記事は、
こちらからチェックしてみて下さい。

スポンサーリンク

シェアする