Developers Summit 2019、TypeSquare APIを活用したMixed Realityアプリケーション開発 [事例紹介] 登壇レポート

2019年2月24日 04:33

ホテル雅叙園 ( @東京目黒区 )
2/14(木)、2/15(金)の2日間、国内最大級のエンジニアの祭典ー「Developers Summit 2019」が、ここホテル雅叙園にて、開催されました。

先日、ホテル雅叙園 ( @東京都目黒区 ) にて、開催された「Developers Summit 2019」に、国内フォント最大手のモリサワ様より、登壇のお誘いをいただき、モリサワ様のセッション[APIを活用したフォントの使い方〜 MR (Mixed Reality) の事例紹介〜 ( 14-E-5 ) ]に、私、神戸デジタル・ラボ新事業創造係 MR班の堀尾が登壇させていただきました。登壇テーマは、「 TypeSquare APIを活用したMixed Reality アプリケーション開発 [事例紹介] 」。

当日の発表スライドは、以下、[SpeakerDeck]をご覧ください。

本記事では、「Developers Summit 2019 登壇レポート」と題して、Developers Summit 2019登壇の舞台裏をお伝えしたいと思います。

デブサミ2019登壇キッカケ (2018/08/17)

Developers Summit 2019(通称、デブサミ)への登壇が決まったのは、昨年8月の某日。セッション当日、一緒に登壇させていただいたモリサワの相川さんから、一通のSlackが、、。

今、このレポート記事を書くために、Slackを見返していたら、、。わずか10分足らずで、デブサミに登壇することが決まっていました。笑

「発注者」と「受託者」の関係性ではなく、同じ未来を見据えた仲間として、普段から一緒に頭を抱え、取り組んできたからこそ、会社の垣根を超えた、シームレスな「共創」が実現できる良好な関係を構築できていると自信を持って言える瞬間でもあります。ITエンジニアとしても、お客様からこうしてお話をいただけることが何よりも嬉しいです。

モリサワの相川さんは、営業担当の方でエンジニアではないのですが、エンジニアのトレンドに非常に敏感で、Slackでカジュアルにやり取りをしていただけたので、登壇まで非常にスムーズに連携を取ることができました！

相川さん、いつもありがとうございます！

登壇中のモリサワ相川さん
TypeSquare（Webフォント）の専任営業担当。業務外では社内フィットネスチーム（All-in Fitness Project）を結成し、社員の健康管理や人的交流を目的とした活動も行われるなど、非常にアクティブな方です。

Developers Summit とは？

エンジニアの知的交流を促進することで、世の中がもっと豊かになることを目指して開催される、ITエンジニアの祭典です。

[ 主催 : 株式会社翔泳社様 ]

デブサミ2019テーマ「SHARE YOUR FUN!」とは？
みなさん、技術を愛していますか？さまざまなテクノロジーが登場し変化が激しくなる世の中。エンジニアとしての生涯をどうデザインしていくか、楽しみでもあり不安でもある方が多いのではないでしょうか。変化に適応し、学びつづけるのは辛い？いいえ、テクノロジーは楽しいもの。楽しいから没頭し、没頭するから学びつづけることができる。「楽しい」はエンジニアの成長をブーストしてくれる最強のモチベーションです。新しいテクノロジーと出会う楽しみ、現場で起こる課題を解決していく楽しみ、エンジニアとしての成長を日々実感することの楽しみ、まわりの人やコミュニティに貢献することの楽しみ……デブサミ2019では、さまざまなエンジニアの楽しみを持ち寄って、これからのエンジニアの生き様を考えます。(公式サイトより抜粋)

【デブサミ2019 タイムテーブル】

同イベントでは、Cloud Native ( Docker [コンテナ] / Kubernetes ) 系のセッションに始まり、大規模データ解析 ( RedShift / BigQuery ) 技術、セキュリティ ( DevSecOps / Shift Left )、サーバレスアーキテクチャ ( Severless )、そして、エンジニアのキャリア ( 考え方 ) など、幅広いジャンルのセッションがホテル内の複数会場で、同時多発的に繰り広げられていました。個人的には、 ZOZOテクノロジーズの方が、「ZOZO SUITS」を着用して、セッションに登壇しようとしたところ、会社の広報に止められたという噂を聞いて、さすがはITエンジニアの祭典だなと、ワクワクしました。笑

