検索
連載

なぜ「enchantMOON」を、どうやって作ったのか?UXClip(20)

“手書きハイパーテキストタブレット”「enchantMOON」開発の動機は、「普遍的な道具を作りたい」という欲求だった。「enchantMOON」の「なぜ」と「どうやって」を聞いた。

PC用表示 関連情報
Share
Tweet
LINE
Hatena

 UEI(ユビキタスエンターテインメント)が開発中のタブレット端末「enchantMOON」の波紋が広がっている。同社は2013年1月8日から米ラスベガスで開催された「2013 International CES」にenchantMOON試作機を展示し、各種メディアに取り上げられた。同社にはさまざまな方面からの問い合わせが届いているという。

enchantMOON試作機のデモンストレーション

 タブレット端末分野は、2010年に登場した米AppleのiPadの成功で急激に注目が高まり、今では韓国サムスン電子、台湾ASUS、米Amazonら複数のメーカーが競う「激戦区」となっている。enchantMOONの試みは、一見するとこの激戦区に日本の中堅ソフトウェア開発会社が殴り込みをかける無謀な試みであるかのように見える。

 だが、UEI代表取締役社長兼CEOの清水亮氏の談話を聞くことで、enchantMOONは現在主流となっているタブレット端末とはまったく異なる狙いを持つことが見えてきた。そして、enchantMOONはいきなり登場したものではなく、同社の長年にわたる努力の成果を少しずつ積み重ねて作られた側面があることも分かってきた。

──enchantMOONに関して、特に聞きたいのは、「なぜ」と「どうやって」なんです。なぜ、こういうデバイスを作ろうと思うに至ったのですか?

清水 2004年のことです。(清水氏が以前の勤務先だった)ドワンゴから独立して、最初に作ったのが「UBIMEMO」というiアプリでした。当時は「iモード向け統合PIMアプリ」といっていたんですが、これは実身/仮身アーキテクチャ(注:坂村健氏らが提唱したBTRONの中核となるハイパーテキストの方式)と同様のアイデアを採用したメモアプリでした。ラインエディタとハイパーテキストがくっついている。スケジューラの項目が、ハイパーリンクの飛び先になっていました。

 この時代から「ハイパーテキストを使った道具を作りたい」と思っていました。UEIはよくゲーム会社と間違われますが、やりたいことは「普遍的なもの」を作ることです。ゲームはコンピュータの応用例の1つです。

 これを見てください。

 

 ニューヨーク大学のJeff Hanが2006年にTEDの講演で行ったデモンストレーションです。これが世界で最初に有名になったマルチタッチですよ。後にAppleが提案する「ピンチアウト」や「つかんで回転」といった操作がもう出ています。

──iPhoneの発表(2007年)より前ですね。Appleの中ではすでにiPhoneの研究開発は進んでいたはずなので、同時並行的にアイデアが出てきている訳ですね。

清水 未来のコンピュータは、こういうものになるんじゃないか、と。そこで、私たちもマルチタッチ環境で何ができるか、と研究を始めました。Webブラウザだったらどうなるか、ということで、マルチタッチ環境下のWebブラウザを試作しました。2007年にWebで公開したものが「Site Sneaker2007(はてなブックマークを対象にキーワード検索した結果を3D表示する)」です。

──(画面を見ながら)これはFlashで作られているのですか?

清水 はい。Flashです。それで2007年に最初のiPhoneが発売されて。(初代iPhoneは日本未発売だったため)ヤフオクで死ぬ気で20万円出して購入して。買ったはいいが、プログラムを書けない。ダメなものを買っちまった、と思いました。

──初代iPhoneの時代には外部のプログラマは締め出されていました。

清水 それでもJailbreakして、「iPong」というゲームを作りました(当時の清水氏のBlog記事)。これは世界中でニュースに取り上げられました。

 2008年のApp Store開設(注:ここでApple外部の開発者がiPhoneアプリを開発できるようなった)と同時に「Zeptopad」(注:手書きでスケッチできるツール)というiPhoneアプリを作りました。さらにこれを発展させて、Zeptolinerというアウトラインソフトを作りました。アウトライナーはけっこう難しくて、他にはあまりないと思います。ただ、Zeptolinerは、実は先に作ったUBIMEMOに比べると「退化」していました。ハイパーリンクではなかったから。

 2010年にiPadが出て、Zeptopadもようやく(広い画面と高速レスポンスにより)僕のビジョンのように使えるようになりました。Webを切り取って貼り付けたり、長押しするだけで画像をコピー&ペーストしたりできます。こうした機能は、enchantMOONでも取り入れています。


