note に Figma を埋め込んでみた

note が Figma の埋め込みに対応したという記事を拝見したので、さっそく試してみました。

noteが「GitHub」「Figma」「Twitch」などの埋め込みに対応

Figma Design File

ひとまず、Figma Design File を埋め込んでみました。
当然といえば当然なのですが、公開リンクが誰でも閲覧できるようになっていないと、うまくいきませんでした。
埋め込まれると ↓ の感じですが、左側、下側、右側の灰色部分は Figma の背景でサイズによっては左側しか表示されていないこともあるように見受けられました。
また、左上の黒字の ”Figma” という部分は自動的に挿入されるみたいです。
表示されるサイズは自動的に調整されるようで、小さなフレームのファイルで共有しても、大きなフレームで共有しても全体が表示されるように調整されているように見受けられました。

Figma Design - Prototype

次に、プロトタイプを埋め込んでみたところ、単純にファイルを埋め込んだ場合よりも大きく表示されることがわかりました。
サイズはなんか SVGA (800 × 600) とか VGA (640 × 480) じゃない感じがしてとっても気になったので確認したところ、619 × 402 ピクセルがぴったりハマるサイズのようです。
うーん、このサイズの理由を考えていると眠れなくなりそうな数字です 😅

ただ実は note 初投稿で機能を熟知していないので、すべての環境で同じなのか、あるいは何か設定があるのかはわかっていないのですが。。。

FigJam File

そして、今回 Miro も埋め込めるようになったようなので、Figma User にとってはとっても気になる FigJam についても確認したところ、しっかりと  FigJam も埋め込めることが確認できました。
ということで、「実は 2022/08/10 のアップデートで note に埋め込めるようになったのは 8 つではなく 9 つである！」と言えるのではないかと思います。

以上、試してみた結果の共有でした！