出会い・お互いの印象

千葉県船橋市に拠点をおく長印船橋青果株式会社（以下、長印船橋青果様）は、新鮮な青果物を小売・飲食・流通業者へ安定供給する卸売業を営んでいます。長野県に本拠地を構えるR&Cグループのグループ企業であり、同じく長野県に拠点を置くオンクリの代表・土屋はそのご縁で面識がありました。

今回の記事では土屋をはじめとするオンクリの制作担当者と、長印船橋青果株式会社の代表である北村様と担当者の久我様にお話を聞きました。

まず、土屋と初めて出会った時の印象について、北村様と久我様は次のように語ります。

ーーホームページ制作に関しては、2社でのコンペだったと聞いています。オンクリに決めた理由はなんだったのでしょうか。

そんな時、北村様は土屋のフラットな目線が印象的に映ったといいます。

ウェブサイト制作

サイトコンセプトについて

サイトデザインのコンセプトは、「食を夜明けから、見えずとも支える。それが私たちの仕事」です。

そのコンセプトについて、土屋は下記のように語ります。

土屋

市場での仕事は、まだ夜が完全に明ける前の暗い時間帯から始まるんです。私たちの生活に欠かせない食材を、毎日当たり前のように届けているわけですが、それを行うには日が昇る前から仕事を始めないといけない。そうした当たり前のことだけど、実際に見ないと気づかないような、そんなところに焦点を当てたくて、”食を夜明けから”というのをコンセプトに入れました。

土屋

地元に貢献する企業であることや、食の流通を裏方として支えていること、そうしたこともコンセプトの中に入れたかったので、”見えずとも支える”という表現を使用しています。

制作プロセス

ワイヤーフレームやコンテンツ構成の設計

サイトの構成について、土屋は”夜明け感”が伝わることを意識したと言います。

土屋

サイトに使う素材や全体の構成も、”夜明け感”が伝わることを意識して設計しました。使用するカラーには、夜明けの空を思わせる紫や青を採用しました。落ち着きのあるトーンで全体をまとめながらも、静かに印象を残すような存在感を意識しています。でもそれでいて主張しすぎることなく、やわらかく目に留まるような色味です。

デザインの方向性 – 夜明け感について

ワイヤーフレームや配色、キーワードは土屋によって考案され、その後はオンクリのデザイナー陣に担当が変わります。

企業サイトのトップページのデザインを担当した牧野に、デザイン制作のプロセスについて聞きました。

牧野

最初はムードボードを作りました。写真のテイストとか色合いの感じとかをデザインに落とし込むために一番最初の走りとして作った感じですね。素材は土屋さんが用意してくれたので、私もそれをみながら『こんな要素もあったらいいんじゃないか』とか、見た目の整理をしたりしましたね。

そうしてデザインの土台を作ったあとは、細かいところのデザインを詰めていったといいます。

牧野

ロゴの濃いめの赤色を使いたいという話があったんです。トップページのそれぞれの見出しの左側には実は四角がついているんですけど。この見た目を少し夜明けっぽい感じのグラデーションにしてみたりとか。

牧野

あとは、文字を読みやすくするために、不透明の黒をベタで重ねるのではなくてちょっとグラデーションで重ねるようなデザインにしてみたりとか。でも、（夜明け感をわかりやすく出すには）やっぱり動画とか写真のテイストが夜明けのイメージであることとかが印象としては強くなると思うので。他の部分に関しては本当に些細な変化で、写真・動画の要素の方が大きいかなとは感じます。

夜明けらしさはサイトの面積の大半を占める動画や写真で出した方がわかりやすくなります。しかし、もしかしたら気づかれないような細部にまでコンセプトに則って細やかなこだわりを込める。それがサイト全体の統一感や雰囲気を作り出していると言えます。

デザインに関しては、オンクリ社内でも最後まで意見が割れたそう。

牧野

このデザインに決まったのが、何案か出したあとだったんです。

ーー当初はどんな案を提案していたのですか？

牧野

サイト全体のレイアウトは変わってなくて、細かい部分のデザイン案なんですが、例えば先程の四角い部分に関しては、最初はこの濃い赤・青ではなくて本当に夜明けの後の明るくなった空みたいな色を使っていたんです。私としてはその方が夜明け感を感じたので。どちらかというと、”爽やかな朝”みたいなイメージで作っていたんですが、土屋さんはそこがしっくりきていなかったみたいでした。そこでロゴの色合いを使って欲しいという話になったので、それで変更してみたんです。そしたら自分の中でも前の案よりもしっくりきました。

