← ブログ一覧へ戻る

出品者の画面は「情報密度」で評価する ── 1スクロールで何件さばけるか、という物差し

ヤフオクの出品一覧は「見る」画面ではなく「さばく」画面です。ではその良し悪しは何で測るのか。面積あたりの情報量ではなく「1画面あたりで判断を終えられる件数」を物差しにすると、表形式表示・ラベル編集・支払総額・メモといった機能が、ひとつの軸の上に並びます。

出品者の画面は「情報密度」で評価する ── 1スクロールで何件さばけるか、という物差し

出品件数が増えてくると、画面に対する不満の質が変わります。

最初のうちは「使いにくい」「分かりにくい」という感想です。それが 100 件、300 件と増えるにつれ、不満はもっと即物的になります。スクロールが終わらない。同じ行を二度見る。さっき見たはずの商品がどれだったか思い出せない。

この記事の前提として、筆者の運用規模を先に書いておきます。4つのアカウントで出品していて、落札は1アカウントあたり1日 10〜20 件。出品終了(落札者あり)の一覧は、どのアカウントも常時 500 件前後が並んでいます。1ページの表示は 50 件なので、朝の確認だけで 4アカウント分のページを開いて、数百行を目で追うことになります。

この規模になると、画面の作りが1日の作業時間を直接決めます。1件あたり数秒の差でも、1日 40〜80 件、月に千数百件を処理すれば無視できない差になりますし、それ以上に見落とした1件のほうが高くつきます

このとき起きているのは、操作性の問題ではありません。画面の情報密度が、扱っている件数に追いついていないのです。

この記事では「情報密度」という物差しを定義して、それでヤフオクの出品一覧を測り直します。そのうえで AucKit の一覧まわりの機能を、機能名ではなく密度への効き方で並べ直します。個々の使い方は各記事で扱っているので、ここでは「なぜそれが効くのか」に絞ります。

情報密度とは「1画面あたりの判断完了件数」

情報密度というと、ふつうは「面積あたりの情報量」を指します。文字をたくさん詰めれば密度が高い、という理解です。

出品者の実務では、この定義は使えません。文字がいくら並んでいても、それを見て何も決められないなら密度はゼロだからです。

そこで定義を置き換えます。

情報密度 = 1画面あたりで「判断を終えられる」件数

判断を終える、とは「この行はもう触らなくていい」「この行は今日中に対応する」と決めて次に進めることです。逆に、決めるために別画面を開いたり、記憶をたぐったりした瞬間、その行の密度はゼロに落ちます。表示されていても、判断に寄与していないからです。

この定義にすると、良い画面の条件がはっきりします。1件あたりの面積が小さく、かつ、その面積の中に判断材料が揃っている画面です。この2つは別々の条件で、片方だけでは足りません。

下の図は、同じ画面の高さで純正表示と AucKit 適用後を並べたものです。1件あたりの面積、色による見分け、行に載っている情報量——この記事で扱う論点がひと目で分かります。3件と10件の差は、4アカウント×数百行という規模では、そのまま確認にかかる時間の差になります。

純正のカード型表示とAucKit適用後の表形式表示を同じ画面の高さで比較した図

密度を下げているのは3種類の要因

自分の画面の密度が低いとき、原因は次の3つのどれかです。混ざっていることも多いですが、対処法が違うので分けて考えます。

① 面積が大きい(余白と装飾)

1件が縦に長いパターンです。画像が大きい、行間が広い、ボタンが縦に積まれている。純正のカード型表示は、1件をゆったり見せる設計になっています。数件を丁寧に見るには快適ですが、50件を走査する用途では、同じ情報を得るのに何倍もスクロールすることになります。

② ノイズが混ざっている(判断に使わない要素)

出品終了分のページで言えば、上部の案内文やサブテキスト、キャンペーンの帯、サイドバーの各種リンク。1つずつは小さくても、面積を食い、そして視線を止めます。目が引っかかるたびに走査の速度が落ちるので、面積以上の損をしています。

③ 情報が足りない(別画面に行かないと判断できない)

