こんにちは！静岡県浜松市でWEBデザイナーをしています小瀧です。
ProgateでHTMLやCSS、JavaScriptの基礎を学んだけど、「次に何をすればいいの？」と感じていませんか？
Webデザイナーとして仕事をしていくには、Progateの学習だけではまだ不十分。ここからが本当のスタートです！
今回は、Progate終了後にやるべきステップを5つにまとめ、それぞれのやる理由・注意点も合わせて丁寧に解説していきます。
1. ポートフォリオサイトを自作する
自分のWebサイトを1から作ることで、Progateで学んだ知識を実践に落とし込めます。
- プロフィール、制作実績、連絡先を掲載
- レスポンシブ対応に挑戦する
- デザインにもこだわってみる
気をつけたいポイント： 最初から完璧を目指さず、とにかく1回作り切ること。ブラウザの検証ツールを使って崩れを直す練習にもなります。
2. デザインツール（Figma・XD）を使う
Webデザイナーを目指すなら、コーディングだけでなくデザインも理解しておくことが大切です。
- 有名サイトの模写をFigmaでしてみる
- 自分でバナーやLPの構成を考えてみる
- 配色・フォント・余白バランスに注目
気をつけたいポイント： デザインは「見た目の美しさ」だけではなく「情報の伝えやすさ」が大切。読みやすさや目的に合った構成を意識しましょう。
3. JavaScriptでインタラクションをつける
Progateで基礎を学んだJavaScriptを使って、Webサイトにちょっとした動きを加えてみましょう。
- ハンバーガーメニュー
- スライドショー・画像ギャラリー
- スクロールで出てくるアニメーション
気をつけたいポイント： 最初から複雑なコードを書こうとせず、1つの機能をじっくり理解してから応用へと進めると良いです。
4. WordPressに挑戦してみる
日本のWeb制作現場では、WordPressを使う案件が非常に多いため、避けては通れません。
- ローカル環境でWordPressを動かしてみる
- テンプレートの構成を理解する
- カスタム投稿や固定ページなど実践的な設定を試す
気をつけたいポイント： PHPの知識が少し必要になるので、つまずいたときは調べながら少しずつ進めるのがコツです。
5. 模擬案件 or クラウドソーシングに挑戦する
ある程度スキルがついてきたら、実践で試してみるのが成長の近道です。
- 家族や友人の店舗サイトを無料で作ってあげる
- ココナラやクラウドワークスで簡単な案件を探す
- 模擬案件練習サイトで腕試しする
気をつけたいポイント： 最初から完璧な成果を出そうとせず、「学ぶためにやる」ことを意識してチャレンジしましょう。
まとめ
Progateで基礎を学び終えたら、それを活かして「作って・見せて・改善する」流れに入っていくことが大切です。
- ポートフォリオを作る
- デザインツールに触れる
- JavaScriptで動きをつける
- WordPressを学ぶ
- 案件にチャレンジする
どれも一気にやる必要はありません。一歩ずつ、自分のペースで進んでいけば大丈夫です！
Webデザイナーへの道を、あなたらしく楽しみながら歩んでいきましょう！
satokotadesignキャンペーン実施中！