こちらは前日のリハーサル時の様子です。前日までのセッション応募には、200名枠に、350名以上の方に応募いただいていたようです。また、エンジニア向けのイベントにフォントメーカーのモリサワ様 ( ※デザイナー向けのイメージが強い ) が登壇されるということもあり、非常に注目度の高いセッションの一つだと、主催者の方から直接お声掛けいただき、ゲストスピーカーとして、戦々恐々でした。しかし、当日は、立ち見の聴講者も続出するなど、非常に多くのITエンジニアの方々に、「フォント選定の重要性、Mixed Reality ( MR ) の魅力」について、お伝えすること ( SHARE MY FUN! ) ができ、一ITエンジニアとして「喜び」を感じると同時に、今回の登壇を通じて、また一つ成長できたと自負しています。

※ Twitter、Facebookで拡散いただいた皆さま、ご協力ありがとうございました。また、ご来場いただいた皆さま、本当にありがとうございました！

ここからは、当日の発表について、レポートしていきたいと思います。

セッション本番 (2019/02/14)

前日のリハーサルとは異なり、会場を覆い尽くすほどの数多くのエンジニアの方にご参加いただくことができました。本セッションでは、モリサワ相川さんより、「1. モリサワ製品の説明 ( モリサワパスポートetc )」 、「2. TypeSquare (Webフォント) APIのご紹介」があり、私の方から、「3. TypeSquare APIを活用したMixed Reality アプリケーション開発 [事例紹介]」をお話させていただきました。

デブサミ登壇0秒前の様子
準備していたPCの接続トラブルが発生し、リカバリ用のPCで発表を行うことになったのですが、イベントスタッフの皆さまの対応が圧巻で、大幅な遅延もなく、無事に発表を終えることができました。ご対応いただいたスタッフの皆さん、ありがとうございました。

ここからは、新事業創造係 MR班の堀尾がお話した内容を簡単に、レポートさせていただきたいと思います。

1. なぜ今、Font × MRの取り組みを行っているのか？

突然ですが、皆さんは「ポスト・スマホ」について考えたことありますか？

デジタル端末の進化に伴い、フォントもその姿、カタチを変えてきました。実は、今のモリサワ様の1番の収益源は、テレビなどへの組み込みフォントライセンス販売費なんだとか。紙(アナログ)から、PC(デジタル)→スマートフォンの普及に伴う(マルデバイス化)、コミュニケーション媒体の進化と共に、モリサワ様は、ビジネスの主戦場を変えられてきました。

では、Mobileの次は？

そして、KDLでは、Mobileの次に、Mixed Reality ( MR ) が必ず来ると信じて、約6年前、GAFA（グーグル、アップル、フェイスブック、アマゾンの総称）の一角に位置する、米・巨大IT企業Googleが「Google Glass」を発表した当時（2013）から、MR（AR）がビジネスシーンに与える影響度、ビジネスインパクトの大きさに注目し、研究・開発を続けて参りました。

弊社では、「Microsoft HoloLens(ホロレンズ、以下HoloLens)」のアプリケーション開発にもデバイス発売時から取り組みを始め、昨年7月には、Microsoft公式のMRPP(※Mixed Reality Partner Program)認定を取得いたしました。

[図(下)] MRPP認定取得の際に、米・Microsoft本社（レドモンド、シアトル）を訪れた際の様子。Microsoft本社前に飾られたロゴ。

[図(下)] MRPPトレーニング中に作成したプロトタイプを本社エンジニアにフィードバックを受けている様子。

ただ、HoloLensのような透過型ディスプレイや、Vuzix Bladeを代表する画面の小さなスマートグラスで文字を表現するのは、非常に難しい。

そこで、フォントメーカーのモリサワ様とMR ( Mixed Reality ) 空間での「1.フォントの視認性、デザイン性」、また、「2.フォントの変化によって生じるUXの違いについて」の共同研究を開始いたしました ( 2016 〜 ) 。

具体的な取り組み内容については、次章でご説明します。

2. モリサワ × KDL MR事例紹介【 Unity C#編】

では実際、Mixed Reality ( MR ) は、どのような現場のどのような方の役に立つのか？という現場の課題解決をテーマとし、2つのユースケースを考えてみました。

