デザイン未経験の自分がデザイナーになるためにやったこと

PCで作業をする男性の手元

今回は、これまで趣味でも実務でもデザインの経験が全くなかった僕が、6ヶ月間の学習でWEBデザイナーとして制作会社に就職するためにやってきたことについてお話しします。

僕は2022年の2月に営業職として勤めていた前職の会社を辞めて、しばらくの間は営業職として次に雇ってもらえる会社を探してたんですが、
就職先が見つからなかったのと、本当は営業なんてやりたくないなと思っていたという理由から、転職活動を一旦休止し、色々考えてWEBデザイナーとしての転身を目指して勉強することにしました。

結果だけお伝えすると、勉強を始めてから約6ヶ月後、2022年10月にデザイナーとしてWEB制作会社に就職することができました。

自分で言うのもなんですが、たった6ヶ月間学習しただけで、実務経験者ばかりが重宝されるデザイナーという職種に就くことができたのは、かなりの偉業だと思います。

WEBデザイナーは現在とても人気の職種で、目指している方もたくさんいると思いますので、僕の記憶が薄くならないうちに僕の成功体験をしっかりと書き残しておいて、読んだ人の参考にしてもらえればと思います。

はじめにやったのは、PhotoshopとHTML・CSS

僕は2022年3月にデザイナーになるための勉強を始めました。

最初は何から勉強したらよいかわからなかったので、とにかくYouTubeで情報を収集し、まずはじめにどんなことから勉強しないといけないだろうかと考え、調べた結果Photoshopという画像加工ソフトとHTML・CSSというプログラミング言語(正確にはマークアップ言語)から始めることにしました。

Photoshopは画像加工やWEBサイトの設計ができるソフトで、そのPhotoshopで作成した設計図を、SafariやChromeといったWEBブラウザで実際に表示させるのがHTML・CSS。

どちらもWEBデザインを行う上では欠かせないツールです。

僕は書籍と動画教材などを用いて、これらを学習することにしました。

最初は本当に大変でした。

Photoshopはツールが多すぎて何をしたい時にどのツールを使えば良いかわからず、HTML・CSSは何をどうすれば、画面上のどこがどんなふうに変わるのかが全く理解できませんでした。

教材はあるものの、直接誰かに教えてもらうわけじゃないので、どこを調べれば答えが出てくるのかが全くわからなかったんです。

ひとまず本や動画を見てひと通り頭の中に知識を通過させておいて、実際に使う場面になってわからないことがあればまた戻ってこようと決めて、学習を進めることにしました。

そんな感じで十分に理解できないままサラッと教材を終わらせ、次にWEBサイトやバナー画像の模写をしました。

実際にネット上で広告として使われてるバナー画像をPhotoshopを用いてそっくりそのまま再現したり、WEBサイトのスクリーンショットを撮ってHTML・CSSでそのままコードを書いたり、といった感じです。

当然難しいなと感じる部分もたくさんあったんですが、自分の手によってそれっぽいものを形にすることができたのは自信になりました。

これを5〜10回ぐらい繰り返すうちに、PhotoshopもHTML・CSSもある程度使えるようという自身が持てるようになりました。

職業訓練校でデザインの基礎を学習

4月末から大阪の職業訓練校にも通い始めました。

訓練校は6ヶ月のカリキュラムになってたのですが、最初のうちは色彩やデッサン、美術史といった座学がメインでした。

勉強になるなとは思いつつも、早く実践的なことをやりたいなという気持ちもありましたが、色彩の知識などは実際の現場でも役に立つ場面はちょこちょこあるので、今となっては学んでおいてよかったとも思います。

WordPressとjQueryの学習

平日の昼間は訓練校で学習し、土日はアルバイトもしながら、それ以外の時間で他の勉強をしました。

Photoshop、HTML・CSSがひと通りわかるようになったら、次はWordPressとjQueryの勉強をすることにしました。

WordPressというのは世界中で広く使われているCMSです。

CMSとは、効率よくWEBサイトやブログ記事などを投稿できるシステムのことです。

実はこのブログもWordPressで作っています。

WordPressは「テーマ」というテンプレートのようなものがあって、他人が作ったテーマでWEBサイトを制作することもできるのですが、自分でテーマを作ってしまえば自分が作りたいデザインを忠実にそのまま実装させることができるんです。

このWordPressテーマを自作できるようになるとWEBデザイナーとしての価値を高められるんじゃないかと思い、勉強することにしました。

誰かが作った既存のテーマなら、プログラミングをしなくても簡単にカスタマイズできるんですが、テーマ自体を自分で作ろうと思うと、PHPというプログラミング言語を少しだけ扱えるようになる必要があるんです。

なので僕は合わせてPHPの勉強も少しだけすることにしました。

途中難しくてつまづきそうな部分も多少ありましたが、何とかテーマ作成はできるぐらいにはなりました。

結局今の会社ではWordPressのテーマを作ることはありませんでしたが、後ほど説明する「ある理由」から、テーマ制作はできるようになっておいてよかったと思いました。

WordPressの次はjQueryの学習をしました。

実はjQueryではなくJavaScriptをやろうと思ったのですが、習得までにちょっと時間がかかりそうだなと思い、jQueryから始めて後からJavaScriptを頑張ることに決めたんです。

