記事より動画で見たい方はこちらから！（チャプター付きリンク有）
【動画のChapter】
00:48 今回のお題～タイトル
01:32 実際にFigmaを操作しながら解説
01:58 「Figma Sites」でスライダーをつくるには
04:50 横幅いっぱいのスライダーにするには
05:10 スライダーの方向や速度の設定
05:28 スライダーの個々の要素にリンクを張るには
06:08 「カード型UI」が並ぶスライダーをつくるには
07:37 今回のまとめ
09:55 「Figma Sites」が使用できるプランについて
こんにちは。上武 ハヤです！今回は、「デザインデータ」だけで
スライダーをつくるお話だよ。
みなさんこんにちは～！！
どーもどーもどーもっ！私は「上武 ハヤ（うぇぶ はや）」といいます！
最近、動画配信を始めたVの者(Vtuber)ですよ！
tedateさんのCSS解説動画（近日公開予定）を制作したご縁で、
こちらにも投稿させてもらうことになりました！（これ言うの3回目）
今日もよろしくおねがいしますっ！
さて、前回の内容にひきつづき。
今回も、空前絶後！の神ツール「Figma Sites」についてのお話です！
デザインデータだけで、スライダー、実装しちゃうよって話。
そう、Figma Sitesならね。
今回はですね…、「スライダー（カルーセル）のつくり方」について、やってみました！
「Figma Sites」を使えば、
「Webサイトにスライダーを実装すること」についても
なんと…
「デザインデータを用意するだけ」で、ほんとうに「スライダー」、
できちゃうんですよ！
これね…今回も動画の中で、実際に手を動かしてご紹介してるんだけど…もうね。
ほんとうにね。
- ・(1). 画像をFigmaのデザイン上に並べてあげて、
- ・(2). オートレイアウトを適用して
- ・(3). インタラクションの設定をするだけ！！！！！
たったこれだけの、わずか数ステップで！！
できちゃうんだから！！スライダーがっ！！！
アメージング。amazing フィグマちゃん、ってわけです。
この前もその前も、毎回言ってますが「Figma Sites」、
「ゲームチェンジャー」になりえます。
おそらく、
Webデザイン、Web制作のワークフロー、変わってくると思います。（これ言うの3回目！）
デザインデータだけで、スライダーを実際につくってみて…
「Figma Sites」の圧倒的な実力、再実感しました。
もうね、アルティメットシーイング。カーズ様も真っ青の強さってわけ。
…ということで、今回も、実際に私自身がFigma Sitesで、
スライダーをつくってみた様子を動画として配信してますので、ぜひぜひ！ご覧ください～！！
【実践動画】【Figma Sites】スライダーも実装できます！全Webデザイナー必見の超機能！【デザインデータだけで！Webサイトにスライダーを実装する方法！】
【動画のChapter】
00:48 今回のお題～タイトル
01:32 実際にFigmaを操作しながら解説
01:58 「Figma Sites」でスライダーをつくるには
04:50 横幅いっぱいのスライダーにするには
05:10 スライダーの方向や速度の設定
05:28 スライダーの個々の要素にリンクを張るには
06:08 「カード型UI」が並ぶスライダーをつくるには
07:37 今回のまとめ
09:55 「Figma Sites」が使用できるプランについて
みなさんぜひぜひ、チャンネル登録お待ちしてますっ！！！
上武 ハヤでした～！またねーーー🌟🌟🌟！！
（※この記事は内容の品質向上を目的に、随時更新を行う場合があります。）
※記事内の動画は個人配信者によって制作されたものです。
Figmaロゴは、Figma商標ガイドラインに基づいて使用されています。
※Figma および Figma Sites は、Figma, Inc. の商標です。
※文中に登場する名詞・名称・商標等はそれぞれの権利を有する権利者に帰属します。