■第一回:株式会社 茨城電材工業 様(2009年5月制作)
www.ibaraki-denzai.jp/
[01]プロローグ

日本の町工場の力がスゴイことは、多くの人が知っている。宇宙ロケットなどのミクロン単位での精密部品も、機械ではなく職人の手作業のほうが正確だという話もある。町工場の職人の勘と技術は、まさに日本の宝だ。今回のクライアントも、そんな町工場の1つ。
技術の街・日立市の「株式会社茨城電材工業」様。
鉄道のレール等に使われる銅の曲げ加工・ロウ付けに関しては、まさにエキスパートで海外からも高く評価されているという。
そんな「茨城電材工業」の実力と心意気をどう伝えるか。
それが今回の使命だ。


[02]企画会議
プロデューサーがお客様と相談してまとめたレイアウト案。このプランに基づいて、個々のデザイン要素を整えていく。

ドメンテさんプロデューサーの菅谷氏が資料を持って来社したのは2009年5月12日。
事前にドメインを取得するために必要な基本情報だけは受け取っていたが、詳しいレクチャーを受けるのは、この日が最初。自ら見聞きしてきた町工場の魅力をアツく語ってくれる菅谷氏。資料として預かった写真からは、なるほど町工場らしい様々な作業シーンを見て取れる。ボクは漫画家でもあるので、すぐにドラマを妄想してしまう。普段は人のいいオヤジさん、お孫さんがいるかもしれない。そのお孫さんと過ごす時には、デレデレのおじいちゃんなのかも。でも、ひとたび作業に入ると、鋭いまなざしで手練の技をくり出す。その道ン十年の誇り高きプロだけが持つ厳しい顔。日本を支えてきた顔だ。
そのプロの表情をデザインの中核にして作ろう。菅谷氏の説明を受けながら、瞬く間にイメージが浮かんでいった。

今回のホームページ制作のために用意された作業写真の一部。どの写真も職人的な魅力にあふれているが、最終的に右端の写真をメインビジュアルに採用した。奥行きがあること、オヤジさんの表情のよさ、特徴的な製品や機材が大きく映っていること等がその理由。レール状の銅材のカーブなども、画面に動きを感じさせてよい。与えられた素材で最大限の効果を目指すのがデザイナーの役目だから、写真選定はとても重要なステップ。
(↑)このページのTOPへ
[03]ええっ!?グリーン?
選んだ作業写真や製品写真をグリーン地に乗せてみた例。やはりコントラストがはっきりしすぎて、雰囲気を削ぐ。オヤジさんのキャラクターとも合致しない色調なのは明白だ。いくら要望だからといって、このまま作っていいわけがない。

が、クライアントのデザイン的な要望の話になって、考え込んでしまった。
ふだんは銅ばっかり見てるから、全体的に明るく爽やかなグリーンでデザインしてほしい」というのである。
今回は職人の渋さ、愚直さ、心意気といったモノをアピールしたい。それには製品=銅は欠かせないデザイン素材となるだろう。製品の実物なしでは説得力に欠ける。だから、タイトルバックには銅が必須だ。
しかし、銅の色とグリーンは補色の関係に近く、本来なら「下品な色使い」であり、避けるべき配色なのだ。もちろん、あえてソレをやることで、それぞれを浮き立たせるというデザインもあるが、どちらかと言えばポップな色調になりやすい。う〜ん、町工場の渋い魅力をポップ調で表現するってのは・・・やっぱ無茶だよなぁ。



翌日、改めて菅谷氏からのメールが届いた。

先日はおじゃまいたしました。
「茨城電材工業」様、どうぞよろしくお願いします。
今朝になって、写真選定の結論のメールが社長より届きました。
結局、工場長のオヤジさんのキャラを立たせたいとのことになりました。
実際にこの町工場の中心人物であり、そういう意味では会社のシンボル的な写真ではあるのですが、なかなかいい表情していますし、このオヤジさんを輝かせてあげましょう。
(09/05/13.菅谷メール)



