プペルバス公式サイト
西野彰浩氏の絵本「えんとつ町のプペル」の世界観を日本中の子供たちに届ける、プペルバスの公式サイトです。トップページはプペルの町をイラストで表現し、プペルバスを走らせました。キャラクターや町のイラストは制作の許可をいただき、株式会社テイクコーポレーション様に制作していただきました。
- CLIENT
- Y様
- URL
- https://poupellebus.com/
- CATEGORY
-
- サービス
- 担当工程
-
- ディレクション
- デザイン
- 構築
サイト制作の課題
今回プペルバス様のサイトを制作させていただくにあたり、プペルの町をどのように表現するかが一番の課題でした。
西野彰浩氏の『えんとつ町のプペル』は既に有名な作品ですので、プペルバスのWebサイトとして、『えんとつ町のプペル』の世界観を大切にすることを重きにおいていました。
そこで、ポスター1枚から店舗や商業施設のサイン・内外装までを手がけているテイクコーポレーション様に協力を要請させていただきました。
テイクコーポレーション様は様々なデザインを手掛けており、小さいものから大きいものまで多数の実績をお持ちです。
弊社でテイクコーポレーション様のホームページ制作を担当させていただいていたことから、快く引き受けてくださいました。
こだわりのトップページ
テイクコーポレーション様からイラストを提供いただいた瞬間、弊社内でもクライアント様からも「すごい!!」の一言でした!
プペルの世界観を守りながら、Webサイトとして表現するためアイソメトリックの技法を考慮して作成いただきました。
キャラクターも元のデザインを踏襲しつつ、SNSのアバターのような丸みをイメージしてデフォルメし、かわいらしくデザインされています!
町に命をふきこむ
テイクコーポレーション様より提供いただいた素晴らしいイラストを、ホームページとして完成させるため、細部にこだわりWebならではの動きを加えていきました。
町を覆いつくす煙をよりリアルに
煙突から出る煙や町中に漂う煙は、よく見るとゆらゆらと揺れるような動きを加えました。かすかな動きなので、気づかれないこともあります。(笑)
ですがその小さな動きを加えることで、無意識にでも静止画としてではなく「町」として認識いただけるよう工夫をしております。
各下層ページへのボタンを自然に配置
町の建物にかかる看板を下層ページへのボタンにしました。
下層ページへのボタンを看板にすることで、プペルの世界観を邪魔せずに他の情報に自然とアクセスできるようにしております。
看板を作成するにあたっては、フォントの選定に注意を払いました。
プペルの世界観に合わせ、映画で使われるようなフォントや遊び心のあるフォントからそれぞれ選ばせていただきました。
文字組も看板の形状に合わせながら、世界観に合わせて作成しました。
町中をプペルバスが走る!
最後に、プペルのイラストがラッピングされたプペルバスが町の真ん中を走り抜ける一番大切な動きをつけます。
当初、バスの運転手には顔がついていませんでしたが、クライアント様からのご要望により、実際にバスの運転手されている方をキャラクターとして登場させることにしました。
ご本人様にも気に入っていただけたようで安心いたしました、、!
(右下に写っているのはクライアント様ご本人のキャラクターです!クリックするとご本人のウェブサイトに飛ぶことができます。)
下層ページにもバスのパーツを
下層ページにも、バスやバス停のシルエットのイラストをところどころあしらっています。
「プペルバスとは」のページには、バスの窓をイメージして画像を切り取っています!
また、金色の放射線状の円は、「子どもたちの『太陽』のような笑顔」と「バスの『車輪』」をイメージしています!
プペルバスの活動内容のご紹介
クライアントのY様は、ご自身の経験から、日本中の全ての子どもたちに笑顔を届けたいという想いでプペルバスの活動をされています。
YouTubeでその心境を語っておられますので是非ご覧ください!動画としてもクオリティが高く、見ててホロっときてしまいます!
他にもプペルバスの活動を撮影した素敵なYouTubeがたくさんありますので、こちらも是非見てくださいね!