目次
35年ぶりの紙袋リニューアル、Webで「百様図」の思想を伝える
まず岡部さんと林さんから、大丸松坂屋「百様図」のプロジェクトについて語られました。
依頼元は日本デザインセンター（NDC）三澤遥デザイン室。大丸松坂屋の紙袋を35年ぶりにリニューアルし、その新しい柄「百様図（ひゃくようず）」をWebサイトで表現してほしいという内容でした。
岡部さんによると、NDC側の要望は「『紙袋が変わった』だけでなく、『百様図』の仕組み・思想を理解してもらいたい」というもので、「『動的な柄』であることが伝わるアニメーションが必須」だったといいます。
mountに声がかかった後、NDCとmountの間で実写映像やCGでの表現も検討されましたが、最終的にWebで表現することが決まりました。
「できそう」という直感と、頭に浮かんだ欲張りな理想像
オリエンテーションで三澤さんたちの資料を見た瞬間、クリエイティブディレクターの林さんはこう感じたといいます。
林さん：「すごいことを考えるなー。並大抵の試行錯誤じゃないなー、と。たしかに表層ではなく裏側にあるストーリーを伝えることが大切だと感じました。Webサイトなら多くの人に届く表現ができそうだなと。」
そして、何の根拠もないまま「僕らならその想いを受け取って形にできる！（ような気がする）」と感じたそうです。
林さんの頭の中に浮かんだのは、気持ちよく眺められる演出、模様の成り立ちが自然と伝わる構成、今まで見たことのないような驚きを感じさせる強い表現。林さん自身、これを「欲張りすぎる理想」と振り返ります。
手を動かせば動かすほど、突きつけられる現実
しかし、実際にチーム全体で手を動かし始めると、状況は一変します。インナー公開までのスケジュールは、年末のオリエンから翌年3月7日まででしたが、年末年始休暇を挟むと実働期間はわずか1.5ヶ月ほどしかありませんでした。その間に、デザイン、ツール制作、WebGL実装を並行して進めなければなりません。
林さんは当時の心境をこう振り返ります。
林さん：「手を動かせば動かすほど、みんなが手を動かすのを見れば見るほど、欲張りなハードルの高さと、それに到達するまでの果てしない距離感を、毎日毎日突き付けられる日々でした。このままだと平凡で中途半端なものができてしまう。説明的だし、クリエイティブも半端だし。NDCさんが積み上げたものを台無しにしてしまうのでは…大丸松坂屋の品位すらさげてしまうのでは…正直、毎日どんどん絶望していきました。」
林さんの感情曲線は、オリエン時の高揚から年末年始にかけて急降下していきました。
テクニカルチームが抱えた全体像が見えない不安
一方、テクニカルディレクターの岡部さんも、別の角度から同じような不安を抱えていました。
企画段階でのプロトタイプは悪くありませんでした。紙を動かす行為そのものが体験になるというコンセプトも決まり、紙袋に変形するアイデアもありました。しかし、実際に作り始めると、個別のパート（デザイン、実装など各担当領域）はそれぞれうまくいっているように見えても、全体として「これでいける」という確信が得られなかったといいます。
岡部さん：「まだ平面的で立体感が出ていないから、あんまりこれでいいのかっていう確信は得られないし、ツールもどういう展開にすればいいかが決まらなかったので試行錯誤してました。」
ツール制作、紙のレイアウト検証、WebGL実装。それぞれが独立して進んでいるように見えて、最終的に精緻なデザイン、音、実装が全部噛み合って初めて「大丈夫そう」と思えるはずでした。でも、その瞬間がいつ来るのか見えませんでした。
岡部さんの感情曲線も、林さんと同じように下降していきました。
転機をもたらした「原理と見立て」
状況が動いたのは、NDCとの中間打ち合わせでした。
三澤さんから提示されたのは、5つの原理を一つひとつ順序立てて説明し、最後に動画を見せるという構成案です。論理的で、わかりやすい提案でした。しかしmountチームは、それまでの検証の結果、「説明的すぎてはワクワク感が伝わらない」という強い確信を持っていました。
林さんは、その場で別の提案をしたといいます。
林さん：「打ち合わせの場で、自分たちが作ったカードを見ながら、そうじゃなくて原理と見立てっていうのを交互に繰り返すことで、それを非言語で、かつ模様が無限にある様を伝えることができるんじゃないかということをその場で提案しました。」
その場の空気は一瞬張り詰めました。林さん自身も「激しそうだから嫌だな」と心の中で思ったそうです。しかし、「これじゃないと無理だ」と確信していました。
三澤さんも、その提案に賛同しました。「これで行った方が絶対いい、これで行きましょう」
林さん：「その瞬間に、悶々としていたことが解消されるような体験が見えました。絶望だったものが、この方向に突き進んでいけば何かできそう、という確信に変わりました。」
林さんの感情曲線は、この瞬間を境に急上昇します。
すべてが噛み合うまで
方向性が定まってからは、文字通り「あとはやるだけ」でした。
「ザップ」「シュ」といった柄の見立てを示すオノマトペの制作はNDCと分担。岡部さんが作成したツールはmount社内だけでなくNDCとも共有され、両チームががっつり使い込んだといいます。このオノマトペは、140の柄がいろんなものに見える様を示すとともに、サイトのキャラクター付けとしても重要な要素で、岡部さんは「とんでもない数をNDCさんたちが作っていました」と振り返ります。
紙の質感表現、音の制作、デザインの洗練。すべてが同時並行で進み、精緻なデザイン、音、実装が噛み合った瞬間、ようやく岡部さんの感情曲線も上昇しました。
プロジェクトで意識した、視座と共創
最後に、林さんはこのプロジェクトで意識したことを語りました。
まず「掲げたハードルを常に忘れないこと」。Webサイト制作は工程が多く、諦めるポイントも多い。それでも視座を高く持ち続け、チームのリーダーとしてみんなの気持ちを盛り上げることを意識したといいます。
次に「三澤さんたちの期待を常に超えるものを提案すること」。同じ作り手同士が協業するのは簡単ではありません。それを維持するために共創を意識しました。
そして「Web領域は僕らが正義であり続けること」。
林さん：「最初からNDCさんと僕らの領域がはっきり分かれていて、Web領域は僕らの正義である、という矜持を維持し続けるために意識していました。そのために、思考の量とスピードを常に維持し続けることを心がけました」
互いのリスペクトを保ちながら、それぞれの領域で最高のアウトプットを目指す。その姿勢が、最終的な成果につながりました。
「負け筋」への挑戦
続いて語られたのは、創業120周年を迎えたコクヨのスペシャルコンテンツ「Curiosity is Life 好奇心を人生に」です。アートディレクターの米道さんが中心となって制作しました。
目指したのは、タグラインの認知を高めるだけでなく、121年目に向けた「コクヨの自己紹介」としても機能するコンテンツ。米道さんが提案したのは、実写ではなくイラストレーションをメインにした「飛び出すノート（絵本）」というメタファーでした。
米道さん：「『飛び出すノート』というか『飛び出す絵本』のメタファーで、それがちゃんと立体的に見えて、コクヨさんのムード、過去とか未来とか今も含めて知れるようなものにできたらいいなと考えました。」
しかし、米道さんは、このアイデアには大きなリスクがあることを理解していました。
米道さん：「『ページをめくる』って結構勝ち筋がない表現なんですけど、やらざるを得ない。」
ノートや紙をめくる表現は、Web業界では擦られすぎていて、成功例がほとんどありません。それでも、文具メーカーであるコクヨの魅力を伝えるためには、あえてこの表現を選ぶ必要がありました。
手製ノートで社長にプレゼン
企画を固めるため、井出さんは手製の「飛び出すノート」を作成しました。
米道さんによると、コクヨの社長にプレゼンする際、井出さんは手製の飛び出すノートをデスクの上に置き、「これを開いてみてください」という演出込みでプレゼンを行ったといいます。物理的な体験を通じて、Webでやりたいことのイメージを共有する。この提案が通り、プロジェクトは本格的に動き出しました。
その後、チームは絵コンテを作成し、どんな展開だったらワクワクするかを画面に起こしていきます。デザインパターンを検証し、イラストレーションを描き起こし、それを1つ1つ分解して3Dデータに落とし込む。100点以上の文具を3Dモデリングし、ノートの上に配置してアニメーションを作っていきました。
終わらないパフォーマンス調整
「負け筋」と分かっていながら挑んだ代償は大きかった。
物理エンジンの選定から始まり、Cannon.jsやOimo.jsなどを比較検討。ページをめくる挙動に合わせて影を変形させたり、ノートの歪みを計算したり。3DモデルをWeb上でリアルタイムに動かすためのパフォーマンス調整は、終わりが見えませんでした。
米道さんは当時の状況をこう振り返ります。
米道さん：「今回1番ハラハラしていたのが公開の前日まで、クラッシュして全然見れないということが起きてました。」
最悪の場合、全部映像で代替えする素材まで準備していたといいます。しかし、公開前日の深夜、なんとか動くようになりました。
米道さんの感情曲線を見ると、3Dモデルが揃ってノートから一斉に飛び出す瞬間を初めて見たとき（クリスマスの時期）に一度だけ上昇しています。しかし、実際にブラウザで動かすとパフォーマンスが出ずにクラッシュし、再びどん底へ。公開が近づくにつれて、感情曲線はずっと低空飛行を続けました。
一方、テクニカルディレクターの梅津さんの感情曲線は、また違った軌跡を描いていました。「いいアイデアが出ない」「ついにThree.js使うのか。楽しみでもあった」「3Dアニメが入るとわくわく」「動かない…」「終わらない…」。技術的な挑戦に対するワクワク感と、終わらない調整作業への絶望が交互に訪れていました。
公開前日の深夜まで戦い続けた末、なんとか世に送り出したコクヨのスペシャルコンテンツ。米道さんと梅津さん、それぞれ異なる軌跡を描いた感情曲線が、このプロジェクトの困難さを物語っていました。
泥臭く、真摯に
大丸松坂屋とコクヨ、2つのプロジェクトを通じて語られたのは、華やかなアウトプットの裏側にある生々しい感情の浮き沈みでした。
セッションの最後、司会から「mountとはどんな会社か」と問われた彼らは、自らをこう表現しました。
一同：「こういう感じのやつを泥臭くやってる会社です。ただ、作るものに対しては正直だし、作るということに対して真摯でありたいと思って、日々戦っています。」
スマートな成功事例として語るのではなく、絶望や葛藤を隠さずに共有したmount。林さんの「視座を高くし続けること」、米道さん・梅津さんの技術的な執念。感情曲線という可視化を通じて示されたのは、それでも諦めずに作り続ける姿勢でした。
おわりに
「今回は一番真面目な学びの場」と冒頭で語られたiDID DAY 2025。mountが赤裸々に明かした制作の舞台裏は、デジタルクリエイティブの価値とは何か、その本質を改めて考えさせる機会となりました。