なかなか発売されなかったAndroid端末

 CES2010のとき、NECから依頼されて、Androidを搭載した2つ折りの2画面Androidタブレット向けのアプリを作りました。「Zeptopad FOLIO」という名前です。翌年のCES2011にもバージョンアップして展示しています。

 これはもうenchantMOONのプロトタイプのようなものでした(清水氏のBlog記事)。(手書きで)丸、三角、四角を書いて描線を直線に補正したり、地図を切り取ったり。ペン操作で情報を操作する機能を盛り込みました。

enchantMOONの前身に相当する「Zeptopad FOLIO」のデモ

 ただ、なにしろ端末がなかなか発売されなかった。ここまで作ったのに、最終製品は出ない。なにか自分たちの努力が無視されている感じがしました。

──「Zeptopad FOLIO」はAndroidアプリだった訳ですよね。一方、enchantMOONはAndroidをベースに使いながら、Androidと互換性を持たせずに専用機のような作りになっています。その理由は? 複雑にしたくなかったということですか。

清水 そうです。複雑にしたくなかった。(Androidアプリ実行の互換性を持たせず)専用機にすることで、レスポンスを確保できます。enchantMOONは初代iPad並みのCPUパワーだけど、ペン入力はすごく速い。それに、CTS(Compatibility Test Suite、Google PlayなどGoogle製のAndroidアプリを載せる上で必要な端末の認証テスト)を通すには、画面にGoogle検索窓を置かないといけない(笑)。

 同じころ、電通の鏡役員という方から「広告代理店の人に16時間でプログラムを覚えてもらう」という企画がきました。そこで、「前田ブロック」の前身にあたるツールを14時間で作った。他のどんな言語を使うよりenchant.jsを使う方が手っ取り早かった。

 プログラミングを教えるとき、キーボードを使うと、ほとんどの人がついてこれないんです。カッコの対応すら取れない。全角でファイル名を書いちゃったりする。

──プログラミング言語の入力で要求されるカッコの種別の使い分けなどの正確なタイピングが、実は普通の人には苦痛だったということですか。

清水 そうです。そこで、(ビジュアルプログラミングにより、タイピングがなくて済む)前田ブロックを作った。

──enchantMOONには、このenchant.jsや前田ブロックの展開という意味がある訳ですよね。enchantMOONの上で作った成果物をPCのブラウザで動かしたり、という。

清水 そうです。enchant.jsの上だったら、みんな動きますから。

──enchant.jsのビジネス展開としてハードウェア製品を作るというのは、すごく意外な「手」に思えます。

清水 もっと小さな会社なら、iPhoneアプリ、iPadアプリでそれなりに売り上げが立っているからいいや、という考え方もあるだろうけど、われわれにはビジネスの規模が小さ過ぎる。

 enchant.jsのマネタイズという観点で見ると、いろいろな方法があります。だけどオープンソースのライブラリって、だいたいお金を取った時点で破たんする(笑)。クラウドホスティングにしても何億円というビジネスにはスケールしません。

 (enchant.jsの)「開発者がたくさんいる」という財産は何に役に立つのかと。そこでプラットフォームを作ることだと思いました。

──そこでenchantMOONを作ろうという考えが出てきた訳ですね。しかし、なぜハードウェア製品だったんですか?

清水 プラットフォームの「憑代(よりしろ)」としてハードウェアが必要だった。象徴的で分かりやすいものが。2012年に入ってから、「(ハードウェア製品を)作ろう」と決断した。作れそう、と思った。

──enchantMOONの市場としては個人向けや教育向けを考えているのでしょうか。

清水 売り方は検討中ですが、個人向けもあるし、教育向けもある。法人向けの問い合わせもすでにあります。

──ハードウェア製品を作るためのチームを、よく作れましたね。