これが最も見落とされがちで、最も密度を下げる要因です。

たとえば落札者が実際に支払った金額。一覧に出るのは落札価格だけなので、送料を含んだ総額を知るには取引ナビを開くしかありません。あるいは落札者の評価。あるいは「この商品は棚のどこに置いたか」。最後のものに至っては、そもそもヤフオクのどの画面にも存在せず、頭の中にあります。

情報密度を下げる3つの要因(面積・ノイズ・情報不足)を並べた図

①②は面積の問題なので、詰めれば改善します。ところが③は詰めても改善しません。むしろ、足りない情報を取りに行くたびに画面を離れるので、詰めた効果すら打ち消されます。密度を上げる作業は、①②の圧縮より③の解消のほうが効きます。

一覧まわりの機能を「密度への効き方」で並べ直す

ここからは AucKit で一覧に効く機能を、すべて密度の観点に置き直して見ていきます。名前は違っても、やっていることは6種類に分けられます。

1. 面積を圧縮する ── 表形式表示

出品リストを表形式で表示は、カード型(縦並び)を列の揃った表に変換します。対象は出品中・出品終了(落札者あり)・出品終了(落札者なし)の3ページです。

効くのは「1件あたりの縦幅が縮む」ことよりも、視線の移動が縦1本になることです。カード型では価格を探すのに毎回目が左右に泳ぎますが、表なら価格の列を上から下へなぞるだけで済みます。走査という作業においては、この差のほうが大きく効きます。

そのまま表計算ソフトへ貼り付けられるのも、突き詰めれば同じ理由です。列が揃っているとは、機械にとっても人間にとっても走査しやすい形だということです。

2. 読む対象を、見分ける対象に変える ── ラベル編集

一覧の密度を語るうえで外せないのが出品終了分ラベル編集です。取引状態の文言を短く置き換え、行に色を付けます。

ヤフオクの取引状態は、そのままだと文章です。「発送をしてください」「落札者からの入金待ちです」「まとめて取引依頼が来ました」。1件ずつ読むぶんには親切ですが、50件を走査するときには全部読まないと状態が分からないという重い作業になります。

この機能は、それを3段階で軽くします。

短縮する。 既定では次のように置き換わります。

純正の文言置換後表示方法
発送をしてください要発送行背景(薄い赤)
送料を連絡してください送料連絡行背景(薄い橙)
落札者からの入金待ちです未入金行背景
まとめて取引依頼が来ました同梱依頼行背景(濃い桃)
発送完了しました発送完了行背景(薄い緑)
受取連絡がされました受取連絡済行背景(薄い緑)
落札者からの連絡待ちです───行背景
取引メッセージがあります取メ注意バッジ(黒)

色分けする。 ここが本質です。文言が短くなっただけなら、まだ「読む」作業が残ります。行に色が付くと、読まずに見分けられるようになります。赤い行が対応待ち、緑の行が処理済み。ページを開いた瞬間に、今日やるべき塊がどこにあるか目に飛び込んできます。文字は読む速度に律速されますが、色は面で認識できるので、ここで走査のコストが一段下がります。

バッジで例外を立てる。 8つ目のルールだけ表示方法が違います。「取引メッセージがあります」は行背景ではなくバッジ表示です。理由は、これが他の状態と同時に起こりうるからです。発送前でもメッセージは来るし、発送後でも来ます。行の色は取引の進行段階を表す一次元の情報なので、そこに例外を混ぜると意味が壊れます。だから別レイヤーの記号として重ねます。

置換ルールは設定から自由に編集できます。文言・置換後の語・色・行背景かバッジか、すべて変更できるので、自分の扱う商材や運用に合わせて調整できます。たとえば同梱の多い出品者なら「同梱依頼」の色を最も目立たせる、といった設計が有効です。

取引状態の文言を短縮し色分けしバッジを重ねる3段階を示した図

密度の観点で言うと、この機能は「面積あたりの情報量」ではなく「認識にかかる時間」を短縮しています。 同じ50行でも、読んで判断する50行と、見て判断する50行では、さばける速度がまったく違います。

