こんにちは、デザイナーのゆうこです。
先日、けたたましく動くクマ略して「けたくま」オフィシャルサイトと、陽気で好奇心旺盛なラッコたちの「ラッコズ」オフィシャルサイトをリリースしました。
LINEスタンプでおなじみのシュールで独特な動きのくまと、たまらなく可愛いわんこ。みなさんも、一度は目にしたことがあるのではないでしょうか。
RACCOS Official | ラッコズ公式
「おはよう朝日です」の人気コーナー「おきたらんど」でおなじみのラッコズ。テーマソングの「ありそでないなさそであるよの歌」は、一度聴くと頭から離れません。
けたくまとラッコズの作者、たかだべあさんは、大学生のころにリリースしたLINEスタンプが瞬く間に大ヒットし、翌年「殿堂入りクリエイター」に選ばれました。その後、アニメーション、イラストレーション、ゲーム、音楽、グッズ制作など、幅広い領域で活動されています。
たかだべあ(takadabear)さん
1994年生まれ。LINEスタンプ、アニメーション、イラストレーションなど。 |
私はLIG入社前から、たかだべあさんの生み出すキャラクターが大好きで、どうすればあんなシュール動きが思いつくのか、どうやって滑らかなアニメーションを制作しているのかと、同僚とわくわくしながら語っていました。その数年後、まさかサイト制作に携われるとは……!
今回はけたくまとラッコズオフィシャルサイトの見どころや、発注元であるCHOCOLATE Inc.(以下チョコレイト)へのインタビューをお届けします。
目次
けたくまオフィシャルサイトの見どころ
まずは、けたくまオフィシャルサイトの見どころについてご紹介します。
けたくまのシュールさを引き立たせるために、どこか懐かしさを感じるレトロなデザインにしました。
たくさんのくすっと笑えるいたずらを仕掛けた、けたくまオフィシャルサイト。そのなかでも、見どころをいくつかピックアップしました。
つい遊びたくなるメインビジュアル
部屋でくつろいでいる「けたくま」と「けたたまわんこ」。部屋には、普通はないカラーコーンやボーリングも。彼らはこれらのアイテムでどうやって遊ぶのでしょうか?
アイテムをクリックorタップすると、彼らの奇想天外なおうち遊びを垣間見ることができます。予想も付かない彼らの遊び方を、すべてチェックしてみてくださいね。
個人的には、けたたまわんこがコーヒーを自分にかけて、そのまま弾けてしまうのがとくにお気に入りです。
けたくまがコンテンツをぶっとばす
画面をスクロールしていくと、いたずら好きなけたくまが画面外から出てきて、そのままNEWS記事をぶっとばしてしまいます。ニュースをぶっとばしたけたくまは、そのまま満足そうに余白で踊り続けます。
ぶっとばした記事に「空飛ぶけたくま、全国に大量発生中! 晴れた日に魚を求めて一斉に移動した模様。」と気になる内容が書かれていますが、よく見ると日付は「20XX.04.01」でエイプリルフール、カテゴリは「LIAR」。実はダミー記事なのです。
けたくまが大量に上から降ってくる
サイト右下の「!!」ボタンを押すと、けたくまが大量に(なんと700匹!)上から降ってきて積み上がることで、コンテンツが見えなくなってしまいます。コンテンツが見れないので、当然Webサイトの意味はなくなるでしょう。
けたくまらしく、いい感じにぶっとんでいるアニメーションを目指しました。
ラッコズオフィシャルサイトの見どころ
続いては、ラッコズオフィシャルサイトの見どころについてご紹介します。
シュールで賑やかなけたくまのサイトから一変、ラッコズのサイトは大人も楽しめるよう、シンプルでおしゃれなデザインにしました。
見ているだけで癒される可愛いラッコズオフィシャルサイト。そのなかでも、見どころをいくつかピックアップしました。
ふわふわと浮かぶメインビジュアル
陽気なラッコズが仲良く海で楽器を奏でている様子がたまらなく可愛いです。
マウスを動かすことで、実際に海で浮いているかのように、海面をラッコズがふわふわと漂います。同時に出現する波模様も、たかだべあさんがイラストを書き下ろしてくれました。
壮大なストーリー
ラッコズは可愛いだけじゃありません。実は背景に壮大なストーリーがあったのです。
ラッコズの住むラッコズランドは、たくさんのなぞに包まれています。水たまりが世界中とつながっていたり、ちょっぴり怖い見た目の宇宙人が訪れたり……これらのなぞが今後どのように解明されていくのか楽しみです。
スクロールするにつれて海の奥深くへ潜っていく感覚を、視差効果のパララックスや背景色のグラデーションで表現しました。
個性ある細かい設定
個性ある見た目のラッコズですが、実はちゃんとそれぞれに名前と性格が設定されています。
主人公のコラコは、夢見る小さなラッコで好奇心旺盛。他のラッコズは、目立ちたがりな子や笑い上戸な子、さらにヨイショな子やキザな子まで……!
子どもだけでなく大人まで楽しめてしまう理由は、このしっかりとした設定にあるのかもしれません。
チョコレイトへのインタビュー
ディレクターのほそさんと、今回Webサイト制作をご依頼いただいたチョコレイトへ行ってきました。そこで、気になるLINEスタンプの作り方、人気キャラクターの誕生秘話、Webサイト制作の感想など、たくさんお話しいただきました。
人物紹介:たかだべあさんけたくまとラッコズの作者。1994年生まれ。LINEスタンプ、アニメーション、イラストレーションなど。コンテンツスタジオ チョコレイト所属。 |
人物紹介:永井さん / 佐藤さんチョコレイトでキャラクター事業を担当するビジネスプロデューサー。 |
LINEスタンプ制作について
たかだべあさん:クリエイターズスタンプの展開が始まった様子をみていて、「絵を描くのは好きだし、自分でもできるかも」と感じていました。最初は静止画だけだったのですが、やがてアニメーションにも対応されるという情報を見つけまして。
もともとパラパラ漫画を描くことが好きだったので、「せっかくならアニメーションのほうに挑戦しよう!」と思い、作ってみたのがきっかけです。それまでアニメーションは作ったことがなかったので、完全に独学でやってみました。
たかだべあさん:「CLIP STUDIO」です。アニメーションのLINEスタンプを作るのに最適なツールだと思っています!
描いた素材をそのままAPNG(※アニメーションのLINEスタンプの納品形式)に書き出せるので、重宝しています。
たかだべあさん:テンションのアガる曲をかけながら、面白い動きの想像を膨らませて作っています。最近よく聴いているのは、Apple Musicの公式プレイリストの「エクササイズ」。けたたましい体の使い方を、運動する用の楽曲から着想しています。
仕事の進め方について
永井さん / 佐藤さん:週に1度の打ち合わせで、アニメーションのアイデアや、ストーリー展開上見せたいキャラクターの性格などを持ち寄り、SNSで効果的にラッコズの世界観を伝えるための表現方法を議論しています。
たかだべあさん:ゲームです!よくやっているのは「テトリス」。無心になれるので、プレイ後は頭がすっきりします。
Webサイト制作について
たかだべあさん:どちらもものすごく反響がありました!
けたくまはかなり遊び要素のあるサイトに仕上げていただいていますが、実際にファンの方からは「遊びまくった」「ずっと遊んじゃう」という声をいただけてとても嬉しかったです。
ラッコズはこれまで発信していなかったキャラクターの名前や性格を出せたことで、より知ってもらう機会をつくることができました。「好きだったキャラクターの名前がわかって嬉しい」「この子、こんな名前だったんだ」といった反応があり、これからの展開に期待感を持たせられたと感じています。
たかだべあさん:けたくま・ラッコズ、どちらもメインビジュアルが一番のお気に入りです。
けたくまの賑やかさや遊び心が、トップページでたっぷりと表現いただけて本当に嬉しかったです。
ラッコズは、やはり海に浮かんでいる様子が一番ラッコズの原点であり特徴的な部分なので、理想的なデザインになったと感じています。マウスを動かすとゆらゆら揺れたり、波紋が出てきたり、とても世界観のあるメインビジュアルに仕上げていただきました。
たかだべあさん:120点です!!!本当にありがとうございました!
まとめ
今回ご紹介したけたくまオフィシャルサイトは、海外Webデザインアワードで高い評価をいただき、下記の賞を受賞しました。
- awwwards – Hornable Mention
- CSS Design Awards – Special Kudos
- CSS Winner – Site of the Day
- CSS REEL – Featured
けたくまのシュールで独特な魅力が、国境を超えて海外の人々にも伝われば嬉しいです。自分が手掛けたWebサイトによって、クライアントに喜んでもらえたり、エンドユーザーに楽しんでいただければ、これほど嬉しいことはありません。
今後もたかだべあさんの活動から目が離せません。たかだべあさん、永井さん、佐藤さん、この度は貴重な機会をいただきまして、本当にありがとうございました。
以上、ゆうこでした!
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。