今年こそWebデザイナーになりたい!結局何を覚えればいいの?ソフトスキル編

今年こそWebデザイナーになりたい!結局何を覚えればいいの?ソフトスキル編

thmb_03_218

第三回目はソフトの使い方についてです。ソフト自体は会社によって使っている内容が異なりますが、Webデザインで使うソフトはだいたい同じですのでどのような使い方とどのような勉強をすれば良いかまとめていきましょう。

絶対必須なAdobe illustrator (以下イラレ)は絶対覚えよう

thmb_03

Webデザインに必須なソフトと言っても過言ではないソフトですね、近年Webデザインで使っているソフトとしてはおそらく一番使われていると言っても良いくらいだと思います。もちろんPhotoShoopを使っていたり他のソフトを使っている会社もいますが、僕が見てきた限りこのイラストレーターを使っている会社がほとんどでした。
ではなぜ、イラストレーターのソフトを多用しているのかと言うと、そもそもイラストレーターの基本的な機能は印刷専用という所にあります。フォトショとは特性が違うので、当初はフォトショがよく使われていましたが、イラレのバージョンアップに伴い汎用性が増し、印刷に使っていたデータをそのまま使うことが出来たり、フォトショよりもレイヤーの管理が楽だったり、色々な理由によりイラレユーザーが増えていきました。
そもそもイラレは印刷に使うようなポスターなどのデザインに使われてきましたが、上記の理由により今はWebデザインの最前線で使われています。

覚える機能は基本的な機能とショートカットで良い

shotcut

これはイラレに限らずですが、基本的にグラフィックソフトで大切なのは基本機能をまずは覚えて、それを仕事で使う感覚ですなので、どちらかというと機能を知るというよりも、どのような形、大きさ、色、グラデーション、効果、汎用性などを考えていくと自ずとそれに近い機能があるので、そのように覚えると記憶されやすいです。
ですので、勉強方法としては自分の好きなサイトを一度全く同じようにデザインしてみるとより、ソフトの使い方が分かると思いますので是非1度やってみてください。

写真補正や素材作成に最適なAdobe PhotoShop(以下フォトショ)

stockvault-waterdrops-on-window134615

イラレに続き、フォトショとうソフトがありますが世の中で画像加工といえばこのフォトショが挙げられます。このフォトショ自体主な機能としては名前の通り写真を加工する機能が大前提です、色はもちろん明るさや、オブジェクトの合成機能や、肌を綺麗にしたり様々な写真の加工が可能です。昔はよくこれを使って心霊写真を作ったりしていたとか…
フォトショ自体はあくまでも素材を作ったりするという概念で考えてください、その素材自体はイラレでレイアウトするという考えの元覚えるとより良いかと思います。
フォトショの基本機能は基本的な操作本を1冊購入するなどしてもらうのが良いでしょう。これはイラレと同様ですが何かどのようにしたいか?という点が非常に重要ですので、ここは写真が明る方が文字が引き立つなどという考えの元加工する事が大切です。

最近人気の出て来た Sketch (スケッチ)

skitched-20180218-082424

最近耳にするようになったスケッチですが、今の会社でもよく使われています。イラレに比べて非常に軽く、UIを作るには非常時便利ですのでかなりオススメですね。イラレだと面倒な事がこのソフトだと簡単にできるのが魅力なのと管理も非常に楽という点が売りです。ですので余裕がある方はこのスケッチを購入してみてはどうだろうか。
しかし、このスケッチは現状Macのみの対応となっているのでWinユーザーにとっては辛い選択である。
ですが、今後アプリのデザインやスマホのデザインをする際には非常に楽だし、zeppelinというソフトと連携することが出来るので、アプリプログラマーと連携するのも非常に楽です。というかアプリ制作は必須と言っても良いでしょう。
余裕があれば是非覚えていきたい。
勉強方法はイラレと一緒ですね。
Sketch

スケッチを追従するAdobe XD

skitched-20180218-082733

スケッチが台頭してきて、Adobeももちろん黙ってはいない、当然追従するソフトを開発した。XDというUIデザイン専用に開発されたソフトである、基本的にはスケッチと変わらないがこちらはWinに対応しているので、どうしてもWinじゃないといけない人はこちらを選択することをお勧めします。
Adobe XD

コーディグソフトで一気に有名になったSublime Textさん

d0b403c8-s

上記のソフトで画を起こすと当然コーディングをしなければなりません、具体的にコーディングソフトはどのようなものがるかというと、過去シェアがあったのが DremeWeaver(以下ドリ)という緑色のソフトです、ドリは色々と便利な機能が多いのですが、若干僕にとっては重たく、今は使っていません。
現在より多く見かけるのが、SublimeTextというソフトです、これはプログラマーも使っており便利なプラグインが数々あります。さらにSublimeTextは基本的には無料で使える!w(有料版もある)
初心者の方でこれからコーディングをソフトを使う人は是非このSublimeTextを使ってみると良いと思います。
もちろんドリでもいいけど、最近使っている会社見ない…
SublimeText

