1kkaku / Junichi Kasahara / 笠原 順一

Selected works

• 

  Pixel-Voxel-Drop

  Using Three.js and shaders, this satisfying visual effect pixelates a 2D video with ripple dynamics, extrudes it into 3D voxels, and shatters them using the Rapier physics engine. I've contributed a demo and tutorial on Codrops, breaking down the core concepts of this effect in detail.

  Three.jsとShaderを使用し、2Dの動画をリップルエフェクトでピクセル化しながら3Dのボクセルへ、 さらにはRapierの物理エンジンでバラバラに落下させるという、Satisfyingな表現。 Codropsにてデモとチュートリアルを寄稿し、このエフェクトの核心を解説しています。

  Codrops Tutorial Demo Satisfying
  
• 

  3D-Ascii-Cloth

  What if ASCII characters could behave like real cloth and rigid bodies? This experimental project explores a new approach to 3D ASCII using Three.js and Rapier, where text tears, flows, and collapses under physics.

  もしASCII文字が布や剛体のように振る舞えたらどうだろうか。 Three.jsとRapierを使用して、テキストが物理法則に従って引き裂かれ、流動し、 崩れ落ちるという、3D-ASCIIの新しいアプローチを追求した実験的プロジェクト。

  Physics AsciiArt Typorgaphy Demo
  
• 

  Hole

  "Dimensional Voxel Morphing" triggered by the context of the footage. A flat video transforms into voxels, where coffee in a cup flows into liquid, and a smashed ball scatters as solid spheres—leaving a hole behind in the footage.

  フッテージのコンテクストをトリガーにした”ボクセル・モーフィング”。 平面の動画がボクセルへと変化し、カップの中のコーヒーが液体へと、スマッシュされたボールがまさに球体となって散らばる。そして残されたフッテージには穴が残る。。。

  Morphing Video Context
• 

  Ink

  "Dimensional Voxel Morphing" triggered by the context of the footage. A 2D ink video transforms—some parts casting into solid voxels, others squirming as viscous jelly—before seamlessly flowing back into flat video.

  フッテージのコンテクストをトリガーにした”ボクセル・モーフィング”。 2Dフラットなインクが流れる映像が、あるものはソリッドなボクセルとなって空間に投げ出され、あるものは粘性のゼリーとなって、うごめく。 そして何事もなかったかのようにインクが流れる映像へとまた戻っていく。。。

  PixelArt VoxelArt Morphing Video Context
• 

  Postal Code Clock

  This clock matches the current time (HH:MM) to the last four digits of real Japanese postal codes, displaying the corresponding regions. When time and postal codes intersect, unknown corners of Japan emerge on screen—turning the clock from a compass of time travel into one of space travel to unfamiliar lands.

  現在時刻（HH:MM）を下4桁にもつ実在の郵便番号を検索し、その地域を表示していく時計。 郵便番号と時刻が重なり合う瞬間、スクリーンには行ったこともない「日本のどこか」が立ち現れる。 タイムトラベルを導くコンパスであった時計は、ここで見知らぬ土地へと導くスペーストラベルのコンパスにもなっている。

  Signage DigitalArt KITTE OSAKA
  
• 

  The Just Clock / 正しい時計

  One stroke at a time, every second, the character "正" (Sei) takes shape. As Japan’s tally mark, it also carries meanings of precision, fairness, and by extension, justice. No two characters created here are alike—some linger, others wander, colliding over "rightness": a catalyst for conflict, yet a refuge that unites the world. And so, the "world" keeps ticking on, precisely in time.

  1秒ごと、1画ずつ、「正」の文字が形づくられる。 「正」の字は、「正確さ」や「正しさ」、延いては「正義」の意味をもつ言葉でもある。 ここで生み出された文字たちに同じものはない。留まり、動きまわり、反発する。まるで自身の「正しさ」を振りかざして干渉しあうように。 世界は「正しさ」を巡って争いながら、また世界は「正しさ」を拠り所に一つになる。 そして「世界」はまた「正しく」時を刻む。

  PIXI.JS DigitalArt Clock
  
• 

  The Temporal Strata

  The present rests upon the past. What would it look like if we divided a video into an arbitrary grid, mapping its luminance to Z-depth while continuously stacking past frames behind? The accumulated layers behave like a pliant soft body, where the present is vividly and volumetrically thrust forward by the past.

  現在は過去の積み重ねの上にある。映像を任意のグリッドに分割し、その輝度をZ深度にマッピングしながら、過去のフレームを背後へと次々に重ね合わせていったらどうなるだろうか。 積層されたレイヤーは柔軟なソフトボディのように振る舞い、現在という瞬間が過去によって鮮やかに、そして立体的に押し出されていく。

  Physics PixelArt Video
• 

  Consists Of Voxels

  This project applies “Pixel-Voxel-Drop” to the human body through MediaPipe Edge AI via webcam. Hand-tracking triggers allow free control over the collapse and reconstruction of the entire body or clothing alone. Through this loop, human presence and the physical body are redefined as a collection of voxels.

  "Pixel-Voxel-Drop"をさらにMediaPipeのエッジAIを通して、人体へと応用したウェブカメラ。 人体そのものや服だけなど、ハンドトラッキングによるトリガーで自在に崩壊と再構成をコントロール。 このループにより、人物の存在、その肉体をボクセルの集合として再定義している。

  Mediapipe VoxelArt CamereApp Edge-AI
• 

  Like Shatter Glass

  What would it look like if we treated a video plane like a rigid, vitreous wireframe and destroyed it? Interactively shattering it is immensely satisfying. It shatters like a breaking glass tube, leaving behind nothing but glowing crystal shards.

  映像を硬質なガラス状のワイヤーフレームのように表現して、それらを破壊したらどうなるだろうか。 クリック操作だけで粉砕できる様子は、まさにSatisfying。ガラス管が割れるように粉々に砕け散り、後には光を放つ結晶の破片だけが残される。

  Satisfying Physics VoxelArt Video