【制作秘話】サービス開始から20年！特設ページ 「モッピー20th Anniversary #わたしとモッピー」　#CeresPRFriday

こんにちは！セレス広報担当です。

セレス広報がセレスの「リアル」をお届けする #CeresPRFriday

セレスが運営する国内最大級のポイントサイト「モッピー」が、2005年5月2日のサービス開始から20周年を迎えます！

これまで「モッピー」をご愛顧くださったユーザーのみなさまへ向けて、モッピーを愛するモッピーデザイナーが感謝の気持ちを込めてつくったモッピー20周年記念特設ページ「#わたしとモッピー」の制作秘話をご紹介します！

▼モッピー20周年記念特設ページ「 #わたしとモッピー 」

ポイントサイト「モッピー」とは

2005年5月2日、リスのマスコットキャラクター「モッピー」を採用したポイントモバイルサイト「モッピー」がサービス開始。当時、PC版のポイントサイトが主流のなか、フィーチャーフォン（ガラケー）版のポイントサイトとして誕生しました。2011年には、業界に先駆けWeb版（スマートフォン・PC対応）サービスを開始し、ユーザー会員数を飛躍的に拡大。2020年にはスマートフォン版アプリ、2023年には決済サービス「モッピーPay」サービスの提供を開始しました。現在、累計会員数が1,200万人（2024年4月時点）、ポイント交換先サービスも60種類以上を数え、国内最大級のポイントサイトとしてたくさんのユーザーのみなさまにご利用いただいております。

――特設ページ「モッピー20th Anniversary #わたしとモッピー」の企画について教えてください

Mさん：今回の特設ページのテーマである「 #わたしとモッピー 」にあるように、普段からモッピーをご利用いただいているモッピーユーザーのみなさま一人ひとりに感謝の気持ちをお伝えしたいという思いがあり、ユーザーのみなさまが特設ページを通してよりモッピーを身近に感じていただけるような企画を考えました。

まず企画をするにあたり、モッピーを運営する事業部内全体で実施したアンケート結果をとりまとめて、クリエイティブチームで具体的なアイデア出しを行いました。それと並行して実施した、「モッピー20周年」をテーマにしたモッピーユーザーアンケートの調査結果も参考にしながら、最終的に「ユーザーのみなさまへの“感謝”と“還元”」というコンセプトを固めました。

特設ページのテーマでありメインコンテンツでもある「 #わたしとモッピー 」では、ページにユーザー情報を紐づけ、モッピーのWebサイトにログインすると過去10年分の累計獲得ポイント数と2024年の全ユーザーの獲得ポイント数ごとに算出した割合を“モッピー称号”として表示する仕様にしました。

そのほかにも、「モッピー20年の歩み」や「モッピーデータベース」でサービス開始からこれまでの軌跡を数字にしたインフォグラフィックス、モッピーユーザーアンケート結果のランキングやいただいたメッセージのなかからピックアップした240件からなるユーザーのみなさまのあたたかいお声の数々、普段はなかなか紹介する機会のないモッピーの仲間たちのキャラクター紹介など、とにかくユーザーのみなさまに「喜んでいただきたい！」という一心で、“モッピーくん”を盛りだくさんに詰め込みました！

～特設ページを企画したMさんは、今年の7月でモッピー歴6年を迎えるWebデザイナーです。周りからは「何でもできる人」と評判で、現在は公式YouTube「モッピーチャンネル」の動画制作を担当しています～

――実装にあたってデザインのこだわりを教えてください

Sさん：ユーザーのみなさまに目で楽しんでいただきたくて、明るくにぎやかになるようにカラフルな色を使用し動きもつけて、見ているだけで楽しい気分になれるようなページにデザインしました。

～「モッピー20th Anniversary #わたしとモッピー 」のメインビジュアル～

Sさん：全体のデザインは、クリエイティブチームで案出ししたアイデアを参考にして、アートディレクターのOさんと相談しながら詰めていきました。できるだけ華やかにしたかったので、案出し段階からあった動きをつけるというアイデアをもとに、メインビジュアルのモッピーくんと「モッピー累計会員数」のインフォグラフィクスのグラフにアニメーションをつけました。

～グラフに動きをつけた「モッピー20年の歩み」のインフォグラフィクス（2025年4月9日現在）～