3. ノイズを除去する ── 不要要素を隠す

不要要素を隠すは、ページごとに不要な要素を消す機能です。出品終了分のページなら、上部のサブテキストや案内文、共通の広告・バナー・キャンペーン枠、サイドバーの各リンクなどが対象になります。項目ごとにオンオフできます。

「消しただけで何も足していない」ので地味に見えますが、密度の定義に照らすと立派な改善です。判断に使わない要素が消えた分、同じ面積により多くの判断できる行が入ります。実効的な密度は上がっています。

4. 別画面に取りに行く手間をなくす ── 支払総額・落札者情報

ここが③への対処です。面積を削るのではなく、足りない情報を行に引き込む方向の機能群です。

支払総額の記録・表示。 落札価格に送料を足した金額を、一覧の列に出します。これまで取引ナビを開かないと分からなかった数字が、行の中で完結します。受取明細との突き合わせが、画面を移動せずに終わります。

送料がまだ決まっていない取引は「—」で表示されます。これは情報の欠落ではなく、「まだ動いていない」という判断材料です。空欄が並んでいれば、それ自体が状況を語ります。

入札者/落札者ID表示。 落札者の表示名に加えて、評価数と良い評価の割合を行に出します。相手を確認するために評価ページへ飛ぶ、という往復がなくなります。取引の慎重度を行の上で決められるようになるので、これも③の解消です。

5. 頭の中にある情報を画面に固定する ── メモ・チェック済みマーク

①②③のどれとも違う、第四の種類があります。そもそもヤフオクの画面に存在しない情報を行に置く機能です。

出品終了分メモは v0.6.5 で追加した機能で、各商品行に1行のメモ欄を置きます。表形式表示と併用すると「取引メモ」の列になります。

この機能が埋めているのは、ヤフオクの構造上どうしても空いてしまう穴です。取引の情報はヤフオク側にありますが、その商品が自分の倉庫のどこにあるか、何に気をつけるべきかは、自分しか知りません。これまでその情報の置き場所は、頭の中か、別のメモ帳か、スプレッドシートでした。どれも一覧とは別の場所にあるので、参照するたびに画面を離れることになります。

実務で効くのは、だいたいこの3種類です。

  • 保管場所(「棚B-3」「2階奥」)── 発送のときに探し回らずに済む
  • 同梱・要望(「同梱希望あり」「領収書同封」)── 梱包の直前に思い出せる
  • 注意点(「傷の指摘あり・写真確認済」)── 取引メッセージを読み返さずに済む

入力欄は常に表示されていて、書いて Enter か欄の外をクリックすると保存され、枠が一瞬グリーンに光ります。メモは商品(オークションID)に紐づくので、ページを開き直しても残ります。

保存先はこのブラウザの中だけで、最終更新から90日で消えます。これは容量対策というより設計思想です。終わった取引のメモが残り続けると、一覧に「もう判断に関係ない文字」が増えていきます。それは密度を下げる方向の変化なので、放っておいても消えるようにしてあります。空欄にすればその場で削除されます。

チェック済みマーク。 確認した入札者・落札者のIDに ✓ を付けて記録します。これは自分の作業の痕跡を行に残す機能です。「この人はもう見たか」を思い出す必要がなくなります。

メモとチェック済みマークは、密度を上げるというより密度の低下を防ぐ機能だと言えます。記憶に依存した行は、時間が経つほど判断できない行に変わっていくからです。書いた瞬間から、その行はずっと判断できる行のままになります。

6. 閲覧が、そのまま記録になる ── 売上データ収集

売上データ収集は、出品終了(落札者あり)のページを開いたときに、その画面に表示されている落札情報を記録します。追加のリクエストは発生しません。見ることが、そのまま記録することを兼ねるという設計です。

貯まったデータは売上レポートで集計として確認できます。密度の話からは少し外れますが、「一覧を見る」という毎日の作業が集計作業を兼ねてしまう、という意味では、時間あたりに片づく仕事の量を増やしています。

