2020年2月（XD27）のアップデートで追加されたAdobeXDの多角形ツールでハートも作れるようにもなっていたのをご存知でしたか？
AdobeXDはアップデートの頻度が高いのでどんどん使いやすくなっているんですが、ちょっと別のツールを使っていたりして、チェックを怠っていると、いつの間にそんな機能ついてたんや・・・ということも。アプデが入ったら、ひととおり何が変わったか新機能情報に目を通す習慣をつけないとですね。（反省）
アプデごとに新機能はチェックしましょう
【Adobe XD】小ネタ：多角形ツールでハートをつくる
ハートの作り方
というわけで、多機能ツールを使ってハートを作っている様子を動画で撮ってみました。
作り方は、多角形ツールで三角形を作って、アビアランスの欄にある六角形マークの数値欄に「<3」を入れると、ハートのシェイプに置換されます。
海外では、「<3」がハートの意味で使われるから、この組み合わせなんですね。
自動アニメーションで動かしてみる
これだけだと芸がないので、最近追加されたAdobeXDに追加された自動アニメーションの機能を使って、ボタンアニメーションを作ってみました。
これでボタンの動きなども表現できるようになりました。
ただ、プレゼン段階でXDの作り込みにこだわりすぎると、実装に入るまでの期間が長引きそうな気が・・・。部分的に提案するのに使うといいのかな。
それと、ちょっと残念なのは、アニメーションgifやapngのような、すぐ使える形式で書き出せないこと。これをコーディングで同じ動きを再現して作らないといけないのかと思うと、コーダーの作業量が増えるだけなので、もうちょっとどうにか簡単にできるようにしてもらいたい・・・。このあたりが実装される前に、プロトタイプからそのままサイトが書き出せるような機能がついたりしそうですが。
デザインパーツのモジュール化ももっと進んでくれるといいなと思う今日このごろなのでした。
最後まで読んでくださってありがとうございました。