HTML5やCSS3などのWebの最新トレンドに対応したWebサイトが効率的に作成できるWebオーサリングソフト「BiND for WebLiFE*」（以下、BiND）がバージョン5として発売された。 BiND 5では、ビジネスでも最も注目を集めるFacebookやTwitterなどのソーシャルサービスとの連携を強化し、ソーシャルマーケティングを強力に支援する。BiNDおよびBiNDサーバーを利用してECサイトを展開するオトギデザインズの森岡聡介さんにお話を伺った。
東京の台東区で廃校になった古い小学校をアトリエとしてプロダクト・グラフィックデザインなどの活動を行っているデザイン事務所オトギデザインズ。“リノベーションプロダクト”をコンセプトとして、昔なじみの生活道具などにちょっとしたアイデアを加えることで新しいモノへと変えていく。語り継がれるおとぎ話のように、綿々と受け継がれてきた想いとカタチを今のライフスタイルに合う新しいモノへと変え、さらに未来へとつなげていく。
そんな活動を行っているオトギデザインズが展開している商品が“いろばき”。今も多くの小学校で使われている日本ならではの上履きにさまざまなカラーリングや装飾を施し、大人の女性が懐かしい上履きをスニーカー感覚で普段履きとして楽しめる注目の商品だ。
オトギデザインズのWebサイトの制作・運営作業を手掛ける森岡さんは、実はBiND以前にFlashサイト制作ソフトであるID for WebLiFE*からのユーザ。「技術進化の早いWeb制作において、技術習得にかける時間よりも、みずから手がけたプロダクトをWebを使ってどのように伝えていくか、そのコンテンツづくりに時間をかけたかった」という森岡さんはID for WebLiFEに引き続き、BiNDも導入。
「BiNDは、単にWebをつくりたい人向けというよりは、Webを使ってなにかを伝えたい人向けのツールだと思います。ある意味、Webはなんでもできすぎるんです。しかし、あくまでも主役は「写真」であり「ことば」ですから、制約がありながらもその中でうまい使い方を工夫するくらいがちょうどいいんです」
グラフィックデザイナーとしても活躍する森岡さん。Webコンテンツ制作では、Photoshopなどで必要となる画像パーツをつくり、それをBiNDに取り込むという手法。
「BiNDでは、画像の拡大・縮小やトリミングがスムースにできるので、Photoshopでは大きめの画像をつくっておき、BiNDに持っていってからWebページの全体的なバランスを見ながら、大きさやトリミング調整をしています。
そういった感覚的なデザインワークにすごく向いているツールだと思います」
また、BiNDの機能で、jQueryを使った動的コンテンツを簡単に生成できるSHiFTも森岡さんのお気に入りだ。
「ちょっとしたバナーやアクセントにも利用できますが、オトギデザインズのトップページではWebページの背景として使っています。いろばきという靴のソールの柔らかさや履き心地のよさをどう表現しようかと考えていたときに思いついたんです。動画ではなく、あえて4枚の静止画を組み合わせて動的に見せたのがポイントです」
アニメーション的なパーツはWebページの一部として配置してしまいがちだが、こういった大胆な使い方ができる自由さもBiNDの特徴だ。
「アプローチが逆なんですよね。つくりたいコンテンツがあって、それにはこの技術が必要…と考えるのではなく、
BiNDが提供してくれているAjaxなどの最新技術を含むさまざまな機能をこういうふうに使えるんじゃないか？って考えるんです。その結果、やりたいことを実現できてしまうところが、BiNDの凄いとことですね」
BiNDによって制作されたいろばきのオンラインストアがオープンしたのは、2010年12月のこと。
「セレクトショップなどの店舗へ卸し販売と並行してオンラインストアも展開したいと考えていた折、いろばきの発売とほぼ同時期にBiNDがEコマース機能に対応すると聞いて、すぐにバージョンアップしました」
Eコマース展開にあたっては、ブランディングおよび製品訴求をどのように表現するかが重要な課題。森岡さんは、先の例のようにBiNDが提供する機能を活用することで、より効果的なWebコンテンツをつくり出した。
また、いろばきは実店舗への出荷もしているため、WebサイトをBtoBツールとしても活用。プレスルームをWebサイトとして開設し、POPなどのSPツールをダウンロードできるようにしている。
「Webのデザイン作業は僕が担当しますが、更新作業はほかのスタッフもやります。BiNDは操作性もわかりやすいので作業はすぐに覚えてもらえる。しかも短い時間で作業できるので、“できるときにやる”というワークフローが実現できます。商品の発送業務などいろいろあるなかで、これはとても大きなメリットです」
BiNDサーバーによるEコマース機能*に関しては、「現状では商品点数も少ないので、現状のシンプルな機能性が適しています。ただ、これから商品が増えてきた場合、関連商品をグルーピングできるようになると嬉しいですね」
また、森岡さんはBiND 5で搭載されたさまざまなソーシャル連携にも関心が高い。
「現在はTwitterでお客様とのコミュニケーションを図っていますが、次はFacebookですね。BiND 5ならFacebookページもつくれるし、ソーシャルメディア*を使えばお客様の反響が今どのくらいあるのかを把握できる。いろばきをつくるにあたって、僕たちは心に向けたプロダクトというコンセプトでたくさんの想いを込めました。僕らはオトギデザインズのWebサイトを通じてその想いを届ける作業ができればと思っています。そのためのツールがBiNDなんです。買うだけがお客様の意思表明ではないと思っています。どういうところが気に入ってくれたのか、
どんな想いに共感してくれたのか、リアルな声が聞けるのがすごく嬉しいんです。ですからFacebookでは僕らとお客様との想いがつながる場をつくりたいと思っています。」
HTMLやCSSを意識することなくHTML5やCSS3に対応したWebサイトを、プロレベルの洗練されたデザインで制作できるという特性を備えたWebオーサリングソフト。Webページ上のコンテンツをブロックという単位で追加・編集・削除ができ、ブロック内にはテキストや画像以外にも、ボタンなど機能性を有するさまざまなパーツをGUIベースの簡単操作で配置していくことができる。
100種類以上搭載された豊富なテンプレートは、いずれもプロがデザインしたもの。テンプレートを選んだ後でも、デザインやレイアウトパターンの組み合わせを変えることで、オリジナルデザインを簡単に仕上げることができる。
https://www.digitalstage.jp/bind
Copyright © 2010-11 MdN Corporation. All Rights Reserved.
当ホームページ掲載の記事、写真、イラスト等の無断掲載を禁じます。