一覧に効く機能を密度への効き方で6分類した図

入力画面にも密度がある

一覧だけの話ではありません。

高速出品モード(出品フォーム既定値の設定内)は、出品フォームで開始価格と即決価格を横並びにして、入力を1画面にまとめます。フォームにおける密度とは「スクロールせずに入力を完了できるか」です。入力欄が縦に長く並んでいると上下を往復することになり、往復のたびに「どこまで入れたか」を思い出す必要が出てきます。

出品フォーム既定値そのものも同じ発想です。毎回同じ値を入れる欄を、開いた時点で埋めておく。判断が要らない欄を消しておくことで、判断が要る欄に集中できます。意味としてはノイズ除去に近いものです。

密度には上限がある

ここまで密度を上げる話をしてきましたが、上げすぎると逆に読めなくなります

分かりやすいのは折り返しです。列幅を詰めすぎると「23,900 円」の「円」だけが次の行に落ちる、といった崩れ方をします。面積としては最小ですが、読むときに一瞬つっかえる。この「一瞬」が 50 行分積み上がると、詰めて得た時間を使い切ってしまいます。

AucKit の表形式表示では、金額・日時・状態などの列を折り返さない設定にしたうえで、幅の調整はタイトル列で受けるようにしています。どこを詰めて、どこを詰めないかを決めるのが密度の設計であって、一律に詰めることではありません。

支払総額を「総額」と「送料の内訳」の2行に分けているのも同じ判断です。1行に押し込めば面積は減りますが、金額が2つ並んで読み違えやすくなります。ここは面積を1行分譲って、読み違いを防ぐほうが得だと判断しています。

密度の上限は、読み違いが起き始める手前にあります。

自分の画面を測ってみる

抽象的な話が続いたので、最後に自分の環境で測る方法を書いておきます。特別な道具は要りません。

1. 1画面に何件表示されているか数える。 スクロールせずに見えている件数です。

2. そのうち何件が「判断を終えられる」か数える。 その行を見ただけで対応要否が決まる件数です。金額や評価を確認するために別画面を開く必要がある行は、数に入れません。

3. 直近の30分で、一覧から別画面へ移動した回数を数える。 取引ナビを開いた、評価を見に行った、明細を確認した、メモ帳を開いた。この回数が③の情報不足の目安になります。

1と2の差が大きければ、足りないのは情報です。1そのものが小さければ、面積の問題です。3が多ければ、画面の外に置いている情報を中に持ってくる余地があります。

筆者の場合、この3つのうち最後まで残っていたのが3でした。表形式にして面積は詰まり、色分けで状態は一目で分かるようになった。それでも金額の確認では取引ナビを開いていたし、棚の場所は頭の中にありました。支払総額とメモを行に載せたのは、そこが最後の穴だったからです。

まとめ ── 密度が高い画面は、速いのではなく見落とさない

情報密度を上げると作業が速くなる、と書いてきましたが、実際に効いてくるのはもう少し別のところです。

同じ50件を、3スクロールで見る場合と、10スクロールで見る場合を比べてみます。かかる時間の差はたいしたことがありません。差がつくのは取りこぼしの確率です。スクロールが増えるほど、見た行と見ていない行の境目が曖昧になり、「さっきのあれは対応したか」が分からなくなります。

密度が高い画面とは、全体を一度に視野に入れられる画面のことです。全体が見えていれば、順番に処理していけば漏れません。見えていなければ記憶で補うことになり、記憶は必ず抜けます。

1日 40〜80 件を4アカウントに分けて扱っていると、これは実感として分かります。速く終わった日より、取りこぼしがなかった日のほうが精神的にずっと軽い。密度の高い画面は、その日の終わりに「全部見た」と言い切れる状態を作ってくれます。

出品件数が増えて画面に不満が出てきたら、機能を足す前に一度この物差しを当ててみてください。足りないのは面積なのか、静けさなのか、色なのか、それとも情報そのものなのか。原因が分かれば、打つ手は自然に決まります。