404 Not Found Award
無くなっている。
かつての自分がブックマークに登録していたページが、無くなっている。
何て味気ないんだろう。
実家に帰ったら子供の頃よく行った店が空き地に変わっていた時のような気持ちになる。
せめて無くなったページの跡地、404ページが少しでも楽しめるものだったら……。
他のサイトの404ページはどんな感じだろう。
調べてみた
Googleはこんな感じ。
シンプルではあるがイラストが添えられている。
これならページが無くなっていても多少は気分が紛れる……かもしれない。
Appleはどうだろう。
……。
こんなもんか?
世界のGoogleが、Appleがこんなもんなのか?
あるだろ!!!もっと楽しめる404ページが!!!!!
404 Not Found Awardとは
面白い、おしゃれ、かわいいなど、個性的で魅力的な404エラーページに対して、私が勝手に贈る賞です。
5,000サイトほどチェックして、その中から一応厳選はしたのですが、素敵なページが多く、それでも100サイト以上になってしまいました。
部門を分けたのでお急ぎの方は好きな部門だけ見てください。
また、各部門の最後にリンクを貼ってあるので、気になったページはぜひご自分でチェックしてみてください。
それではどうぞ。
🏆 Food部門 🏆
食べ物に関する404ページに賞を贈ります
(1/11)
🏅入選:ミスタードーナツ
🏅入選:ごま油の四季
🏅入選:スシロー
🏅入選:キユーピー
🏅入選:R.L waffle cake
🏅入選:江崎グリコ
🥉銅賞:???
チリン ⁽⁽🔔₎₎ チリン
突然ですがクイズです
Q. これは何の404ページでしょう
シンキングタイム、スタート!! ピーッ!
ズンチャカ ♫ ⁽⁽🕺🏻₎₎ ♪ ドンチャカ
ピーッ! ソコマデッ!👮
正解は…
びっくりドンキーでした
ということで銅賞はチーズバーグディッシュでおなじみ、ハンバーグレストランの『びっくりドンキー』。
びっくりドンキーを象徴する「❗️」のマークとプレートが使われており、「びっくりドンキーらしさ」が出ている。
プレートが空なのも404ページらしくて良い。
🥈銀賞:dancyu
“全国の食いしん坊のための食と暮らしを豊かにする体験型メディア”、『dancyu』。
食のメディアということで、404の“0”の部分が皿と箸になっている。おしゃれ!
🥇金賞:株式会社折兼
金賞は食品包装資材専門商社の『折兼』。
容器の底に“404”と“SORRY”と書かれており、食品包装資材の会社ということを活かした404ページになっている。
おかずとご飯を詰めることができ、ちょっとしたパズルゲームとして楽しめる点も良い。
🏆 Genius部門 🏆
知的な404ページに賞を贈ります
数は多くない
(2/11)
🏅入選:芝浦工業大学
🏅入選:QuizKnock
🥉銅賞:PNAS
日本語では『米国科学アカデミー紀要』と呼ばれる、米国科学アカデミー発行の総合科学学術雑誌『PNAS』。
科学誌らしく、404ページには元素記号で作られた“No Page Found”が並ぶ。良いアイデア。
🥈銀賞:SkillUp AI
データサイエンスのスペシャリストから機械学習のスキルを体系的に学べるコミュニティ、『SkillUp AI』。
ランダムにAI用語を解説してくれる。
404ページに辿り着くたびに賢くなれる。
🥇金賞:yukicoder
競技プログラミング・アルゴリズムの練習サイト『yukicoder』。
404ページでは「404」にちなんだ問題が出題されている。
$${4x^2+0x+4}$$は必ず0より大きくなるので、出題された式は実数解を持たない。
解が存在しないことをページが存在しないこととかけていると思われる。知的な表現。
🏆 Original Character部門 🏆
キャラクターが活躍する404ページに賞を贈ります
(3/11)
🏅入選:株式会社ポケモン
🏅入選:bebop
🏅入選:ONE PIECE.com
🏅入選:PIXIV FANBOX
🏅入選:ドラえもん公式サイト
🏅入選:KETAKUMA Official
🏅入選:レゴランド・ジャパン・リゾート
チリン ⁽⁽🔔₎₎ チリン
レゴランド・ジャパン・リゾートの
404ページからクイズです
Q. どんな顔をしているでしょう
シンキングタイム、スタート!! ピーッ!
ズンチャカ ♫ ⁽⁽💃🏻₎₎ ♪ ドンチャカ
ピーッ! ソコマデッ!👮♀️
正解は…
3番でした
🏅入選:inadani sees
🥉銅賞:BRUTUS.jp
ライフスタイル情報誌、『BRUTUS』の公式Webサイト。
BRUTUSが起用しているのはアメリカの漫画『ポパイ』に登場するキャラクター『ブルート』。
『BRUTUS』の名前の由来にもなっている。
gifアニメーションで動きを見られるのが楽しい。
画面がゴチャゴチャしていないのも良い。
🥈銀賞:doma.solutions
デザイナー・どまそ氏のポートフォリオサイト。
よく見るとタブレットに404ページと同じイラストが描かれているように見える。
かわいい。調べた中で一番かわいい404ページ。
🥇金賞:Pixar(米)
アメリカのアニメーション制作会社、『Pixar』。
404ページには映画『インサイド・ヘッド』の『カナシミ』を起用。
映画では頭の中のコントロールパネルでカナシミたちが記憶を「長期記憶」と呼ばれる場所に送っている。
ページが見つからなかったことを、映画の設定になぞらえて上手く表現している。
キャラクターが泣いている404ページはあまりよく分からないが(見つからなくて泣きたいのはこちらなので)、カナシミであれば納得である。
🏆 Animal部門 🏆
動物の404ページに賞を贈ります
犬と猫は別部門
(4/11)
🏅入選:SmartHR
🏅入選:京都精華大学
🏅入選:maxilla
🏅入選:mercan
🏅入選:しまうまプリント
🏅入選:Utopia Agriculture
🏅入選:waldo
🏅入選:GARDEN EIGHT
🏅入選:ふじおか中央こども園
チリン ⁽⁽🔔₎₎ チリン
ここでクイズです
Q. ふじおか中央こども園の404ページに描かれている
『びっくりカエル』は次のうちどれでしょう
シンキングタイム、スタート!! ピーッ!
ズンチャカ ♫ ⁽⁽👯♀️₎₎ ♪ ドンチャカ
ピーッ! ソコマデッ!👮♂️
正解は…
1番でした
🥉銅賞:BYARD
“業務を可視化し、カイゼンを容易にする業務設計プラットフォーム”、『BYARD』。
鳥獣戯画風のウサギとカエルが会話していてユーモラス。
画面がイメージカラーの緑になっている点もポイント。
🥈銀賞:WWFジャパン
100カ国以上で活動している環境保全団体、『WWF』の一翼を担う『WWFジャパン』。
ページが見つからないことにかけて、「ドードーは既に絶滅してしまい、世界中のどこを探しても見つけられない」という強烈なメッセージが書かれている。
これは日本版のページのみ。
🥇金賞:The Woolmark Campany
羊毛産業に関係するすべての人々の暮らしをより良くする会社、『The Woolmark Campany』。
「ごめぇぇぇ"んなさい」という羊たちからのメッセージが書かれている。
これだけでもユーモアがあって素晴らしいのだが、英語版のページを見ると、“Our baaaaaad.”と書かれている。
これは“Our bad.”(ごめんなさい)と“baa”(英語圏での羊の鳴き声)を組み合わせたもので、日本語と同じユーモアを織り込んでいる。すげー!
🏆 Dog部門 🏆
犬の404ページに賞を贈ります
様々な犬種をお楽しみください
(5/11)
🏅入選:Help Scout
🏅入選:W3G
🏅入選:OHEYAGO
🏅入選:El Paso Chihuahuas チームショップ
🏅入選:ワンコnowa
🏅入選:Twitter開発者プラットフォーム
🥉銅賞:みんなの銀行
スマホ完結のデジタルバンク、『みんなの銀行』。
犬が穴を掘るイラストで「掘ってもページが見つからない」ということを表現している。ただ犬のイラストを使うだけでなく、ポーズに一工夫あるのが良い。
🥈銀賞:MAGASINN
五感をフルに使って京都カルチャーを楽しめる空間、“泊まれる雑誌”『マガザンキョウト』プロジェクトを手掛ける会社『MAGASINN』。
モノクロのページがおしゃれ。
画面下部の再生ボタンを押すと音声が流れる。
調べた範囲では音声を流せる404ページは他にはなかった。
聴いている犬はマガザンがオープンしたミックスジュース専門店、『CORNER MIX』の看板犬『ZASSHU』。『CORNER MIX』にはペットも連れて行けるらしい。
🥇金賞:Amazon(米)
『Amazon』の404ページにも犬がいる。舌が出ている。
リロードしてみる。
リロードする度に別の犬が。
一体何パターンあるのか。
リロードを繰り返し、パターン数を突き止めた。
その数……
82パターン!!!!!
気合い入りすぎ!!!!!
複数パターンの404ページを用意しているサイトは他にもあるが、パターン数が圧倒的。
ページデザインもシンプルで見やすい。
ちなみにこの犬たちはAmazonの従業員が飼っている犬で、一緒に出社しているらしい。いいな〜!
🏆 Neko部門 🏆
犬の賞があれば猫の賞もある
“Cat部門”じゃないのかって?うるさい!
(6/11)
🏅入選:WIX.com
🏅入選:トースターチーム
🏅入選:RINN
🏅入選:まいどなニュース
🏅入選:Adobe Stock
🥉銅賞:Colla
チームパフォーマンス改善アプリ、『Colla』。
「📷モフモフ写真館」と題して、猫の写真が貼られている。
写真館なのでランダムで何パターンか出してくれるとさらに嬉しい。
🥈銀賞:サンリオ
銀賞はシナモロール、ポムポムプリンなどのキャラクターで有名な『サンリオ』。
ハローキティのシルエットが描かれている。
以前はシルエットではなく単にハローキティがいたようだが、シルエットにすることで「ページがない」ことを表す404ページの趣旨に沿ったものとなっている。
え、キティは猫じゃない?
🥇金賞:ヤマト運輸
「クロネコヤマト」でおなじみ、『ヤマト運輸』。
404ページでは箱に入ったクロネコを30秒以内に探すゲームをプレイすることができる。
「クロネコ」と「箱」を活用して、なおかつゲームで楽しませる。素晴らしい。
このように、一部の404ページではちょっとしたゲームで遊ぶことができる。
🏆 Playable部門 🏆
ゲームを楽しめる404ページに賞を贈ります
正直ゲームを作ってくれてるだけで全部金賞
(7/11)
🏅入選:KIRIN
🏅入選:mass:werk
🏅入選:Wendy's(米)
🏅入選:Développeur web sur Lille
🏅入選:CAMPFIRE
🥉銅賞:SUZURI
オリジナルグッズを販売できるサービス『SUZURI』。
通常の404ページの他に、ゲームをプレイすることができるページが稀に表示される。
障害物をジャンプで避け続ける。
寿司はアイテムかと思いきや障害物。
2,800点くらいまで行ったが、終わりがあるかは不明。
🥈銀賞:プラチナゲームズ
『NieR:Automata』、『ベヨネッタ』等で有名なゲーム開発スタジオ、『プラチナゲームズ』。
404ページではジャンプと銃撃のみで敵を倒すゲーム『8-Bit Bayonetta』をプレイすることができる。
さすがゲーム開発スタジオ。404ページとは思えない程のクオリティ。
Steamでも無料配信されていたらしい。
🥇金賞:タイトー
『タイトー』といえば『スペースインベーダー』。
404ページではインベーダーゲームをプレイすることができる。
自社の看板作品であるインベーダーで“404”を表現しており、さらに実際にゲームとして遊ぶことができる。
『タイトー』の404ページとしてこれ以上の正解はないと思う。
🏆 Nanimono部門 🏆
誰?な404ページに賞を贈ります
(8/11)
🏅入選: 早稲田ゼミ
🏅入選:OZPAの表4
🏅入選:日清食品
🏅入選:ジーニアスウェブ
🥉銅賞:CRISP
カスタムサラダレストランを展開する会社、『CRISP』。
404ページではCRISPのデザイナーが西麻布の路地裏を歩いている……というか踊っている。
gifがちょっと斜めなのがおしゃれ。イケてる。
ちなみに上の404ページは会社のページで、レストラン『CRISP SALAD WORKS』の404ページは以下のようになっている。
あなたはどんなサラダをカスタムをする?的なことを言っています。
🥈銀賞:FULL KAITEN
“在庫を利益に変える小売企業のための分析ツール”、『FULL KAITEN』のサイト。
知らないおじさんが土下座している。
調べたところフルカイテン株式会社の代表取締役らしい。
ジーニアスウェブと内容は似ているが、偉い人が土下座までしているという点で銀賞。
🥇金賞:スピッカート
大阪のデザイン事務所、『スピッカート』。
女性らしき人が「きゃっ」と言っている。
🏆 Urbane Design部門 🏆
画面がおしゃれ、かっこいい404ページに賞を贈ります
実際のページも見てほしい
(9/11)
🏅入選:plantica
🏅入選:Make a Move PROJECT
🏅入選:STORES
🏅入選:CIRCUS Inc.
🏅入選:THE SHIFT
🏅入選:STUDIO DETAILS
🏅入選:MOUTAKUSANDA!!! magazine
🏅入選:total property network
🏅入選:TRICLE.LLC
🏅入選:Roboto エンターテインメント
🏅入選:tote inc.
🥉銅賞:株式会社データグリッド
生成AIを活用したソリューションの共同開発、AIプロダクトの提供を行う『株式会社データグリッド』。
会社のロゴをうまく活かし、スクロールするたびにランダムな文字にモザイクがかかる。
こういうのかっこよくて好きなんですよ、大人になっても。
🥈銀賞:baqemono.inc.
WEBサイト制作・DTP制作会社、『株式会社バケモノ』。
上下左右鏡張りになったような画面。
スクロールでパターンを切り替えることができる。
404ページにしては凝りすぎている。かっこいい。
調べていて分かったことだが、既に紹介した『CRISP』のページも『total property network』のページも、ここで紹介できなかったページも含め、多くのページをこの会社が制作していた。
個人的にWebサイト制作を依頼する機会があったらお願いしてみたい。
🥇金賞:tumblr
メディアミックスブログサービス、『tumblr』。
ランダムで幻覚のような映像が表示される。おしゃれ。
「探しているものはこのアドレスではありません。しかし、エラーページをお探しの場合は、ここがそのエラーページになります。」と書かれており、わざわざエラーページを探すような物好きのことも考慮している。
上記以外にもパターンは存在するので、ぜひ直接見に行ってほしい。
🏆 Only One部門 🏆
他には真似できない404ページに賞を贈ります
甲乙つけがたい
(10/11)
🏅入選:ブリッカーズ
🏅入選:日本コカ・コーラ株式会社
🏅入選:JA全農たまご株式会社
チリン ⁽⁽🔔₎₎ チリン
ラストクイズです
Q. 卵の前で頭を下げているキャラクター、『オムレッツくん』の特技は何でしょう
シンキングタイム、スタート!! ピーッ!
ズンチャカ ♫ ⁽⁽💃👯🕺🏻💃🏻🕺👯♀️₎₎ ♪ ドンチャカ
ピーッ! ソコマデッ! 🫵🏻👮🏻♂️
正解は……
2番でした
(オムレツダンス……?)
🏅入選:GRAPE COMPANY
🏅入選:PREDUCTS
🏅入選:Netflix
🏅入選:日本郵便株式会社
🏅入選:サッポロビール
🏅入選:ポケットモンスターオフィシャルサイト
🏅入選:PEUGEOT
🏅入選:一行文庫
🏅入選:株式会社LIG
🏅入選:Dribbble
🥉銅賞:figma
ブラウザ上で簡単にデザインができるツール、『figma』。
自由にポイントを動かして404ページをデザインすることができる。
figmaというデザインツールの特性をよく表している。
アイデア次第で404をどんな形にもできるのが楽しい。
🥈銀賞:note
お世話になってます。
この記事を含め、さまざまな文章、写真、イラスト、音楽、映像が投稿されているメディアプラットフォーム、『note』。
404ページでは『note 404美術館』と称して、noteクリエイターから投稿された画像がランダムに表示される。
わざわざ404ページを見に行きたくなるようなアイデア。
画像からはクリエイターページに飛べるので新しい出会いがあるかも。
🥇金賞:ZOZOTOWN
ファッション通販サイト『ZOZOTOWN』。
ZOZOTOWNで実際に販売されているインテリア雑貨で「NOT FOUND」を形成している。
アイデアも面白いし、何より画面がカラフルで楽しい。
それぞれの文字から商品ページに飛ぶことができ、前述の『note』や『株式会社LIG』と同様、404ページから戻る動線としても機能している。
🏆 Expession部門 🏆
ウィットに富んだ文章表現の404ページに賞を贈ります
(11/11)
🏅入選:asana
🏅入選:Todoist
🏅入選:横浜赤レンガ倉庫
🏅入選:YAMAP
🏅入選:CSS HappyLife
様々な仕掛けが用意されているようだが、残念ながら現在は機能しない。
🏅入選:ライツ社
🏅入選:パタゴニア
🏅入選:Discord
ちなみに、イラストの右側にある蛇の看板をクリックすると、ゲームをプレイすることができる。(PC版サイトのみ。スマホ、タブレットは不可。)
🏅入選:アルバムをつくろう。
🏅入選:Uber Eats(米)
🥉銅賞:Marvel Comics(米)
『アイアンマン』でおなじみ、アメリカの漫画出版社『Marvel Comics』。
404ページでは、Marvelのキャラクター(アイアンマン、デッドプール、キャプテン・アメリカなど)と、そのキャラクターに応じた文章がランダムに表示される。
(私はほとんど知識がないが)Marvelファンには嬉しい404ページだろう。
単なる作品のセリフではなく、404ページに合わせている点が好印象。
🥈銀賞:zendesk
カスタマーサービスソフトウェアを提供する『zendesk』。
「おめでとうございます!」と書いてある404ページは他に無いと思う。
たまたまここに辿り着いたら「ラッキー!」と思ってしまうだろう。
「0」をグラフにして活用するアイデアも芸術点が高い。
自然にナビゲーションに誘導している点も素晴らしい。
🥇金賞:女子美術大学
東京5美術大学のうちの一校である『女子美術大学』。
「ページが見つからなかった」というマイナスの事象に対して、美大ならではの言葉でプラスの表現に換えている。お見事。
画面を半分に割るレイアウト、右側にランダムに表示される写真と文章もかなりおしゃれ。
リンクへの誘導も欠かさず、総合的に判断して404ページとしての完成度が高い。
ここまで読んでいただきありがとうございました。
そしてWebデザイナーの皆様、素敵な404ページを作っていただきありがとうございます。
全ての404ページを紹介しきれないのが心残りではありますが、404 Not Found Awardは以上となります。
まだまだ私が見たことのない素敵な404ページもたくさんあると思うので、もし見つけたら教えてください。
……あぁそうだ。よかったらこのページをブックマークに登録して、またいつか思い出したときに読み返しに来てください。
それでは。