つい最近、Pablo StanleyさんがデザインしたアバターのSketchライブラリが出ました。
Pablo StanleyさんはCarbon Health(ヘルスケアアプリ)の共同創設者で、デザインのワークショップをしたり、SketchやPhotoshopなどのチュートリアル動画をYouTubeにあげているデザイナーです。
Website / YouTube / Twitter
YouTubeでは英語でPodcastはスペイン語で色々デザインについて発信しているので、英語・スペイン語がわかる人でデザインに興味がある人は要チェックです。
では早速、Avataaarsを使っていきましょう〜
Avataaarsの使い方
使うまでの手順を写真付きで紹介していきます。
あっという間に終わりますww
YouTubeの説明欄に
Use it freely for your personal or commercial projects.
「個人・商用に自由に使っていいよ」とあるので、気にせず自由に使えるみたいです。
まず、Avataaarsをダウンロード
こちら→Avataaars
「Get the library」をクリックすると Dropboxのページに飛びます。
右上の「ダウンロード」をクリック
ダウンロードに以下のライブラリがあるのでダブルクリックで開いてください
開くとたくさんのアバターが出迎えてくれます
左側にあるHow to useのページに英語で使い方が書いてあります。
まず、環境設定「Preference」にいきます。
「Libraries」をクリックします。
「Add Library」をクリックします。
ダウンロードにある「AvatatLibrary.sketch」を選びます。
以上でライブラリの追加完了です。
実際にAvataaarsを使ってみる
「Insert」→「Symbols」→「Avataaar」にいきます。
「Circle」は円の背景有りで、「Default」は円の背景無しです。
どちらかを選んで、アートボードにカーソルを持っていくとカーソルのところに薄くアバターが表示されます。
クリックすると、その場所にアバターが表示されます。
（別に新しくアートボードを用意しました）
右の「Overrides」から髪型、髪色、メガネ、肌の色、目、口、服、など色々変更できます。
こんな感じ
(ちょっと長いですが・・・)
なかなか面白いです
色々なパターンがあるので、遊んでみてください。
ちょっとおまけ : Avataaarsのカスタマイズ方法
最初にダウンロードしたライブラリのファイルを開いてSymbolのページから自分の好きなようにカスタマイズできます。
＊元のデザインをそのままいじらずに、複製してカスタマイズしましょう。
服を「Graphic Shirt」を選ぶとTシャツのロゴ(Graphic)を変更できるみたいだったので、「こんにちは！」Graphicを試しに追加してみました。
ClothingのYour textをCommand + dで複製
テキストを「こんにちは！」にして終わりですww
Command + sで保存して、反映されているか確認のために新しくアバターを作ります。
服のところで、Graphic Shirtを選びます。
Graphicがみにくいので、色を変えます。
先ほど作ったSymbolが追加されているので、それを選びます。
こんな感じになりました
髪の毛と被ってますが、、、ww
こんな感じでちょろっといじることができますので、自分の好みのアバターにカスタマイズしてみてください。
＊Symbolをそのまま編集すると、その時に使っているSymbolが変わるので複製して編集することをおすすめします。
以上、Pablo Stanleyさんがデザインしたアバターのライブラリ【Avataaars】の紹介でした〜
やっぱり I love Sketch.
I love Sketch too!!という方はこちら
では〜