清水 運が良かった。(家電ベンチャーの)Cerevoのような先行者もいた。(同社代表取締役の)岩佐琢磨さんにも相談したら、いろいろ教えてくれた。(プロトタイピングのための)3Dプリンタも導入してみた。試作しながら、もっとカッコよくするには別のセンスが必要だということが分かりました。

 それでイラストレータの安倍吉俊さんに依頼することにした。安部さんは固定ファンがいっぱいいるし人気がある。安部さんのファンが100人ぐらいは買ってくれるんじゃないかと(笑)。

 (映画監督の)樋口真嗣さんと安部さんに同時に声をかけた。樋口さんは、『ヱヴァンゲリヲン新劇場版:Q』(2012年11月公開、樋口氏は画コンテ・イメージボード・デザインワークスで参加)で忙しかったからダメ元で聞いてみたら、OKが出た。

 樋口さんは監督だから、与えられた道具の中でベストなものを作る方法を知っています。「ダメ出し」をしてくれる人、ということで樋口さんにお願いした側面があります。それに樋口さんは僕より有名だし(笑)。それで、enchantMOONのデザインは安倍吉俊さんが描いて、樋口真嗣さんが最終Goを出した。

──いよいよ今の形のenchantMOONになる訳ですね。


enchantMOON本体外観

清水 企画からは、「紙にはアイコンはないよね」という提案が出てきました。アイコンが見えているから惑わされる。線を描く機能1つ取っても、ペンの太さや色を選ばせた瞬間に負けている。そこでenchantMOONでは鉛筆一本だけ。その代わり筆圧で濃淡を付けられて、消しゴムもかけられる。


enchantMOONで描いたイラストのハードコピー

 enchantには「魔法をかける」という意味がある。例えば、文字列をマルで囲むと、検索できる。「π」と書いて指で囲むと、Google検索が働いてπ = 3.14159265という数字(円周率)が出てくる。

 こういう「No UI」の企画書が出てきたのが2012年9月でした。それまでの企画書がダメだし続きで、もうヤケになって出したのかもしれないけど(笑)。

──enchantMOONでは、マグネシウム合金を使ったりハンドルを付けたり、他のタブレット端末に比べてハードウェアの外装にお金をかけていますよね。なぜですか?

清水 ハンドルが付いているのは、安部さんの絵が、そういう絵だったから。ハードウェアも、実はソフトウェアの一種(注:設計データを作る過程は、ソフトウェアを作る過程と変わらない知的労働である、といったニュアンスでこのような表現をしている)。アイデンティティを削ってはいけない。

──知的努力の跡を外装にも見せないといけない?

清水 そう。今までのどのタブレットと似ていてもいけない、と思った。あえて重厚長大に。デザイン上の冒険をしないとダメだと。ハンドルは、正直いってかなり大変でした。ハンドルがなければ今頃もうできてます(笑)。


ハンドルで立たせられる

──enchantMOONは初代iPad並みのCPUだというお話ですが、スペックが古めなのは意図的なのですか?

清水 まず枯れていること。デュアルコアのSoC(system-on-a-chip)で入手しやすいものは、まだあまりない。それに、(発熱が多すぎて)燃えると困る(笑)。

 もう1つ、enchantMOONの場合は、CPUコアが増えるだけだと、CPUバスがボトルネックになって速くならない可能性がある。(CPUバスでの信号の衝突が多発すれば)文字の追従性がかえって悪くなるかもしれないですしね。

──enchant.jsで作られたプログラムが動くとして、ミドルウェアのレイヤはどうでしょうか。外部開発者がenchantMOON向けにプログラムを作れるようにするのでしょうか。


enchantMOONでハイパースティッカーを動かすアーキテクチャ

清水 そこは考えてます。enchantMOONのソフトウェア・スタックの中で「Eagle VM」と呼んでるものがJavaScriptエンジンなんだけど、これは改造が可能で、ソフトウェアをプラグインできる。それを使えばmruby(注:組み込み開発用の軽量Ruby言語処理系)も載せられます。他の言語をサポートすることもできる。

 enchantMOONには「シール」という概念がある。Webをペンで切り取ってシールにして、そこに「スティッカー」を貼る。このスティッカーがアプリケーションに相当する。それぞれはUNIXコマンドのように小さなものだけど、複数のスティッカーを組み合わせて使うことができる。

 Evernoteスティッカーは、貼るとシールがEvernoteにいく。清書スティッカーとか、方眼スティッカーとか、いろいろなスティッカーがある。

