「WEBデザイナーになる！」と思い立ったはいいけど何から始めたらいいかさっぱりわからない人へ。まずは形から入ることをおすすめします。
というわけで、未経験から独学でウェブデザイナーを目指す人に必要な環境をざっくりとご紹介。
※これあったらいいよ！みたいのあったら教えてください。
パソコン1台あれば出来る！は半分正解で半分は間違い
パソコン1台で手軽に始められて原価のかからない仕事と思われがちで、周囲からもよく言われます。
まあ、実際間違っちゃいないんですが、初期投資に結構お金かかるし、毎月支払うお金も結構あります。僕の場合、月4~5万くらいは払っている気が…。
ざっとリストアップするとこんな感じ
- パソコン
- デスク
- イス
- Photoshop
- Illustrator
- テキストエディタ
- ドメイン
- レンタルサーバー
1つずつ見ていきましょう。
1.自室の制作作業環境を用意する
パソコン本体、マウス、キーボード、机、椅子…。結構お金かかるので、ここで挫折するくらいの半端な覚悟ならやめておいたほうがいいです。
1-1.パソコン
パソコンは必須。これがないとなんにも始まりませんので最初に買いましょう。
Windows、Macのどちらでもいいけど、デザインやるならMacがおすすめ。Helveticaを筆頭に有名フォントが最初から使えるのはかなりのアドバンテージ。
映像編集みたいに重たい作業をしないなら、ノートPCがなにかと便利。どこへでも持ち出せるメリットは結構大きい。ウェブだけならMacBook Airで十分です。
1-2.マウス
マウス変えるだけで信じられないくらい作業効率が上がります。
僕のおすすめはロジクールのマウス。大量に配置されたボタンを見て「なんだこれ…。」となりますが、各ボタンにキーボードショートカットを登録して、作業効率がグーンと上げることができます。
PhotoshopやIllustrator使うときは捗って仕方がないです。
ロジクールのおすすめマウス
ロジクールのマウスの中で特におすすめなのがゲーミングマウス。ショートカットボタンが大量に登録できるのもメリットですが、ゲーミングマウスは正確で細かい動きに対応出来るよう、かなり精密な操作設計がされています。細かい作業の多いデザイナーにはおすすめのマウス。
LOGICOOL 充電式ゲーミングマウス G700s
有線・無線両方に対応してるので、電池切れを心配する必要がない。アプリケーション毎にショートカットのセットを切り替えれるのも便利。副ボタンも大量に付いてます。
こちらの記事でG700sについてレビューしていますので興味があればどうぞ。
LOGICOOL オプティカル ゲーミングマウス G300s
G700sより少しグレードが下の型ですが、実用性は十分。値段も手頃なので利用者も多いみたいです。
1-3.キーボード
キーボードは人によって好みがバラバラ。一概にコレ！とは言えないけど、Macユーザーなら純正のキーボードを使うのが最良の選択肢だと思う。
デザイナーに愛されるキーボードの代表にHappy Hacking Keyboardがあるけど、高いのでそこそこの覚悟をしておきましょう。
激安キーボードだったらAnkerのがおすすめ。安いけど性能はそこそこあるし、Mac用として十分使える。
Anker ウルトラスリム Bluetooth ワイヤレスキーボード 【iOS/Android/Mac/Windows対応/長時間稼働】（ホワ...
1-4.デスク
奥行きのない机を選ぶと肩がこってかなりしんどいです。最低でも奥行き80cmは欲しいところ。
IKEA、ニトリで探すか、楽天・amazonあたりでポチッと買おう。安いし。
SD STORE パソコンラック パソコンデスク PCデスク ラック付きデスク 左右入替可 収納 両用デスク 幅96×奥...
1-5.椅子
イスに座って作業をすることが増えるので、長時間座っても疲れないものを選びましょう。
その昔、座椅子とテーブルで作業していたことがありましたが、肩と腰が悲鳴をあげたのでやめておいたほうが身のためです。
イス、大事。
2～3万円はしますが、HARA Chairがかなり良い。
見た目にこだわらないならゲーミングチェアも素晴らしい性能です。
DXRACERの椅子、自分も使ってたけど体への負担は本当に少なくなるのでおすすめです。
2.デザインに必要なソフト、アプリケーション
2-1.AdobeCreative Cloudへ登録を。Photoshop、Illustratorを使おう
ウェブやデザイン制作においてAdobeのPhotoshop、Illustratorは必須ツール。月額4980円でAdobeのソフトウェアが全部使えるAdobeCreative Cloudに登録しましょう。
2-2.テキストエディタ。
HTML/CSS、PHPなどのコードを書くのに必要です。テキストエディタで作ったデータをサーバーにアップロードすることでWEBサイトが公開できます。
よく使われているテキストエディタをまとめます。
| 人気のテキストエディタ | |
| Dreamweaver | Creative Cloudに登録すると使えるAdobe製ソフト。昔はWEB屋と言えばDreamweaverという風潮だった。現在は無料でもかなり優秀なものがあるのでそこまで使われてない。 |
| Brackets |
Dreamweaverと同じくAdobe社提供。テキストハイライトやクイック編集など、無料とは思えないほどの機能がてんこ盛り。日本語にも対応しているので、初心者にとてもおすすめのエディタです。 ダウンロード：http://brackets.io/ |
| SublimeText | 「恋に落ちるエディタ」として有名なSublimeText。デフォルトでもかなり優秀なパフォーマンスを発揮するのですが、プラグインによる機能拡張でさらに進化を遂げます。 初期状態では日本語に対応してないので、後から自分で設定する必要があります。初心者には少し敷居が高いかも。 ダウンロード:https://www.sublimetext.com/ ※無料で使えますが、厳密には有料のシェアウェアです。 |
| Atom | SublimeText同様、プラグインによってどんどん機能を追加していくタイプのエディタ。見た目がすごくカッコイイので一度は使ってみてほしい。 こちらも日本語対応は自力で。 ダウンロード:https://atom.io/ |
僕は最近Bracketsばかり使ってます。
2-3.デザインフォント
Macユーザーは最初から書体環境が整っているのであまり気にしなくても平気ですが、必要に応じてフォントを買うという感覚は持っておきましょう。
日本語フォントなら、デザイナー御用達のモリサワフォントが全て使えるMORISAWA PASSPORT ONE（年間契約）。
欧文フォントならWindowsユーザー必携の改訂6版 TrueTypeフォントパーフェクトコレクション (デジタルBOOK)。こちらはHelveticaやFutura、Gillsansなどの有名フォントが安価で多数手に入るので、最初に買っておくといいでしょう。
2-4.Google Chromeなどのモダンブラウザ
Internet Explorerを使ってる人は早急にGoogle ChromeやFirefoxに乗り換えましょう。開発ツールや拡張機能などWEB制作の作業効率を上げてくれるツールがたくさん用意されています。
特にGoogle Chromeは必須ブラウザ。便利だし早い。
2-5.Googleアカウント
Google Chromeをインストールしたら早めにGoogleアカウントをとりましょう。WEBの仕事をする上でなくてはならない存在。まずはGmailアカウントの取得を。
3.環境が整ったらウェブサイトを公開してみるところまで頑張る
ここまで環境が整えば後は慣れ。まずは自分のWEBサイトを立ち上げてみよう。最初はWordPressを使ってブログを書くところから始めると、勉強になることが多いです。
その前にまだ少し覚えておくことがあるのでチェックしましょう。
3-1.最低限HTML/CSSを覚えておく
まずはHTML/CSSの基本を抑えておきましょう。呪文のような単語が並ぶので最初は理解するまで時間がかかると思います。まずは1冊教科書を買って全ページ写経。わからなくてもいいから本に書いてある通りテキストエディタにひたすら打ち込む。これである程度の理解はできるので、あとは自分のやってみたいことを検索するなどして調べてみましょう。
HTML/CSSの入門書ならこの本がおすすめ。ステップ形式で進むので、本書のチュートリアルを終えたころには一通りサイトが作れるようになってるし、何より自信がつく。HTMLの理解ができていれば、WordPressもそんなに難しくないはずです。
3-2.ドメイン
ドメインとはホームページを公開するURLのことです。ドメイン業者から年間1000円前後で取得することができます。好きな文字列を決めたら早めに取ってしまいましょう。他の人とかぶると、早い者勝ちになります。
代表的なドメイン業者をあげておきますが、どこが有利とかはないので契約時に1番安い業者を選べばいいでしょう。
3-3.レンタルサーバー
HTML/CSSで作ったホームページのデータを格納するところです。取得したURL（ドメイン）を経由してここに格納されるデータを見てもらうことでウェブサイトが表示されます。こちらもページ公開に必須なので契約しておきましょう。
おすすめはエックスサーバー。月額1000円以内で借りれるサーバーの中では最も高性能で、WordPressなどのプログラムも1クリックで簡単にインストールすることができます。
ロリポップ！やさくらのレンタルサーバーもありますが、速度や機能を考えるとあまりおすすめしません。安いけどね。
3-4.FTPソフト
レンタルサーバーにデータをアップロードするのに必要なソフトです。初心者にはFileZillaがおすすめ。
とっつきにくいソフトですが、インストール方法や使い方をTECHACADEMYさんの記事で詳しく解説してくれてるのでこちらを参考にしましょう。
出典-TECHACADEMY magazine:http://techacademy.jp/magazine/2447
4.アクセス解析ツール他
公開したサイトのアクセス数を調べるのに使います。サイト制作をするデザイナーには直接関係ありませんが、当たり前のように導入を求められるので必ず覚えておきましょう。将来ディレクターを目指すデザイナーなら必ず通る道。
4-1.Google Analytics（グーグルアナリティクス）
アクセス解析ツールの王道。Google提供の無料解析ツールで、多くの人が使ってます。アクセス数やユーザー数、検索キーワード対策などSEOに欠かせない機能がたくさん。サイトを公開する前にかならず準備しておきましょう。
Google Analytics：https://www.google.com/intl/ja_jp/analytics/
4-2.SearchConsole（サーチコンソール）
Google Analytics同様に解析ツールとして利用されます。アナリティクスが検索された結果に対するツール、こちらは検索されるまでの状態を解析・改善するツール。自分のサイトが今どういう状態で、どのような評価をされているかを見るツールです。サイトやブログを運営する方は必ず入れておきましょう。
4-3.キーワードプランナー
サイトを公開しても誰にも見てもらえなければ意味がありません。ユーザーが検索するキーワードを予測するのに最適なツールです。一度使ってみることをおすすめします。
キーワードプランナー:https://adwords.google.com/KeywordPlanner#start
5.より快適に仕事をするためにあると便利なもの
なくても大丈夫だけど、あったらめちゃくちゃ便利なアイテムやツール。
5-1.モニター
パソコン本体の寿命が5年くらいだとしたら、モニターは10年以上現役で稼働します。iMacのようにモニターと一体型のパソコンを買うと、液晶or本体のどちらかが壊れたら終了ですが、別々に持っておくことでリスクを分散することができます。
デザイナーであればEIZOのモニター（旧ナナオ）がおすすめ。発色がキレイで、どの角度からでも画面が見えるIPSパネルを買っておけば間違いないです。次点でLGあたりを買うと良いでしょう。
5-2.Evernote
「すべてを記憶する」でおなじみのEvernote。ちょっとしたアイデアのメモから、文書作成など、月間60MBまで無料で使用可能。インターネット環境があれば職場や外出先など、どこからでもアップロード、アクセスが可能です。Google Chromeの拡張機能を使えばインターネット上の気になったサイトや文章、画像など何でもスクラップできます。タグを付けて管理できるので、後から検索するのもラクラクです。
Evernote:https://evernote.com/intl/jp/
5-3.Pocket
Evernoteは何でも保存できるノートといったところですが、こちらはブックマークに特化しています。Google Chromeの拡張機能で気になったサイトを次々とブックマークしていき、後で読む的に使うことができます。一覧表示も見やすく、タグ管理も可能。愛用しています。
Pocket:https://getpocket.com/
5-4.Twitterアカウント
Twitterに流れてくる情報は鮮度が高い。最新の情報やトレンドに興味のある方にはおすすめ。WEB系のアカウントをフォローしておけば諸先輩たちの仕事効率化スキルや考え方がタダで聞けちゃう。同時に苦悩も聞けるけど。
まとめ：未経験から転職を目指すには準備が必要
WEBデザイナーって職業の響きがいいし、IT系だし（一応）、あこがれで目指す人も結構いるみたいです。スマートに働く印象が強いのでしょうね・・・。
目指す人が多い分、辞める人も多く、入れ替わりの激しい業界です。技術もめまぐるしく変化して、自分で努力できないタイプはどんどん置いて行かれます。常に最新の情報を追う根性がないと結構厳しい。
ある程度覚悟があれば後は勉強あるのみ。業界で何をしたいか、何が出来るかを明確にした上で転職をしてみましょう。仕事が取れて、こなす自信があるならいきなり独立しても大丈夫です。
なんにしても行動するしかないので、本気で目指すなら今からでも行動しましょう。
コメント