レイアウト自体はそこまで変わっていないので、劇的な変化にはならないかもしれません。それでもこうした細やかな部分へのこだわりによってサイト全体の印象は変わったといいます。

牧野

このグラデーションの色合いに合わせてメインの黒文字の色合いも変わっていったので、印象は変わったとは思うんですよね。それこそメインで使っている黒色の文字って、意外とサイト全体の雰囲気を左右するというか。目に入ってくる色として多いので、こだわってやりましたね。

採用サイト制作

提案・目標・ゴール設定

採用サイト制作を提案するにあたって、お客様と打ち合わせを重ねるうちに、土屋は以下のような印象を受けたと言います。

土屋

とにかくみんないい人なんです。

そう語る土屋ですが、実際面接を受けにきた求職者も、働いている人が優しいからという理由で会社に入るくらい、雰囲気が良いそうです。

土屋

そしてみんな、”食に貢献したい”という思いがあって仕事をしているんだというのが伝わってくるんです。

市場のイメージというと、なんとなく年配の男性が仕切っているイメージですが、長印船橋青果さんの従業員は大卒〜75歳くらいまでと多様です。

そしてそれぞれがお互いのことを尊重しあって働いています。

土屋

例えばデジタル面で何かあれば職場の若い方々が中心となってサポートしています。反対に、年配の方々はその経験値によって、職場の若い方々を助けているんです。

なぜそのようなお互いを尊重し合う文化が生まれたのか、そこには市場で働くことの特性が関係しているそうです。

生産者の方や流通業者の方など、さまざまな立場の方と日々やりとりを重ねる現場では、仕事を円滑に進めるために協調性が欠かせません。そうした環境の中で、「まずは相手の話をきちんと聞く」という姿勢が自然と根づき、お互いを尊重し合う価値観が育まれてきたといいます。

そんな雰囲気の良さをぜひサイトを通して伝えたい。そのような思いもあり、オンクリでは以下のようにサイトコンセプトを定めました。

「なんかいい。言葉にはできない雰囲気の良さがあるこの会社で千葉県の食を支える」

制作プロセス

ワイヤーやコンテンツ構成の設計

コンセプトにもあるように、会社の雰囲気の良さは実際に接して見ないとわからない、”言葉にはできない雰囲気の良さ”をサイトを通して伝える必要があります。そこで、サイトを開くとすぐに晴れやかな表情の社員の皆さんの姿が目に入るような設計にしました。

デザインの方向性

採用サイトのデザインは、牧野が担当しました。長印船橋青果さんとは直接お会いしたことはないそうですが、それでも会社の雰囲気の良さについては知っていたそうです。

ーーこのプロジェクトを始めるにあたって、土屋から”雰囲気がいい”ということは聞いていたんですか？

牧野

聞いていました。それこそ土屋さんがカメラマンと写真撮影にいったときだと思いますけど、まだ夜中のような時間帯から市場にはずっと活気があり、そんな中働いている人たちは年代とか関係なく、リスペクトしあう仲間が集まっているのがすごくよかった、というのは何回も聞きましたね。

ーー何回も話したくなるくらいよかったんですね。

牧野

そう、すごい感動したんだと思います。（土屋から）話を聞くだけでなんとなく愛着が湧いてくるというか、、

ーーうまいんですね。

牧野

そうなんですよね、こっちもちゃんと感動してしまうんですよね。

そんな前情報があって、企業サイト・採用サイトのデザインを担当した牧野。特に採用サイトに関しては働いている人たちの魅力を全面に出すようなサイト作りが求められます。そのため、サイトのファーストビューにはこだわったといいます。

ーー今のトップページでは社員の方々のお顔がスライドショーで見れるようになっていますが、元々このようなデザインで考えていたのでしょうか？

牧野

元々はスライドショーではなくて、画面全体にバラバラに写真が置いてあるようなイメージが共有されてきました。

ーーそれをスライドショーに変えたんですか？

牧野

そうですね。スライドショーにすることでよりたくさんの社員さんのお顔が見れるようになるので。元々方針としては社員さんの笑顔を見せたいというのがあったので、その方針にも合いますし、こちらを提案しました。

ーーバラバラに配置するよりも、視線が一点に固定されるのでいいですね。

牧野