──enchantMOONの場合、手でスケッチやメモを描いたり、Webを切り取ったり、「スティッカー」(enchantMOON上でのプログラム機能単位)を貼ったりして、ハイパーテキストを作る訳ですよね。その資産を他に持ち出す方法はありますか?

清水 いくつかの段階があると思います。第1段階はクラウドサービス。第2段階は、enchantMOON同士のアドホックなネットワークでの通信。WiFiダイレクトを使うことを考えています。

 あとは、USB端子でPCにつなぐこともできる。enchantMOONはUSBメモリのように認識されるようになっていて、コンビニのカードリーダーにUSBでつなげられれば、そこでハードコピーを取ることもできる。

 ハイパーテキストの一部をコピーする方法は、検討中です。ファイルシステムのように安直にコピーできるようにすると、情報漏えいとか流出の問題を引き起こしやすくなるので。

──「巨人の肩に乗る」という言葉がありますが、enchantMOONを見るとそれを感じます。Androidのコア部分、(JavaScript用VMの)V8エンジン、それに自分達で作ったenchant.js、前田ブロック、「Zeptopad FOLIO」のアイデアなどの資産を載せて、レイヤを重ねて目的のものを作ろうとしている訳ですね。

清水 実はAppleやNeXT Computerもそうだった。ほら、半導体は純粋に近いシリコンに微量の不純物を混ぜて作る訳じゃないですか。ああいう感じというか。オープンソースで手に入るソフトウェア資産に、不純物を混ぜて個性を出す訳です。


 2時間に及ぶインタビューの最中、清水亮氏は猛烈な勢いでしゃべり続けてくれた。清水氏が10年間近くも「ハイパーテキスト」にこだわり続け、多くの才能を集めてこのハードウェア製品を作り出そうとしている様子が、ひりひりする感触と共に伝わってきた。

 enchantMOONという製品がどのように受け入れられるのかはまだ分からない。だが、既存の製品の後追いではなく、「その先にあるビジョン」を示そうとしている点で、同社の冒険的な試みは多くの人々に刺激を与え始めているといっていいだろう。

著者プロフィール

星暁雄(ほしあきお)

ITジャーナリスト。日経BP社で『日経エレクトロニクス』記者、オンラインマガジン『日経Javaレビュー』編集長などの経験を積み2006年に独立。現在はフリーランスとして活動。半導体、プログラミング言語、オペレーティングシステム、エンタープライズIT、インターネットサービス、スマートデバイスなど、幅広い分野の取材執筆経験を持つ。イノベーティブなソフトウェア分野全般に関心を持つ。最近は現実世界のモノとソフトウエアを結ぶ技術に特に注目している。より詳細な経歴はこちら


Copyright © ITmedia, Inc. All Rights Reserved.

