これまで５年、WEBデザインとプログラミングを誰かに教えてきました。WEB制作やプログラミングの業界に入ってからは、もう10年以上になります。もちろん自分でも膨大に作ってきましたし、人材育成においても、様々なプロジェクトを立ち上げてきました。
そんな中で「どうすれば最もWEBデザイナー、エンジニアとして優秀な人材に成長するか」わかってきたので、まとめていこうと思います。
ちょっと長くなると思いますが、今、WEB制作を勉強されていたり、これからはじめようと思っていらっしゃる方は、ぜひ、最後まで読んで欲しいです。読んだ後で勉強を始めることで、通常の勉強方法と比べると、何倍も優秀なWEBデザイナー / エンジニアとして成長できるでしょう。
これまでの経験上、お伝えする内容を実践することで「優秀になる」傾向は明らかです。ぜひ、勉強の手を一旦止めて、読んでみてください。
WEB制作の学び方.1 基本的なWEB制作の流れを把握しよう
まず、最初にWEB制作の流れを把握しましょう。会社や個人ごとに変化はあるかもしれませんが、基本的には次の流れになるはずです。
- クライアントにWEBサイトでやりたいことを聞く(ヒアリング)
- ヒアリング内容を元にWEBサイトの企画をつくる
- ワイヤーフレームと呼ばれるWEBサイトの設計図を作る
- Photoshopなどでワイヤーを元にWEBデザインを作成
- HTMLやCSSなどでコーディング(サイトとして機能する形にする)
- JavaScriptなどで動きつけたり、WordPressで更新機能つけたり
- 会員登録などのシステムがある場合は開発する
この流れを基本として、個人や会社のやり方で最も良い方法にアレンジして使っているところがほとんどです。なので、基本的なWEBサイトが出来上がる全体の流れは上記で一旦覚えておいてください。
なお、1〜3まではディレクターと呼ばれる人が担当することが多く、WEBデザイナーとフロントエンドエンジニアが4〜6、そして7がバックエンドエンジニアと呼ばれる人の仕事になります。
よく言われるプログラマーやエンジニアは7を担当する人たちです。4〜6を担当するのがWEBデザイナーとフロントエンドエンジニアで、2つは別々の職種ではあるのですが、どっちも1人でできる場合も多いです。
WEB制作の学び方.2 WEBデザイナー、エンジニアとしてずっと生き残れる人の特徴を把握しよう
全体の流れを把握して頂いたところで、今度は「どんなWEBデザイナーやエンジニアが評価されるか」「ずっと生き残っているか」という本質的なところをご説明します。まさに、これからみなさんが「目指す場所」そのものですね。目指すところが明確になれば「そのためにどうするか？」を考えられます。
とは言っても、目指すところはシンプルで「仕事のできるWEBデザイナーやエンジニア」です。「技術だけ高いデザイナーやエンジニア」ではありません。これが、社会に求められているデザイナーやエンジニアの現実です。
例えば、技術だけ高くても、コミュニケーション能力が低ければ仕事はできません。何を作れたとしても、クライアント、またはユーザーが欲しがるものや望むものを作らなければ、ただの自己満足で終わってしまいます。
できるWEBデザイナーやエンジニアは、クライアントやユーザーが欲しいもの、求めるものを把握して、その欲求を超える期待以上の作品をつくり、叶えてあげることができます。さらに、相手が気づいていない問題まで発見して、予算の限り改善案を出し、制作することもできます。
- クライアントやユーザーの欲求に答え、さらにその上を行く作品を作る
- 相手の気づかない問題も見つけ、予算の限り対応し、改善できる
- 視野が広く、言われる前に求められることに気づき、実行する
- 常に技術や業界の情報を追求し、勉強し続けている
- 放っておいても仕事が出来るし高速で成長し続けている
この5つを「デザインやプログラミング」という専門領域の中で、出来るかどうかが、生き残るWEBデザイナー / エンジニアと、ドロップアウトしてしまう人との違いです。別の仕事では、これら6項目を出来ていたと言う人もいらっしゃるかもしれません。しかし肝は、それを専門領域の中でできるか、ということです。
たとえば、プログラミングの綺麗な書き方、効率の良い書き方を自分の頭で考えて書くことも求められます。更新のしやすさや、管理のしやすさなどを考えると、ひとまずアプリやサイトを形にすればOKということにはなりません。デザインにおいても、売り上げを向上させる設計や、ユーザーが気持ちよく使えるデザインなども試行錯誤する必要があります。都度、自分で頭を悩ませて考えなければならないことです。
そのためには、もちろん本質的に技術を理解しなければなりません。ただ、技術だけではダメで、何が問題で何が解決策なのか、問題解決そのものへの慣れと実力が備える必要もあります。「自分で問題を発見し、考え、技術を使いこなして解決する力」を鍛えなければなりません。完璧ではないにしろ、仕事が出来る人は5項目のうち、いくつかの特徴を持っています。
そして、考える力は知識がいくらついたところで、身につきません。知識だけあっても「それらをいかに応用し、組み合わせて使えるか」は、また別のスキルなのです。問題を見つけ、解決する力は技術の知識だけ詰め込んでも育ちません。技術の知識を使って、いかに自分で考え、試行錯誤し、自分で問題を解決したか、その場数こそが考える力を育てるのです。
技術を使えることは最低条件です。もっとも大事なのは、技術を使った問題解決スキルに他なりません。ところが、道を間違えると「言われたことしか作れない状態」に陥ってしまいがちです。
企画において何が問題で、どう解決すればいいのかなんて、一切気づけずに、言われたことだけしか出来ない人になって終わりです。それでは、知識はあってもどこで使えばいいかわからない、技術の応用もほとんどできない人が出来上がるでしょう。職業訓練校で学んだ人に、こうした指示待ちスタイルに育ってしまった人が、特に多いように感じます。
にも関わらず、今、間違った学び方が標準化しているため、考える力が伸びないまま技術だけは「知っている」といった人材が溢れているのです。まるで、2020年以前の、自分で考える力を一切育てない義務教育と一緒ですね。
だから、せっかく専門的にスキルを習得したのに、年収300万円前後かそれ以下の人で溢れています。使い方次第で1,000万円前後は、割とすぐいけるスキルなのに、もったいない話です。そして、結局「稼げないじゃないか」と、別業界に行ってしまう人も大勢います。自分の力が足りないだけなのに、業界のせいにして。せっかく習得するのですから、そんな末路は辿りたくないですよね。
では、どうすれば技術も身につけた上で「生き残れる」WEBデザイナー / エンジニアになれるのでしょう。
>>キャリア形成について必要な考え方｜これから求められる5つのスキル｜スキルを身につける方法とは
WEB制作の学習方法.3 WEB制作を学習するにあたっての心構えを知ろう
仕事のできるクリエイターになるためには、どうすればいいのか。それにはまず「勉強している最中から意識すること」がいくつかあります。
まずは「いつでも答えを教えてもらえる環境にいかないこと」です。つまり、メンターなどが専属でいつでも優しく答えを教えてくれる、聞き放題の環境は、絶対にダメです。これには経験に裏付けされた、明確な理由があります。
先ほどご紹介した5つの特徴を振り返ってみると、たった1つ、共通点があるのです。それは、どれもこれも「自分で考えて問題を解決する力」が必要だと言うことです。
例えば「クライアントやユーザーが求める、さらに上の作品」を目指すには、自分で企画全体を理解し、何が最適なのかを考え出す力が必要です。指示された通りに作るのではなく、さらに良くするにどうするかを、本質がずれない範囲で提案していかなければなりません。
さらに、特徴2つめの、クライアントもユーザーも気づいていない、売り上げをあげるために必要なことを観察して見つけ出し、予算の限り補うためにはどうするか。ここにも、問題を見つけて解決策を考え出す力が必要になりますね。
常に技術を学び、放っておいても成長する。視野が広くてよく気がつく。これも自分で考えて答えを出す、問題解決力が必要です。技術だけ持っていても、言われたものだけしか作れないのであれば、それは3流にしかなれません。クラウドソーシングサービスで、かなり低単価の案件を取れるくらいの仕事しかもらえず、結局稼げないで終わることになるでしょう。
しかも、プログラミングもデザインも専門的なので、そうした専門的知識の中で対応しなければならないのです。他で仕事が出来たとしても、専門的な知識の中で、そのまま考える訓練もなしにあれこれ気づけるかといったら難しいです。
もし、習得の最中に答えを教えてもらえる環境にいたらどうなるか。15分程度悩んで、わからなければ聞いてくれと言われるかもしれません。それでは、デザインやプログラミングにおいて、何1つとして「自分で」問題を解決していないことになります。答えの丸写しと一緒です。与えられた答えをそのまま丸写しして、出来た気になるだけで終わりです。本当の意味で使いこなせるくらい理解なんて出来てませんし、考える力も育ちません。
本当に大切なのは「どれだけ悩んでも、なるべく多くの答えを自分の頭で考えて出すこと」です。だからこそ、考えて問題解決する力も成長しますし、技術を深く理解できます。WEB制作チームは、少数精鋭であることが多いです。なので、作るだけじゃなく、どんどん頭を動かして解決できる問題は自分で発見して解決していく力がないと不十分です。
よく「悩む時間がもったいないから、誰かに全部教えてもらいたい」という人もいますが逆です。悩む時間をなるべく捻出して、自分で試行錯誤して答えを出すことで問題解決力は向上するのです。誰かに何でも教えてもらったのでは、何か問題が起きた時に、ただただ指を加えてみていることしかできません。
優秀だと感じる人は、みんな自分で答えを出す力に長けています。問題が発生したり、わからないことが生まれたりすると、人に聞くよりまず自分で調べて、誰に何を言われなくてもいつの間にか解決しています。技術の移り変わりの早いこの業界で、誰も経験したことがないトラブルなんて、日常茶飯事。問題が発生した時に、誰かに頼るしかないのであれば、それでは評価はされません。
>>Python入門講座【IT初心者やプログラミング未経験者におすすめ】どんな言語？メリットは？
WEB制作の学習方法.4 まず手始めはProgateからやってみよう
では、具体的な練習方法に入っていきましょう。
WEB制作は基本的に、WEBサイトをデザインするスキルとプログラミング2種類のスキルが必要です。最初にご説明したWEB制作の流れの通りですね。一旦、Photoshopのようなツールで見た目のデザインを作ってから、プログラミングで形にします。
両方、同時に始めるよりも、片方ずつ始めた方がいいので、まずここではプログラミングからスタートしていきましょう。WEBサイトを作るためのプログラミング言語は、HTMLとCSSと呼ばれています。
なお、HTMLとCSSはマークアップ言語と呼ばれており「プログラミングではない」とする話もよく聞きますが、ここではややこしくなるので、HTMLとCSSもプログラミングと呼びます。違いがなんとなくわかってきたら、ご自身で言い分けると良いでしょう。どちらにせよ、今は、深く考える必要はありません。
では、HTMLとCSSは、どうやって学べばよいのかというと、うってつけの学習ツールがあります。それがProgateです。Progateは完全初心者向けの学習サービスで、SafariやGoogle Chromeといったブラウザ上でゲーム感覚で学ぶことができます。Progateは、HTMLやCSSをはじめとしたプログラミング言語の「概要」を全体的にざっくり理解することに、かなり向いています。
なので、まず、ProgateのHTMLとCSSの項目を上級、可能なら道場まで「2周ほど」すると良いでしょう。それ以上はする必要がありません。なんとなく全体が把握できれば良いので、一刻も早くProgateを離れることを目標としてください。一通りProgateで全体像を抑えたら、次に進みます。
>>Pythonの資格の種類や初心者向けの資格について｜Pythonは国家資格？｜難易度や合格率は？
WEB制作の学習方法.5 STARTOUTに挑戦してみよう
自分のサービスだから、宣伝してるんじゃないかと思われそうですが、実際おすすめなので紹介しています。実は、STARTOUTは「Progateの次に何をすべきか」という質問を受けた時に、当時、世の中にProgateの次になるものがなかったので作りました。だからProgateの次にうってつけなのです。
しかも、この評価は何も自分たちだけで打ち出したものではありません。リリースした直後に、多くの人からもらった評価なのです。
Progateで養われない力は「実際に作る力」です。とりあえず全体をざっくり把握するにはちょうどいいですが、そのあと「実際にWEBサイトを作ってみましょう」となると、何をすればいいかわからなくなる。そんな状態に陥るはずです。たくさん相談受けましたし、かなり高い確率で起こる現象です。
では、次に何をすればいいかというと、Progateのようにブラウザ上で作る形式ではなく、自分のパソコンで作れるようになる練習です。まさにSTARTOUTは、自分のパソコンでWEBサイトを作り上げる訓練に向いているのです。そして、自分のパソコンで作れるということは、一通りWEBサイトを作れるようになるということですね。ここまでいけば就職もできます。
特にSTARTOUTの場合、考える力も養われるように設計しています。先ほどもお話した通り、WEB制作で評価されるためには、自分で考えて問題を解決していく力が必要なのです。だからこそ、考えながら訓練していく構造になっています。
特に「自分のサービスを作りながらWEB制作を習得する」という内容があるのですが、これをやった人はめちゃくちゃ仕事できる人材に成長しています。
というのも、WEB制作は単純にWEBサイトを作る仕事ではなく「誰かのビジネスをWEBサイトを使って成長させる」というお仕事なのです。プログラミングやデザインは基本的に全部そうですね。
なので、根本的に自分でウェブサービスを作って売った経験があるなら、仕事や企画の全体像を理解しやすくなり、どう自分が動けばいいか、何が問題でどう解決すればいいのか、総合的にできるようになるのは当然なのです。考える力も、一気に成長します。
ただ、自分の事業をつくるのは、ちょっと荷が重いという方もいらっしゃるでしょう。そんな方に向けて「WEB制作ロードマップ」も用意しています。これは、実際にWEB制作の仕事をする手順を辿って、1つWEBサイトを作りながら技術の習得を進めていく形式になっています。実践に沿った形式なので、もちろん習得も早いです。
いずれにしても、実践しながら技術を習得していく方法ですので、一通り終わった時には、作品も完成しています。作った作品があれば、もちろん就職もしやすくなりますので、STARTOUTを一通り終わらせたら、あとはWEB制作会社での就職を目指せるようになります。
もちろん、プログラミングだけでなく、Photoshopの使い方から、デザインの方法まで学習できます。なのでSTARTOUTを終わると、考える力やプログラミングスキルだけではなく、デザインスキルまで一式習得可能ということなのです。そして、一通り終わったら人に見せられる作品も完成しているので、就職活動や仕事の獲得にも動きやすくなるでしょう。
ここまできたら、あとすべきことは、自分が作ったものに対し、プロのレビューをもらいながら現場でスキルアップしていくだけです。
WEB制作の学習方法.6 より極めたいスキルを学ぶ、または就職する
STARTOUTを徹底的にやりきれば、基本的に下記の資産が手に入っているはずです。もし手に入っていなければ、まだやり込んだ方が良いでしょう。
- 仕事ができる問題解決能力
- 人に見せられるレベルの作品(ポートフォリオ)
- 働き始められるレベルまで技術
- 収益を生むサービス
- ビジネスやマーケティングに対する圧倒的理解
とにかく就職を早めたり、受託で仕事はじめたいのであれば、サービスを収益化するまで作らなくても大丈夫です。無料で何かしらのサービスを作り、100名前後のユーザーに使ってもらうくらいでも良いでしょう。それでも、十分「仕事ができるし今後期待できる、作れる人材」として重宝されます。これまで、散々ユーザーさんの意見を聞いてきた結果、そうでした。
ではSTARTOUT後は、どこに向かえば良いでしょう。答えは2つです。
まず1つめの道が、特定の技術を伸ばすこと。プログラミングをさらに伸ばす、もしくはデザインをさらに伸ばす。1つのスキルに特化した学習サービスはいくらでもありますので、特化した学習方法に移動し、さらにスキルを伸ばすと良いでしょう。
2つめが、就職です。今まで学んだ全てを活かして、なんとか就職してみましょう。会社でしっかり働くことができれば、プロからのレビューも無料でもらえますし、実績もどんどん生まれ、一気に成長することができます。もう自分で考える力も習得しているわけですから、いくらでも成長できます。
なお、流行りの未経験フリーランスは、何か事情がない限りはあまりおすすめしません。というのも、未経験でフリーランスをやるよりも、会社の方が圧倒的に実績を作れます。自分一人でやるよりも、最新の情報が入ってくるのも早いです。
たとえばいきなり、誰もが知っている上場企業の仕事を未経験フリーランスで取れると思いますか？ 難しい方が大半のはずですが、就職すればすぐです。自分よりも圧倒的にすぐれた先輩と働くことで、実力もどんどんついていきます。フリーになるなら、就職して実績をつけた後にフリーになることをおすすめします。
>>Webマーケティングやビジネス講座ならJ Career School
WEB制作の学習方法.7 まとめ
今回は、WEB制作の学習方法について、一通りの流れを書いてみました。WEB制作を学びたい人の中には、いきなり学校に行ったり、なんでも聞ける環境を求めたりと「なんとなく先生に言われた通り作ったけど、自分でやろうとすると何もできない」「いざ仕事になると、どう動いていいかわからない」といった、知識は多少溜まったものの、実際に作れない、仕事ができない状態に自ら追い込みつつある方も多いのではないでしょうか。しかも大きなお金を払って。
今回、断言できるのは、まず長期に渡って生き残り続ける人は、ほぼ間違いなく、冒頭にあげた5つの特徴をもっているということです。もし最初から5つの特徴を持っていないのであれば、習得中にでも訓練すべきです。いざ学校を卒業したり、カリキュラムを終えたりしたあとも、結局、仕事に到達できないということになりかねません。もし運良く到達できたとしても、現場で働くうちについていけなくなり、途中で離脱してしまうでしょう。
そうなったら、せっかくこれまで築き上げてきた努力も、すべて水の泡になってしまいます。またゼロから別の経験を積んでいかなければなりません。それはあまりにも無駄ですし、ゼロに戻るくらいなら「考える力や問題解決力」を同時に訓練した上で「Webデザイナーやエンジニアとして、仕事ができる人」に成長して行った方が何倍も自分のためになるでしょう。
WEB制作の勉強方法についてまとめると、
- 安易に聞ける場所にいかない
- なるべく自分で考えて問題を解決する
- 悩むことから逃げない
- 「悩む時間が無駄だから教えてもらう」思考は脱落しやすい
- 15分で教わった答えより、3時間悩んで出した答えの方が100倍有益
- 独学を基本に進めることを考えてみる
ということなのです。
自分で試行錯誤して、自分んで答えを出す、というマインドを前提として持った上で、今回ご説明させて頂いた学習方法を辿ってみましょう。そうすれば、技術も習得した上で、自分の頭1つで勝ち抜いていける「実践で求められ続ける、WEBデザイナーやエンジニア」としてWEBを使いこなせるでしょう。