デザインエンジニア：デザインとコードの受け渡しをなくす職種

同じ会社で、シニアセキュリティエンジニアより上の年俸レンジがつく

Rampのニューヨークのデザインエンジニア募集は、年収レンジが$172Kから$440Kだ。同じ会社のシニアセキュリティエンジニア募集は$236Kで終わる。下限は同じで、上限は倍近く開いた。フィンテック企業が、セキュリティの経験年数より画面の仕上げに高い値を付けられると判断したことになる。

仕事の中身ははっきりしている。モックアップを描いて開発者に渡す代わりに、アイデアをそのままプロダクションコードにする。インタラクション、モーション、デザインシステム、アクセシビリティまで、ユーザーが手で触れる層の全部が一人の範囲だ。コードを覚えたデザイナーもいれば、デザインの目を鍛えたフロントエンドエンジニアもいる。採用側が見るのは出身ではなく、受け渡しなしで完成させられるかどうかだ。何を作るかまで持つプロダクトエンジニアとも違う。この席の勝負は、どう見えてどう動くかにある。

Vercelがこの職種名を広めた代表格で、同社のデザインエンジニアはマーケティングページから製品UI、社内デザインシステムまで横断して働く。GitHubやUberにも近い席があり、ミュンヘンのスタートアップMercuraのような小さな会社まで同じ職名で採用を始めた。米国の大手プロダクト企業の専売だった名前が、採用市場の全体に広がりつつある。

日本語では注意が一つ要る。「設計エンジニア」と訳すと機械設計を指すことが多く、ここで扱うのはWeb系のデザインエンジニアだ。需要が伸びる背景には生成ツールがある。それらしいUIを誰でも数分で出せるようになった結果、平凡な画面の値段は下がり、最後の5%を仕上げる手の値段が上がった。Rampの募集の要求スタックにReact、TypeScriptと並んでLLMが書かれているのはそのためだ。ツールが下書きを作り、人が仕上げに責任を持つ。

土台はプロダクション水準のフロントエンドだ

土台はプロダクション水準のフロントエンドだ。ReactとTypeScriptで性能を落とさずにモーションを載せられること、フレームワークに頼らなくてもCSSが手に馴染んでいること。その上にデザインの基礎が乗る。タイポグラフィ、余白、色のコントラストを自分で判断できないと、デザイナーがいない場面で決定が止まる。

• デザインシステム：トークン設計とコンポーネントAPI。作った本人が抜けても他人が拡張できる構造
• インタラクション実装：バネの物性、イージング、ドラッグの詳細をコードで。ライブラリを選んだ理由を説明できる水準
• プロトタイピングの速さ：会議で言い合う代わりに、翌日動くデモを持ってくる習慣
• アクセシビリティ：キーボード操作とスクリーンリーダー対応。仕上げ品質の一部であって別項目ではない
• 生成ツールの運用：LLMで下書きを出し、捨てる判断ができる手。Rampの募集が要件に明記している

ポートフォリオの基準が他の職種と違う。モックアップ画像は証拠にならない。デプロイ済みのリンク、触れるインタラクション、他人が実際に使っているデザインシステムだけが数えられる。

フロントエンド開発者から始め、決定権を持ち込む

入り口はたいていフロントエンドエンジニアだ。ジュニアの区間ではデザインシステムのコンポーネントに貢献しながら、デザイン判断を横で吸収する。シニアになると製品画面ひとつのルック&フィールを丸ごと持ち、デザイナーと対等に視覚の決定に加わる。スタッフの区間はデザインシステムとブランド表現の全体に責任を持ち、次の採用基準を作る席だ。

報酬は会社による開きが大きい。Built Inの集計では2026年の米国デザインエンジニアの平均基本給は$148,301、レンジは$83Kから$233Kだ。そこからRampの上限$440Kまでの距離が、この職種の現在地を示す。平均的な会社ではフロントエンドエンジニア並みで、仕上げ品質で競う一部のプロダクト企業ではセキュリティエンジニアを超える。

日本の求人でこの職名はまだ少ない。新卒採用では職種の枠が先に決まり、デザイナーとエンジニアの分業がはっきりした会社が多いから、同じ仕事はフロントエンド募集の「デザインシステム構築経験歓迎」の一行に隠れている。職名がなくても道がないわけではない。現実的な準備は、デプロイ済みのデモを一つ、最後まで磨き切ることだ。新作を増やすより、手元の一つにダークモードのコントラスト、キーボードフォーカス、イージングの値まで埋めておくほうがいい。リンクを開いて30秒触れば、仕上げがどこまでかそのまま見える。