フリーランスのデザイナーがクライアントワークにBiNDを使う理由

デザイナーとしての本質であるデザインへのこだわりを実現してくれるツール

Webデザイナー側はコーディングにかける時間と手間を省くことでデザインに専念でき、クライアント側は更新を自分達で行えるというメリットから、あえてWeb制作ツールを活用する事例が増えています。
フリーランスのWebデザイナーとして活躍されているそうまかおりさんが選んだのは「BiNDup」。
BiNDを選んだ理由と、Webデザイナーがクライアントワークでツールを使うメリットについて、お話を伺いました。

実際の仕上がりをクライアントがイメージしやすい

どのようなホームページ制作案件でBiNDを使うのか？

個人でお店をやっている方など小規模なクライアントやWebに詳しくない方ほど、Webに掛けるコストを抑えたいという方が多くいらっしゃいます。かつクライアント側でも運用更新を行いたいという場合に、BiNDで制作しています。というのも、BiNDであればコーディングが要らないので、低コスト・短納期での制作が可能ですし、HTMLなどの知識も要らないのでクライアントにも更新作業が勧められるなど、納品後のサポートもしやすいというメリットもあります。それまでは、サイトを納品したら仕事としてはそれで終わることが多かったのですが、クライアント自身がサイトを運用していると、自然と要望が出てくるんです。そのタイミングでリニューアルを提案して、次の案件に繋がることもあります。

制作時には、Photoshopなどのツールも併用する？

低コスト案件であれば、作業自体も効率化していく必要が出てきます。BiNDならば、Photoshopでワイヤーフレームを別に用意することなく、フレーム決めやデザインをBiND上で始められます。つまり、実際の仕上がりがクライアントもイメージしやすいので、サイト化したらイメージが違ったということもなくなります。もちろん、グラフィック制作はPhotoshopなどのツールを併用します。オリジナルのデザインを起こすときはPhotoshopを使い、クライアントが後に変更したくなるような簡単なパーツはBiNDの編集ツールであるSiGNで作ります。

また、私は基本、BiNDのテンプレートは使わずにゼロからデザインしていくのですが、低予算の案件などは、テンプレートをベースに使うこともあります。BiNDのテンプレートはデザインクオリティもとても高いですし、有用なものが多いと思います。BiNDのテンプレートがどう作られているのかなど設定を見ると、カスタマイズの参考になる点も多いですね。

Webデザインという視点で考えたときBiNDのメリット

スライドショー作成機能のSHiFTが好きですね。パラメータの調整なども楽にできるし、その場でプレビューしながら調整できる点もいいです。BiNDではエフェクトも追加されてますよね。BiNDを使わなくてもjQueryプラグインなどでいろいろなスライダーを選ぶこともできますが、スライダーによってはブラウザとの相性があったり、コーディングによってエラーが発生したりします。そうした対応へのストレスや、パラメータ調整もコーディングで行ってからプレビューしなければならないなどのストレスを考えると、BiNDはストレスフリーです。スライダーのデザインに集中できるというメリットが大きいですね。

[SHiFT編集画面]デュレーションやスピード、ループなど、スライドショーのパラメータをこの画面だけで簡単に調整できる。そうまさんの場合、Webデザインの雰囲気に合わせて、さりげないゆっくりとしたフェードを利用することが多いという

トライ＆エラーが簡単で、デザインに集中できる

Webフォントは重宝している？

Webフォントはすごくいいですよね。以前は文字もグラフィックパーツとして作ることが多かったのですが、レスポンシブ表示で問題になることもあるので、Webフォントはありがたいです。私の場合、ビジュアルデザインのアクセントとして欧文フォントを使うことが多いですね。BiNDならWebフォントを簡単に選びやすく、テキストを変えたり、フォントを変えたり…そういったデザインとしてのトライ＆エラーを手軽に行えるのは、本当に嬉しい。スライダーと同様に、Webフォントも自分で組み込むこともできるのですが、フォントを変えるには一旦コーディングに戻らなければなりません。BiNDならデザインに集中できるので、その点もメリットです。

和モダンを意識したデザインで、日本語フォントを活用したサイト「Zipangu Modern」

デザインするうえで気に入っている機能とは

デザイン管理機能のDressもいいですね。デザイナーとして、色にはすごくこだわっています。たとえば、見出しなどのアクセントカラーもベースカラーと同じ色を使うのではなく、微妙にトーンを変えることで全体としてのイメージは全然変わります。一目では違いが分からないかもしれませんが、微妙な色使いがデザインのクオリティを上げることになるのです。といって、見出しが出てくるたびに色を指定するのは面倒ですよね。そういった意味で、Webページのパーツごとに色をセットしておけるDress機能はWebデザインの作業効率をすごく高めてくれます。本来、CSSコーディングで管理しなければなりませんが、CSSの知識がなくても使える点もいいですね。ただ、機能が豊富過ぎて、私もすべて使いこなせてはいませんが（笑）。

[Dress編集画面]Webページを構成する部品ごとにスタイリングを指定し、デザインセットとして管理できるDress機能

制作ツールを使う上で気を付けていることやこだわり

BiNDらしくないデザインにこだわっていますね（笑）。BiND以外のWebデザインソフトやBootstrapなどのフレームワークでもそうなんですが、そのまま使ってしまうと、どうしてもそのツールの匂いみたいなものが出てしまうんです。BiNDもBiNDらしさ…があるように思います。ブロックで構成されている…みたいな。やはり、私はデザイナーですから、自分らしさを表現したいですね。もちろん、クライアントありきですから、クライアントの要件を自分らしいカタチで表現したいと考えています。

日本にいながらskypeでフランス語レッスンを受けられる「フランス語教室 Cours Montmartre「クール・モンマルトル」

仕事のスタンスにフィットするツールのひとつがBiND

クライアントワークにBiNDを選ぶ理由

私は、コーディングはある時点で辞めたんです。もちろんHTMLやCSSなどのコーディングもできるのですが、私がやるべき仕事はUIも含めたビジュアルデザインだと考えているのです。コーディング自体は知っておく必要があるとは思いますが、作業には時間がかかるものです。その時間を、私はデザインに充てたいのです。Webだけでなく、ビジネスツールも含めたCI提案も仕事として行うことが多く、クライアントの課題に対してデザインで応えることが私の仕事だと考えています。私の仕事のスタンスにフィットするツールのひとつがBiNDです。デザインワークに集中することができる。同時に、短期間でのWebデザイン制作も実現できる。まさに、私にぴったりなんです。Webデザインは難しそう…と躊躇しているグラフィックデザイナーさんも多いと思いますが、そういった方にこそBiNDを試してみて欲しいですね。むしろ、なんでBiNDを使わないの？って思うくらいです。

BiNDupを無料で使ってみる

【Profile】そうま かおり さん　

http://4real-design.com/
横浜をベースとしたフリーランスのグラフィックデザイナー。Wbデザイン・制作を中心に、さまざまなグラフィックデザインを手掛けるほか、アートディレクションも行う。また、フォトグラファーとしても活動しており、パリなどに脚を運び、ヨーロッパの風景写真作品も多数制作。BiNDによるWebデザイン歴も長く、微妙な色使いやタイポグラフィなどにこだわったフルカスタマイズのデザインが特徴的。

※MdN Design Interactiveより転載／2017年11月
（テキスト：久保靖資、撮影：鈴木隆志）