実はオヤジさんを象徴的に使うというアイデアは、ボクがひそかに温めていただけのことで、当初はむしろ製品写真を並べるイメージだった。
が、このメールによると「オヤジさんのキャラを立たせたい」とクライアントが決断したようである。よし、ボクが感じていたこととクライアントのビジョンが合致した。これならイケる!
色の問題が解決しさえすれば、だが・・・。

(↑)このページのTOPへ
[04]考え抜く・・・。お待たせしてごめんなさい。でも・・・
元の写真から必要な部分だけを切り出したデザイン素材。キレイに切り抜くのは手間だが、色々なバランスを試してみたいので、多めに作っておく。

「全体的に明るく爽やかなグリーン」をあえて使うなら、一方をワンポイントアクセントのようにして、一方は逆に全体にあしらう。あるいは、6:4くらいの割り合いで、全体を色分けしてしまうといった、いずれにしても配色に相当注意しないと「最低の色づかい」になってしまうだろう。
今回は全体の印象を「爽やかなグリーン」にするという要望だから、色分けするのは無理。部分的にグリーンがあればいいってコトじゃないのだから。ならば結論は1つ・・・とは言えないが、銅のほうをワンポイントに使い、全体はグリーンで処理することを決断。
こうして考えをまとめてから、実際の制作をスタートする。「戦略上の劣勢を戦術でカバーすることはできない」というのが軍事上の常識なのだそうだが、これは商売でもデザインでも同じ事だ。行き当たりばったりで作るものには迷いがあって、どこか、しっくりこない。よく出来ているように見えても、何か物足りなく感じる。それはお客様や閲覧者にも分かるのだ。言葉にはならないが不安や不審を感じているから、何か別の理由を見つけてNOと判断されてしまう。表面に出てくる理由とは別の理由だから、いくらアンケートを取っても改善策につながらない。これが一番コワイのだ。
今時はパソコンソフトが進化して、誰でもソコソコのデザインを作れるようになった。安易に作れてしまうことがコワイのである。パソコンで今までできなかったことができるものだから「やるべきこと」じゃなくて「できること」をやってしまいがちになるのだ。だからボクは考えがまとまるまでは、絶対作業に入らない。アタマの中に完成イメージが浮かんでいない状態では、決して作業をはじめない。そうしているうちに期日は刻々と迫ってくるのだけど、早めにテキトーなモノを出すよりは、ギリギリまでお待たせしてでも考え抜いたモノを出すべきだと思っているのだ。

まず主役のオヤジさんの位置をきめる。頭部を枠から飛び出させることで立体感を高めつつ、上部に白い空間を作って、シャープ感を演出しようと思った。 文字を入れてバランスを見る。実際には、その後の作業をしながら文字の太さや大きさを変えたり、微妙に位置をズラしたりもする。 製品のキリヌキ写真を合成。どの部分をどれくらい見せるか、微妙な調節をくり返して最終的な位置を決めていく。 単調で奥行きがなかった背景に先端イメージの光や製品の部分アップなどを合成する。最終的には遠近感を強調する格子状のパターンも加えて立体感を補強。
(↑)このページのTOPへ
[05]考えをカタチにする。

というわけで、いよいよ制作スタート。
だが、単に緑色で塗ればいいってモノではない。「茨城電材工業」の技術は、昔ながらの職人技でありながら最先端でもあるのだ。
そこでグリーンのバックに先端イメージの光の煌めきやシステマチックなグリッドをコラージュした。こうすることで静止画でありながら全体に動きが感じられるようになるし、グリーンも単調では無くなり、明るさも出るはずだ・・・・。
作りながら、微妙な調整をくり返していく。考えはまとまっていても、実際に作りはじめると、また別の問題が見えてきたり、もっといいやり方が見えたりするからだ。最初にしっかりしたシナリオは用意するけれど、本番ではアドリブも必要になる、という感じ。アタマの中のイメージが正しいかどうか、実際にやってみる、という部分もある。デザインは感性の問題だと思われがちで、実際そうなのだけど、実は理論のほうが大きい。だからまず「考え抜くこと」なのだが、理屈だけの頭デッカチでもダメなのだ。スポーツでもそうだよね。勝つための戦略を練り込んだ上で、でも土壇場では直感力とか瞬発力がモノを言う。

