この作品について
「墨 — sumi」は、和紙に見立てた画面に墨を置いて描く、インタラクティブな視覚作品です。 マウス、ペン、指のいずれでも操作できます。開くたびに、はじめに龍が一筆ずつ描かれます。 画面に触れればその場で筆が自分のものに変わり、続きを描けます。
操作方法
描き方は2通りあり、画面右下の左端のボタンで切り替えられます。既定は「筆」で、 マウスの左ボタンを押しながら、あるいは画面に触れたまま動かすと墨が出ます。 押していないときは何も起きないので、狙った位置に筆を構えてから引けます。 「自動」に切り替えると、押さずに動かすだけで墨が出ます。選んだ方は次に開いたときも保たれます。
ゆっくり動かすと濃く太く、速く動かすと細くかすれ、筆の運びがそのまま墨の表情になります。 ペンタブレットや Apple Pencil では筆圧も読み取ります。押し込めば太く濃く、 浮かせれば細くかすれます。開いたときに自動で描かれる龍も、この筆で引いたものです。 手を止めると、水中を漂っていた墨は流れの静まったところから順に紙へ吸われて定着し、 そのまま残ります。
画面右下のいちばん左は線の太さのつまみです。細い線から太い線まで、 つまんで動かすと連続で変わります。その右の「紙」を押すと「水」に切り替わり、 墨が水中に落ちたように広がって散っていきます。眺めるだけならこちらが向いています。
「色」を押すと、墨の色を11色から選べます。墨・藍・群青・緑・朱・紫・金・ 蛍光桃・蛍光青・黄・胡粉があり、一覧の最後の色玉からは、それ以外の色も 自由に選べます。色は筆に含ませるものなので、変えても すでに書いたものはそのまま残り、次に引く線から変わります。 一枚の紙に何色でも並べられます。違う色が重なったところでは、量に応じて混ざります。
その左の「白地」を押すと紙が黒くなります。紙は墨の下に敷き直すだけなので、 切り替えても書いたものは消えません。黒い紙に蛍光の色で書くと、線が光って見えます。 色はにじみ方や筆の運びには関わらないので、紙・水のどちらでも、太さがいくつでも 同じように使えます。選んだ色と紙は次に開いたときも保たれます。
「戻す」で直前の筆致を取り消せます(Ctrl+Z、Mac では Command+Z でも同じです)。 十回前まで戻れます。「保存」で今の画面を PNG 画像として書き出せます(S キーでも 同じ操作ができます)。「白紙」で墨をすべて消して最初の状態に戻せます。
使っている技術
WebGL2 と自作の GLSL シェーダーで、Jos Stam の Stable Fluids に基づく流体シミュレーションを GPU 上で解いています。速度場の移流、圧力ポアソン方程式のヤコビ反復による射影、 vorticity confinement、墨の濃度場の移流と濃度依存の異方性拡散を毎フレーム計算し、 和紙の質感と重ねて描いています。外部のライブラリは使っていません。
About this piece
Sumi (墨) is an interactive visual piece: a screen that stands in for washi paper, waiting for ink. It answers to a mouse, a pen, or a finger. Each time you open it, a dragon is drawn stroke by stroke. Touch the screen at any moment and the brush becomes yours, ready to carry on.
How to use it
There are two ways to draw, switched with the leftmost button in the bottom-right corner. The default is Brush: ink flows only while the mouse button is held down, or while a finger stays on the screen. Nothing happens when you are not pressing, so you can set the brush where you want it before you pull. Switch to Auto and ink flows from movement alone. Whichever you choose is remembered next time.
Move slowly and the ink runs dark and wide; move quickly and it thins and breaks into dry streaks. The way you carry the brush becomes the character of the line. Graphics tablets and Apple Pencil report pressure as well: press down for wider and darker, lift for finer and drier. The dragon drawn on arrival comes from this same brush. When you stop, the ink drifting in the water is drawn into the paper wherever the flow has settled, and stays there.
The slider at the left of the corner sets the line width, continuously from fine to broad. The Paper button beside it switches to Water, where ink spreads and disperses as though dropped into a tank. That is the mode to simply watch.
Color opens a choice of eleven inks — sumi black, indigo, ultramarine, green, vermilion, purple, gold, neon pink, neon blue, yellow and white — and the swatch at the end of the row opens the full colour picker for anything else. The colour belongs to the brush, so changing it leaves everything you have already drawn exactly as it is; only the next stroke changes. You can put as many colours on one sheet as you like, and where two of them overlap they mix in proportion to how much ink is there.
The White button beside it turns the paper black. Paper is laid underneath the ink, so switching it never removes what you have drawn. Neon colours on black paper look lit from within. Colour has no bearing on how the ink bleeds or how the brush behaves, so every colour works the same on paper or in water, at any line width. Your ink and paper are remembered next time.
Undo takes back the last stroke (Ctrl+Z, or Command+Z on a Mac), up to ten strokes back. Save writes the current screen out as a PNG image; the S key does the same. Clear removes all the ink and returns the paper to white.
How it works
A fluid simulation after Jos Stam's Stable Fluids runs on the GPU, written in WebGL2 with hand-written GLSL. Every frame advects the velocity field, projects it with Jacobi iterations of the pressure Poisson equation, applies vorticity confinement, and advects the ink density with concentration-dependent anisotropic diffusion, composited over the texture of the paper. No external libraries are used.