こんにちは。

今日は HTML5 Conference 2015 というイベントに来ています。

じつは、なんと、スピーカとして登壇することになったのです。

いったいどういうことなんだろう。

目の前にはもうたくさんの人がいる……。たいへん緊張しています。

……あ、もうぼくの番!? 自己紹介しなくては! ええと、こほん、

自己紹介(こんにちは)

松島まつしま さとる と申します。

人がさわるところを、さわったらおもしろく・ためになるようにする係です。

見た目もつくりますが、機能設計と、動きや反応のデザイン・実装が中心です。

Twitter: @satorumurmur / Facebook: satoru.matsushima

読む」ための UI・インタラクションのデザインに、とくに強い関心があります。

たとえば星海社さんとのお仕事(SINAP)

  • 最前線』小説ビューア(東京TDC賞 2011 RGB部門入賞)
    • UI 設計 / プロトタイプデザイン / インタラクションデザイン / 実装 / 原稿管理編集システム構築
  • 2013年のゲーム・キッズ 謎と旅する女
    • 演出 / プロトタイプデザイン / インタラクションデザイン / 実装
  • レッドドラゴン(リプレイセッション本文)
    • 演出 / インタラクションデザイン / サウンドエンジニアリング / 実装
  • ツイ4
    • UI 設計 / プロトタイプデザイン / インタラクションデザイン / 実装

個人活動

  • BiB/i(ビビ)(JEPA 電子出版アワード 2014 選考委員特別賞)
    • 変わり種の EPUB リーダです。

ちいさいころから本が好きでした。

一方、出会ったときからウェブがとても好きです。

(学生のぼく)

(数年前のぼく)

仕事としてつづけてきたウェブデザインの技能で、

ずっと気になっていたブックデザインができるようになるのか?

というわけで、これこそぼくの仕事、と思っています。

  • おもしろいことがたくさん書いてあって。
  • あんなにコンパクトに綴じられて存在感があって。
  • だれでもどこからでも読むことができて。
  • だれでもどこからでも届けることができて。

そのためにはいろんなことを解決しなきゃいけなくて、

一方、あたらしく挑戦できることもたくさんあって……

……だから今日はいろいろと話したいことがあるのですが。

なかでもとくに「読書体験」ということに関心があるので、その話をします。

  • 本と読者の間に閉じた、個人的な時間。
  • 本と読者の間に生じて、誰かに伝播するインタラクション。(ポエム)

これまでの読書から継承したいこと:

  • ひとりで誰にも邪魔されずに読めること
  • 所有できること・だれかに渡せること
  • それを持っていれば読み始められること
  • 送り手が込めた言葉そのもの以上のデザインをまとめて受け取る体験

これからの読書に実現したいこと:

  • みんなで互いに影響しあいながらも読めること
  • いくらでも持ち運べること≒持ち運ばなくてもいいということ
  • 映像や音楽と(幸せに)融合したあたらしいおもしろさ
  • 受け手が自身の体験をデザインしながら読めること

そもそも本とは、

  • 言葉や絵やいろいろが、
  • それをより楽しむためのデザインによって、
  • ひとつながりで読めるようなかたちに綴じられたもの。

つまり、UI 込み なのです。

たとえば、紙の本なら、

一冊ごとに専用のハードウェアつきで手に入ります。

完結した UI を持ち、めくられることを待ち構えています。

一方、電子書籍は、

綴じられることを待ち構えたソフトウェア、というかんじです。

それだけで完結するインタフェイスは備えていません。

電子書籍をつくるむずかしさ(=挑み甲斐?)

「表現したいことはたくさんあるのにねえ……?」

それをどんな HTML / CSS で書くか、なかなか決まらないんだよね……。

「とりあえずこういう HTML でやっとく……?」

仕様ができても、それを表示できるリーディングシステムがまだなかったり。

ガイドラインの類にも class="font-size_14pt" みたいなのがあったり。

「いまんとこ、このくらいの表現が限界なんじゃない?」

こ、これが限界……? しかも、これでも、1冊つくるだけで大変……!

本がほんとうに本としてはたらくのは、(ダジャレ)

読まれるときです。

読者に開かれてはじめて、本はコンテンツを語り出します。(ポエム)

そして本が読まれるためには、ほかにも必要なことが。

  • デザインされ/綴じられて、読まれる準備ができていること。
  • 読む人がいて、読む人に届いていること。

読者に届かないといけません。

本をつくって届ける=出版しなくては始まらない。

電子書籍をつくるおもしろさ(=遊び甲斐)

あなたがつくり、あなたが届けることができます

  • 距離や設備や規模の制約を受け……にくい。
  • 物理的な UI はリーディングシステムに外部化されたので、ネットに乗れる。

あたらしい表現があるはず!

  • 紙にしかできないことがあるように、電子書籍にしかできないことがあるはず。
  • マルチメディアやインタラクティブ、アクセシビリティはもちろん、ほかにも、

UI に余地があることを生かした、あたらしいデザイン。

あたらしい出版、あたらしい読書、あたらしい本の可能性があるのでは?

そのデザインに使われる知識と技術は、HTML に CSS に JavaScript に……。

ぼくも BiB/i というものをつくってみました

BiB/i(ビビ)はブラウザのなかで動く EPUB リーダです。

  • YouTube 動画のように EPUB をブログやツイートに貼り付けられます。
  • プラグインやアプリは不要で、ブラウザのまま読めます。
  • 電子書籍やそのなかの特定の章や段落を、URL で人に教えられます。

様々なブラウザ・様々なデバイスで動作し、電子書籍とウェブを繋ぎます。

ページ? めくる? スクロール? 段組? 注釈? 検索?

いろいろと悩みつつ、まだまだ足りない表現力や快適さに歯噛みをしつつ。

  • すべての人に出版を解放するツールになれたら、
  • 本を仲立ちにした誰かと誰かのコミュニケーションの役に立てたら、
  • ウェブと本の融和をさらに加速させられたら、

……と、願いながらつくっています。

HTML5 Conference 2015 | html5j 電子出版部

ウェブと本の狭間で悩んでみた (3) (悩むより夢想していましたね)

ありがとうございました!

(ご来場の方は、よろしければぜひアンケートにご協力ください!)