新商品リリース🎊ここでしか聞けない制作の裏側を教えて！！

先日「うんこミュージアム」に行ってきたニッチほそかわです。

【Nicheっち、】
　横浜の新しいあそび場【アソビル】内にある　うんこミュージアムに行ってきた

うんこミュージアムやうんこドリルなど
ここ数年「うんこ」が脚光を浴びている気がします。

みなさんは毎日快調ですか？

まぁ、そんなことは置いといて。笑

今日は耳寄りな情報を入手したのです！
というのも、

なんとなんと！

EC事業部から
新商品が出たというじゃありませんか？

これは新商品について取材するっきゃない！

取材はメディア事業部ほそかわが担当します。

【商品開発にあたって どんな人がどんな風に頑張っているのか？】
【もし、ジョインすることになったらどんな仕事をさせてもらえるんだろう？】

って　皆さん　気になりませんか？

EC事業部

・デザイナー
・コーダー
・カスタマーサポート

のみなさんに
具体的な仕事内容や新商品販売までのエピソードを聞いてきました。

こちらが新商品「やまとなでしこ」

腸をきれいにすることで、便通を良くし、
健康的なダイエットサポートを目指すEC事業部の商品第2弾です。

今回は　日本となじみ深い納豆に着目したみたいです。
（前回は、炭でしたね。：くろしろ）

「納豆菌」が腸にしっかり届いて綺麗にしてくれるらしい。

「今日やまとなでしこみたいな色の服着てきちゃった～～」
と言っていたCS担当者。

デザイナーに聞く

ほそかわ：　新商品のリリースにあたって担当したことはなんですか？

デザイナー：　パッケージ探し・ラベル制作・バナー制作・LP制作・冊子制作・お礼状制作・ロゴ制作かな～。

ほそかわ：おおおおお（笑）たいへん！！！

デザイナー：　そう！たくさん担当してる（笑）
ほそかわ：　でも、ネット販売だから、アピールする方法はネット上だけだし、デザインが肝ですよね。担当したデザインで 、特に ロゴ制作とかパッケージデザイン、LP制作のこだわりを聞きたいです！！

パッケージ制作秘話

デザイナー：　納豆菌って顕微鏡で見ると、六角形っぽいんだよね～。

ほそかわ：　だから六角形を主としたデザインなのか！

デザイナー：　そうなの。
あとは、「納豆＝日本」ってイメージや、商品名の『やまとなでしこ』のイメージを掛け合わせて、和風テイストなデザインにしたよ。

ほそかわ：　いろんなインスピレーションからパッケージデザインが生み出されてるんですね。

デザイナー：　色味も、納豆っぽい色と、大正っぽいモダンな色遣いを意識！

ほそかわ：　納豆らしさもあり、上品さもあります。
他こだわった点はありますか？

デザイナー：　これね、透明のフィルムを貼っているんだけど、分かる？

ほそかわ：　あ、これ印刷じゃなくて、フィルムを貼っているのか！

デザイナー：　そうそう。

落ち着いた色合いの配色だけを使うと　もったりするし、かと言って　六角形の格子を全面にデザインすると　ごちゃごちゃするからね。白の六角形の格子を背景にしてみたよ。（よく見てね）この白の格子を活かすために　ツルっとした光沢感のある透明フィルムを使ったよ。

（わかるようで わからないようなデザインの話ですが、印刷会社と、あーでもないこーでもないと言って　やっと決まったこだわりのパッケージらしい。）

かばん👜に入っていても　かわいい。

ロゴの秘密

デザイナー： 実は ロゴマークは 『大和撫子』の文字を組み合わせて作ったんだよ。

ほそかわ：　え～～！知らなかったです！分解してみよう！

～大和撫子を見つけてみよう～

みなさん、きちんと見つかりましたか？
（和が難しいかも。）

LP制作秘話

デザイナー：　次は　LPデザインでこだわったことを喋ろうかな！

ほそかわ：　ぜひぜひ～

デザイナー：　これがね　LPなんだけど…

→やまとなでしこのLP

💻PC版

📱スマホ版

デザイナー：　パッケージデザインでも言ったけど、「日本＝納豆」ってイメージだから、全体的にトーンを落とした色を使ってデザインをしたよ。
でも、伝えたい部分は目立たせないといけないから、【補色】にしたりして視覚的に目立つように工夫したの。

補色；補色とは、色相環 で正反対に位置する関係の色の組合せ。

ほそかわ：　中学美術で習ったやつだ！！

デザイナー：　あとはね～、購買者の資料を見たりして、購買者像をあたまに描きながら

『どういうデザイン・色合いがいいだろうか？』を考えるのはもちろん、