まとめ

いかがでしょか。ソフトスキルもそれなりにないと受ける会社はあなたのスキルが判断できません。
しかし、なんでもそうですがソフトをいかに使いこなせるというのは会社は求めてません、あなが形にしたい事や創意工夫をしたい気持ちがソフトのスキルにつながる事を忘れてはいけません。
ですので、いくら資格を持ってても使い方を知らない人は会社いらないという事です。

よりソフトを使ってより良いものを生み出す事が重要と考えてソフトの使い方を勉強してみていはいかがでしょうか。

以上今年こそWebデザイナーになりたい!結局何を覚えればいいの?ソフトスキル編でした。気に入ってくれたらシェアしてね!

関連記事

410cb567eef6283065274df2547a2b9a_s

Webサイトで問い合わせが来る必要なマーケティング・デザイン手段5選

久々の更新… さて今回はWebデザインを続けていくと、Webサイ...

記事を読む

smartphoneIMGL0018_TP_V

UIデザインの幅に関しての基本的な考え方と理論

全く更新できず時間が過ぎていく…気ままに更新していきますのでたまに見て...

記事を読む

skitched-20180814-223313

今日からあなたもデザイナー!?忘れがちな商業デザインの配色テクニック

デザイナーの商業デザイン配色テクニック 配色については過去ある程度テ...

記事を読む

domain_cms

今年こそWebデザイナーになりたい!現役Webデザイナーに必要なサーバー・ドメイン・CMS 基本知識について

今回で第5回を迎えました。なんとか頑張って続けていきます!Webデザイ...

記事を読む

cssjshtml_img15

今年こそWebデザイナーになりたい!Webデザイナーに必要なコーディングスキル編(html/css/js)

今回はコーディングスキル編として、Webデザイナーとして就職するために...

記事を読む

新着記事

_4da9d299-fa39-4639-bd84-79ffedfd71e9

指示をするということはプログラミングする事と一緒

ほとんど更新してませんが、ひっそりとオランダで生きてます(笑)オランダ...

記事を読む

410cb567eef6283065274df2547a2b9a_s

Webサイトで問い合わせが来る必要なマーケティング・デザイン手段5選

久々の更新… さて今回はWebデザインを続けていくと、Webサイ...

記事を読む

smartphoneIMGL0018_TP_V

UIデザインの幅に関しての基本的な考え方と理論

全く更新できず時間が過ぎていく…気ままに更新していきますのでたまに見て...

記事を読む

PASONAZ160306470I9A2122_TP_V

ECサイトに必須!商品検索したあとの検索結果の正しい表示について考える

ECサイトに必須!商品検索したあとの検索結果について考える ECサイ...

記事を読む

skitched-20180814-223313

今日からあなたもデザイナー!?忘れがちな商業デザインの配色テクニック

デザイナーの商業デザイン配色テクニック 配色については過去ある程度テ...

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

_4da9d299-fa39-4639-bd84-79ffedfd71e9
指示をするということはプログラミングする事と一緒

ほとんど更新してませんが、ひっそりとオランダで生きてます(笑)オランダ

410cb567eef6283065274df2547a2b9a_s
Webサイトで問い合わせが来る必要なマーケティング・デザイン手段5選

久々の更新… さて今回はWebデザインを続けていくと、Webサイトの効

smartphoneIMGL0018_TP_V
UIデザインの幅に関しての基本的な考え方と理論

全く更新できず時間が過ぎていく…気ままに更新していきますのでたまに見て

PASONAZ160306470I9A2122_TP_V
ECサイトに必須!商品検索したあとの検索結果の正しい表示について考える

ECサイトに必須!商品検索したあとの検索結果について考える ECサイト

skitched-20180814-223313
今日からあなたもデザイナー!?忘れがちな商業デザインの配色テクニック

デザイナーの商業デザイン配色テクニック 配色については過去ある程度テク

→もっと見る

  • -売る技術-

    ウエブデザイン暦21年目。犬をこよなく愛するデザイナー。今はディレクションとデザイン を中心に制作全般をしてます。主にマーケティングを軸にデザインを組み立て商品が売れるサイトを構築しています。 デザインとマーケティングについて研究の日々。現在はオランダでWebデザイナーとして働いています。

    ツイッターやってます。
  • Amazonアソシエイト・プログラム規約による記載

    売る技術はamazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイト宣伝プログラムである、Amazonアソシエイト・プログラムの参加者です。

PAGE TOP ↑