2021年4月15日からシーライクスに「Webデザイン入門コース」ができました。
以前はWebデザインコースに含まれていた内容ですが、より基礎知識を厚くしたコースという感じですね。旧WebデザインコースのDay2までの内容をもっと細かく載せているので、とても分かりやすくなりました。
Webデザイン入門コース・Webデザインコースはどんな内容なのか、内容や感想をお伝えします!
シーライクス Webデザイン入門コースの概要
Webデザイン入門コースはDay5まであり、Day2まではWebデザイナーやデザインについての基礎知識、Day3からはPhotoshopの基本機能を学んだり、バナー制作を行ったり、HTML/CSSの書き方のさわりを学んでいくなど、Webデザイナーになるためのはじめの一歩が載っています。

サイト制作まではいかなくても、バナー制作とかでちょいちょい小銭を稼ぎたい方ならWebデザイン入門コースだけでもよいかも?


Webデザイン入門ということで、予備知識から学ぶことができます。例えば…
- どういう流れでWeb制作が進められるのか
- Web制作に関してどんな人が関わるのか
- Webデザインをするためにはどんなところで働くのか など
Web制作の流れ(ワイヤーフレーム⇒カンプ⇒コーディング⇒公開)は独学だと結構ワイヤーフレーム作らずにやったりして偏ることが多い気がするので、改めて流れが学べるのは良いなと思います。
Webデザイン入門コースDay1は、Webデザイナーについて解説
Webデザイナーの必要なスキルや働き方などの解説があります。フリーランスと会社に勤めるWebデザイナーでは仕事で関わる人が違うことがあるので(フリーランスの場合は、一人でディレクションやデザインなど全部やることが多いけど、会社員の場合は分担になる)その辺の違いを理解しておくとよいと思いました。
また、制作の仕事をするなら押さえておきたい著作権についての内容も触れられています。
Webデザイン入門コースDay2は、デザインの基本を解説


Day2では、デザインの基本となる配色やレイアウト、タイポグラフィなどを学ぶことができます。
デザインの基本は、まとめる・揃える・くりかえす・メリハリをつける
これはわかりやすい&名言だと思います。



配色は、合わせ方でセンスの良し悪しが決まるし、イメージもすごく変わるから重要だよねー。レイアウトも「なんかバランスが悪い」って感じるレイアウトはなぜバランスが悪いのかを解説しているので、Day2はデザイン初心者は必須!ですね。
Webデザイン入門コースDay3からは実践形式


Day3からは実践形式!Photoshopや配布される素材を使ってバナーやHTML/CSSに触れていきます。軽く触れる程度なので、ここで絶望感は多分感じないはず!!!
特にデザインを始めていく流れやちょっとしたコツに関する内容は、分かりやすいです。基礎中の基礎ですが、「ああ、こういうやりかたもあるんだね」と参考になりました。身に付くまでは何度も資料を見直してもよいでしょう。
まずは参考になるものを探す!0から生み出すのは難しい!
Webデザイン入門コースDay4は、バナー作成の課題あり
Day4でバナー作成の課題がありますが、困ったときはシーメイトさんの提出課題も見ることができますので、ピンタレストやそれらを見ながらインスピレーションを受けつつ作るのがよいのではないでしょうか!
色々なバナーをトレースしてデザインスキルを磨く「バナートレース」についても触れられています。バナートレースは今後も時間があるときにちょこちょこやっていきたい練習なので、ぜひDay4 内容はじっくり学んでみてください。
Webデザイン入門コースDay5は、いよいよコーディング


Day5では、いよいよHTMLやCSSのコーディングをテキストエディタを使って学んでいきます。



得意と苦手がはっきり出るコーディング。ここで躓くとWebデザイナーへの道は相当厳しいようなので、何度も実践したほうがよい!と思います。最低限読めるのは必須条件!ちなみにわたしはコーディング苦手です!!!
ちなみに旧コースでは、HTMLやCSSの内容はなく、その辺はProgateというプログラミング学習サイトをやってコーディングの練習をしてから本編に入るという流れでした。今回はProgateについては触れられていないようでしたが、知識の定着を兼ねて初級だけでもやっておいたほうがよいのかな?と思います。
シーライクス Webデザイン入門コースまとめ