そうですね。あと、一画面に見せられる情報量が多くなるっていうメリットもあります。

社員の方々のスライドショーの隣には、サイトのコンセプト「なんかいい。言葉にはできない雰囲気の良さがあるこの会社で千葉県の食を支える」の文字が並びます。

ーーこの言葉の配置で何か工夫されたことはありますか？

牧野

私的にはちょっとご機嫌な感じを出したくてこのデザインにしました。”言語化できないんだけどなんかいいんだよね”みたいな気持ちって、ちょっとご機嫌な感じがするなぁと思うんです。なので線でちょっとリズム感をつけてみるとか。そういう感じでデザインを組みました。

線があることで、ウキウキ感というか、ホップしているようなイメージを感じることができます。

フォントに関しても企業サイトとは違って明朝体を採用しています。

ーー全体的にすごく柔らかい雰囲気を感じますが、意識してこうした雰囲気を出しているんですか？

牧野

そうですね。明朝体って強弱があるじゃないですか。うまく言語化できないんですけど、それがたまっている部分と流れている部分とで流れを感じられるので、なんかいいなと思って使っています。

トップページ以外のサイトデザインは、オンクリのデザイナーである小林が担当しました。

採用サイトのデザインにおいて、小林が特に印象に残っているページは、「人を知る」というページとのこと。

採用サイトの中で、その企業で働く人の魅力を伝えることはとても重要なことです。そこでオンクリでは社員コンテンツの充実を図るため、現地に赴き社員インタビューを実施したと言います。

小林もインタビューに同行。実際に社員の方々にお話を聞きました。

小林

インタビューの同行できたのは良かったと思っています。テキストベースで情報をもらってそれをデザインに落とし込むことはもちろん可能ですが、テキストからは人柄まで分かりづらく、若干冷たい印象を持ってしまいがちかなと思います。でも直接お会いしてお話を伺うことで、会社全体の温かい雰囲気を感じることができました。

ーー実際に会うことでより愛着が湧くような感覚がありますよね。

小林

はい。インタビューをすることによって、『テキストだけでは伝わらない人の温かみを表現する』ということを意識できたというか、自分の中でデザインの方向性が定まった感覚でした。

採用サイトにおいて、事業内容をわかりやすく見せることは必要不可欠。そこで採用サイト内では、『長印船橋を知る』という項目のもと、人や数字、仕事内容を主軸にした長印船橋の特徴をまとめたページを制作しました。小林はこの部分のデザインも担当。内容が膨大な範囲に及ぶからこそ、文字ベースではなく図解で情報を載せています。

ーー膨大な内容だと思いますが、苦労した点はありますか？

小林

『食材がお客様のもとに届くまで』というセクションでは、事業の全体像を一枚の絵で伝えることにしました。限られた横幅のスペースの中に、どのように情報を整理して収めるか、レイアウトには特に頭を悩ませました。

最初のデザインでは、情報を縦に羅列していたそうですが、タブで切り替わるようにデザインを変更。その経緯について次のように語ります。

小林

牧野さんにデザインを見ていただいて、“タブで切り替えて表示してはどうか”と提案してもらい、修正しました。そうすることで、情報を比較しやすくなったと感じます。

チーム一丸となってユーザビリティの向上を目指すことで、クライアントにとってもサイトの読者にとっても価値のあるコンテンツ制作に繋がります。

仕上がりについて

仕上がった採用サイトについて、社長の北村様と担当者の久我様にお話を伺いました。

ーー仕上がったサイトの印象はいかがですか。

ーー何かお気に入りポイントなどはありますでしょうか。

写真撮影・動画制作

動画制作では、採用サイト用の社員インタビュー動画4本と、公式サイトのトップページに掲載するタイムラプス動画を制作しました。

代表の土屋がディレクションを、カメラマンの土屋ふみさんが撮影・編集を担当。

撮影は2日間にわたって行われました。公式サイトのタイムラプス動画は、サイトのコンセプトである「夜明け感」を出すために、早朝4時ごろから撮影を開始。そこから1日かけて、公式サイトや採用サイトの写真撮影も行いました。

公式サイトと採用サイトの撮影を同じタイミングで行うことになりますが、その際色味を特に意識したと言います。

土屋

公式サイトでは夜明けを表現したかったので、赤みや青みを出すような撮り方や編集を意識してやってもらいました。採用サイトの方は、人の良さを出したいので極端な色は使いたくありませんでした。なので写真とかも色がガッと出るようなものではなくて、笑顔が映えるような色味でお願いしました。

