<p data-line="0" class="code-line">こんにちは！<br>
株式会社マトリックス ゲーム事業部 デザイン一課 の遠藤です。<br>
遊技機開発にて2Ｄデザインをメイン業務として担当しております。<br>
遊技機2Dデザインに興味を持って欲しい！という想いからこの仕事の<br>
魅力とノウハウをブログにまとめていきます！</p>
<h1 id="%E9%81%8A%E6%8A%80%E6%A9%9F2d%E3%83%87%E3%82%B6%E3%82%A4%E3%83%8A%E3%83%BC%E3%81%A8%E3%81%84%E3%81%86%E4%BB%95%E4%BA%8B" data-line="5" class="code-line">
<a class="header-anchor-link" href="#%E9%81%8A%E6%8A%80%E6%A9%9F2d%E3%83%87%E3%82%B6%E3%82%A4%E3%83%8A%E3%83%BC%E3%81%A8%E3%81%84%E3%81%86%E4%BB%95%E4%BA%8B" aria-hidden="true"></a> 遊技機2Dデザイナーという仕事</h1>
<p data-line="6" class="code-line">パチンコ、パチスロには液晶モニターが付いていて、「液晶演出」と呼ばれる抽選の当落を表す<br>
演出（動画）があります。この演出に必要なデザインを作成するのが「2Dデザイナー」の仕事です。<br>
パチンコとパチスロでは作るものが異なりますが、スキルとしては同等と思って頂いて問題ありません。</p>
<p data-line="10" class="code-line">パチンコ、パチスロを打たない人にとっては、遊技機開発のデザインはまったく未知の世界かもしれません。<br>
17年この仕事に携わって来ましたが、映像クオリティーが年々上がっていて<br>
新しいアニメやゲームIPが次々と登場し、さまざまな作品に関わる機会が増えています。<br>
IPを意識したデザインを求められるため、考え提案するやりがいのある仕事です！</p>
<p data-line="15" class="code-line">インターネット上でも遊技機2Dデザインに関する情報は非常に少ないのが実情です。<br>
どんな仕事なのか？　必要なスキルは？　どこにやり甲斐があるのか？　<br>
などなど、遊技機2Dデザインに興味を持っても、分からない事がたくさん出てくると思います。<br>
一つ一つ疑問をフォローしていきたいと思います。<br>
まずは2Dデザインの担当個所を一部ご紹介します。</p>
<h1 id="2d%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%AE%E6%8B%85%E5%BD%93%E5%80%8B%E6%89%80" data-line="21" class="code-line">
<a class="header-anchor-link" href="#2d%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%AE%E6%8B%85%E5%BD%93%E5%80%8B%E6%89%80" aria-hidden="true"></a> 2Dデザインの担当個所</h1>
<p data-line="22" class="code-line">2Dデザインの担当部分について、パチンコの表示物を一部参考にしながら説明いたします。<br>
実機の映像はお見せできないため、弊社のオリジナルデザインでご紹介いたします。<br>
<img src="https://storage.googleapis.com/zenn-user-upload/4676c6370113-20241021.png" loading="lazy" class="md-img"></p>
<h2 id="%E3%80%90%E5%9B%B3%E6%9F%84%E3%80%91%E3%80%90%E6%95%B0%E5%AD%97%E5%9B%B3%E6%9F%84%E3%80%91" data-line="26" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E5%9B%B3%E6%9F%84%E3%80%91%E3%80%90%E6%95%B0%E5%AD%97%E5%9B%B3%E6%9F%84%E3%80%91" aria-hidden="true"></a> 【図柄】【数字図柄】</h2>
<p data-line="27" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/d392810bd333-20241022.png" loading="lazy" class="md-img"><br>
キャラクターと数字図柄の組み合わせが一般的です。<br>
キャラ構図、フレームデザイン、数字図柄をデザインします。<br>
一番、目にする機会が多い表示物です。魅力的に感じるデザインを目指して工夫します。</p>
<h2 id="%E3%80%90ui%E3%80%91%E3%80%90%E4%BF%9D%E7%95%99%E3%80%91" data-line="32" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90ui%E3%80%91%E3%80%90%E4%BF%9D%E7%95%99%E3%80%91" aria-hidden="true"></a> 【UI】【保留】</h2>
<p data-line="33" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/488d8d904c28-20241022.png" loading="lazy" class="md-img"><br>
IPを意識したインターフェイスデザインが必要になります。<br>
ステージによって役割やデザインが異なります。立体的にデザインすることが多いです。</p>
<h2 id="%E3%80%90%E3%83%AD%E3%82%B4%E3%80%91%E3%80%90%E6%96%87%E5%AD%97%E3%83%86%E3%83%AD%E3%83%83%E3%83%97%E3%80%91" data-line="37" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E3%83%AD%E3%82%B4%E3%80%91%E3%80%90%E6%96%87%E5%AD%97%E3%83%86%E3%83%AD%E3%83%83%E3%83%97%E3%80%91" aria-hidden="true"></a> 【ロゴ】【文字テロップ】</h2>
<p data-line="38" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/dd57fed371d3-20241022.png" loading="lazy" class="md-img"><br>
演出の期待度によってデザインの派手さ盛り具合を加減します。<br>
業務のメインと言っても過言では無いほど、文字系のデザインが多いです。</p>
<h1 id="%E5%BF%85%E8%A6%81%E3%81%AA%E3%82%B9%E3%82%AD%E3%83%AB%E3%80%81%E3%83%84%E3%83%BC%E3%83%AB" data-line="42" class="code-line">
<a class="header-anchor-link" href="#%E5%BF%85%E8%A6%81%E3%81%AA%E3%82%B9%E3%82%AD%E3%83%AB%E3%80%81%E3%83%84%E3%83%BC%E3%83%AB" aria-hidden="true"></a> 必要なスキル、ツール</h1>
<p data-line="43" class="code-line">Photoshopがメインツールです。他にもIllustrator、CLIP STUDIO PAINTも併用して使います。<br>
2Dツール以外にも3D素材をつかったり、Element 3Dでパスから3Dを作ったりもします。<br>
Photoshopの機能を使いこなしたい！　という方にはスキルアップになるお仕事です。</p>
<h2 id="%E3%80%90photoshop%E3%80%91" data-line="47" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90photoshop%E3%80%91" aria-hidden="true"></a> 【Photoshop】</h2>
<p data-line="48" class="code-line">ブラシ、パス、テキスト、レイヤースタイル、グラデーションマップ、スマートオブジェクト、レイヤーカンプなど<br>
多くの機能を組み合わせ、クオリティーの高い作品を制作します。<br>
加えてEye Candyなどのプラグインも使用します。</p>
<h2 id="%E3%80%90illustrator%E3%80%91" data-line="52" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90illustrator%E3%80%91" aria-hidden="true"></a> 【Illustrator】</h2>
<p data-line="53" class="code-line">パスのアウトラインを拡張、縮小、パスをPhotoshopとリンクしたりなど<br>
サブツールとして使用しています。</p>
<h2 id="%E3%80%90clip-studio-paint%E3%80%91" data-line="56" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90clip-studio-paint%E3%80%91" aria-hidden="true"></a> 【CLIP STUDIO PAINT】</h2>
<p data-line="57" class="code-line">イラスト系の作業はクリスタで対応する場合が多いです。<br>
遊技機で多く使われる筆文字、ガラス割れ、手書きエフェクトも描きます。<br>
他にも3Dオブジェクトの読み込み、素材集としても使用しています。</p>
<h1 id="%E5%9B%B3%E6%9F%84%E5%88%B6%E4%BD%9C%E3%81%AB%E3%81%8A%E3%81%91%E3%82%8Bphotoshop%E6%A9%9F%E8%83%BD%E3%82%92%E8%A7%A3%E8%AA%AC" data-line="61" class="code-line">
<a class="header-anchor-link" href="#%E5%9B%B3%E6%9F%84%E5%88%B6%E4%BD%9C%E3%81%AB%E3%81%8A%E3%81%91%E3%82%8Bphotoshop%E6%A9%9F%E8%83%BD%E3%82%92%E8%A7%A3%E8%AA%AC" aria-hidden="true"></a> 図柄制作におけるPhotoshop機能を解説</h1>
<p data-line="62" class="code-line">図柄作成の際にPhotoshopのどの機能を使っているの解説です。<br>
<img src="https://storage.googleapis.com/zenn-user-upload/9c7b7586d017-20241021.png" loading="lazy" class="md-img"></p>
<h2 id="%E3%80%90%E2%91%A0%E3%83%96%E3%83%A9%E3%82%B7%E3%80%91" data-line="65" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E2%91%A0%E3%83%96%E3%83%A9%E3%82%B7%E3%80%91" aria-hidden="true"></a> 【①ブラシ】</h2>
<p data-line="66" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/4f0192906f9f-20241022.png" loading="lazy" class="md-img"><br>
キャラクターの着彩はもちろん、レイヤースタイルベベルとエンボスの雑味が強い箇所への加筆。</p>
<h2 id="%E3%80%90%E2%91%A1%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%E3%82%B9%E3%82%BF%E3%82%A4%E3%83%AB%E3%80%91" data-line="69" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E2%91%A1%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%E3%82%B9%E3%82%BF%E3%82%A4%E3%83%AB%E3%80%91" aria-hidden="true"></a> 【②レイヤースタイル】</h2>
<p data-line="70" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/5e4e712a6afd-20241022.png" loading="lazy" class="md-img"><br>
デザイン物を作るうえでの基本機能。<br>
ベベルエンボス、グラデーション、光彩、パターン（質感、柄）でベースとなる素材を作ります。</p>
<h2 id="%E3%80%90%E2%91%A2%E3%83%91%E3%82%B9%E3%80%91" data-line="74" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E2%91%A2%E3%83%91%E3%82%B9%E3%80%91" aria-hidden="true"></a> 【③パス】</h2>
<p data-line="75" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/f69accd8c555-20241022.png" loading="lazy" class="md-img"><br>
各パーツの下地となる形状をパス（シェイプ）で作成します。<br>
拡縮の自由度も高く、ラインが綺麗に取れるためクオリティーを担保出来ます。</p>
<h2 id="%E3%80%90%E2%91%A3%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%83%9E%E3%83%83%E3%83%97%E3%80%91" data-line="79" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E2%91%A3%E3%82%B0%E3%83%A9%E3%83%87%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3%E3%83%9E%E3%83%83%E3%83%97%E3%80%91" aria-hidden="true"></a> 【④グラデーションマップ】</h2>
<p data-line="80" class="code-line"><img src="https://storage.googleapis.com/zenn-user-upload/15215e0f2b4e-20241022.png" loading="lazy" class="md-img"><br>
レイヤースタイルのグラデーションで下地を作り、グラデーションマップで仕上げます。<br>
金属の表現はグラデーションマップで リアルに再現！<br>
金⇒銀に変えたい時など色替えにも便利な機能です。</p>
<h1 id="%E3%81%A9%E3%81%93%E3%81%AB%E3%82%84%E3%82%8A%E7%94%B2%E6%96%90%E3%81%8C%E3%81%82%E3%82%8B%E4%BB%95%E4%BA%8B%E3%81%AA%E3%81%AE%E3%81%8B%EF%BC%9F" data-line="85" class="code-line">
<a class="header-anchor-link" href="#%E3%81%A9%E3%81%93%E3%81%AB%E3%82%84%E3%82%8A%E7%94%B2%E6%96%90%E3%81%8C%E3%81%82%E3%82%8B%E4%BB%95%E4%BA%8B%E3%81%AA%E3%81%AE%E3%81%8B%EF%BC%9F" aria-hidden="true"></a> どこにやり甲斐がある仕事なのか？</h1>
<h2 id="%E3%80%90%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%82%B9%E3%82%AD%E3%83%AB%E3%82%A2%E3%83%83%E3%83%97%E3%80%91" data-line="87" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%82%B9%E3%82%AD%E3%83%AB%E3%82%A2%E3%83%83%E3%83%97%E3%80%91" aria-hidden="true"></a> 【デザインスキルアップ】</h2>
<p data-line="88" class="code-line">1人のデザイン作業として対応する範囲が多岐にわたり、様々なデザインを考える必要があります。<br>
一つの項目に対して2，3案方向性の違うデザインを提案しなければなりません。<br>
凄く大変で考えるのも辛い時がありますが、インプットを素早く、アイデアを補うようにしています。<br>
それらを繰り返してるうちに引き出しが広がりスキル幅が広がった実感がわきます！</p>
<h2 id="%E3%80%90%E3%83%84%E3%83%BC%E3%83%AB%E7%86%9F%E7%B7%B4%E5%BA%A6%E3%82%A2%E3%83%83%E3%83%97%E3%80%91" data-line="93" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E3%83%84%E3%83%BC%E3%83%AB%E7%86%9F%E7%B7%B4%E5%BA%A6%E3%82%A2%E3%83%83%E3%83%97%E3%80%91" aria-hidden="true"></a> 【ツール熟練度アップ】</h2>
<p data-line="94" class="code-line">Photoshop の機能をフルに活用する仕事なので、ツールに対して理解が深まります。<br>
レイヤーとレイヤースタイルを重ねる事でクオリティーを上げていく事が出来ますし<br>
遊技機デザインは特に質感、色彩、光沢、立体を強く出す表現が多いため<br>
ツールの機能を理解する機会にもなります。<br>
遊技機開発に関わったスタッフはマルチに活躍出来ている印象があります！</p>
<h2 id="%E3%80%90%E7%89%88%E6%A8%A9%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E3%81%8C%E5%A4%9A%E3%81%84%E3%80%91" data-line="100" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E7%89%88%E6%A8%A9%E3%82%BF%E3%82%A4%E3%83%88%E3%83%AB%E3%81%8C%E5%A4%9A%E3%81%84%E3%80%91" aria-hidden="true"></a> 【版権タイトルが多い】</h2>
<p data-line="101" class="code-line">近年のパチンコ、パチスロはアニメ、ゲーム版権のタイトルがほとんどです。<br>
知っているアニメや好きな作品に関わることが多く、モチベーションが上がります！<br>
オリジナルタイトルではデザインの自由度も格段に上がるので、さらにやり甲斐を感じます。</p>
<h2 id="%E3%80%90%E9%81%8A%E6%8A%80%E6%A9%9F%E5%A5%BD%E3%81%8D%E3%81%AB%E3%81%AF%E5%A4%A9%E8%81%B7%E3%80%91" data-line="105" class="code-line">
<a class="header-anchor-link" href="#%E3%80%90%E9%81%8A%E6%8A%80%E6%A9%9F%E5%A5%BD%E3%81%8D%E3%81%AB%E3%81%AF%E5%A4%A9%E8%81%B7%E3%80%91" aria-hidden="true"></a> 【遊技機好きには天職】</h2>
<p data-line="106" class="code-line">普段からパチンコ、パチスロを遊ぶ人にとって業界の最前線で仕事を出来るのはモチベアップ！！<br>
好きなタイトルの続編に関わることもあるので、自分のスキルをアピール出来てやり甲斐があります。<br>
一緒に仕事をするメンバーもパチンコパチスロ大好きな人ばかりなので直ぐに意気投合できます！</p>
<h1 id="%E3%81%BE%E3%81%A8%E3%82%81" data-line="110" class="code-line">
<a class="header-anchor-link" href="#%E3%81%BE%E3%81%A8%E3%82%81" aria-hidden="true"></a> まとめ</h1>
<p data-line="111" class="code-line">第1回の遊技機2Dデザインブログは、遊技機を知らない2Dデザイナー（志望）さん向けに遊技機2Ｄデザインってどんな仕事？<br>
を知ってもらって少しでも興味を持って欲しいという想いから、あれこれ書いてみました。<br>
遊技機開発に関する情報は秘匿性が高くネット上で検索してもなかなか見つからないかと思います。<br>
弊社に遊技機２Dデザイナー志望で応募される方の中には遊技機に関して全く知らない人もいらっしゃるので<br>
このブログをきっかけに知る機会になりましたら幸いです。</p>
<p data-line="117" class="code-line">今後はより遊技機デザインをする上での注意点や、技術的な面にも触れていきたいと思いますので<br>
また読んでもらえたら嬉しいです！</p>
<h1 id="%E6%AC%A1%E5%9B%9E%E4%BA%88%E5%91%8A" data-line="120" class="code-line">
<a class="header-anchor-link" href="#%E6%AC%A1%E5%9B%9E%E4%BA%88%E5%91%8A" aria-hidden="true"></a> 次回予告</h1>
<p data-line="121" class="code-line">第2回は遊技機２Dデザインをする上で意識しなければならない点をまとめた内容にしたいと考えています。<br>
独自ルールが沢山ある遊技機界隈…知らずにデザインすると大変な事に…<br>
ならないように情報共有したいと思いますので是非次回も見てください！</p>


遊技機2Dデザイナー歴17年のノウハウをブログに書いてみた

遊技機2Dデザイナーという仕事

図柄制作におけるPhotoshop機能を解説

どこにやり甲斐がある仕事なのか？

Discussion