PREVIEW
'; }else{ mask.innerHTML = '
画像をご覧いただくには会員登録が必要です
' + btn_txt + '
'; } if((_preview && location.hash.indexOf('maskoff') !== -1) || (typeof itmIdLogin !== 'undefined' && itmIdLogin == 1)){ img.style.visibility = 'visible'; }else{ nxt.parentNode.insertBefore(mask,nxt); } } } }; /** * mask_leadin : subscription マスクの実行 * @param {Object} マスク用パラメータ(sc,lc,ac,bc)と記事の状態(subscription_exist,subscription_objects,preview)を持った Object */ function mask_leadin(_p){ if(!_p.subscription_exist) return false; addCSS('/css/spv/cmsInput.niche.css?date=202407081140'); let d = document; let description = createElementWithAttribute('div',{"class":"colBoxDescription"},function(div){ div.appendChild(createElementWithAttribute('p','',function(p){ p.innerText = '続きを読むには、[続きを読む] ボタンを押して会員登録あるいはログインしてください。'; })); }); let button = {}; if(_p.preview){ button.link = 'javascript:void(0)'; button.text = '続きを読む(TestMode)'; button.func = 'if(window.confirm(¥'マスクを解除しますか?¥')){location.href = ¥'#maskoff¥';location.reload();}else{return false;}'; } else { button.link = 'https://id.itmedia.co.jp/isentry/contents?sc=' + _p.sc + '&lc=' + _p.lc + '&ac=' + _p.ac + '&cr=' + _p.cr + '&bc=' + _p.bc + '&return_url=' + encodeURIComponent(d.URL) + '&pnp=1&encoding=shiftjis'; button.text = '続きを読む'; button.func = 'cx_itm_mask_button();'; } button.elem = createElementWithAttribute('div',{"class":"colBoxButton"},function(div){ div.appendChild(createElementWithAttribute('a',{"href":button.link,"onclick":button.func},function(a){ a.innerText = button.text; })); }); let mask = createElementWithAttribute('div',{"class":"mask_leadin"},function(div){ div.innerHTML = '
'; }); mask.querySelector('.colBoxIndex').appendChild(description); mask.querySelector('.colBoxIndex').appendChild(button.elem); let subscription = _p.subscription_objects[0]; subscription.classList.add( 'is-' + _p.subscription_type ); if((_p.preview && location.hash.indexOf('maskoff') !== -1) || (typeof itmIdLogin !== 'undefined' && itmIdLogin == 1)){ subscription.style.display = 'block'; }else{ subscription.parentNode.insertBefore(mask,subscription); } }; /*IMAGE MASK & Lead-in*/ (function(d){ let membersControl = searchMembersControl(); // %メンバー用マスクの存在チェックと対象要素取得 let imageMask = searchImageMask(); // 画像マスクの存在チェックと対象要素取得 let subscription = searchSubscription(); // subscription マスクの存在チェックと対象要素取得 let isPreview = d.domain.match(/(preview|broom|localhost)/); let param ={ isLoginURL:'//status.itmedia.co.jp/isLoginAIT.cgi', sc:'0c1c43111448b131d65b3b380041de26f2edd6264ee1c371184f54d26ab53365', lc:'7d7179c146d0d6af4ebd304ab799a718fe949a8dcd660cd6d12fb97915f9ab0a', ac:'1a599d548ac1cb9a50f16ce3ba121520c8ab7e05d54e097bfa5b82cb5a328a0f', bc:1, members_control_exist:membersControl.exist, image_mask_exist:imageMask.exist, image_mask_objects:imageMask.Objects, subscription_exist:subscription.exist, subscription_objects:subscription.Objects, subscription_type:subscription.type, preview:isPreview }; let setExtraMask = function(){ if (d.getElementById('isLogin') || isPreview) { // isLogin 呼び出し済みであれば各マスク処理を実行 if (imageMask.exist) { param.cr = '2c93f81754142e105c8bca17824745d14c8c4d69e9d7ede513e5530546e97641'; mask_images(param); } if (subscription.exist) { param.cr = '90cfa6d666682f8b5dc3c798020e432fc294ef430deb069008d4f8bceeb02418'; mask_leadin(param); } } else { // isLogin がなければ、呼び出した後で再実行 let js = mask_images.setISLOGIN(param.isLoginURL,param.sc); js.addEventListener('load',function(){ setExtraMask(); }); } }; if( subscription.type != 'force' ) { //強制 subscription ではない場合のみ実行 if (imageMask.exist || subscription.exist) { setExtraMask(); } } })(document);
LOADING
'; w.removeEventListener('scroll',arguments.callee,false); htmlRequest(_xhrfile,_idname); elem.setAttribute('data-status','true'); console.log('finished : ' + _idname); }else{ // console.log('retry : ' + _idname); } }else{ e_loader.innerHTML = '
LOADING
'; w.removeEventListener('scroll',arguments.callee,false); htmlRequest(_xhrfile,_idname); elem.setAttribute('data-status','true'); console.log('finished : ' + _idname); } } }; w.addEventListener('scroll',scrolling,false); // スクロールイベント scrolling(); // スクロールイベント(閲覧位置が半端な場合のために 1 回実行させる) }; w.addEventListener('load',loading,false); // LOAD 後に実装 };