メニュー部分を組み込む。オヤジさんから感じる人柄を邪魔したくないので、丸みを帯びたボタンにした。 社長様のメッセージ欄を追加。本文はホームページとして仕上げる段階で組み込むので、ここでは枠のみをデザインする。 右側に入るリードコピー、序文、その他のイメージスナップを組み込む。4つの写真は対角線で対比するよう、似た写真が並ばないように注意している。 役目だから、写真選定はとても重要なステップ。

そうして、できあがったデザインイメージ。長年培ってきたオヤジの技術、厳しさ、心意気。それと最先端イメージを組み合わせて、立体的で動きを感じるようにまとめたい・・・というのがデザイン的なテーマだ。タイトル部分のデザインだけで技術力の全てを印象づけるには無理があるので、右下に写真を並べ、イメージを補強した。あちこち、ダミーな部分も残っているが、これでほぼ狙い通りのはずだ。
これで、ぶつけてみよう。

(↑)このページのTOPへ
[06]さらなる要望に工夫で応える
社長メッセージのバックに薄く配置された写真は、単に薄くしたのではなく、テレビの走査線のような細かい横線で濃淡の調節をしている。写真をそのまま薄くするだけだと冷たい感じがしてイヤなんだよね。

いい感じですねえ。
オヤジさんもいい感じで存在感を出していて、また配色もイメージ通りで、とってもいいと思います。



菅谷氏からの返答は悪くない。よし!イケそうだ。

できましたら、ご提案デザインの右下部にある4枚の写真のうち、左下の写真(バーナー作業のアップの写真)。これをメイン画像にてもっと目立たせたい気もします。(よく見ると背景にて使われてはいるんですよね。)
可能でしたら調整ください。
仕上がりが楽しみです!
引き続き仕上げ、どうぞよろしくお願いします。
(09/05/16.菅谷メール)



おっと、そういう意見が出たか。
実はボクも、その写真をなんとかしたいと思って、色々やってみていたのだが、下手に大きく使うとメインで使用したオヤジさんの写真とカブってしまい、組み合わせしにくかったのだった。工場特有のちょっとゴチャっとした写真が多いからで、コラージュすると、それぞれが混じりあって、分かりにくくなってしまうのだ。
分かりやすく配置するにはオヤジさんを小さくしてしまうしかないだろうが、ボクは、オヤジさんを象徴的に見せたいと感じているし、似たような大きさの画像を並べてもメリハリがなくて、画面に動きが感じられなくなる。そもそも、タイトルスペースに配置する画像を増やすと、緑の部分が減ってしまって、部分的にグリーンをあしらっているというだけのモノに見えてしまうだろう。メイン画像ではゴチャゴチャさせたくない。町工場ならではのダイナミズムを感じさせたいのだ。

では、タイトル画像に組み入れるのではない方法で、この要望を満たすことを考えてみてはどうか。単に大きく写真を出してしまうと、他の写真を殺してしまう危険がある。邪魔にならず、バランスを崩さず、でも大きく出して大丈夫な方法・・・。
と考えて、「社長メッセージ」のスペースを活用することを思い付いた。
メッセージ文のバックに、薄く写真を入れたらどうだろう?大きいけれど薄いから、主張しすぎてバランスを崩さずに済むかも。実際に文字が入ると写真のディテールが分かりにくくなるだろうけれど、大きいから完全に分からないというほどでもないだろう。変化球的な方法ではあるけれど、これはこれで1つの回答になるのではないか?

(↑)このページのTOPへ
[07]フィニッシュが見えた!
トップ画面のデザインの一部を改造して、各ページのヘッド部分も作る。タイトル以下の本文部分の構成も整えていく。

