お絵描きシステムを忘れていませんか？

今回は「Gyaki（ぎゃき⁠）⁠」というお絵描きシステムを紹介します。

計算機やWebがこれだけ普及しているのに，お絵描きシステムが世の中であまり使われていないのが不思議です。iPad Pro，Surface Pro，Surface Bookのような魅力的なペン計算機が最近たくさん登場しているのにもかかわらず，ペンを使ったお絵描きシステムは広く活用されていませんし，普通のユーザがお絵描きするシチュエーションも，あまり想定されていないように見えるのは気のせいでしょうか。スマホが流行る以前は，PalmなどのPDA（Personal Digital Assistant：携帯情報端末）でメモを描く人も多かった気がするのですが，スマホやタブレットでお絵描きする人は以前より減っているような気がしています。

文章を使うよりも絵で説明するほうがわかりやすいことは多いでしょうし，デザインをスケッチしたいことも多いでしょうし，考えをまとめるために図を描きたいこともあるでしょうし，ペンで絵を描きたい機会は多いはずです。実際，紙のノートを活用している人は多いと思われますが，現在のパソコンはマウスやキーボードを使って，テキストや図を編集するのに使うのが普通だと思われており，ペンを使って知的生産活動を行うことはとくに推奨されていません。Palmのようなペン型PDAが広く使われていたときは，ペンによるお絵描きもそれなりに利用されていたと思うのですが，スマホが普及してペンが駆逐されたために，手書きでメモする機会が減ってしまったように思われます。

しかし，

• 性能が良いペンコンピュータが普及しつつある
• あらゆるブラウザでお絵描き機能が提供されている

という状況の現在，新しいWeb時代のお絵描きシステムが，もっと使われるべきだと思います。

Gyaki――ブラウザ上の手軽なお絵描きシステム

お絵描きアプリやWebサービスはたくさんありますが，達人のための機能を持つものが多く，とくにお絵描きが得意でない普通のユーザが手軽に使うためのものは多くありません。アイデアなどをメモしたくなったとき，最小の手間でお絵描きを開始して安全に保存できるようなお絵描きシステムを簡単に使えるようにしておきたいものです。

パソコンやタブレットで文章を書くときはエディタを起動するのが普通であるのと同様に，お絵描きするときはアプリを起動したりWebページを開いたりする必要があります。しかし絵を描く方法やセーブ方法を簡単化することによって，お絵描きのハードルを下げることはできるでしょう。私は，最小限の機能をもち手軽に利用できる「Gyaki」（⁠楽ギャキ）というシステムを作って使っています。

Gyakiでは，とにかく手軽にアイデアをスケッチすることを目標としているので次のような機能だけを用意しています。

• 手書きで線を描く
• 3種類の太さを選択
• 3種類の色（黒／灰色／白）を選択

一度描いたものを移動することはできませんし，undo機能すらありませんが，紙のスケッチでも同様ですし，たいていの場合においてそれでなんとかなっているわけですから，無理にたくさんの機能を用意する必要はないと割り切っています。

これらの機能だけを用意した理由は，情報科学芸術大学院大学（IAMAS）の小林茂氏の著書『Prototyping Lab』（⁠オライリー・ジャパン，2010年）で紹介されている「アイデアスケッチ」をスマホやタブレットで簡単に使いたいと考えたからです（図1⁠）⁠。アイデアスケッチは小林氏の同僚であるJames Gibson氏が考案したもので，学内外のワークショップなどを通じて小林氏が普及に努めているものです。

絵が下手な人間でもこの方法でスケッチを書けば，割とまともな感じに見えるという大きな利点があります。

Gyakiの使用例

http://Gyaki.com/［適当な文字列］というURLにアクセスすることでGyakiのお絵描きを始められます（図2⁠）⁠。

デフォルトのペンを使って，私が箱の絵を描くとこのようなサエない絵になってしまいますが（図3⁠）⁠，アイデアスケッチで書けばこのようになり（図4⁠）⁠，かなりカッコ良くなることがわかります。

普通の紙でアイデアスケッチを利用する場合は，灰色のコピックや薄墨の筆ペンなどが必要になりますが，Gyakiだともっと気軽にアイデアスケッチを使うことができます。

前述のGyakiのURLの「適当な文字列」のところに，GyazoのユーザID（Macの場合̃/Library/Gyazo/idに書かれている文字列）を指定すると，アップロードボタンを押したとき，お絵描き結果が自分のGyazoアカウントに追加されます。URLが多少長くなってしまいますが，本誌12月号で紹介したGyumpを使って，短いURLを使用すれば便利です。描いた絵の一部分だけが必要な場合は，Gyazoで選択してアップロードすればよいでしょう。いずれの場合でも，何かを描いてからWeb上にセーブするための手間はかなり少なくなっていますし，Gyazo.com上で後から検索するのも簡単です。

Gyakiの実装

昔のブラウザ上でお絵書きするためには，FlashやJavaなどのプラグインを使う必要がありましたが，最近のブラウザのJavaScriptではいろいろな方法で何でも描けるようになりました。

• Canvas機能を使う
• SVG機能を使う
• WebGLを使う

3次元描画を行うにはWebGLが適しており，最近人気の情報視覚化システム「D3.js」ではSVGが利用されているなど，用途によって適した描画システムは異なりますが，単純なお絵書きにはCanvas機能を使うのが一番楽です。Gyaki.comではCanvas機能を使ったお絵描きをサポートしています（注1⁠）⁠。

注1）

Gyakiのコードを公開しています。