ひらいた本の入口
画面の中央には、紙と同じように本の本文が表示されます。操作はできるだけ控えめにし、読むことに集中できるよう余白を広く取ります。
スマホでは一枚のページに見える本文も、紙の本と同じように、ページをめくって読み進めていきます。
左右端のクリック、横方向のドラッグ、または矢印キーでページを移動できます。
画面の中央には、紙と同じように本の本文が表示されます。操作はできるだけ控えめにし、読むことに集中できるよう余白を広く取ります。
スマホでは一枚のページに見える本文も、紙の本と同じように、ページをめくって読み進めていきます。
参照した読書アプリから借りるのは、派手な装飾ではなく「主役以外を静かにする」姿勢です。
青はリンクや主要操作だけに使います。余白と本文が画面の大半を占めるほど、前後へ進む操作を見つけやすくなります。
見出しは重すぎない太さにし、本文はスマホでも無理なく読める大きさにします。UIではなく文章が前に出るバランスを保ちます。
画面の左右を押すと、その方向へページをめくれます。横にドラッグする操作にも対応し、紙を送る感覚で読み進められます。
キーボードを使うときは、左右の矢印キーでも移動できます。操作方法が変わっても、現在位置は同じように保たれます。
ページの先頭と末尾では、進めない方向の操作を無効にします。
一ページに入る本文量は、端末の高さに合わせて変わります。画面からあふれる文章は、縦にスクロールさせず次のページへ送ります。
将来、文字サイズを変更できるようになった場合も同じです。文字が大きくなればページ数を増やし、小さくなれば一ページに入る文章を増やします。
どの画面でも、本文・ヘッダー・ページ操作の位置が大きく動かないように整えます。
この本の原稿は、すべてMarkdownファイルとして保存します。見出しと段落を中心にした小さな構成なので、特別な記法を覚えずに書き始められます。
作成画面から書き出したファイルを src/content/book-pages に置くと、本棚から読める章としてContent Layerに読み込まれます。
対応形式をひとつに絞ることで、書き方と表示の差を減らし、読むための機能に集中できます。