← Back to the collection
VISUAL COMPUTING / 2024—2026 / INTERACTIVE APPLICATION

A landscape made of language.

Word Embeddings

Ten thousand words, each with 200 dimensions. A browser-based exploration of relationships, analogies, and the space between meanings.

MEDIUM
  • JavaScript
BUILT WITH
  • React
  • Three.js
  • Web Workers
  • Typed arrays
ACCESS

Private source · project overview

Word Embeddings demonstrating king minus man plus woman, a semantic neighborhood around greek, and a path from computer to internet
EXPLORE THE APPLICATIONLaunch Project
32 seconds · word arithmetic, semantic neighborhoods, and paths · from my demo recordings.Open film ↗
01

Giving vectors a place

A Word2Vec tensor and its word labels become a navigable point cloud. Search focuses a word, relationship fields connect two terms, and vector arithmetic explores analogies. It turns an otherwise abstract table of numbers into something you can move through.

02

Keep the interface responsive

A Web Worker loads and parses the binary tensor and calculates a deterministic projection. The original Float32Array buffer is transferred back to the main thread instead of copied. Instanced point rendering and an adjustable visible-word count keep the scene manageable.

SYSTEM SKETCH / CONCEPTUAL OVERVIEW
BINARY VECTORS + LABELS
          │
          ▼
     WEB WORKER
  parse → centre → project
          │ transfer buffer
          ▼
  INSTANCED 3D POINTS  ←  search / inspect
          │
  ORIGINAL 200D VECTORS → cosine similarity
A reading of the architecture, not an application screenshot.
SYSTEM MAP / WORKER BOUNDARY / DATA FLOW

A worker prepares the map. Vectors keep the meaning.

Tensor + word labels → embeddingWorker: load / parse. embeddingWorker → useWordEmbeddings: postMessage · transfer buffer. useWordEmbeddings → vectorMath: original 200D vectors. useWordEmbeddings → CartesianSpace: projected positions. EmbeddingViewer → vectorMath: query. vectorMath → CartesianSpace: matches + relationships.12345601 / ASSETSTensor + word labelsBinary vectors · TSV labels200 dimensions per word02 / WORKER THREADembeddingWorkerloadTensor / loadWordsDeterministic random projection03 / MAIN THREADuseWordEmbeddingsReceives labels + 3D positionsTransferred Float32Array buffer04 / ORIGINAL VECTOR SPACEvectorMathCosine search + arithmeticSemantic neighbours + paths05 / 3D VIEWCartesianSpaceInstanced points + word labelsFocus, halo and path geometry06 / INTERACTIONEmbeddingViewerSearch / analogy / path inputsVisible word count + inspection
  1. 01 / assets

    Tensor + word labels

    Binary vectors · TSV labels

    200 dimensions per word

    • load / parse → 2. embeddingWorker
  2. 02 / worker thread

    embeddingWorker

    loadTensor / loadWords

    Deterministic random projection

    • postMessage · transfer buffer → 3. useWordEmbeddings
  3. 03 / main thread

    useWordEmbeddings

    Receives labels + 3D positions

    Transferred Float32Array buffer

    • original 200D vectors → 4. vectorMath
    • projected positions → 5. CartesianSpace
  4. 04 / original vector space

    vectorMath

    Cosine search + arithmetic

    Semantic neighbours + paths

    • matches + relationships → 5. CartesianSpace
  5. 05 / 3D view

    CartesianSpace

    Instanced points + word labels

    Focus, halo and path geometry

    • 06 / interaction

      EmbeddingViewer

      Search / analogy / path inputs

      Visible word count + inspection

      • query → 4. vectorMath
    1. 1Tensor + word labels embeddingWorkerload / parse
    2. 2embeddingWorker useWordEmbeddingspostMessage · transfer buffer
    3. 3useWordEmbeddings vectorMathoriginal 200D vectors
    4. 4useWordEmbeddings CartesianSpaceprojected positions
    5. 5EmbeddingViewer vectorMathquery
    6. 6vectorMath CartesianSpacematches + relationships
    Projection makes a navigable picture; similarity calculations use the original vectors. The worker’s older pcaReducer name does not describe full PCA.
    Read from the implementation
    • workers/embeddingWorker.js
    • hooks/useWordEmbeddings.js
    • utils/vectorMath.js
    • components/CartesianSpace.jsx
    • pages/EmbeddingViewer.jsx
    03

    The map is not the territory

    The scene uses a deterministic random projection, not full PCA, despite an older helper name. Analogy search uses cosine similarity in the original 200-dimensional vectors. Three-dimensional proximity is a visual aid; it is not a faithful measure of every semantic relationship.

    04

    Three ways into the space

    Word arithmetic draws an analogy one step at a time. A neighborhood halo reveals nearby words and similarities. Path mode traces intermediate words between a start and destination. The film shows all three using the actual application interface and results.

    CONTINUE EXPLORING

    3D Pathfinding →

    A 3D pathfinding and learning environment. Compare deterministic graph search with an agent learning from rewards, repeated journeys, and negative sink states.

    2020—2026
    • JavaScript