読者が自分で読み進められるコンテンツを作る

見開きを移動し、細部を開いて読めるデジタル特集を作り、雑誌の例を試します。

個人で雑誌を作る編集者が、キッチン特集のためにインタビュー、写真エッセイ、三つのレシピを集めました。長い一枚のページにも載せられますが、見開きを行き来し、写真を拡大し、気に入った記事に戻れるようにしたい。読む体験も作品の一部です。

デジタル雑誌、展覧会の案内、図解入りのフィールドガイドなど、移動や探索が内容を深めるときに向いています。まずは内容と読者の読み進め方から考えます。操作を付けるのは、読む、比べる、詳しく見ることに役立つ場所です。

要点

章立てを決め、読者に見せる内容を用意します。移動方法と、操作すると開く詳細を伝えてください。例で目次と見開きを試します。自分の作品を作ったら、読む順序と小さな画面での見え方を確認します。

編集方針を構成に落とし込む

各章の名前と役割、章の間の移動方法を指定します。自分に権利があるか、公開の許可を得た内容を使い、創作と取材記事を区別してください。詳しいレイアウトを頼んでも、インタビューや記事の事実確認まで済むわけではありません。

Markdown
小さなキッチンをテーマに、操作できるデジタル雑誌を作ってください。
試作には架空の編集記事を使い、そのことを明記します。表紙、目次、
短いインタビュー、写真エッセイ、レシピカード3枚を入れてください。
目次から見開きに移動し、前後の見開きを送り、写真やレシピの詳細を
開けるようにします。幅の狭い画面でも読みやすくしてください。
決済や購読の販売は入れません。

作成、公開、データの権限は、キャンバスでライブアプリを作るを参照してください。例は操作を判断するために使います。依頼から同じ書体や記事が再現されるわけではありません。

キッチン特集を読む

架空の雑誌 PARAFFIN の例には、表紙、目次、インタビュー、建築写真のエッセイ、レシピの見開き、巻末の内容があります。

  1. 目次を開き、写真エッセイに移動します。キッチンの写真を一枚拡大し、誌面を詰め込まずに細部を見せる方法を確認してください。
  2. レシピの見開きで、分量の倍率を変え、材料にチェックを付けます。変更前後の材料の量を比べ、見開きの移動ボタンで読み進めてください。
新しいタブで開く
見開きの移動、写真の拡大、レシピ詳細を試せるキッチン雑誌

サンプルデータを使った例です。再読み込みすると変更内容がリセットされます。

これはサンプル記事を使った使い捨てのデモです。変更は再読み込みでリセットされます。購読に関する表示を操作しても、実際の購読申し込みや決済は行われません。

読者が戻りやすくする

一通り読んだら、読み進めるうえで困った点を一つ改善します。

Markdown
いつでも使える目次ボタンを追加し、見開きの移動ボタンの横に現在の章名を
表示してください。既存の記事と詳細表示は維持してください。

公開前に、すべてのリンク、画像のクレジット、キャプション、事実関係を確認します。幅の狭い画面で読み、移動用の表示が本文を隠さないか確かめてください。詳細を閉じて同じ見開きに戻る動作も試します。読者からの投稿を受け付けるなら、一般公開する前に、その公開範囲と確認の手順を別途検討します。

フィードバック

この記事は役に立ちましたか?