あっ、これいいですヨ!
これなら、この素材を押し出したい社長の要望にもかなうし、うるのさんがおっしゃるデザイン的な条件もかなうと思いますし。
これにて構築していただけますでしょうか。
(09/05/17.
菅谷メール


おおっ、プロデューサーのOKが出た!よし、これでまとめていくぞ!
というわけで、あとは本当にホームページにしていく作業である。
ここまではデザインだけ。見た目がホームページっぽいけれど、まだ単なるデザインで、ホームページとして表示できるわけではない。このイメージのまま、ちゃんとホームページとして動作するように完成させていくには、このデザインを一度解体して、もう一度ホームページ作成ソフト上で組み直すのである。そうしないと様々なシステムや仕掛けを組み込めないし、それがキチンとしていないと見た目がいいだけの役立たずになってしまうのだ。
でも、そこは慣れたもの。どう解体するか、どう組み直すか、全部見えている。もちろん各種システムがどのように組み込まれるのかもね。設計者=大工でなくてもいいのだけど、大工のことが分からない設計者ではイイモノは作れないのである

(↑)このページのTOPへ
[08]エピローグ
最終的に完成したホームページデザイン。

茨城電材工業様、ありがとうございました。
※まだ仕上げの途中だったかしら?
トップ画面右下の4枚の写真のうち、左上のものを「東金沢工場」のものと差し替えていただけますでしょうか。
いよいよ明日早朝の便で上海なのですが、帰国後、クライアントに報告に行きたいと思います。
(09/05/23.菅谷メール)



この時期は、ちょうどボクシング世界チャンピオン「内藤大助」選手の上海でのタイトルマッチの時期で、内藤選手のセコンドでもある菅谷氏は、海外へ向かう直前に連絡をくれた。
安心して試合に臨んでもらうためにも、すばやく対応しなくちゃ。というわけで、以下のように返答した。

写真の差し替えですけど、内藤選手がリングに上がるまでには、できあがってると思いますよ。
では、いい試合になることを、心からお祈りしております。
内藤選手をはじめ、宮田ジムの皆さんにもよろしく。
(09/05/25.うるの返信)



茨城電材様のご対応ありがとうございます。
今、東京ドームホテルから挑戦者一行をのせて、私がひとりで引率しているバスの中です。うしろの席で挑戦者が休んでいます。

(09/05/26.菅谷メール)



これは試合当日のメール。上海での試合はトラブルで中止となり、急きょ日本での試合となったことは当時の報道で確認していただきたいが、菅谷氏は、挑戦者一行を引率して、試合会場に移動中だったようだ。そのバスの移動中にモバイルアクセスでボクのメールを確認し「茨城電材工業」の状況をチェックしていたわけだ。

まもなく世紀のタイトルマッチが開催される。でも「茨城電材工業」の仕事だって、とても大事なコトなのだ。イイモノを作ってクライアントに喜んでいただき、その上で十分な結果を目指さなきゃならない。今日の試合だって、ゴールじゃなくて通過点の1つ。セコンド陣が選手と共に、もっともっと高みを目指して挑み続けるように、ボクらはクライアントと共に挑み続ける。ホームページの完成は、そういうチャレンジのスタートなのだ。
悩み、工夫し、いいスタートが切れたことを感じながら、ボクは試合をテレビで観戦した(いつもはボクもスタッフの一人として会場にいることが多いが、今回は上海の予定だったので遠慮していた)。
コーナーポスト脇に菅谷氏が見える。表情までは分からないが、たぶん彼も、安心して試合に集中しているだろう。明日は「茨城電材工業」に完成の報告に行く。そこでお客様の笑顔に出会えることを信じているはずだから。



(↑)このページのTOPへ

サービス内容 完成までの流れ オプション お申込・お問合せ アフィリエイト募集 会社案内 通販法に基づく表示 HOME
ドメンテさん
※便利な専用オーダーフォームもご用意しております。
株式会社アームズエディション ■販売元:株式会社アームズエディション
〒311-4143 茨城県水戸市大塚町1866
TEL.029-253-4650 FAX.029-252-4332
URL:http://www.arms-edition.com
E-mail:info@arms-edition.com


(C)2004-2009. URUNO CREATIVE OFFICE. & ARMS EDITION.