Sさん：今回の制作にあたって、After Effectsでキャラクターの顔に表情をつける動きやWebにアニメーションを組み込む作業は、自分にとって初めての挑戦になりました。短い期間での実装で、自分で調べたり、上長や色んな方に相談したり教えていただいたりしながら最後まで進めました。

Mさん：自分が企画したので内容はわかっていたんですが、実際に完成したページを見たときは「かわいい！！」と思って、わたしも嬉しくなりました（笑）

Sさん：よかったです！

～Webデザイナーとして今年の6月でモッピー歴3年目に突入するSさん。今回の特設ページ制作を経てますますレベルアップしたSから、広報へ新しいモッピーコンテンツの持ち込み企画をいただいたので、広報もこれから頑張ります！～

――苦労した点はどんなところですか？

Mさん：今回、ユーザー情報を紐づけた「#わたしとモッピー」を進めるにあたり、どこまでデータをさかのぼるか問題が発生したのですが、技術的に20年間をさかのぼることはできるものの、相当な工数がかかってしまうという課題が生じてしまい、、、

Sさん：一度、「#わたしとモッピー」がなくりなりかけたときは、ヒヤヒヤしました（笑）

Mさん：そうだったね（笑）ページのタイトルにもしている「#わたしとモッピー」は、一番のメインコンテンツだと思っていたので「絶対になくしたくない」という気持ちがありました。最終的に「10年間」という妥協点で着地できて本当によかったと思ってます。

Sさん：わたしはやっぱり時間との闘いですね。アニメーションに挑戦にしながらあれもこれもとやってみたいことがたくさんあって、「期日までに終わるかな」と不安な気持ちになりながら最後まで突っ走った感じです。無事にページ全ての実装が完了できたときは、「わたしの2025年は終わった（やり切った）」と思いました（笑）

Mさん：まだ１月だったのに（笑）

～個別にユーザー情報を紐づけた「#わたしとモッピー」。過去10年分の累計獲得ポイント数と自分が該当する割合のポジションが「★」マークでわかるようになっています！～

――思い出に残っていることがあれば教えてください

Mさん：マーケターと違い、普段、デザイナーの仕事のなかでユーザーの方との接点はほとんどないので、今回の20周年企画にあたり、ユーザーのみなさまをより身近に感じることができたのは嬉しい経験でした。

アンケート結果で、みなさまからいただいたメッセージを一つひとつ読んでいくと、とても嬉しくなるようなポジティブなコメントがたくさんあったんです。モッピーを心から楽しんで利用してくださっているなと思えるコメントも多くて、これまでの仕事のなかでも、特に思い出に残るお仕事になりました。

Ｓさん：そうですね。自分にとっては初めての挑戦という部分も大きかったのですし、今回の記念LPはいつもの情報をギュッと詰め込んだある意味一方通行的なキャンペーンページとは違って、モッピーとユーザーのみなさまとの距離を縮められるような企画のページ実装に携われたのは嬉しかったです。

ページ自体もかわいくできましたし！いまは本当にやり切った感でいっぱいです（笑）

～モッピーデザイナーのMさん（左）とSさんに、モッピーくんと仲間たちが大集合しました！～

モッピーデザイナーの特設ページの制作秘話はいかがでしたか？

セレスには、半期に一度、社員一人ひとりが自分のレベルに適した目標を設定し、挑戦する制度があります。そのため、部署間をまたいで社員を支援する環境があり、自分がやりたいと思ったことには積極的にに手を挙げて挑戦できる風土が根付いています。

ポイントサイト「モッピー」を運営するポイントメディア事業部でも、マーケター、エンジニア、Webデザイナーが役職やポジションに関係なく、コンテンツの案出しから業務改善にいたるまで自由に意見交換やアイデアを出しあい、個人のスキルとメディアを成長させています。

「会社とともに成長したい」「自分のアイデアを実現してみたい」「モッピーデザイナーをやってみたい」「セレスのことをもう少し知りたい」という方はぜひ一度、採用ページまでお気軽にお問合せください！みなさまのご連絡をお待ちしております！

▼モッピー20周年記念特設ページ「モッピー 20th Anniversary #わたしとモッピー」