どんなサイトも間違い探しになるChrome拡張「どこでも間違い探し」を作りました

どんなサイトも間違い探しになるChrome拡張「どこでも間違い探し」を作りました

記事
コラム
いつも見ているニュースサイトやWikipediaが、そのまま間違い探しの問題になったら面白いと思いませんか?
そんな思いつきから、Chromeの拡張機能「どこでも間違い探し」を作りました。ボタンを押すと、今開いているページのどこかがこっそり書き換わります。あなたはそれを見つけるだけです。
問題を用意する必要はありません。ネットにあるページの数だけ、問題があります。この記事では、遊び方と、作る中でぶつかった壁と工夫を紹介します。

どんな拡張機能?

「覚えてから探す」間違い探しです。普通の間違い探しは2枚の絵を見比べますが、初めて見るページでは「元の姿」が分かりません。そこで、先に画面を覚えてもらう形にしました。
1. 覚える:黄色い枠の中を数秒間じっくり見る
2. 暗転:画面が暗くなっている間に、どこかが変わる
3. 探す:変わったと思う場所をクリックする
4. 結果:見つけた数とタイムが出て、答え合わせもできる
変化は全部「本物のページ」の上で起きます。画像を加工しているのではなく、ページの文字や画像そのものを書き換えています。だから、変化はどれも自然で、だまされた感覚が楽しめます。
02-find-frame.png
黄色い枠の中だけが出題範囲。下のバーに、見つけた数とタイムが出ます。

遊び方と3つの難易度

難易度は3つです。「かんたん」なら子どもでもクリアでき、「むずかしい」は1文字の変化まで出てくる本気モードです。遊んでいる間は、こんな助けがあります。
• 黄色い枠:変化が起きるのは枠の中だけ。枠は、問題にしやすいものが多い場所に自動で置かれます
• ヒント:20秒見つからないと、変化のあたりがぼんやり光ります
• 答え合わせ:結果画面でボタンを押している間だけ、元のページに戻り、「あー、そこか!」を体験できます。

06-hint.png

03-answer-changed.png
04-answer-original.png

上が変化後、下が元のページです。ロゴが左右反転し、「UltraForm」に背景色が付き、「羅針盤」の色が変わっていました。
終わったら、ページは完全に元に戻ります。Escキーでいつでもやめられます。

みんなで競う「今日のお題」

毎日1ページ、全員が同じ問題に挑戦できます。お題はWikipediaの記事(富士山、寿司、新幹線など)で、日付が同じなら出題も同じになります。
結果は、Wordle風のマス目でシェアできます。

緑は自力で発見、黄色はヒントを見てから発見、赤は見つけられなかった変化です。SNSに貼れる画像カードも保存できます。シェア文にはページのURLは入らず、ドメイン名だけが載ります。

05-result-card.png

ポップアップには、プレイ回数・パーフェクト回数・お題の連続日数が表示されます。毎日のちょっとした頭の体操にどうぞ。

おわり

どこでも間違い探し」は、いつものネットをそのまま遊び場にする拡張機能です。最後まで読んでいただき、ありがとうございました!




サービス数100万件のスキルマーケット、あなたにぴったりのサービスを探す