はじめに

今回の執筆クリエイターは、株式会社プレイドにてデザインエンジニアをされている菅家大地さん。今回は菅家さんご自身のWebデザイナーからフロントエンジニアに転身された経験を踏まえ、職種の違いによる変化（年収・業務・マインド）を中心に紹介します。

※このマガジンは…
全部読むと"集客できる"Webサイトが作れる――。そんな記事を目指して。
成功しているクリエイターの実例を通じて、クリエイターの考え方や技術についての知識をお伝えしていきます。

**********************************************************************************

◆スピーカー紹介

AI技術の発展や業界の飽和などを理由に、将来性を不安視しているWebデザイナーの方もいるでしょう。デザイナーの需要がなくなるわけではないので、研鑽を積んでその道を極めることは重要ですが、現在の経験や知見を活かしつつ違う職種に転身するのも1つの選択肢だと言えます。自分も学生時代は雑誌などのエディトリアルデザインをやりたいと思い、デザイナーの道を志しました。しかし、その後はWebデザイナーからフロントエンジニアに転身し、現在は「デザインエンジニア」という職種に就いています。
 
フロントエンドエンジニアは、Webデザイナーと同じくユーザーが直接触れる部分を担当している職種なので、ジョブチェンジする方も少なくありません。今回は僕自身のWebデザイナーからフロントエンジニアに転身した経験を踏まえ、職種の違いによる変化（年収・業務・マインド）を中心に紹介します。

◆スキルと給与が紐づく？フロントエンドエンジニアとして年収300万円 UP

多くの方がもっとも気になるのは給与面ではないでしょうか。僕は株式会社フリーセル（ブランディングテクノロジー 株式会社）で5年半ほどWebデザイナーとしての実績を積みました。その後にフロントエンジニアに転身したのですが、その際の年収は据え置きという感じでしたね。デザイナーからエンジニアへの転身であり、そのままキャリアを活かせたわけでもなかったので、そのタイミングでは給与アップを果たしていません。

その後、フロントエンドエンジニアのキャリアを6年くらい積んで今の会社に転職しましたが、エンジニアになった時からトータルでは300万円くらいは年収アップしています。エンジニアはデザイナーよりもスキルレベルを客観的に判断しやすく、スキルを身につければ分かりやすく指標として自身の成果を見える化しやすい傾向があります。「このスキルがあれば、このくらいの年収水準になる」という業界内の評価などが、デザイナーより見えやすいですね。そのため、デザイナーの時よりも給与は上がりやすくなったと感じています。
 
個人的に年収アップにつながったスキルとしては、「Webアプリケーションの開発スキル」ですね。例えば「JSフレームワーク」「フロントエンドのルーティングや状態管理」「Webアプリケーション全体の設計」「バックエンドとの繋ぎ込み」「非同期処理周り」などの知識やスキルでしょうか。Webアプリケーション開発は一般的なWebサイト制作に比べて高単価になる傾向にあるので、年収アップを目指すうえでは狙い目かもしれません。
 
エンジニアの年収について触れましたが、勘違いすべきではないのは「Webデザイナーからフロントエンドエンジニアになったからといって、必ずしも昇給するわけではないこと」ですね。自身のスキルを高めて、それを評価してくれる会社に入社・転職することも重要です。転職先の会社がどういう業態なのかも年収アップするうえでの指標になります。受託か自社サービスかなどエンジニアとしてどういう領域で関われるのか、会社自体が儲かっているのかなどが給与面にも反映されると考えています。

◆Webデザイナーとフロントエンドエンジニアの違いや共通点の理解も大切

Webデザイナーとフロントエンドエンジニアの求められるスキルや知識の違いとしては、当たり前の話ですが、デザイナーはデザイン、エンジニアは実装に関する知見が重要です。Webデザイナーとフロントエンドエンジニアは、どちらもユーザーが関わる画面の制作を行うので、お互いの領域をちょっとずつ知っていることで上手くコラボレーションできると思います。「どういう風に制作したらユーザーが使いやすいか」というユーザー視点を持ち合わせることは両職種に共通して不可欠です。
 
エンジニアはものすごくデザインができる必要はありませんが、簡単なデザインの原則とかデザインソフトの使い方などがある程度分かっていると良いですね。デザイナーもエンジニアばりに実装ができる必要はないですが、実装を踏まえたデザインができるのが理想です。このデザインは実装が難しそうだとか、実装の際にデータが重くなりすぎないかなど、完全にではなくてもいいので、部分的に互いの領域（知識やスキル）を持ち合わせていると意思疎通で苦労しにくくなります。転身する際も他職種への理解が深くなると思います。


僕自身がエンジニアになってからマインド面で変わったこととしては、「表側」よりも「裏側」を気にするようになったことですかね。自分がデザイナーの時はいかにビジュアルを良くするかを考えていましたし、画面をいかにキレイに作れるか、ファーストビューでインパクトを与えられるかに主眼を置いていました。一方、エンジニアとしてはよりWebの機能性なども気をつけるようになりました。画像をたくさん使ってキレイなビジュアルにしたいのはもっともですが、使いすぎることで読み込みに時間がかかってパフォーマンスが落ちることを気にします。「同じパーツを使い回して効率的に作ったほうがいいよね」と、僕自身も「裏側」を考えるエンジニア視点が身についてきました。

◆職種が変わったことによるプラス面とマイナス面とは

僕はデザイナー時代からフロントエンドの業務も請け負っていました。デザインを主軸に置きつつ、コーディングを中心にしたフロントエンドにも対応していたイメージです。転職して職種がフロントエンドエンジニアになったことで、実装の役割に集中できるようになったのが大きな変化でした。分業体制の会社で、フロントエンドに集中したことでよりスキルを高めることに集中できた面がありました。
 
フロントエンドエンジニアに転身して困ったことは、デザインと分業になることで時にコミュニケーションで齟齬が生まれることです。デザインから実装までのWeb制作周りが全部できるのは楽ではあるんですよ。なぜなら自分で考えたデザインイメージをそのまま実装に落とせばいいだけなので。デザイナーとエンジニアの意思疎通がしっかりできていないと良い成果物になりません。
 
自分の場合はもともとデザインをやっていたため、意思疎通にそこまで苦はなく、共通認識を持ちやすい傾向にありました。もちろん苦労しなかったわけではありませんが、比較的やりやすかったとも言えます。また、Webデザイナーを経験していたからこそ気づく違和感などもありました。Webデザイナーからフロントエンドエンジニアへの転身をご検討している方は、デザイナー視点を持っていることが武器になることを意識すると良いかもしれません。

・・・

ー Twitter

ー クリエイターキャリア支援メディア『HIGH‐FIVE』

ー LINE

ー Instagram