見出し画像

Web制作学習005 【興味が持てないアニメーションは子どもと一緒に】2021.05.01~

昨日の続き。
Web制作学習の6週目の記録です。

寄り道してgitを学び、
次はCSSアニメーションが課題でした。

もともと動きのあるWebページに興味が持てず、
どちらかというと見づらくなって邪魔だと感じていたので、

学習意欲がわきませんでした。

少し工夫して乗り切りました。

5歳児を楽しませるという課題にしてみた

画像1

動きのあるWebページに、
あまりよい印象をもっていませんでした。

デザインのかっこよさよりも、
ページのわかりやすさや使い勝手のよさに

価値を感じていました。

なのでアニメーションを学ぶことに
モチベーションがわきませんでした。

※もちろんアニメーションが
かわりやすさや使いやすさにつながるケースもあると思います。

そこで、

「5歳の息子を楽しませる」という形で、
視点を少しずらしてみました。

ちょうど息子が空手をはじめたばかりのころだったので、

以前作ったサンプルWebサイトに、
アニメーションを使ったページを追加しました。


技の画像にカーソルを合わせると、
画像が動いたり拡大したりする

という簡単なもの。

とりあえずアニメーションはこれでよしとしました。


動画を見ながらコードを書くのではなく、メモをとって、課題を考えながら

画像2

ドットインストールでCSSを学ぶとき、
はじめのうちは動画を見ながらコードを書いていました。

画面を2分割して、
左側で動画を再生して、右側でコードを書く。

スムーズに進むけど、
何も頭に残らない感じがしました。

途中でやり方を変えました。

手順はこんな感じ。

1.動画を見ながらポイントをメモする
2.動画を見て作られたWebページをメモする
3.動画をとじて、メモを見ながらWebページを再現する
4.動画を見て答え合わせ

こうすると、
聴き流して素通りしてしまったところがあれば、

つまずいて先に進めないので気づくことができました。


それでも興味が持てないところはとばす

画像3

興味が持てないところに、
課題を少しだけずらすことで興味を持たせる。

そうしてほんの少しはモチベーションが上がりました。

それでもやはり、
つまらないと感じてしまう部分はありました。

そんなときは潔くとばします。

その場でとばしても、
必要であればどこかでつまずくことになります。

そうなれば別の観点から興味を持つことになります。

そうなったときに学び直せばいいわけです。

興味を持てないまま学ぼうとしても、
あまり頭に入りません。

これはおもしろい。

そういう気持ちで取り組めるようになるまで、
ほうっておけばよいです。


まとめ

画像4

今日はWeb制作6週目を振り返りました。

動画学習はぼっーとしていても動画が進んでいくので、
一部すどおりしてしまう傾向にありました。

手順を変えることで、そのあたりを減らす工夫ができました。

また、
そもそも興味が持てないという問題もあり、

課題を少しずらすことで乗り越えることができました。

それでも無理な部分はあって、
そのあたりは放置しました。

必要があればいずれ戻ってくることになるので、
その方がよいかと思います。


おまけ

画像5

1日2時間という学習時間は、
たぶん同じような立場で学習している人にくらべて少ないと思います。

理由は2つあって、
一つは健康第一で考えていたから。

食事や睡眠を第一に考えていました。

もう一つは好奇心を保つため。

学習が進むのコツは、
いかに楽しむかだと思っています。

その際、
効率的に学ぶという視点はとても大切でした。

ぼくはこの本から学びました。
具体的で実践的な内容が書かれていて、すぐに役立ちました。

この記事が気に入ったらサポートをしてみませんか?