分かりやすくてよいコースだと思いました!
Webデザインの工程は長いので、基礎知識を入門で区切ることは構成上大きな意味があると思います。
デザインの基礎がしっかり詰まっているので、資料や動画を見直して基礎力を高めていきましょう!わたしも定期的に資料を見直したいです。
Webデザインコース


さて、Webデザインコースです!
ここからは架空のサイトを作るという内容で、サイト作成を学んでいきます。
Day1は、Webサイトを作るまでの準備について解説


Day1は、Webサイトを作るまでの準備について解説があります。
どんなサイトを作りたいのか(要件定義)をまとめることと、サイトの設計図であるワイヤーフレームの作り方を紹介しています。ワイヤーフレームは設計図みたいなやつで、作るのは難しくないのでほっとしました!



わいやーふれーむ…はじめてきいた!
ツールでも手描きでもワイヤーフレームは作れるのですが、手描きの方が気楽かな~。
Day2は、デザインカンプの作り方に関して解説
デザインカンプとは、実際に作るデザインの見本のことです。
できるだけ具体的に決めることで、どんな印象を与えたいのか、フォントや写真の雰囲気などを共有していきます。
かなりボリュームのある内容なので、進めるのが結構大変です。ゆっくり時間をとってやっていきましょう!
Day3は、鬼門のコーディングに関して解説
Day3はコーディングを行っていきます。
Day4は、レスポンシブなどより高難易度の内容
今の世の中には必須のスマホ対応(レスポンシブ対応)これをやらないサイトは検索順位がめっちゃ下がるので、最重要な内容です。サーバーアップまでの内容を載せています。こちらも結構なボリュームなので、ゆっくりと時間をかけてやっていきましょう!
Day5は、卒業制作


卒業制作は今まで学んだことを使ってオリジナルのサイトを制作します。卒業制作の提出物は、
- 要件定義シート
- ワイヤーフレーム
- デザインカンプ(PCのみでOK)
- コーディングデータ(html/css/js/画像などコーディングした際に使ったデータ全て)
- URL(サーバーにアップした方のみ)
Webデザインコースで学んだ内容を全て込みで提出!!!というハードルの高いものです(´・ω・`)
課題の合格点は80点以上なので、何度も復習しながらやりましょう!



わたしは、ヨガスタジオのサイトを作りました。デザインだけさくっとご紹介!


Webデザインコースをやってみて
一番人気のWebデザインコースですが、Webデザイン入門コースから始めて、Webデザインコース終了までかなりのボリュームがあります。
流れは一通り分かりましたが、やはりコーディングが一番大変だし、好き嫌いがはっきり分かれます。
ブログを作る関係でWordPressをいじっていたこともありなんとかコーディングはできたけど、仕事で毎回がっつりコーディングをするのはつらいなぁと感じたのも確かです。



やはりペライチとかStudioなどノーコードのデザインでWebデザインをやりたいなぁ ・・・。
でもこんな感じでコーディングやデザインもっと勉強したい!って方もいるので、向いている人にはめっちゃ向いていると思います。
でもHTML+CSSで全部作り上げたらかなりの達成感が!!!
シーライクス云々の話ではないのですが、今の自分に「時間をかけてサイトを作れる時間があるかないか」も大切なポイントかなと思いました。
シーライクスでWebデザインコースを受けているシーメイトさんの声
心折れかけながらもクリアした方、どんどん次に進んでいる方、みなさん色々ですが、共通して言えることは、「ワクワクしながら学んでいるな」って感じがします^^
Webデザインコースまとめ


ボリュームたっぷりの内容で、サイト作成からアップまでの流れがよくわかる内容でした。
ただ、そのボリュームゆえに、時間をしっかりとって勉強する必要あり!
特に仕事にするには 入門コースの終わりでも書きましたが、Progate でHTML&CSSはしっかり練習しておいてもよいなと思いました。やっぱいきなりコーディングをやりだすのは理解するのが大変です…。
「サイト作りの練習する機会」はなかなかないので、まずは自分のサイト、友達や知り合いのお店のサイトを作るとか実際に仕事を取ってきて練習もかねて本番をするのがよさそうな気がします。
コースを終えても練習あるのみ!頑張りたいと思います。
動画の勉強は自分のペースでじっくり学べるので、コミュニティを楽しみつつデザインを学びたい方にシーライクスはおすすめですよ!