文系でもWebデザインに興味ある人へ【勉強法・必要スキル / ツール】

文系だけど、Webデザインとか興味あって勉強してみたい。
でも、HTMLとかCSSとか色々プログラミング勉強しないといけないみたいでなんだか辛そう・・・」

こんな方に向けてこの記事を書いています。

この記事の内容

  • 文系でもプログラミングはできるというお話
  • Webデザインに必要なスキル・ツールの紹介
  • おすすめのWebデザイン勉強法

実際に僕自身、出身の大学では経済学部で文系でした。

でも独学でプログラミングを勉強して、現在はフリーランスでWeb制作・コーディングなどの案件を受けています。

また、プログラミングの挫折も経験しています。

これらの経験を元に書いていきますね(^^)/


文系でもプログラミングはできるというお話

先ほど書いたように文系大学出身でして、大学時代プログラミングはやった事はなかったです。

自分のパソコンすら持ってなかったですし、自分用のパソコンを買う予定もなかったです。

オーストラリアに留学したときにパソコンを買ったのですが、それはあくまでもあった方が便利だからと言う理由だけです。

じゃあなぜプログラミングを始めたのか・・・?

プログラミングを始めた経緯はこちらの記事で紹介しています

簡単に言うと、「たまたま再開した友達とプログラミングの勉強をスタートした」ということです

プログラミングやウェブデザインの知識はゼロからのスタートでしたが、今では様々なタイプのウェブサイトを作ったり、自分らが欲しいサービスを作れるようになりました。

詳しくはポートフォリオサイトをご覧ください*このポートフォリオサイトもゼロから自分で作りました

Webデザインに必要なスキル・ツールの紹介

色々あるので、これからWebデザインを始めたいという方に向けていくつか紹介します。

必要なスキル

  • HTML / CSS
  • javascript(jQuery)
  • もちろんデザインスキル

“Webデザイナー”と一言でいってもいろんな括りがあって、やることが全然違ってきますが、とりあえずスタートはHTML/CSS、Javascriptになるかと思います。

自分が表現したいもの・作りたいものによって必要なスキルが増えたりするのでその都度勉強すればオッケーです。

デザインスキルはいくつかデザインの基礎本を読んで、いろんな人のデザインを見て学びましょう〜
*詳しくは下のおすすめのWebデザイン勉強法に書いています。

勉強方法は下の方で紹介しています

必要なツール

Webデザインをするにあたって必要になってくるのがAdobeのソフトウェアです。

Webサイト制作やデザインなどの案件でAdobeのファイル形式(PSD/AI)のものが使われているので、持っておくべきですね。*PSD=Photoshop AI=illustrator

SketchはAdobeよりもあまり使われていないですが、動きがとても軽くAdobeより安くて、UIデザインもしやすいのでオススメです。
*海外ではUIデザインなどを作る際によく使われています(Macのみ)

おすすめのWebデザイン勉強法

基本的に流れは以下

  • 上で紹介した基本的なスキルを身に付ける
  • デザインの基礎を勉強する
  • デザインツールを使えるようになる
  • 自分が作りたいものを作る
  • 必要に応じて新たなスキルを身につける<
  • 番外編:ブログで発信

これの繰り返し
*番外編は後から追加しました

上で紹介した基本的なスキルを身に付ける

プログラミングはある程度まで無料で学ぶことができます

以下は僕が実際に利用したプログラミングの学習リソースです

ドットインストール:一つ一つの学習動画が短いので進めやすいです。無料会員でも様々なプログラミング言語を学べます。

Progate:ゲーム感覚で進めれるのでとても楽しいですし、初心者はとっつきやすいかと思います。

Codecademy:英語ですが無料で色々学べるので、英語ができる人はチェックしてみてください。

またYouTubeに上がってるプログラミングのチュートリアル動画は英語の方が断然量が多いですが、最初は日本語で学んだ方が理解しやすいです。

独学はしんどいし辛いのでプログラミングスクールのレッスンを受けるのもオススメです

コースはいろいろあるので自分に合ったコースを選んで受講してみて下さい

学んだスキルで稼げるので、独学がしんどい際は課金する価値ありです。

デザインの基礎を勉強する

まずは基礎でいいのでデザインの勉強したほうがいいです。

おすすめのデザイン本はこの3冊のみ

基礎的なことを学んだら後は好きなデザイナーの人のデザインをよく見て真似たりアレンジしたりしましょう。

いきなり頭の中にポッとデザインアイデアが浮かぶ事はあまり無いので、普段から様々なインスピレーションに触れておくと良いです。

デザインのインスピレーションはここから

デザインツールを使えるようになる

これがデザインしたいってなってもデザインツールが使えないと何も始まりません。

Photoshop・illustrator・Sketchなど使い方がわからないと宝のもちぐされです。

大体の事はググったらすぐ出てくるので大丈夫ですが、基本的な操作は覚えておきましょう。

YouTubeにもたくさんチュートリアル動画が上がっていますので要チェックです。

Sketchの操作は直感的なので一番使いやすいかと思いますが、やっぱりAdobeの方がWebデザイナーはみんな持ってる感じですね。

自分が作りたいものを作る

デザインツールの基本的な操作を覚えたら、まずは何でもいいので自分がデザインして何か作りましょう(例:スマホケース、ウェブサイト、ZINE、名刺等)

自分が作りたいものができると嬉しいですし、モチベーションが上がります。

僕はとポートフォリオサイトを作りました。

必要に応じて新たなスキルを身につける

「何か作ろう」・・・となると、だいたいそれを実現する為に必要なスキルが出てきます。

なので、その都度ググったり、勉強したりして新しいスキルを身につけると良いです。

自分が作りたいものが作れて、スキルアップにもつながるので一石二鳥ですね

番外編:ブログで発信

自分が勉強している事もしくは作ったものなどを世に発信する場所としてブログが最適です。

ブロガーになれと言っているわけではなく、自分が作ったもの・できる事を見せる場所を設ける形でブログを持つのも良いと思います。

実際にフリーランスとして活動している中で、ブログのおかげでとれた案件も何個かあります。

ブログの始め方は、ブログを始めたい人は、今すぐ始めましょう。【WordPressブログ開設手順】で紹介しています(^^)/

まとめ:文系理系関係なくWebデザインはできる【まずはやってみよう】

WebデザインするにあたってHTML/CSS、JavaScriptは必要になってくるかと思います。

でも、プログラミングは言葉みたいなものなので、やれば小学生〜でもできるようになります

文系理系関係ありません。

習得するのにかかる時間は個人差はあると思いますが、諦めずにコツコツやっていくといずれ身に付いてきますよ

コツとしては、最初から完璧を目指さない事です

また、いろんなプログラミング言語があるからといって不安にならないこと

自分が作りたいものから逆算して、それに必要なスキルを身につけることが近道です

いろんなことを網羅したとしても使わないスキルがあったらもったいないですよね

ちなみに、僕は特に頭がいいわけではないですし、有名な大学に入ったわけでもありません、、、
*大学では体育会系の部活に入っていたのでほぼテニスしかしていませんww

そんなアホアホマンでもプログラミング勉強して、フリーランスでWeb制作活動しています(^^)

なので文系でも理系でもなんでも是非スタートしてみてください〜

では〜



Posted

in

,