JavaScriptというのはプログラミング言語で、いろんな用途で使える汎用性の高い言語なんですが、これが使えるとWEBサイトに動きをつけられるようになるので、今では多くのWEBサイトでJavaScriptは使われています。

一方でjQueryとはJavaScriptの一部みたいな感じで、汎用性は劣るものの習得難度はJavaScriptよりも圧倒的に低いと言われています。

汎用性が劣るとは言っても普通のWEBサイトで使いたいような効果はjQueryで十分実装できるので、自分はひとまずこっちから勉強することにしました。

というのもそろそろ制作実績をまとめたポートフォリオを作成し、それを提げて就職活動をしないといけないなと考えていたころなので、JavaScriptを習得するまでの時間を使うのは厳しいかなと思ったんです。

jQueryはそれほど苦労することなくサクッと習得できたので、ここから制作実績とポートフォリオの作成にとりかかることになります。

職業訓練校でIllustrator・Photoshopの学習と制作実績の作成

職業訓練校では座学を終えた後、IllustratorやPhotoshopの授業が始まりました。

Photoshopは自分で勉強してある程度使えるようになっていたと前述しましたが、Illustratorをここで初めて操作しました。

Illustratorは基本操作を教わったあとに、オリジナルのキャラクターや自分のロゴマークを作ったりして実際の使い方を覚えました。

Photoshopを習った後はポストカードを作りました。

その後授業でもHTML・CSSの学習をしましたが、正直自分はこの段階で相当使いこなせていたんで、他の受講生さんに比べたらスキルは「大人と子供」ぐらいの差がありましたね。

WEBのカリキュラムを終えたら、次は就職に向けたポートフォリオ作成に取り掛かり始めました。

ポートフォリオではお菓子のパッケージや水族館のチラシ、後はWEBの授業で作成したWEBサイトのデザインカンプを掲載しました。

このポートフォリオは就職活動で企業に見せるために作るものなんですが、同時に訓練校の修了課題にもなっていました。

ポートフォリオもIllustratorで作成するわけですので、ここまでの流れでIllustratorやPhotoshopといったデザインソフトに関する理解はかなり深まったように思います。

WEBサイトの制作事例を作成

職業訓練校ではグラフィックデザイン専門のコースに通っていましたので、一部WEBデザインのカリキュラムはあったものの、基本的には印刷物の作成が主な内容でした。

なのでWEBサイトの制作事例は自分で準備する必要がありました、

HTML・CSS、WordPress、jQueryといった、WEBサイトを作成する上で必要なスキルはひとまず身についたので、授業やバイトの合間を縫って、制作事例として企業の方に見てもらえるWEBサイトを作っていきました。

僕が作ったのは家会話教室・システム開発会社・ヨガ教室・地域紹介サイト・移住支援サイトと、それに加えて、これらの制作事例を全てまとめたポートフォリオサイトも作りました。

そしてこのポートフォリオサイトを、僕はWordPressで作ったんです。

先ほど僕は「テーマ制作はできるようになっておいてよかった」と言いましたが、それはこのポートフォリオサイトをWordPressテーマで作ることができたからです。

WEB制作会社を受けようと思うと大体ポートフォリオ・制作事例を見せてくださいと言われるんですが、考えてみればこのポートフォリオサイトでも自分の腕を見せられるし、むしろ一番はじめに見られるんだから、ここでいいサイトを作っておけばアピールとして非常に有効なんじゃないかと思いました。

ポートフォリオをWordPressテーマで作成し、サイト内で「このポートフォリオサイトはWordPressで作成しました」とどこかに書いておけば、企業の採用担当の人に「実務経験はないし学習期間も半年だけだけど、デザイン・コーディング・WordPressまでできるのか」と良い印象を与えられる気がしたんです。

またポートフォリオサイトには制作事例だけでなくコンセプトやペルソナ、またこの記事で僕がこれまで書いてきたような「デザインの学習履歴」や自分の性格・長所短所なども載せました。

あまり他の人のポートフォリオを見たことはありませんが、僕が作ったポートフォリオサイトはかなりボリュームがあり、内容も充実してたんじゃないかと思います。

やっぱり未経験で戦おうと思ったらポートフォリオで勝負するしかないですからね。

就職活動

狙い通り、就職活動をする上で、このポートフォリオサイトはとても有効でした。

採用担当者の方々の反応は軒並みよかったですね。

多分ここまでしっかりと作り込んでくる求職者はあんまりいないんだと思います。

実務経験なしということからかなりハードルを下げて見てもらえてたというのもあるかもしれないですけどね。

8社ほど応募して面接に進めたのは5社。

そのうち2社から内定をもらい、そのうちの1社に入社を決めました。

繰り返しになりますが、実務経験ゼロで学習期間は半年間ですからね。

それでこの結果は上出来じゃないかと思います。

まあとは言っても、ここに至るまでには、この記事では書き尽くせないぐらい大変なことがたくさんありました。

またそんな話もさせていただこうと思いますので、お楽しみにしてください。

もし僕が作ったポートフォリオサイトを見てみたい方がいらっしゃいましたら、僕のメールアドレスまでご連絡ください。

URLをお送りします。

ken.taka.0114.cool@gmail.com

じゃっ!