タダケンのEnjoy Tech

楽しみながらラクに成果を上げる仕組みを考える

「UIデザイナーのためSketch 入門&実践ガイド 改定第2版」で学ぶUIトレース

f:id:tadaken3:20181123190330p:plain こんにちは!
タダケン(@tadaken3)です。

11/16に、「UIデザイナーのためSketch 入門&実践ガイド 改定第2版」が発売されました。

もともと第1版をもっていたのですが、今回の改定第2版では、「UIトレース」についての章がまるっと追加されたため気になったので購入しました。

UIデザイナーのためのSketch入門&実践ガイド 改訂第2版

UIデザイナーのためのSketch入門&実践ガイド 改訂第2版

UIトレースとは?

UIトレースとは、すでに世に出ているWEBサービスやアプリケーションを模写することで、プロダクトに使われている色やフォントサイズ、余白などについて学ぶトレーニング手法です。

UIトレースは手軽に始められるのですが、単に画面の要素をなぞるだけだと表面上の仕様を学ぶだけにとどまってしまいます。本書ではさらに一歩踏み込んで、具体的な学習方法が書かれています。これだけでも買ってよかったなと思います。

また、UIトレースをはじめる上で、疑問に思う「縦にスクロールするスマホアプリの場合に、スクリーションショットの画像をどのように準備するのか?」「どの部分からトレースしていけばいいのか」といったことに丁寧に解説されていて、すんなりとUIトレースに取り組み始めれるようになっています。1

f:id:tadaken3:20181123185253p:plainf:id:tadaken3:20181123185254p:plain
UIトレースについて丁寧に解説

UIデザインもプログラミングと同じ、本を読んだり、勉強会に参加してインプットするだけでは、身につかず、自分で手を動かすことが大事だと思います。なので、この本を参考にできる限りUIトレースを実施していきたいと思います。

SKetch愛にあふれる「デザイナー座談会」

また、「改定第2版」には、「デザイナー座談会」という章も新たに追加されています。

DeNAやYahoo、メルカリ、Amazonといった名だたるIT企業のデザイナーが集まって、社内でのSketchを使われ方などが、結構具体的に書かれています。そして、みなさんSketchがお好きなんですね。Sketch愛がビンビン伝わってきました。

デザイナー座談会の内容は「試し読み」としてnoteで公開されているので、気になった方はぜひ読んでみてください。

note.mu

まとめ

今までSketchの基本機能を覚えるために、このブログのアイキャッチ画像を作ったりしていたのですが、今後はデザイン力を鍛えるためにUIトレースを頑張っていきたいと思います。

UIデザイナーのためのSketch入門&実践ガイド 改訂第2版

UIデザイナーのためのSketch入門&実践ガイド 改訂第2版


  1. 文字が読めないよう本のキャプチャ画像の解像度はあえて落としています。