1.新規ファイルを作成する
ショートカットコマンド（comand+N）
Sketchを起動すると起動画面が出ます。画面左下の「New Document」を押すと新規ファイルが作成されます。メニューバーの「File」→「New」でも同じ操作をおこなえます。
テンプレートから作りたい時は「File」→「New From Template」を選ぶと、iOSやAndroid、マテリアルデザインなどさまざまな初期セットから作成を開始できます。
自分専用のテンプレートを登録したり、他で公開されているさまざまなテンプレートも登録することができるのでいろいろ試してみましょう。
2.ページを作成する
ショートカットコマンド（Shift+command+N）
新規で作成したファイルには、最初から最上位概念であるページが1つある状態でスタートします。ページを複数作成する場合は、PAGESメニューの「＋」アイコンをクリックすることで新規で追加でき、右クリックをすることで複製したり削除したリストことができます。
ページをクリックすることで、ページ名を変更することができますので管理する場合は適切な名称に変更することをおすすめします。
冒頭のセクションで解説した「New form template」のサンプルデータやテンプレートなどを参考にアートボードやレイヤーの管理規則を参考にするのもいいでしょう。
3.アートボードを作成する
ショートカットコマンド（A）
新規で作成したファイルのキャンバスにはアートボードは存在していないため、ツールバーの「Insert」→「Artboard」もしくは、「A」を押した後キャンバス上でドラッグすることで任意のサイズのアートボードが作成できます。
Step1 - メニューからのアートボード作成
ツールバーの「Insert」→「Artboard」を順にクリックします。
Step2 - ショートカットコマンドからのアートボード作成
画面右側のインスペクタのエリアでアートボードの種類が表示されるので任意のデバイス名を選択するか、「A」を押した後にキャンバス上でカーソルをドラッグします。
Step3 - アートボードプリセットの編集
Sketchのアートボードは、さまざまなプリセットが用意されていますが、アートボードプリセットメニュー右下の「Create Custom Size...」ボタンから自分の好みのサイズを登録することもできます。
4.シェイプを作成する
ショートカットキー（R/O/U/L）
シェイプはツールバーの「Insert」+「Shape」で、それぞれの名称に応じたシェイプを作成できます。またキーボードショートカットからすばやく取り出すことができます。
- Rectangle(矩形)：「R」
- Oval(円形)：「O」
- Rounded（角丸）：「U」
- Line(線)：「L」
Star(星形)、Polygon(多角形)、Triangle(三角形)のシェイプはショートカットキーの割り当てはありませんが便利なシェイプです。
Rounded(角丸の矩形)は、画面右側のインスペクタエリアにあるRudius（半径）の値を調整することで角丸コーナーの度合いを操作できます。応用としてStar(星形)やPolygon(多角形)はPoint（点）の値を調整することで多様な図形を作成することができます。
Lline（線）やアロー（矢印）の場合はこれらの値は操作できませんが、Bordersの値の調整で先の太さやArrowの先端のデザインをいくつかのパターンで変更することもできます。
Step1 - メニューからのシェイプ作成
ツールバーの「Insert」から、挿入したいシェイプの種類を選択、もしくは形に応じたキーボードショトカットを押してからキャンバス上でドラッグします。
Step2 - シェイプ拡縮の比率固定
ドラッグするとシェイプが作成されます。この時「Shit」を押しながらドラッグすると辺の比率が等しいシェイプが、「option」を押しながらドラッグすると力ーソルを中心とした任意のサイズでシェイプが作成できます。
※「shift」と「opton」は併用可能。線と矢印の作成時は機能しません。
画面右側のインスペクタエリアにはサイズの指定が表示されており、縦横の入力箇所に比率を固定か非固定かを選択できるロックアイコンがあるのでシェイプオブジェクトのステータスを管理しておきましょう。
Step3 - インスペクタエリアでのシェイプに対応する値の操作
インスペクタエリアでのシェイプに対応する値の操作で、さまざまな表現ができます。座標やサイズ、塗り色や線の有りなしの選択など。詳しくは後のレッスンで解説します。
5.テキストを作成する
ショートカットキー（T）
テキスト(Text)は、ツールバーの「Insert」→「Text」から作成、もしくはキャンバス上でクリックすれば座標応じたポイントテキストが作成できます。ドラッグして範囲を作成すればエリアテキストが作成され、ドラック範囲に応じたテキストの折返し設定が反映されます。テキスト入力はキャンバス上をクリックするか、「Shift＋Enter」もしくは「esc」を押すことで入力が完了します。
Step1 - インラインテキストとボックステキスト
ツールバーの「Insert」→「Text」か、キーボードショートカットを選ぶとマウスカーソルがテキスト入力用に変化します。
キャンバス上でクリックするとポイントテキストになり改行せずに文字入力されます。ドラッグして範囲を作成すればエリアテキストが作成され、ドラック範囲に応じたテキストの折返し設定が反映されます。
Step2 - インスペクタエリアでのシェイプに対応する値の操作
シェイプと同じくインスペクタエリアでのテキストに対応する値の操作で、さまざまな値が調整できます。テキストカラー、フォントサイズ、フォントの種類、効果などです。さらに詳しい操作はまたあとのレッスンで解説いたします。
シェイプやテキストのオブジェクトは基本的に、新規作成時にアートボードを選択していない限り最上の位置に生成されます。Sketchでは、オブジェクトを作成するたびにカーソルが初期状態に戻りますので、PhotoshopやIllustratorのようにオプジェクトを連続で作成したり複製する場合は、「command+D」の反復操作を使うことで効率的に図形を作成することができます。
シェイプやテキストをはじめとしたオブジェクト全般は、画面右側のインスペクタエリアで、座標やサイズの調整の他に、Transform（角度）や反転などさまざまな操作が行なえます。
これらをうまく活用してUIデザインを進めていきましょう。オブジェト操作や詳しい取り扱いは次の記事で紹介します。
