第1章 全体像:Transformer Explainerで何が見えるのか
こんにちは。ゆうせいです。
本記事から、全14章にわたって、Transformer Explainerというツールで可視化されている要素技術を、一つずつ解説していきます。Transformer Explainerは、GPT-2というモデルがブラウザ上で実際に動き、入力した文章から次の単語を予測するまでの内部処理を、リアルタイムで見られるツールです。ただ、初めて開くと、画面には見慣れない用語とベクトルの図が並んでおり、どこから見ればよいのか分からないという声をよく聞きます。第1章では、個々の技術の説明に入る前に、全体の処理がどのような順番で流れているのかを把握します。地図を先に持っておくことで、以降の章で扱う技術が、全体のどこに位置しているのかを見失わずに済みます。
Transformer Explainerとは何か
まず、対象となるツールを確認します。
Transformer Explainerは、GPT-2(small)モデルをブラウザ上で直接動かす可視化ツールです。このモデルは、Andrej Karpathy氏のnanoGPTプロジェクトによるPyTorch実装から派生したもので、ブラウザ内での実行のためにONNX Runtime形式へ変換されています。インターフェースはJavaScriptで構築され、フロントエンドのフレームワークにSvelte、動的な可視化にD3.jsが使われています。数値は、利用者の入力に応じてリアルタイムに更新されます。
使用されているGPT-2(small)は、1億2400万個のパラメータを持つモデルです。最新でも最も強力でもありませんが、現在の最先端モデルと多くのアーキテクチャ上の構成要素と原理を共有しているため、基礎を理解する出発点として適しています。
この最後の点が、教材として使ううえで重要です。GPT-2は2019年に公開された、やや古いモデルです。しかし、そこで使われている部品の多くは、現在の大規模言語モデルにもそのまま引き継がれています。GPT-2で仕組みを理解しておけば、より新しいモデルの解説を読むときにも、土台として使えます。
全体の処理は3つの段階に分かれる
Transformer Explainerが可視化している処理は、大きく3つの段階に分けられます。
第一の段階は、埋め込み(Embedding)です。入力された文章を、数値のベクトルに変換します。
第二の段階は、Transformerブロックです。ベクトルを何度も変換しながら、文脈の情報を取り込んでいきます。
第三の段階は、出力確率の計算です。最終的なベクトルから、次に来る単語の候補と、それぞれの確率を計算します。
実際、Transformer Explainerの解説でも、テキスト生成型のTransformerは、埋め込み、Transformerブロック、そして出力の3つの主要な構成要素からなると説明されています。埋め込みでは、テキスト入力がトークンと呼ばれる小さな単位に分割され、それらのトークンが、単語の意味を捉えた埋め込みと呼ばれる数値ベクトルに変換されます。Transformerブロックは、入力データを処理し変換する、モデルの基本的な構成単位です。
この3段階を、もう少し細かく見ていきます。
段階1:入力を数値に変える(埋め込み)
コンピュータは、文字をそのまま計算できません。「今日はいい天気」という文章を数値に変える必要があります。この変換は、3つの手順で行われます。
手順1:トークン化
文章を、トークンと呼ばれる小さな単位に分割します。トークンは、単語そのものの場合もあれば、単語の一部(サブワード)の場合もあります。
たとえば「visualization」という英単語は、モデルによっては「visual」と「ization」のように分割されることがあります。この分割ルールを、あらかじめ学習データから決めておきます。
各トークンには、辞書のように番号が振られています。この番号を、トークンIDと呼びます。
手順2:トークン埋め込み
トークンIDは、単なる番号であり、意味を持ちません。ID番号の1番と2番が近いからといって、意味が近いわけではありません。
そこで、各トークンIDを、意味を表す数値のベクトルに変換します。このベクトルを埋め込み(Embedding)と呼びます。GPT-2(small)では、各トークンが768個の数値からなるベクトルに変換されます。
このベクトルは、意味が近い単語どうしが、ベクトル空間の中で近い位置に配置されるように学習されています。
手順3:位置エンコーディング
ここまでの処理では、単語の並び順の情報が失われています。「猫が犬を追いかけた」と「犬が猫を追いかけた」は、含まれる単語が同じであるため、埋め込みだけでは区別できません。
そこで、それぞれのトークンが文章の何番目にあるかという情報を、ベクトルとして加えます。これが位置エンコーディングです。
この3手順により、文章は「トークンの数 × 768」という形の数値の集まりに変換されます。この段階以降、モデルの内部では、文字ではなく、この数値の集まりだけが扱われます。
段階2:文脈を取り込む(Transformerブロック)
ここが、Transformerの中核です。埋め込みによって作られた数値の集まりを、Transformerブロックと呼ばれる処理単位に、繰り返し通していきます。
GPT-2(small)では、このブロックが12個、直列に並んでいます。同じ構造のブロックを12回通ることで、文脈の情報が段階的に深く取り込まれていきます。
1つのTransformerブロックの中では、大きく2つの処理が行われます。
処理1:マルチヘッド自己注意
自己注意(Self-Attention)とは、文章中の各トークンが、他のどのトークンに注目すべきかを計算する仕組みです。
たとえば「銀行の口座を開いた」という文における「口座」というトークンを処理するとき、「銀行」というトークンに強く注目することで、「口座」が金融の文脈の言葉であると判断できます。
Transformerの中核となる革新は、この自己注意機構にあります。系列全体を処理し、長距離の依存関係を、従来のアーキテクチャよりも効果的に捉えられるようにするものです。
この計算は、Query、Key、Valueという3つのベクトルを使って行われます。さらに、複数の視点から同時に注目先を計算するため、ヘッドと呼ばれる単位に分割して並列に処理します。これがマルチヘッドと呼ばれる仕組みです。
Transformer Explainerで最も画面の面積を占めているのが、この部分です。本連載でも、第5章から第10章までの6章をかけて、この仕組みを分解して説明します。
処理2:MLP層(全結合層)
自己注意で文脈の情報を取り込んだ後、各トークンのベクトルを、独立に変換する処理が行われます。この処理を担うのが、MLP層(多層パーセプトロン、全結合層)です。
自己注意がトークンどうしの関係を扱うのに対し、MLP層は、各トークンの内部の情報を、より豊かな表現に変換する役割を持ちます。
処理を安定させる仕組み
自己注意とMLP層の周囲には、残差接続とレイヤー正規化という仕組みが配置されています。
これらは、モデルの予測精度に直接寄与するというより、深い層を重ねても学習が安定するようにするための仕組みです。12個のブロックを積み重ねられるのは、この仕組みがあるからです。
段階3:次の単語を予測する(出力)
12個のTransformerブロックを通過した後、最後のトークンに対応するベクトルを使って、次に来る単語を予測します。
手順1:ロジットの計算
768次元のベクトルを、語彙の数だけの次元に変換します。GPT-2の語彙は約5万語ですから、5万個の数値が出力されます。
この段階の数値を、ロジットと呼びます。ロジットは、まだ確率ではありません。マイナスの値も含む、範囲の決まっていない数値です。
手順2:Softmaxによる確率化
ロジットに対してSoftmax関数を適用することで、すべての値が0から1の範囲に収まり、合計が1になる確率へと変換されます。
「次に来る単語が『天気』である確率は32パーセント、『気温』である確率は8パーセント」といった形になります。
手順3:温度による調整
Transformer Explainerには、温度(Temperature)というスライダーがあります。これは、確率の分布の尖り具合を調整するパラメータです。
温度を低くすると、最も可能性の高い予測を選ぶことに近づきます。より創造的な答えが欲しい場合には、温度を上げます。
温度を上げると、確率が平均化され、可能性の低い単語も選ばれやすくなります。生成される文章は多様になりますが、不自然になるリスクも高まります。逆に温度を下げると、最も確率の高い単語ばかりが選ばれ、文章は安定しますが、単調になります。
このスライダーを動かすと、画面上の確率の分布が即座に変化する様子が観察できます。パラメータと出力の関係を体感する上で、最も分かりやすい機能です。
全体の流れを一つの表で整理する
ここまでの内容を、処理の順序に沿って整理します。
| 順序 | 処理 | 入力 | 出力 | 解説する章 |
|---|---|---|---|---|
| 1 | トークン化 | 文章(文字列) | トークンIDの並び | 第2章 |
| 2 | トークン埋め込み | トークンID | 768次元のベクトル | 第3章 |
| 3 | 位置エンコーディング | 埋め込みベクトル | 位置情報を加えたベクトル | 第4章 |
| 4 | Query、Key、Valueの生成 | ベクトル | 3種類のベクトル | 第5章 |
| 5 | 内積による類似度の計算 | QueryとKey | 注目度のスコア | 第6章 |
| 6 | スケーリング | スコア | 調整されたスコア | 第7章 |
| 7 | 因果マスク | スコア | 未来を見えなくしたスコア | 第8章 |
| 8 | Softmaxと重み付き和 | スコアとValue | 文脈を反映したベクトル | 第9章 |
| 9 | マルチヘッドの結合と出力射影 | 各ヘッドの出力 | 統合されたベクトル | 第10章 |
| 10 | 残差接続 | 入力と出力 | 加算されたベクトル | 第11章 |
| 11 | レイヤー正規化 | ベクトル | 正規化されたベクトル | 第12章 |
| 12 | MLP層 | ベクトル | 変換されたベクトル | 第13章 |
| 13 | 出力層と温度 | 最終ベクトル | 次のトークンの確率 | 第14章 |
順序4から順序12までが、1つのTransformerブロックの中身です。この一式が、GPT-2(small)では12回繰り返されます。
初学者がつまずきやすい点
つまずき1:「ブロックが12個ある」ことの意味
Transformer Explainerの画面では、Transformerブロックが1つだけ大きく表示されていることがあります。実際には、同じ構造のブロックが12個、直列に並んでいます。
12個のブロックは、それぞれ異なる重み(パラメータ)を持っています。構造は同じですが、中身の数値は異なります。同じ処理を12回繰り返しているのではなく、同じ形の異なる処理を12回通っている、と理解してください。
つまずき2:「予測されるのは1トークンだけ」ということ
Transformerは、一度に文章全体を生成するわけではありません。1回の計算で予測するのは、次の1トークンだけです。
文章を生成する際は、予測したトークンを入力の末尾に追加して、もう一度、最初から計算をやり直します。この繰り返しによって、文章が1トークンずつ伸びていきます。
この点を理解していないと、「なぜ同じ計算を何度も行うのか」という疑問が解消されません。
つまずき3:ベクトルの次元数と、トークン数の混同
「768」という数字と、入力したトークンの数は、まったく別のものです。
768は、1つのトークンを表現するために使う数値の個数(次元数)です。トークンの数は、入力した文章の長さによって変わります。
画面上の行列を見るときは、縦がトークンの数、横が次元数(768)である、という対応を常に意識してください。
理解度を確認する問い
第1章の内容を、次の問いで確認してみてください。
Transformerの処理を、3つの大きな段階に分けて説明してみてください。
「猫が犬を追いかけた」と「犬が猫を追いかけた」を、モデルが区別できるのはなぜでしょうか。
温度パラメータを上げると、生成される文章はどのように変化するでしょうか。また、その理由は何でしょうか。
まとめ
Transformer Explainerが可視化しているGPT-2の処理は、埋め込み、Transformerブロック、出力確率の計算という3つの段階に分けられます。
埋め込みの段階では、文章がトークンに分割され、意味を表すベクトルに変換され、位置情報が加えられます。
Transformerブロックの段階では、自己注意によってトークンどうしの関係が計算され、MLP層によって各トークンの表現が変換されます。この処理単位が12個、直列に並んでいます。
出力の段階では、最終的なベクトルからロジットが計算され、Softmax関数によって確率に変換されます。温度パラメータによって、この確率分布の尖り具合を調整できます。
次の第2章では、この流れの最初の入口である、トークン化を扱います。文章がどのようなルールで分割されるのか、なぜ単語単位ではなくサブワード単位で分割するのか、日本語ではどのような問題が起きるのかを解説します。
第2章に進む前に、実際にTransformer Explainerを開き、短い英文を入力して、画面全体をひととおり眺めてみてください。この時点では、個々の数値の意味が分からなくても構いません。「入力が左にあり、右に向かって処理が流れ、最後に単語の候補が並ぶ」という大きな流れだけを、目で追ってみてください。その感覚を持っておくと、第2章以降の説明が、全体のどこに位置する話なのかを掴みやすくなります。
セイ・コンサルティング・グループでは新人エンジニア研修のアシスタント講師を募集しています。
投稿者プロフィール

- 代表取締役
-
セイ・コンサルティング・グループ株式会社代表取締役。
岐阜県出身。
海外放浪の末、2000年創業、2004年会社設立。
IT企業向け人材育成研修歴業界歴20年以上。
すべての無駄を省いた費用対効果の高い「筋肉質」な研修を提供します!
この記事に間違い等ありましたらぜひお知らせください。
学生時代は趣味と実益を兼ねてリゾートバイトにいそしむ。長野県白馬村に始まり、志賀高原でのスキーインストラクター、沖縄石垣島、北海道トマム。高じてオーストラリアのゴールドコーストでツアーガイドなど。現在は野菜作りにはまっている。
最新の投稿
新人エンジニア研修講師2026年8月10日第14章 出力層:ロジット、Softmax、そして温度パラメータ
新人エンジニア研修講師2026年8月10日第13章 MLP層とGELU:トークンごとの情報を加工する
新人エンジニア研修講師2026年8月10日第12章 レイヤー正規化:値のばらつきを揃えて学習を安定させる
新人エンジニア研修講師2026年8月10日第11章 残差接続:入力をそのまま足し合わせる仕組み
