こんにちは、ふひっくすです。
Webデザインの独学での勉強方法なやみますよね。
そこで、いろんなサイトや書籍から勉強方法をまとめていこうと思います。
あくまで僕の備忘録的な記事になるとおもいますが、あしからず。。
Webデザインは何からはじめるか
まずはProgateで「HTML＆CSS」をまなびました。
Progateで一番最初にやったのはRubyだった気がします。
まずは、いわゆる「プログラミング拒絶反応」をとることから始めました。
基礎の部分が一番挫折しやすいんですが、
そこを０から丁寧に教えてくれるので大変ありがたいサービスです。
スクールはどうするか
プログラミングスクールの「TechAchademy」と「侍エンジニア塾」の無料体験。
あと、「CodeCamp」も受けてみました。
侍エンジニア塾の無料体験、結構気に入ったんです。
そこからProgateでプログラミングの学習をはじめました。
しかし、無料体験だけです。さすがに10万も20万もするのでお金がなく…。
分割払いも未成年は親の許諾がいるのでやめました。
手順はどうするか…？
いろいろググってみると、
「まずは書籍から」「Progateから」
「ウェブサイトをトレースする」「バナーを模写する」
などの情報が出てきました。
備忘録として参考になるサイトを上げておきます。
全体の流れ
Webデザインを独学で３ヶ月以内にモノにする７ステップ勉強法
ポイント
- 基礎を終えたら実践に移る。
- 勉強みたく完璧を求めない。
- とにかく手を動かす。「わからない部分（サイト完成などの目標）」のために勉強する（←勉強が「目的」にならないようにする）
冒頭の、自転車を例えたWebデザインの勉強の仕方が参考になりました。
いままでProgateで手を動かしたり、書籍をよんで少し見ないでコード打ったりもしてた。
でも、だんだん書籍が目標になってました。。
これからは書籍で勉強しつつ、実践的な内容をアウトプットしていきます。
大変参考になりました。
勉強法の方向性を見直す
Webデザイン初心者が独学で一気に上達する俺流勉強法
ポイント
- インプットしたらすぐにアウトプットする
- なにができるのかを知っておけば十分
インプットしたらすぐにアウトプットする癖（習慣）をつける。
そうすれば、インプットは有意義なものになるんですね、！！
考え方が参考になります。
具体的なデザインスキルアップの方法
https://isamuson.com/?p=1466
ポイント
- 【流れ】いいサイトを見る→模写する→評価を受ける
- 【手順】バナー模写→サイト模写
- やっぱり続けることが大事！
かなり具体的に書いてあります。
模写をする部分についても、
いきなり「全部」模写するのは非効率で挫折率も高くなるというのは納得できる。
模写してほしい箇所は大きく分けて4つです。
- ロゴ
- ヘッダー・メニュー付近
- メイン画像
- サイドバー
目的は模写するのでは無く良いデザインを盗む事です。
全部模写していたら何時間もかかってしまう場合もあるので1〜2時間と自分の中で制限時間を決めて、その時間内で収まる様に模写する箇所を考えていきます。
また、バナーから始めるとよさそうです。
Webサイトの模写から初めても問題はなさそうですが、
抵抗を減らすためにバナーからはじめてもいいね！
最初からサイトを模写するのは時間もかかるし難しいと思うで、最初はバナーなどから模写していきましょう！
バナーはデザインの細かい部分が良く分かるので初心者の人にはオススメです。僕も最初はバナーのトレースから始まったので1ヶ月ぐらいバナーの模写をしてからサイトの模写に移る方が良いと思います。
バナー制作の具体例
https://isamuson.com/?p=1648
ポイント
- 自分で考えてデザインを真似する
- 並べて模写→最後に重ねる（違いを目視）
- あまり深く考えない。質より量。
バナー制作するときの気をつけるべき点まで書いてありました！
その模写作品も公開されています。
これを参考にすすめていこう〜！！