学習沼の如月が、新しく見付けて1年くらい前からやってみたかったこと。
エンドレスの画像スクロール。
取り敢えずはインライン(直線)で試したくて、素材を集めながら作ってみた画面が下の動画。
HTMLとCSSだけで再現できるという感動。←JavaScriptが上手く実装できず、苦戦することなく済んじゃうのが堪りません(ぁ
が、如月には少し知識が足りず、ダックスフンドちゃんは透過GIFアニメーションを使用。
トポトポと歩いているように見せたかった…
スクリーンショットしたんで画質よくないし、カーソル出現しちゃうんですけど、可愛すぎません?
音が出ます。再生される際は注意が必要です
如月作のショボショボ動画ですが、素材の愛らしさは抜群です!
背景 シルエット画像
GIF動画 歩くダックスフンド
音楽 yuhei komatsu氏『ハネル』
※如月が作成した動画はPremiere Proでリミックス機能を使ったので、そのままの音源ではありませんが、とても愛らしい音ですよね!
紹介した以上のサイト素材で作っています。
使用したツールはVisual Studio Code、Adobe Illustrator、Photoshop、Premiere Proです。
コーディング、楽しい♪
学習沼な如月ですが、沼ってる人間だからこそ思うこと。
日々、学習できるのは『作りたいもの』があるからです。
挫折しそうな人、行き詰まってる人は、『作りたいもの』をまず見付けてください。
パーツだけでもいいし、ペライチ(紙や画面1つ分程度)でもいいし…
そういうものがあると続けやすい(続きやすい)です。
最初はモノマネだっていい。
テレビ番組の中に出てきたアイコンとか、ボタン。YouTube、TikTokとかのパーツのモノマネとか。
実績にできなくても学習に使う分にはモノマネするのは「悪」じゃないです。