写真撮影では、市場で行われているせりの様子も撮影。撮影当時について、土屋ふみさんは次のように振り返ります。

土屋ふみさん

（せりは）勢いがすごかったです。集団の中に巻き込まれてお互いが見えなくなってしまうくらい。でもとにかく臨場感を出したかったので、邪魔にならないよう配慮しながら、集団の中に突っ込んでいって撮影していましたね。

写真を見ると、せりの臨場感や生き生きとした部分がしっかりと映し出されているのが印象的です。

インタビュー動画制作

2日目には社員の方々とのインタビュー動画を制作。この動画制作は、オンクリチームにとってとても印象に残る撮影になったそう。

各インタビュー動画の冒頭で、社員4名が共通して「会社の雰囲気の良さ」について語る場面を配置したのは意図的な編集だったと言います。

土屋

いい人たちがいるというのを一番伝えたかったです。結局動画って、多くの人は全部を見ないと思うんですよね。 なので冒頭の10秒ぐらいってすごい大事だと思っています。じゃあそこで何を伝えたいかとなったときに、社員の方々が言っている“人柄の良さ” を1番に出したかったです。

良いインタビューとは

インタビューにあたっては、「短い時間の中でインタビュー対象者とどれだけ打ち解けることができるか」を大切にしていたと言います。

土屋

質問リストとかを事前にみっちり作って、というよりはどこまで本音の話をしてくれるのかが大事だと思っています。動画コンテンツが多い今の時代、動画を見ている人も何が本当のことで何が嘘なのかって、なんとなく分かるようになってきていると思うんです。そうじゃなくて、なるべく（インタビュー対象者の）本音を聞き出したかったです。そういう意味でも、短い時間の中でどれだけ仲良くなれるかを意識していました。

インタビュー内で話しているのは、職務内容の紹介や働いていて良かったと思うことなど。話す内容としては、もしかしたら動画より文章で読んだ方が良い内容かもしれません。しかし、あえて動画にすることで、社員の方々の雰囲気を知ってもらいたかったと言います。

カメラマンである土屋ふみさんも、良いインタビューにすることを意識していたそうです。

土屋ふみさん

良いインタビューの条件って、いかにインタビューを形式的なものではなく、会話レベルのものに持って行けるのかだと思うんです。例えば、質問リストで想定していなくても、会話が脱線することはよくあります。でもむしろ、そういう方向に会話を持っていって、その人の本音を語ってもらうのが、良いインタビューなのかなと思っています。

ーー長印の社員の方々とのインタビューはいかがでしたか？

土屋ふみさん

会話レベルまで持っていけたと思います。1人1時間半くらいは喋っていたんじゃないかなと記憶しています。

それに加えて、現場では社員側の協力体制が印象的だったと言います。

土屋

皆さんの撮影をする際に、常に担当者の方が1人いてくれました。例えば、次に撮影をする人が少し前にきて、場を和ませてくれたりしたんです。それってすごく良いことだと思うんですよね。社員の方々としては意図的にやっているわけではないと思うんです。でも、普段から職場の雰囲気がいいことがそうした場面ですごく伝わってきました。そうなると、僕たちもいいコンテンツを作ろう、とより頑張る気持ちが湧いてきましたね。

雰囲気の良さについては、カメラマンのふみさんも言及してくれました。

土屋ふみさん

動画の中で、“これを話してください”みたいに、誘導的なことは何もしていないんです。でも、インタビューの中で会社の雰囲気がいいみたいなことはほぼ全員話をしていたんですね。示し合わせたわけではなかったので、それだけ雰囲気がいいというのが伝わってきました。

社員の方々の雰囲気の良さとオンクリチームの良いインタビューにすることへの追求心が、インタビュー動画をよりクオリティの高いものに仕上げたのかもしれません。

あとがき

今回の記事を書くにあたり、オンクリのチームメンバーが口を揃えて語っていたのは、長印船橋さんの会社に漂う「雰囲気の良さ」でした。仕事への誇り、お互いを思いやる温かな人柄、会社内で尊重し合う空気、一連の仕事を通じて感じたその全てが、サイトのデザインや撮影物など、クリエイティブの源になったと感じます。

現場のリアルな温度を制作物に落とし込めた今回のプロジェクトは、私たちにとっても大きな手応えのあるプロジェクトになりました。