この記事のレベル
| 初心者 | （3.0） |
| 重要度 | （2.5） |
| 難しさ | （3.0） |
こんにちは、編集長のカワウソです！
「面白い仕掛けのあるサイトを作りたい」と考えていませんか？
Web上にはさまざまなデザインのサイトがあり、他社と差別化するために「面白い仕掛け」を取り入れたいと考える方は、少なくないと思います。
そこで今回は、面白い仕掛けがあるサイトを厳選して7つご紹介します。
カワウソ
この記事は次のような人におすすめ！
- 自社を魅力的にアピールしたい人
- サイト制作に予算をかけられる人
- 競争が激しい業界のビジネスを営む人
この記事を読めば、面白い仕掛けのサイトが生み出す効果も分かります。
また、記事の後半では、面白い仕掛けのサイトを作るときのアイデアも紹介しているので、ぜひチェックしてみてください。
それではどうぞ！
面白い仕掛けがあるサイトが生み出す3つの効果
面白い仕掛けがあるサイトは、主に以下3つの効果を生み出します。
他社の事例を参考にする前に、「なぜ面白い仕掛けのサイトを作るのか」について、考えてみましょう。
自社に対する期待感を抱かせる
面白い仕掛けがあるサイトは、ユーザーに「自社に対する期待感」を抱かせます。
面白い仕掛けにより、自社の特徴や商品を魅力的に伝えられるためです。
とくに、建築事務所、Web制作会社、コンサルティング会社など、顧客に対して「アイデア」を提供する企業なら、なおさらです。
ユーザーがサイトの面白い仕掛けを体験し、「この企業は本当にセンスがよい！」 と感じることで、自社への期待感が一層高まります。
ユーザーの記憶に残りやすい
面白い仕掛けがあるサイトは、ユーザーの記憶に残りやすいと言えます。
面白い仕掛けにより、強烈なインパクトをユーザーに与えるためです。
ユーザーによっては、商品を購入するまでに、数週間ないしは数ヶ月の時間をかけます。
その期間、インパクトが弱いサイトなら、ユーザーに忘れられてしまうかもしれません。
つまり、自社の知らぬ間に、ユーザーの候補から脱落してしまっているおそれがあるのです。
一方、面白い仕掛けがあるサイトは、前述のとおり強烈なインパクトを与えます。
たとえ、ユーザーの検討期間が長かったとしても、覚えてもらえる可能性は高くなるでしょう。
競合他社と差別化できる
面白い仕掛けがあるサイトは、競合他社と差別化するのに効果的です。
面白い仕掛けがあるサイトは魅力的な存在である一方で、作るのに通常よりも費用や時間がかかります。どの企業にも真似できることではありません。
たとえば、面白い仕掛けがあるサイトは、写真やイラストが凝っていたり、アニメーションで動きを演出していたりします。一般的なサイトを作るよりも、どうしても費用や時間がかかってしまうのです。
しかし、逆に言えばそれはチャンス。
サイト制作に予算を注ぎ込めない企業も多いなか、自社が実現できれば、競合他社と差別化を図れます。
創業期の企業の場合、面白い仕掛けのサイトを作るのは、おすすめできません。
前述のとおり、面白い仕掛けのサイトを作るのには、通常よりも時間や費用がかかります。
創業期であれば、必要最低限の投資として、「名刺程度のサイト」から始めましょう。
詳しくは、以下の記事で解説しています。
面白い仕掛けがあるサイト事例7選
ここでは、面白い仕掛けがあるサイトを7つ紹介します。
なお、この記事での「面白い」とは、「笑ってしまう」といったニュアンスのものではなく、「サイトを見た人の心を惹きつける」ものを指します。
分かりやすく言えば、自社の特徴や商品を、面白い仕掛けでよりよく演出しているサイトのことです。
株式会社 明電舎
▲出典：株式会社 明電舎
『株式会社 明電舎』は、さまざまな電気技術を要する企業です。
コーポレートサイトのなかにある「あなたのとなりの明電舎」というページを見てみましょう。
面白い仕掛けにより、『株式会社 明電舎』の電気技術が、普段の我々の生活にどのように関わっているのか、分かりやすく伝わってきます。
▲出典：あなたのとなりの明電舎
このページには、以下の3つの質問が掲載されています。
- 電気ってそもそも、どうやってつくっているんだろ？
- 電車ってそもそも、どうやって動いているんだろ？
- 汚れた水ってどうやってキレイになるのかな？
たとえば、一つめの質問はスマホの電源が切れそうで充電しようと思ったユーザーが、ふと抱いた疑問です。
「電気ってそもそも、どうやってつくっているんだろ？」という質問のアンサーとして、面白い仕掛けで分かりやすく解説しています。
▲出典：あなたのとなりの明電舎
イラストアニメーションは、ダムから水が放流されるところから始まります。
『株式会社 明電舎』の水力発電設備によって電気が作られ、最終的にユーザーのスマホに送られる様子がうかがえます。
▲出典：あなたのとなりの明電舎
このように、自社の事業内容を分かりやすく紹介できるのも、面白い仕掛けのメリットです。
もし、自社の事業内容の紹介方法に悩んだ場合は、参考にしてみてはいかがでしょうか。
株式会社村田製作所
▲出典：株式会社村田製作所
『株式会社村田製作所』は、スマートフォン、家電、自動車などに必要な電子部品を供給するメーカーです。
コーポレートサイトとは別に、電子部品のヒミツを伝えるための「デンシランド」という、特設サイトを運営しています。
▲出典：デンシランド
今回は、その特設サイトのなかにある「ハッケンラボ」に注目してみましょう。
面白い仕掛けにより、普段我々が使用しているスマートフォンやパソコンなどに、どんな電子部品が使われているかを楽しく学べます。
▲出典：デンシランド
スマートフォンのページに入り、虫メガネのアイコンをクリックしてみてください。
▲出典：デンシランド
▲出典：デンシランド
すると「〇〇をみつけた！」といった具合に、スマートフォンに使用されている電子部品を発見することができます。
「つぎのページ」をクリックすると、その電子部品がスマートフォンにとってどんな役割を果たしているのかも知ることが可能です。
なお、見つけた部品はカウントされていくので、次を探すのが楽しくなります。
▲出典：デンシランド
自社の取扱い商材を面白い仕掛けで紹介したいと考えている方なら、参考になるのではないでしょうか。
株式会社ライデン
▲出典：株式会社ライデン
『株式会社ライデン』は、「ブランディングとデザインをつなげる」をモットーに、戦略とクリエイティブで、企業のブランドづくりを支援している企業です。
サイトの面白い仕掛けにより、株式会社ライデンの強みである「アートワーク（＝ビジュアルデザイン）」の凄さが伝わってきますよ。
スクロールしていくにつれ、次々にメッセージが飛び出してくる面白い仕掛けに注目してみてください。
▲出典：株式会社ライデン
それぞれのメッセージは、文字の大きさ、太さ、色、位置などが異なり、飽きることがありません。なかでも力強い印象の文字は、まさにこちらに訴えかけてくるようです。
また、縦書きの文字はページのスクロールを促す効果もあるでしょう。
▲出典：株式会社ライデン
この計算されたデザインのサイトを見たユーザーなら、きっと株式会社ライデンのプロデュース力に期待感を抱くはず。面白い仕掛けが「問い合わせの獲得」につながる好例と言えます。
株式会社 闇
▲出典：株式会社 闇
『株式会社 闇』は、ホラー専門の制作会社として、イベントの企画・アプリ開発をプロデュースしている企業です。
サイトの面白い仕掛けにより、『株式会社 闇』の事業内容が明確に伝わってくるだけでなく、その演出力の高さに驚愕します。
ホラー×テクノロジー「ホラテク」で新しい恐怖体験を作りだすというキャッチコピーそのままに、サイトはおどろおどろしいデザインになっています。
たとえば、ページをスクロールしていくと、途中で引き戸が現われ、徐々に開いていく仕掛けがあります。
▲出典：株式会社 闇
そのあとも蜘蛛や「ホラテク」と書かれた血まみれの手が出てきて、恐怖そのものです。百聞は一見にしかず、ぜひ実際にご覧ください。
なお、ファーストビューの「了解して進む」をクリックすると、音声が出るので注意しましょう。恐怖体験をよりリアルに味わいたい方はぜひ押してみてください。
株式会社BAKE
『株式会社BAKE』は、国内外に複数の洋菓子店を展開する企業です。
▲出典：株式会社BAKE
今回紹介するのは、同社が「アートなお菓子」をコンセプトに展開するブランドの『しろいし洋菓子店』のサイト。
面白い仕掛けにより、『しろいし洋菓子店』のアートなお菓子を楽しむことができます。
▲出典：しろいし洋菓子店
このサイトはマンションが舞台となっており、1階に店を構える『しろいし洋菓子店』と、その上の階に住む「住人」との間で展開される物語を知ることができます。
ページがスクロールした状態で始まるのが独特で、上にいけば「物語」、下にいけば「想い」が書かれたエリアにアクセスできます。
参考に、上にスクロールして、マンションの最上階に住む「大家のマダムブルー」の物語を見てみてください。
▲出典：しろいし洋菓子店
そのマダムブルーの人物像はもちろん、商品の「クッキー缶」との物語が語られていますよ。
なお、『しろいし洋菓子店』は、店舗ビジネス中心で展開をしていた『株式会社BAKE』が、初めて取り組むオンラインを基軸としたブランドです。
同社が発表した以下のプレスリリースに、詳しい内容が書かれているので、あわせて参考にしてください。
▶ オンライン上で展開する独自の世界観と“アートなお菓子”が織りなす“イマーシブ（没入）体験”を提供！新ブランドアプリファクトリーはるni株式会社（参考：PR TIMES）
アプリファクトリーはるni株式会社
『アプリファクトリーはるni株式会社』は、ゲーム開発事業と教育事業を展開する企業です。
サイトの面白い仕掛けにより、アプリファクトリーはるni株式会社が「自分達の存在意義」として掲げている「世界中に楽しいを生み出す」がうまく表現されています。
ゲームの仮想空間の中に入ったかのようなサイトで、見るだけでなく、操作できるのが楽しいポイントです。
まず、3Gアートの建物をクリックした状態で、マウスを左右に動かしてみましょう。一緒に建物が動くはずです。同時に画面左側にサイトのメニューである「会社概要」や「事業内容」などが表示されますよ。
試しに「制作実績」にアクセスしてみてください。建物のなかに設置された電子掲示板から、制作実績を確認可能です。
まさにゲーム会社と言ったサイトで、楽しみながらアプリファクトリーはるni株式会社のことを知ることができます。
また、このように遊び心がふんだんに取り入れられたサイトでもあるにも関わらず、ユーザビリティ（操作性）が損なわれていない点も見逃せません。
3Gアートの建物を操作しなくても各ページにアクセスできるように、グローバルナビゲーションが設置されています。
また、ページによっては、下までスクロールした時点で建物が再度表示されます。
このまま他のページにアクセスできるので、ユーザーにとっては親切な設計です。
▲出典：アプリファクトリーはるni株式会社（企業情報ページ）
面白い仕掛けとユーザビリティの高さが両立するサイトと言えるでしょう。
株式会社PLAYWORK
▲出典：株式会社PLAYWORK
『株式会社PLAYWORK』は、オンライン完結型不動産取引サービス『ゴジュパー』や、働く場所を改革する空間レンタルサービス『G.O WORK』などを運営する企業です。
サイトの面白い仕掛けにより、株式会社PLAYWORKのビジョン、ミッション、バリューがうまく表現されていますよ。
- ビジョン：遊び働く世界をつくる
- ミッション：世の中の当たり前を変える
- バリュー：GAME経営
ドット絵RPGのデザインで作られており、サイトのいたるところから、面白い仕掛けを発見できます。
たとえば、トップページを下にスクロールすると、ゲームの主人公とその仲間が一緒についてきますよ。
▲出典：株式会社PLAYWORK
「遊び働く世界をつくる」ことを目指している株式会社PLAYWORKだからこその、面白い仕掛けと言えるでしょう。
なお、株式会社PLAYWORKのサイトには、求職者向けのメッセージも添えられています。
このような面白い仕掛けは、求職者に対してもポジティブな印象を与えるでしょう。
以下の記事では、面白い採用サイトを紹介しているので、あわせて参考にしてみてください。
面白い仕掛けがあるサイトを作るときのアイデア3つ
面白い仕掛けがあるサイトを作成するときには、ユーザーの関心を引き、楽しませることが重要です。
以下3つのアイデアを参考にしてみてください。
それぞれ簡単に解説します。
ユーザーの操作に応じてコンテンツを変化させる
ユーザーの操作に応じて、コンテンツを変化させる方法です。
これにより、ユーザーが受動的ではなく、能動的にサイトを操作するようになります。
たとえば、この記事で紹介したサイト事例でも、クリックやスクロールなどの操作に応じて変化するコンテンツは、多かったですよね。
自社のサイトをユーザーに積極的に閲覧してもらうために効果的な手法なので、ぜひ参考にしてみてください。
隠れたページやコンテンツを表示する
ユーザーが特定の条件を満たした場合のみアクセスできるページやコンテンツを、設ける方法です。
これにより、ユーザーにサプライズを与えるだけでなく、サイトを探求させる楽しさを与えられます。
たとえば、 特定のキーワードを入力したときや、画像をクリックしたときなどです。
じつは検索エンジンの「Google 検索」にも、似たような仕掛けがありますよ。
「Google Pacman」と検索してみてください。検索画面上で、『PAC-MAN™』で遊ぶことが可能です。
ストーリーを展開する
サイトを通じてストーリー（物語）を展開する方法です。
単に事実を並べるだけでなく、ユーザーに感情的なつながりを提供し、より深い理解や共感を促します。
たとえば、ユーザーがページをスクロールするにつれて、ストーリーが進行し、新しい情報やビジュアルが表示されるようにします。
自社の歩み、ブランドの起源、製品の開発ストーリーなど、さまざまな素材を題材にできるでしょう。
なお、この手法は「ストーリーテリング」と言って、文学、映画、演劇、音楽、広告、マーケティング、教育、コミュニケーションなど、多様な分野で用いられています。
情報を伝えるための強力な手段であり、ユーザーの関心を引き、メッセージをより効果的に伝えることができます。
面白い仕掛けがあるサイトを作るときの注意点
面白い仕掛けがあるサイトを作るときの注意点は、最低限のユーザビリティを確保することです。
せっかく面白い仕掛けがあるサイトを作っても、「ページが重い」「どこを操作すればよいか分からない」となってしまうと、期待する効果を発揮できません。
サイトの面白さとユーザビリティのバランスを、うまく取るようにしましょう。
なお、サイトスピードについては、以下の記事で詳しく解説しています。
また、UX（ユーザー体験）について解説した記事もあるので、ぜひあわせてご覧ください。
面白い仕掛けがあるサイトをもっと探したい方へ
面白い仕掛けがあるサイトをもっと探したい方におすすめしたいのが、ギャラリーサイトです。
ギャラリーサイトなら、効率的に面白い仕掛けがあるサイトを探せます。
たとえば、『SANKOU!』には、「遊び心がある･作り込まれている」や「要素が動く」などのカテゴリがありますよ。
▲出典：SANKOU!
なお、サイト制作の参考になるギャラリーサイトは、以下の記事で紹介しているので、ぜひチェックしてみてください。
まとめ
この記事では、面白い仕掛けがあるサイトを厳選して7つご紹介しました。
- 面白い仕掛けがあるサイトは、競合他社と差別化できるなどのメリットがある
- 面白い仕掛けがあるサイトの制作は、時間や費用がかかるので創業期にはおすすめしない
- 面白い仕掛けがあるサイトを作るときは、3つのアイデアを参考にするとよい
- 面白い仕掛けがあるサイトを作るときは、最低限のユーザビリティを確保する
- ギャラリーサイトなら、面白い仕掛けがあるサイトを効率的に探せる
面白い仕掛けがあるサイトは、自社の独自性を打ち出すのに効果的です。
サイト制作のリソースに余裕があるときは、ぜひ検討してみてください。
それでは、素敵なサイトが完成することを願っております。
以上、最後まで読んでいただき、ありがとうございました。
ホームページの開設を検討している方へ
エックスサーバーは、高速かつ高い安定性を誇る「高性能レンタルサーバー」です。
国内シェアNo.1※のレンタルサーバーであり、19万社の導入実績があります。
2024年5月7日12時まで、サーバー利用料金が最大30％オフとなる割引キャンペーンを実施中です！
今なら月額693円～とお得にホームページを開設できます！
.comや.netなど大人気ドメインも永久無料と過去最大級にお得です。
ぜひこのお得な機会にホームページ開設をご検討ください！
※ 2023年10月時点、W3Techs調べ。
法人向けレンタルサーバー「Xserverビジネス」なら、
「ホームページ無料制作サービス」が付いているため、
申し込むだけで2日でホームページが完成します！
Xserverビジネスだと「.com」以外にも「.co.jp」や「jp」などのドメインも無料になります。
当メディア「初心者のための会社ホームページ作り方講座」では、初心者の方にわかりやすく会社のホームページを始められる方法を紹介しています！
これから始める方はこちらのホームページの作り方をぜひご覧ください！
ホームページの始め方・立ち上げに関する、ご質問・ご相談はツイッターDM( @kawauso_xsv )までお気軽にどうぞ！
カワウソ
当メディアはリンクフリーです。貴社のSNSやブログでご紹介いただけると嬉しいです。
