attrip.jpのトップページを、操作すると何が起きるかが分かるツールを一つ遊び始める入口として整理します。まずは完成形を作らず、同じツールで「時刻・PV」と「遊ぶ入口」の上下順だけを比べます。
今回、トップページのデザインについて、3つの質問を自分に投げました。
- 初めて来た人に何をしてほしいか
- 今のサイトで残したいものは何か
- どこに違和感があるか
答えは、かなりはっきりしていました。
新しいツールを遊んでほしい。
遊んだあとに「楽しかった」という感じを残したい。
そして、情報が多い。
トップページの入口が競合しているかもしれない
現在のトップページには、現在時刻とPV、大きなツール表示、最新の制作記録、作ったもの、本棚、全ツールへの導線があります。
一つひとつは必要です。問題は、最初に見える場所で同じくらいの強さを持っていることです。
初めて来た人は、「何を読むサイトなのか」「何を見ればいいのか」「どのツールを開けばいいのか」を考えることになります。
遊び始める前に、サイト全体を理解しようとしてしまうのではないか。入口の競合が開始を遅らせているかどうかは、初見の人の行動で確かめます。
目指す構成と、最初に試す差分を分ける
情報が多いからといって、記事や本棚を全部消す必要はありません。ただし、完成形の構成と、最初に確かめる比較を一度に変えると、何が効いたのか分からなくなります。
目指す構成
最初に勧めるのは、操作と結果が想像しやすいツール1件です。
「〈操作〉すると〈変化〉が起きる」という一文、ツール名、画像、主ボタンを置きます。主ボタンは1つだけ、「〈ツール名〉で遊ぶ」とします。補助導線は小さく1つ、「ほかの遊びを見る」です。所要時間は確認できた場合だけ記載します。
その次に、主役と重複しないツールを2件並べます。それぞれに、主役とは違う遊び方が分かる一文を添えます。「新しいから」ではなく、「何をすると何が起きるか」が選ぶ前に想像できる候補にします。
PVや現在時刻、制作記録、本棚、全ツールの分類は残します。ただし、下へ移動しただけで「遊んだあと」の回遊が生まれるとは限りません。遊び終えた人の次の行動は、別の検討事項です。
読む場所をなくすのではなく、まず遊ぶ入口を強くする考え方です。ここで示す順番は、初回比較の結果を見てから検討する完成形の案です。
残したいのは、写真と「まず、試してみる。」
情報を減らすときに、attripらしさまで削ってはいけません。
今のトップページにある大きな写真と、「まず、試してみる。」という言葉は残します。
ここには、説明を読む前に触ってみる空気があります。
トップページを整理しても、無機質なリンク一覧にはしない。作ったものを遊び、必要なら制作記録へ進める導線は残します。実際にいつ読むかは、初見の人の行動で確かめます。
最初に比較するのは、上下順だけ
いきなり色、書体、アニメーション、ページ全体を変えると、何が効いたのか分からなくなります。最初は、同じツールを使って、時刻・PVと遊ぶ入口の上下順だけを比較します。
A案
時刻・PV → 遊ぶ入口
B案
遊ぶ入口 → 時刻・PV
主役のツール1件、画像、説明、主ボタンの文言と寸法、色、書体、下段の全内容、遷移先、ツール本体、既存のURL、本文画像は固定します。候補数の変更やページ全体の並べ替えは、この比較には混ぜません。
一つだけ差を作って、初見の人がどう動くかを見ます。
「楽しかった」は画面だけでは判定できない
この提案の目標は、クリック数だけではありません。
初めて来た人が、5秒表示後に何ができると理解したか。
再表示から開始クリックまでに迷いがあるか。最初の操作結果を理解できるか。
同じ時間遊んだあと、何が印象に残り、次に何をしたいと言うか。
各案を初見の人3〜5人ずつに別々に見せます。小規模な観察なので、統計的な優劣の証明とは扱いません。「楽しかったですか？」と誘導せず、「印象に残ったことは？」「次に何をしたいですか？」と聞きます。
次にやること
まずは、同じ内容を使った次の2案をローカルで比較します。
- A案：時刻・PV → 遊ぶ入口
- B案：遊ぶ入口 → 時刻・PV
この段階では、候補数、色、書体、アニメーション、ツール本体、終了後の導線を変えず、まだ実装や公開はしません。
遊ぶ入口の順番が開始行動に影響するかを確認してから、候補2件や、制作記録・本棚・全ツールの置き場所を考えます。
attrip.jpは、情報を全部同じ強さで見せる場所ではなく、気になったものを一つ試して、そこから次へ進める場所にしたい。
まずは、何が起きるか分かるツールを一つ遊ぶ。
そのあとで、作った理由や記録を読む。
今回の提案は、その順番を確かめるためのものです。