1. Display Assistant

1つ目は、HoloLensを活用した営業シーンのアップデートです。パンフレットではなく、商品に直接、商品説明 ( デジタル情報 ) を紐付けることにより、商品情報をより直感的に得ることができるようになったり、多言語での商品説明が容易となります。また、HoloLensは、デバイストラッキングが可能なので、お客様がどの商品のどの部分をどれくらい見ていたのか？といった趣味嗜好データを定量的に取得することもできるようになります。[ 動画はこちら ]

2. Creative Design X

2つ目は、デザイナー向けのシミュレーションアプリです。デザイナーがデザインしたポスターをPCを介してクライアントにお見せし、GOサインが出た後に、いざ現地に貼ってみるとイメージが違うことが多々あるのだとか、。1.原寸大で確認できないこと、2.実際ポスターを貼る現場 (景観) との整合性をイメージできない、3.デザイナーとクライアント間で共有できないことが問題となっているようです。これらの課題をMixed Realityを活用して解決するのが「Creative Design X」です。デザイナーがデザインしたポスターを、原寸大で確認したり、現地に仮配置してみて、リアルタイムでデザイン修正を行えるなどの機能を実現いたします。[ 動画はこちら ]

これらのデモ開発を行う中で、MR空間におけるフォントの視認性・デザイン性についてもユーザーに直接アンケートを実施いたしました！

デバイスに標準的に搭載されている「メイリオ」、モリサワ様が提供しているフォントで一番視認性の高い「UD新ゴ」、そして、横線の細さからAR ( MR )デバイスでは敬遠されがちな明朝体である「黎ミン」。この３つの書体を同じ空間に表示させ、体験後のユーザーに、以下のアンケートを実施いたしました。

---ここまで堀尾の本気執筆w

ギネス世界記録を持つ、明朝体モリサワ黎ミン(レイミン)とは？

私自身も、本プロジェクトに携わるまで知らなかったんですが、実は、明朝体って、フォントウェイト ( Weight ) を、レギュラー ( Regular ) から、ボールド ( Bold ) に変えても、横線の太さって同じなんですね。だから、AR ( MR ) のアプリケーションでは、文字が見づらい/潰れてしまうといった理由で、敬遠されがちでした。ただ、モリサワ様が開発された黎ミンというフォントを使えば、横線の太さも変更することが可能となり、AR ( MR ) の表現の幅を広げることが出来るようになります。

実際のアンケート結果でも、ゴシック体 ( メイリオ ) より見やすいという結果が出ています。

そして、アンケート結果で1番興味深かったのが、ユーザーは視認性の高さだけでなく、文字が表現する雰囲気も大事にしているということです。実際、3つのフォントどれが好きか？アンケートを実施したところ、視認性の結果とは異なり、黎ミンを選択するユーザーの割合が大きく増える結果を得られました。(25%→38%)

この結果より、MR ( AR ) 空間上で、製品をPRする際に、単に見やすいからという理由だけでゴシック系を選択するのは、考慮不足だということが考察できます。また、選択したフォントが商品に与える印象が大きく違ってくるという点でも、MR ( AR ) 空間上でのフォントの選定が非常に重要になってくると言えます。

Computex 2018 モリサワブース壁面
とても格好よく、実物はかなりの迫力で、
展示会場でもひと際目立っていました。

ブランディングはフォントで決まる。上記のアンケート結果を見たとき、初めてその実感が湧いてきました。

続いて、なぜMixed Realityアプリケーション開発で、TypeSquare API (Webフォント)を活用するのか？というお話。

3. アプリ開発で、TypeSquare APIを活用するメリット

従来のHoloLensアプリケーション開発では、illustratorやphotoshopを用いてデザインを行った後、画像ファイルに書き出し、Unity上に取り込んで、UIの調整を行っていました。ただ、MR ( Mixed Reality ) 、HoloLensのような最新テクノロジーの概念検証(PoC)に費やせる、「人」や「お金」は限られています。筆者のように1人で、アプリ企画、UIデザイン～開発～デプロイまでを一手に担うxRエンジニアが、いちいちillustratorとUnityを開き、UIの確認を行うのは、非常に煩雑で、手間もかかる。だから、UI部分の開発が後回しになり、気が付いたらUIには、システム標準フォントを使っていたなんてことは日常茶飯事です。

