エンジニアさんだって怖くない! Sketch3を使ってみよう②

 こんにちは!!!!!うおおっ!

 

期間が空きすぎて全然違う内容を書こうとしていた

デザイナーの吉田ことヨッシーです。

 

今回は「エンジニアさんだって怖くない! Sketch3を使ってみよう②」ということで、

テンプレートを使って実際にUIをつくってみましょう。

 

f:id:tech-inagora:20160104134046p:plain

 

ーーーー前回の記事はこちらーーーー

エンジニアさんだって怖くない! Sketch3を使ってみよう① - Inagora Tech. Blog

ーーーーーーーーーーーーーーーーー

 

今日の目標は、弊社アプリ

 

WONDERFULL

 

の「設定」画面です。

 

 

f:id:tech-inagora:20160220143316p:plain

 

 こんな感じ

 ではやっていきましょう!

 

 

 

①さてアートボードをおいたら、、

 

f:id:tech-inagora:20160104133136p:plain

 

 

②テンプレートを開きます。

 

File > New From Template  > iOS UI Design をクリック

 f:id:tech-inagora:20160220143748p:plain

 

 

 ばばーーーーーん

 

f:id:tech-inagora:20160104133616p:plain

 

とこんな感じにUIのパーツがはじめから入っています。

 

さらに、自分でテンプレートを作成して定義しておけば

いつでもパーツを引き出すこともできます。

 

やっべ 便利

 

また、テンプレートとして登録したパーツは

編集すると複製したパーツにもすべて

編集した内容が適用されちゃいます。

 

ではでは必要なパーツをコピーして

もとのアートボードに貼り付けましょう!!

 

 

f:id:tech-inagora:20160220144657p:plain

 

5秒くらいでリストが完成しました!(コピペだけだし)

 

右端の矢印も素材を探したり、制作したりする手間も省けて

とても便利です。

 

次回は配置したパーツを編集したり、

独自のパーツをテンプレート化してもっと便利にしていきましょう!

 

あでゅー!