こんにちは、ほないです。以外のものも含めて初めてなので、わくわくしています。日目のあたらんさんの記事、おもしろかったです。私も質問箱をつくりたくなりました。今回はフロントエンドのアニメーションの話です。デザインに興味がある人におすすめの内容です。最後まで読んでいただけるとうれしいです。アプリで使われるインジケーター、みなさんも見たことがあると思います。データを取得しているときに表示して、ユーザーに「今がんばってるのでちょっと待ってね」ということを伝えるためのものですね。ある日、あるサイトでこのインジケーターが表示されたまま進まなくなったとき、ふと「このくるくるってどんなを動きしているんだろう」と思ったのです。見つめてもよくわかりませんよね...。ソースコードを読んで、アニメーションを調べてみることにしました。ソースを見ても良かったのですが、Web版に丸いインジケーターがありませんでした。別々のアニメーションが設定されています。アニメーションをかけたものです。アニメーションをかけたものです。わかりにくいので、さらに分解して、遅くしてみましょう。目でその円を時計回りに消していくようになっています。本来は輪郭を破線にしてその間隔や位置を調節するプロパティですが、ここでは円を途中まで描くために使われています。開発者ツールから引用)。以上が丸いプログレスインジケーターのアニメーションにです。シンプルで気持ち良い動きですが、これを頭の中で思いついてコードにおこすのは難しそうです。進捗を表す要素として、丸いインジケーターのほかに四角いバー型のインジケーターも提供されています。いわゆるプログレスバーです。いう状態も定義されています。