『どのくらいの字の大きさだと最後まで読んでくれるだろうか？』

とかも考えてたりしてる。

ほそかわ：　ほ～～！　マーケティングの観点からデザインをすることも大事なんですね。

コーダーに聞く

コーダー：　僕は 主にコーディングを担当しました。
まず　どんな動きのサイトにするかを考えて、EC事業部のみんなにサンプルを提示して　認識合わせを行ってから　やっと実装を進めていくよ。

ほそかわ：　コーディングするときに特に頑張った点はありますか？

コーダー：　頑張ったのは、【アニメーションの実装】のとこかな？
背景のアニメーションをどうするか？というところから考えて、実装するのには　どういう技術を使えばいいかを調べて、自分が取り組んだことない技術であれば また調べて…の繰り返しです。

ほそかわ：　今回のサイトのコーディングのために 　新技術を身に付けて取り組んだのですね。

良かったら、Biiiサイトを皆さんものぞいてみてください！
→サイトBiii

ほそかわ：　後ろが、ひらひらと舞うアニメーション！
このアニメーションは、どういったインスピレーションから思いついたのですか？

コーダー　：　やまとなでしこのページは、日本的な華やかさ→桜　というところから、パッケージに印字されている六角形のアイコンを桜っぽく散らすアニメーションにしてみた。

ほそかわ：　くろしろの方のサイトは？

コーダー：　炭が散っているイメージ。

ほそかわ：　（笑）またもや　散らす。
※でも　動きがやまとなでしこのページと違うので、みなさん見てみてください。

→サイトBiii

ほそかわ：ちなみにアニメーションのサンプルとか、どうやって見つけるんですか？聞きたい！

コーダー：自分は、codepenというフロントエンドの様々なコードを掲載されているサイトで、動いているものを見てみたり、Webサイトのギャラリーサイトを経由して　いろんなWebサイトを見たりしているかなぁ？

ほそかわ：ふぇ～、参考になります。なんか コーディングだけじゃなく デザイン領域まで担当するんですね。

コーダー：　そうだね。ただのコーダーとして　決まった仕事をするのに飽きた人には　自ら考えて動くことが求められる　ウチみたいな環境が良いと思う。

カスタマーサポート（CS）に聞く

CS担当：　お客様からの質問に答えたり、ECのカート周りを管理するのが私の仕事！（今は社内に1人だけなのでカスタマーサポートは外注もしてるの。）

ほそかわ：　（CSの説明ありがとうございます。）
さっそくですが、新商品のリリースにあたって、CSが担当したことは何ですか？

CS担当：　契約しているECカートや倉庫に新しい商品の登録をしたり、さっき言った　外注しているカスタマーサポートの会社に渡すマニュアルの作成をしたよ！

ほそかわ：　外注の人は新商品の効果や、購入システムとか分かりませんもんね～。

CS担当：　そうなの！　あとは、同梱物構成もしたよ。

ほそかわ：　同梱物。商品（やまとなでしこ）が届いたら、一緒に入ってるやつですか？

↓同梱物

CS担当：　そうそう。商品のこと　きちんと分かってもらえるように　納豆菌丸わかりBOOKを作ることにしたの。

ほそかわ：　あっ！！これ　わたしが頼まれたイラストだ！

CS担当：そう！ほそかわに　描いてもらったイラストだよ。

納豆菌・善玉菌・悪玉菌　うんこ博士などのキャラクターは実は、ほそかわが描いたイラスト

CS担当：　サプリメントと一緒に入ってたら嬉しくなるような同梱物構成を目指したよ。お腹マッサージの仕方も載せてて、ダイエットの参考になると思う！

新商品「やまとなでしこ」をよろしくおねがいします。

そしてそして

くろしろも、引き続き　よろしくおねがいします。

という感じで、

新商品『やまとなでしこ』の販売までに、各担当者がしたことや頑張ったことを聞いてみました。

新商品リリースまでの話は参考になりましたか？

なんとなく、商品販売までどんな仕事があるのか理解していたつもりですが
こうやって販売までのプロセスを細分化して、それぞれ苦労した点などを聞くと、

思った以上に　任される仕事が多くて大変そう！

でも、その分

やりがいもありそうだと感じました。

そんなトレスでは現在　Webデザイナーを鋭意募集しています！
ぜひぜひ　ご応募ください！🎊

【Twitter🐔】https://twitter.com/Tres_innovation

【instagram📷】https://www.instagram.com/tresinnovation/

関連記事📓

🌟EC事業部の大まかな仕事内容やくろしろについて🌟(2017.9)

🌟EC事業部の作業環境について🌟(2018.12)