UIデザインツールにAdobe XDというものがあることを最近知りました。
またFigmoという無料のUiツールもあるそうです。
sketchしか知らなかったので調べてみます。
XD
プロトタイプが簡単に作れるらしい。スマホでタッチなどのインタラクティブなことが自動で同期されてできる。
去年の10月にベータ版が終わり有料になった
Figma
ブラウザで使える。無料でも使える。
こちらの説明が詳しかったです。qiita.com
初期画面はこんな感じ。
左上のregion Toolsを押すと
右側のDesignに画面の大きさ一覧が出る。
あとは簡単にデザインできる。初見でもわかりやすい。英語だけど
もう一つ画面を追加して、Prototypeタブでページ遷移を設定できる。
設定したものは右上のPresentでクリック確認できる。
そしてこちらもXDと同様スマホと同期できる。
アプリを入れてログインして、パソコンで画面を選択したらすぐに反映される!
やばい!楽しい!
エクスポートはレイヤーごとに設定を行える。
設定したら右上のマークから一括でエクスポートもできる?
書き出したのがこれ。
CODEタブを押すとそのUIのコードが観れる。
ここら辺はよくわからないや・・・
そのほかにも複数人でGoogleSlideみたいに同時に作業できるのが強みらしい。
ここまで無料でできたのですごい!Sketchも無料期間終えてしまったし、XDも有料なのでこれはとても良い!
最後に
デザインとプログラミングどっちもかじっているのが私の強みなのに、最近全くデザインしてないよ!