相川さん、、確かにフォントを変えるとユーザー体験が変わって、明らかにHoloLensデモ時のお客さんの反応が良くなったんだけど、実際問題、一ITエンジニアがillustratorに、モリサワパスポートを契約するのは、まぁまぁハードルが高いんですよね。というストレートな思いを相川さんにぶつけてみました。その他にも、従来のデジタル端末とは異なり、奥行きを表現する必要があるMR ( Mixed Reality ) のUI開発で、その全てを画像対応するのは非効率であったり、HoloLensのような容量の小さなエッジデバイス ( 64GB ) に、データ量の多い書体データを保持させておきたくないなど、、。

じゃあ、モリサワのTypeSquare API ( Webフォント ) を活用してみてくださいと、相川さんにご紹介いただき、早速使ってみることに。(Webフォントという名前からも推測される通り、主にWeb界隈で使われている技術ですが、実はWeb以外の技術領域でも工夫次第で活用することが可能です。今回は、そんなTypeSquare API ( Webフォント ) をMixed Reaalityアプリケーション開発に組み込んでみました。 )

導入後、どうなったか？

APIのリクエストを投げると、Base64でエンコードされた書体データがペイロードに含まれた状態で返ってきます。リクエストパラメーターには、[書体名] : "Reimin Y20 Heavy" や、書体データが必要なテキスト情報 (サブセット機能) [書体データの欲しいテキスト] : "あいうえお"、などを持たせることができ、ユーザーの使用範囲に応じた書体データを、任意のタイミングで取得することが可能となります。

レスポンスデータは、Unity C#スクリプト上で、Base64の書体データをデコードし、一時ファイルとしてデバイスにキャッシュさせることで、使用することができます。レスポンスデータをそのまま使えないという煩雑さは残りますが、illustratorを使って、書体を選んで、画像に書き出しを行う手間を考えれば、非常に少ないステップで、様々な書体を試すことができるようになり、PoCの業務効率、UI表現の幅が格段に広がりました。

PoC (概念検証 : Proof of Concept)と言えば、昨今、デジタル変革期として、業種・業態・規模問わず、様々な企業様が「AI (人工知能) 」や「IoT ( Internet of Things ) 」、MR ( Mixed Reality ) など、最新テクノロジーを活用した業務効率化の取り組みを加速させる動きが顕著化してきました。KDLでも、そういったお客様のニーズにお応えすべく、PoCを実施させていただくケースが急増しているのですが、弊社の取り組みをご紹介した際に、フォントの取り組み内容について、興味・関心を持っていただくことが非常に多いです。Mixed Reality ( MR ) のビジネスシーンでの活用を考えると、「1.フォント ( 文字 ) がユーザーに与える影響の大きさ」、「2.フォントの視認性が業務効率に直結すること」が上記の要因として考えられます。本取り組みを通じて、テクノロジーがいくら進化しても、システムを活用するのは、お客様であり、「人」であるということに気付かされました。KDLでは、引き続きモリサワ様との共同研究を進め、関西のMixed Reality ( MR ) アプリケーション開発を牽引していきたいと思います！

エンジニアこそ、フォントにこだわれ。

最後までお読みいただき、ありがとうございました。

筆者 (所感)

本登壇をキッカケに、初めてDevelopers Summitに参加させていただきましたが、同じITエンジニアと言えども、使っている言語や技術要素、業種・業態が違うと、こんなにも考え方が違ってくるのかと、改めて自分の携わっているIT(情報技術)というモノを見つめ直す良い機会となりました。また、普段参加している勉強会とは違って、本当に多種多様なセッションを一度に聞くことができるので、エンジニアとしての視野の広がりを感じました。セッション後の「Ask the Speaker」では、MRとは違った専門分野を持つエンジニアの方と、ディスカッションさせていただき、本気のエンジニア vs エンジニアで、技術について熱く語り合えるなど、他のイベントでは体験できない非常に濃密な時間を過ごすことができ、収穫の多い2日間となりました。関係者の皆さま、ご来場いただいた皆さま、本当にありがとうございました！

この記事が気に入ったらサポートをしてみませんか？