Xdが公開されてから四半期がすぎましたね。今月になってPreview4というバージョンが公開されたので、触ってみました。Xdってなんぞ?という方はこちらの記事からどうぞ!Preview4でできるようになったことまずは今回のバージョンでできるようになったことを、ざっと見てみましょう。・背景のぼかしとオブジェクトのぼかし・プロトタイプの埋め込みタグ・日本語UIこれらが実装されました!早速、詳しく見ていきましょう。今回はこちらの画面を使って説明していきたいと思います。要素やらデザインやらは、この記事のために適当に作ったので深く考えないでください(笑)で、計測機能についてはオブジェクトにカーソルを合わせてalt/optionキーを押下すると周囲のオブジェクトとの距離を計測してくれるというものです。うまくキャプチャが取れなかったので、キャプチャなしになってしまったのですが、今までもオブジェクトを動かしているときに距離が出ていたので、あのような感じだと思えばわかりやすいかなと思います。便利な機能なのは間違いないのですが、僕のツールの使い方だとあまり利用頻度は高くないかも...という感じですかね。実装に近くなった段階で、位置関係を把握したりするのには非常に有効だと思います!背景のぼかしとオブジェクトのぼかし今回から追加された、背景のぼかし昨日はオブジェクトを選択したときの設定パネルから設定できます。画像はオブジェクト自体をぼかす方法。こんな感じに設定すると...選択したオブジェクトがぼけます。選択範囲の下を見るとわかりますが、オブジェクト内だけでボケるのではなく、オブジェクト全体がボケているので外側にぼけあしが出てしまっている状態です。これを解消するために、オブジェクトと同じ大きさのマスクを作ると、ぼけあしを消すことができます。このぼけあしが出るというのをきちんと認識しておかないと、モックアップを確認するときに違和感を感じるかもしれませんね。不要な時は消し忘れないように注意しましょう。次に、背景のぼかしです。背景のぼかしも、オブジェクト自体のぼかしと同様の箇所で設定できます。背景のぼかしというのは、選択したオブジェクトを透過させて、その背景をぼかすという状態になります。絵にするとこんな感じ。本来のレイアウトの上層に一つレイヤーを作って、そのレイヤーに背景のぼかし処理を入れてみました。オブジェクト自体がボケるわけではないのでぼけあしがはみ出たりすることはなく、複数の背景レイヤーにまたがってきれいにぼけていることが分かります。こんな風に使うことができます。モーダルウィンドウを開いた時の、操作面以外をぼけに変えたりできますね。この機能めっちゃいいね。IllustratorとかPhotoshopにもほしい。プロトタイプの埋め込みタグ今まで、URLの共有に留まっていたプロトタイプですが、Webページなどに埋め込んで表示できるようにタグが吐き出せるようになりました!これは便利ですね!日本語UIUIが日本語に対応したため、使いやすくなりました。リリース解説ビデオリリース解説ビデオも用意されているようです。詳しく知りたい方はこちらもどうぞ!個人的には、今回のリリースでの一番の目玉はぼかし機能かな?と思います。次点でプロトタイプの埋め込みコードかなぁ。大きな修正だという触れ込みでしたが、想像していたよりは小さな改善だったなという印象でした。今後のモック作りの主流になっていくのかもしれない。いう可能性を感じさせるものではあるので、ぜひ触って覚えていきたいですね。信長の野望・創造wpkと戦国立志伝はどちらを買うべきか?プロフィールデザインとコンテンツ作りLoveなUIデザイナー。好きな生き方・働き方を実現するためにデザインを使っていきたい。UIデザイナーとして事業会社で働きつつ、個人ではコンテンツ制作(このブログとか同人誌作り)をしています。ブログでは「やりたいときに、やりたいことを、やる。」を実現するための方法ややりたいことをやった結果を書いていきます。