ロゴ類似について何となく

オリンピックエンブレムの類似騒ぎで、色々な方の擁護や批判の意見が飛び交っていますが、前提として多少なりとも「似る」ことは当たり前に起こることを認識するべきだと思うんです。
テレビのバラエティー番組にまで取り上げられる中、著名なグラフィックデザイナーのコメントの中で、「ロゴマークはシンプルな形状になりやすく、そうなれば類似のものが出やすい(一字一句正確ではないですが)」という意見には腑に落ちました、確かにその通りだなと感じます。
シンプルという意見は色々あるようです。以下はクラウドワークスさんの記事の引用。

ロゴがシンプルであれば、デザイン性を損なうことなくリサイズすることができます。逆にロゴが複雑なデザインなら、縮小すればするほどデザインがつぶれてしまい、何のロゴなのか分からなくなってしまうでしょう。

引用:ロゴデザイナー必見!クライアントが納得する『いいロゴ』とは?

自分も経験がありますが、顔をあしらった複雑な形状のロゴマークの場合、縮小すると目のカタチが潰れて「泣いている」ように見えることがありました。

よって線は太く、空白が狭くなりすぎないように…となると必然的にシンプルになるかもしれません。
しかし、シンプルであればあるほど特徴も目立ってくるものです。

そうなると類似と捉えられそうな他のロゴマークもまた見つかりやすいのでは?
特に英語の頭文字を一文字取っただけのロゴマークなんて、もう必ずと言って良いほど似ているロゴマークが他にも存在する、と、考えた方がいいのでは。
今回の問題は有名なオリンピックのエンブレムだからこそ騒がれていて無名の店舗のロゴマークであればこんな騒動にならなかったでしょう。
しかし、本質はというと、有名・無名に限らずこの問題は付き纏うはずで、ロゴマークを作るという事はその店舗なりの成長を願うシンボルとも考えられます。

成長(事業が成功)したらしたで「あのロゴ、あれに似てるよね」となる可能性はあるわけで、今は無名だからどこかに似てても批判されないだろう、というわけにはいかないものだと思います。

意匠登録制度の世界的なオープン化

今回のオリンピックのエンブレムを作ったデザイナーが色々と言われてますが、そもそも、誰がデザインしても類似と言われるものが出来上がる可能性は多かれ少なかれあることを認識するほうが大事だと思います。

いかに類似問題に向き合うか?ってことかな。と。

ただ、今回「酷似」「確かに似すぎだ」と言われても仕方がないほど共通した箇所が多いと見られる中、それをチェックする仕組みというのをそろそろ世の中も導入する方向に目を向けてはどうだろう?と思ったり。
画像認識の技術も進んでいます。Facebookなどの顔認識は怖いほど友達の名前を言い当てる事がありますね。
こんな記事を見かけました。
「SNS上のロゴ画像」を分析するサーヴィス « WIRED.jp : http://wired.jp/2013/02/27/gazemetrix-logo-scanning/
これだけの技術があれば、とりあえずどれだけ似ているロゴマークが世の中にあるかどうか調べるだけなら、だいぶ楽になるのでは?

そんな技術を使った「ロゴマーク意匠登録データベース」というサービスを世界規模で展開する…Google、いやAlphabetさんとかやらないかな?と。(なぜ民間企業かというと政府は腰が重く、国家レベルではなく世界規模のサービスじゃないと意味がないから)

日本国内ではダメで、世界のどこかで管理される規模でないと意味がない気もします。
現に今回の問題は海のむこう、ベルギーのロゴマークと似てると言われているので。

特許庁の意匠制度についても、ちょっと問題を感じます。

意匠は、物品のより美しい外観、使ってより使い心地のよい外観を探求するものです。そして、その外観は、一見してだれにでも識別することができます。このため、容易に模倣することができ、不当競争などを招き健全な産業の発展に支障を来すこととなります。そこで、意匠制度は、新しく創作した意匠を創作者の財産として保護する一方、その利用も図ることを定めて、これにより意匠の創作を奨励し、産業の発達に寄与しようというものです。
引用:特許庁ホームページ

理想としていることは理解できますが、このグローバル社会、意匠を一国の法律だけで管理するにはもう限界がありますし、「創作者の財産として保護する」とは言っても、その手段(類似を調べる手段)が薄すぎるので、作った後に酷似しているという指摘を受けることになりがちです。

意匠登録も世界レベルで、オープンかつ完全デジタル化ってのは無理がありますかね?

少なくとも類似という見えない問題を人力で調べるのは無理があるので、コンピュータで解決するというのはそろそろ考えてもいい時代なのかもしれません。
まあもちろん、類似を避けることが良いロゴマーク作りの目的とは言えませんが、少なくとも今回、オリンピックエンブレムに104作品の応募もあったと言われている中、他の作品にも類似と言われてしまいそうな作品がまだあるかもしれないことは容易に想像できます。
評価の仕方も意匠制度を世界的な機関によって、IT化導入という方向で今後は考えた方がいいのでは?壮大ではあるし、難題もあるし、時間もかかり、もっと議論も必要だと思いますが。

技術を正しく適切に使うにも、政治や利権などで今の日本の仕組みが変わる事に踏み切れない所も感じられます。

政府より民間企業?

今回の騒動のように1人のデザイナーや審査員を指摘するだけでは今後もこういった事は起きないとも限らないし、類似は多少なりとも付き纏うという認識で、選考プロセスには技術的なしくみも、行政レベルで取り組むほうが未来はあるように思えますが、やっぱり「国を超えて」となると、力のある民間企業がやったほうが手っ取り早いような気がします。ま、権利に関する問題は他にもありそうな気がしますが。。

重ねていいますが、類似を探すことがいいロゴマーク作りの目的じゃないし、問題がズレているのは百も承知の上での雑記ですが。

Macの電卓アプリはここがおかしい?

ある同じような関係の仕事をしている人たちとの飲みの席で、「Macの電卓、おかしくない?」と言ったら、みんな「え?なに言ってんの?普通に使えるじゃん」って雰囲気になって、結局使いたくても使えないひとは自分だけでした。

Macの電卓アプリのスクリーンショット

この電卓で「1 + 2 enter」の順番で押した結果です、2という結果が出て、「これは使えない、バグってる」と思った人もいるのでは?
結局この電卓には「RPN – 逆ポーランド記法(Reverse Polish Notation)」の機能が付いていて、そのモードになっていたことが後でわかりました、入力方法が異なるんですね。

おそらく知らないうちにこのモードに移行していたんだと思います。

RPN電卓についてはこちらの方の説明がパッと見てわかりやすいと思います。
http://blog.k2design-office.com/2012/04/21/888/

多くの日本人が電卓を使うシーンにおいて、そのニーズって限られた人じゃないかと思います。
ITや数学の分野と違う一般的な人としては、RPNを知らない人が多いのでは?飲みの席のメンバーでも知らない人がほとんどだったので、可能性はあると思います。

まずRPNという機能について、ニーズってものがどれくらいあるのか?によって、これらは配慮したほうが良さそう?と思った事です。

ショートカット(Command + R)は不要ではないか?

 

RPNモードのコマンドが表示されているインターフェースのスクリーンショット

RPNモードへの切り替えにはショートカット(command + R)が実装されています。
おそらく自分はこのショートカットを使って無意識に切り替えてしまったんだと思います。

この手のショートカットの有用性って、頻繁に操作する場合において重要な気がします。
例えばアンドゥやセーブといった機能はショートカットの価値があると思うのですが、この場合、ショートカットキーを設定すると、無意識(気づかずに)に切り替えられてとたんに「使えなく」なる、ようなデメリットがあるのではないかと思います。

要するに便利と思ってショートカットをつけたことで、かえって操作できないものとして離脱されそうな危険をはらんでしまうことが考えられないだろうか?ということです。

もちろん実装したなんらかの理由があったのかもしれないが、どれだけの人が逆に困るかというのはある程度数字を見て判断するしかないのだろうかとは思います。

しかもcommand+Rといえばブラウザの更新とかに使う人もいるし、なんとなく手が出てしまいます。アプリを切り替える際はcommand + tabを使う人なので、Chromeを立ち上げていて画面更新をしようと思っていて、実は電卓がアクティブになっていたのかもしれません。
例えば以下のスクリーンショットの状態でユーザーは、ブラウザがアクティブになっていると思いがちです。

chromeと電卓を立ち上げているところのスクリーンショット

もしもここで更新しようと思うと、command + Rを押して、そうなるとブラウザばかりに目や意識が集中しているので、電卓のモードがRPNモードに切り替わったなんて気がつかないユーザーもいると思います。

ここでは他アプリケーションとの利用シーンを考えると、このショートカットを実装するべきではないのでは?と考えられます。

モードや状態は見える場所で?

ユーザーのニーズを考えて、「どうしてもRPN切り替えモードを実装する価値がある」とすればどうしたらよいだろう?これはちょっと難しい。
「切り替えられたことに気づかずに離脱される」ことを防ぐだけで考えたら、メニューバーに隠れるのではなく、電卓パネルのどこかに「RPNモード」の表示、非表示を設けるほうがまだ安全かもと思います。

電卓ごときでいちいち自分のミスを調べるか?

「ごとき」なんてちょっと言葉悪いかもしれないが、電卓はシンプルなアプリだと思って使うひとが多いと思うのが本音です。
最初に1+2=3にならない電卓を見て、自分の操作による間違いかを調べるより、使うのを諦めることが一般的かもしれないです。

自分はこのRPN機能を指摘されるまでMacの電卓は使わなかっただろうし、面倒で使い方を調べることもしなかったと思います(本当は仕事柄いけないのかもしれないが)。
で、iPhoneの電卓を使っていました、あれはあれで問題アリですが。
http://matome.naver.jp/odai/2140336523315321201

ショートカットは便利かもしれないが、他アプリと比べると電卓は小さく見えます。他アプリとの関係性にも色々なストーリーがありそうで、奥深いものを感じます。

3Dプリンタに初挑戦

3Dプリンタでつくった猫の形をしたスマホドック
3Dプリンタでつくった猫のスマホドック

会社でAfiniaという3Dプリンタを購入してみました。
http://www.afinia.com/
ちょっと3Dモデリングをやったことがあるのでこっちにも手を伸ばすとどうなるのだろうという想いがあって。
あとIoTとか言われているなか最近、僕が先生として指導している大学経由で使わせてもらっているIntel Edison Kit for Arduinoなどと組み合わせてなにかやってみたいと思ったからです。

Intel Edison Kit for Arduinoの写真

最近JSBoardと呼ばれるJavaScript(Node.js)で動かせるマイコンが増えてきているので、こういったデザインに挑戦したなと思っています。

会社のロゴをプリントしてみたんですが、こういう形状だとIllustratorなどでつくった平面のアートワークに厚みを持たせるだけでだいたいいけるし、ちょっと頑張れば不可能ではないなと思います。
会社のロゴを3Dプリンタで作成している写真です

また進捗があればここで色々結果を書いていこうと思います。

大阪市交通局のデザイナー募集で月給約11万について思うこと

1ea727cdbe2fb95ca24f60c5c214b7dc.png

引用:大阪市交通局がIllustratorやPhotoshopを使えるプロのデザイナーを月額112,600円で募集しTwitterで炎上中 – ライブドアニュース : http://news.livedoor.com/article/detail/8930385/

実は炎上していた当時から思っていたことなんですが、一度冷静に考えるため時間を置いてこの記事を投稿してみます。

事の発端は、大阪市市交通局が公布した「大阪市交通局非常勤嘱託職員募集要項」(現在はリンクが切れている)の応募要件に

・Illustrator、Photoshopの広告デザイン実務経験があること
・Excel、Wordが使えること
・1日6時間で週5回(つまり平日)勤務
・給与 112,600円
・昇級・昇格なし
という内容。

Twitter等で炎上になったようです。
要するに「これだけのスキルがある人に11万だと!?うちらの業種を安く見るな!」という主張が相次いだように思えます。

最近、クライアントと直接やり取りしていく中で思う事があるので、ちょっと目線を変えながら意見を書いておきます。

世間から見た私たちデザイナーの評価とは所詮その程度のもの

最初に思う事を言っておくと、所詮そんなもんです。。

私たちがスキルを磨き、オペレーションを効率よく行うための日々の努力…
実は、これらは発注者にとっては見えなく理解しにくい(どうでもいい)ものかもしれません。

チラシをつくるけれど、その制作費をかけないで済むならそれにこした事ないと考える人もいます。
なぜならデザイナーにお願いする段階ではお金が生まれないわけです。
さらに、依頼した後にどれだけの利益が得られるのかわかりません。  

つまりグラフィックツールを使ってポスターをつくり、Excelなどで書類をつくり、電話対応なども行えるくらいのスキルの人に11万円という給与は、私たちの想いとは別に、彼ら大阪市交通局の方にとっては妥当という認識があったのかもしれません。

だとしたら私たちデザイナーの価値はどうなる?そうだ、給料を上げてもらえるだけの仕事をする必要がある。
給料が上がるという仕組みは何か?
やはり自分がいなくては誰かが困る状況であり、この人と一緒に仕事をしたいと思われる状況。  

じゃあ、その人がいないと困る状況とは何か?ということになるわけで。
ここが問題なんです。

依頼と受動

私は、大学や専門学校で10代〜30代の方にデザインの授業を担当しています。
Illustratorなどの授業中にこのような事を生徒の前で言ったことがありました。
「今君たちが勉強しているのはデザインそのものではない、作業、つまりオペレーションだから」と。
 依頼者の悩みやその背景にある問題点を、デザインというユーザーに一番近い位置から、私たちデザイナーが解決できるか、向き合い、試行錯誤し、相談もできて提案もできる。
「いやー提案してはみましたけど、モックで動かしてみて微妙でした、、、」
とか言えるだけの器量があるか。

もう、IllustratorやPhotoshopが使えるだけ、という人口は20年前と比較にならないほど増えています。
これだけ人が増えると、正直、スキルだけではその人の価値につながりにくいんです。
だから、アプリケーションスキルが高いだけでは給料という評価に結びつけるのが難しい時代だということに気づくべきでしょう。

問題を解決する難しさ

最近のお仕事で何度か、GUI(グラフィカル・ユーザー・インターフェース)の改善依頼を請けるのに、いつの間にかVI(ビジュアルアイデンティティ)の意見を出したりするウチに、ロゴマークの追加依頼に発展したりします。
発注者が気づかない問題点をデザイナーが指摘したもんだから、デザインよりもサービスのコンセプトについて相談されるようになることがあります。
でもそれは当然な気がします、なぜなら、デザイナーはユーザーの目に触れる繊細な部分とサービスのコンセプトと連携させて視覚化できる唯一の職業だと思います。
「この人なら相談できる」と思われると、もっと深いコンセプトデザインを相談させられ、発言も受け入れられやすくなることがあるでしょう。

やはり生き方は自分で決めるもの

言われた通りのことだけを忠実にやるのであれば、残念ながら他に替わりはいるという認識は社会の実情と言えるかもしれません。
言われた指示通りの事だけ行う人に価値がないとは思えませんが、発注者ができないことをやれる職業なんだから、もっと指示を疑ってみて「本当にこの指示が正しいのか」を考えてみるとよいでしょう。
発注者が正しい答えを持っているわけでなく、また、私たちも正しい答えを持っている根拠はないと思います。
たとえ完璧ではなくても、正しさの精度を上げようと試行錯誤ができる人であれば自ずと「11万だと請けられません」と言ったらいいと思います。

そして、こうも思います。
大阪市交通局に怒りの声を上げて、「デザイナーという職業が安く見られる社会を是正したい」なんて自分にはおこがましいと考えています。
生き方なんて自分で決めるんです、11万でももらえるだけ幸せと思っている人を否定することにもなり、おかしいと思います。

大阪市交通局が11万しか出さない、それはそれでいいじゃないでしょうか。
イヤなら行かなければいい。
不満なのであれば違う道を生きるために、個々のデザイナーが何に貢献すればお金をもらえるのか?について考える。
それだけな気がします。

人のデザインを私たちはどう評価し学ぶべきか

画像:ユニクロの電車内広告

先日ユニクロの電車内中吊り広告や新聞広告のデザインが話題になりました。
文字だらけのレイアウト、赤をベース、黒と黄色という昔のスーパーのチラシ風のテイストで、「不快感しか感じられない」「センスを疑う」といった、どちらかというと批判的な意見のほうが目立ったようにも思えます。
またそんな声の主が、デザイン関係あるいはライターなど、私と近い業界にいる人の声が多かったことも気になりました。
さらにNAVERにまでまとめられたようです。
どうしたユニクロ!?ひどすぎる新聞広告に心配の声まで!まとめ
今回は広告デザインをどの視点から自分なりに評価するべきかを考えてみたいと思います。

デザインの先には必ずユーザがいる

広告をつくる仕事に携わる広告業界の人だけでなければクライアントでもなく、私たちがデザインしてつくるものには必ずユーザがいます。
電車内広告デザイン、Webデザイン、プロダクトデザイン、種類は違えどその先にユーザがいることに例外はありません。

もしもデザインを勉強している人だったら、「なぜこうなった?」をまず自分なりに考察するチカラを養うために考えてみたいことです。

「あんたはウチのお客さんが見えてるのか?」と言われて…

私は過去にデザインの事例や潮流などが紹介されている書籍を見ては、流行のデザインや基礎などそれなりに研究したつもりですが、そのような書籍のほとんどは「この広告デザインによって得た成功効果」というデータまでは載っていません。
つまりデザインの潮流を学習するだけでその先のユーザがどう行動したかを理解するのは難しい、ということです。
20年ほど前、私が駆け出しの頃に海外の事例を学んでクライアントに見せた自分のデザインに対し「あんたはウチのお客さんが見えてるのか?」と言われたことを思い出しました。
私は当時、東急線の窓上ポスター(車額とも言われていた)を売っていて、自分で電話営業して契約を決めクライアントと折衝してデザインを仕上げ印刷入稿、電鉄会社に納品ということを一人で全部やっていたので、クライアントのそういった声を聞けたのです。
当時の社内ポスターは規格によって色々な料金設定がありますが、私が売っていたのは1車両に1枚、250車両分に付けられていたハーフ(半分サイズ)ポスターで月額30万円。
路線図のとなりに掲載されるため注目度の高さと網棚に隠れないというメリットはレギュラーポスターと比べると有利な特徴はありますが、当時はバブル崩壊して間もない時期、中小零細にとって月額30万円の交通広告費は必死ものです。
クライアントの社長さんや院長さん、学長さんが顧客にどう響かせるかを一緒に考えたものでした。
私も携わった電車内広告で、あえて文字だけの広告を「仕掛け」たことはあります。
ただしそういう「仕掛け」の場合、いつまでもそのままということはせず掲載期間を区切って意匠替えをしたり、特別なイベントの時期だけ数週間のみ掲載することが多かったように記憶しています。
このユニクロの場合もそれなりの予算を投じて行っただろうし、それなりの「仕掛け」があったのかもしれません。
少なくともユーザに向けて、どうアプローチしたかったのかを学ぶことができると思います。

■デザインとは表面上の視覚ではなく背景にいる人の行動を予測して設計するもの

色やレイアウト、メタファなどは私たちで確認できる表面的な要素に対し、それを見たユーザの動向は私たちに見えにくい位置にあります。
このユーザ動向を背面的な要素としたら、背面的な要素に存在するユーザにどうアプローチしているのかを考えることがデザインの本当の評価につながるのだと私は思っています。
画像:デザインにおける第三者が評価しやすい領域と見えにくい領域
表面的要素を見て「不快感」と思う人は思うし、そう感じないユーザもいないとは限りません。
大事なことは、その不快感と感じないユーザがクライアントの事業とどう関係性を持っているかを考えることが大事で、自分の考えばかりをデザインに取り入れるべきではないということです。
少なくとも表面上得られるヒントから「なんでこんなデザインにしたんだろう?」を考えることも必要なトレーニングだと思っています。

自分の経験でしか感想は語れないから正しいかどうかなんてわからない

この業界を経験している多くの人、そのほとんどの経歴なんて10〜20年程度です。
自分ができるモノに対する評価とは、自分が過ごしてきた時間の中で得た経験の中から初めて評価できます。
「好き」とか「嫌い」とか「カッコいい」とか「ダサい」とか、その多くは自分の経験でしか得られなかったことと言えるでしょう。
もっと多くの年齢層か感受するシチュエーションを考えてみると私にはとても難しい話です、しかし考えることをやめてはいけないように思えます。
もう表面的にしか見えない評価、それはデザインの評価ではないと思うんです。
「人のデザインには何らかの因果性がある」ということをもっと人から学ぶとするか。と。

質感を意識したiconデザインにチャレンジ

ちょっと前に「リアル感を追求した、クリエイティブな素敵iOSデザインアイコン46個まとめ」がいいねって言ってる友達がいて、私もこういったお仕事をさせてもらったことがあるので、やってみたい方へ。

今回つくるのはこれです。
book_image.jpg
写真ではなく、すべて一からつくったものです。
写真にするとどうしてもリアルになりすぎてアイコンっぽく見えなくなりがち。
なので写真から起こす場合でも、あくまで下絵にして書き直すくらいの気持ちがいいと思います。

革の質感を出すには

今回は主にPhotoshopを使いましたが、どうしてもそれだけでは革の質感をたっぷり出すことができなかったので、CGソフトでマッピングしました。
まず原型をモデリングして、素材の革の写真などJPEG画像など貼付けて「それっぽく」してみます。
貼付けただけを見てみましょう。

img01.jpg
img02.jpg

左が簡単にモデリングしたもの、右がマッピングだけしたもの。
これだけだと質感があまり感じられません、なぜかというと、光と影の凹凸感がないからです。
こういった場合、ソフトのほうで「凹凸用のマッピング」の機能を使います。

b_tex_bump.jpg
img03.jpg

左がバンプマップと呼ばれる画像で、Photoshopで白黒にして加工します。
右を見れば分かりますが、マップで黒ければ黒いほど沈んだ感じに見せられ、立体感がでます。
しかし、これでもちょっと物足りないので今回は光沢を付けてみましょう。
質感を決めるマッピングは他にもあって、次は、「光沢マッピング(ソフトによって言い方がちがうけど意味は一緒)」これもマッピングを使ってみましょう。

b_tex_speculer.jpg
img04.jpg

左が光沢マップ、白い部分が反射しやすいようになる、と憶えておきましょう。
ちょっとだけ光沢がつきました、あとはPhotoshopで加工しましょう。

手帳の中身の紙を表現する

キレイに整っている手帳より、「バサバサ」と整っていない感じを出してみたいと思います。
これを適当に手書きするとなんだか不自然になりがちなので、「モデル」となるものが欲しいところ。
ここで、バサバサした書類の写真を大体似たアングルで撮ります。
それを先ほどつくった手帳にPhotoshopで合成してみましょう。
これを元に次は手で描いていきます。

photo.jpg
add_photo.jpg

Photoshop上で撮影した画像を自由変形させて手帳の形と合わせ、トレースして紙を描く

Photoshopのペンツールで紙を一枚一枚トレースするような感じで描いていきましょう。
あまり細かい所を気にしないで一気に描きあげるのがポイントです。
ちょっとはみ出した緑色の付箋を演出してみました、これはちょっとグラデーションがかかってますね。
これも単純にレイヤー効果のグラデーションオーバーレイを使っているだけです。
封筒の質感もあまりリアルにしないほうがいいでしょう。
写真のものをコントラストをあげて使おうと思ったんですが、全体がアイコン風なのでテイスト的に違和感があります、よって封筒も手で(ペンツールで)描き起こしましょう。
fuutou01.jpg
fuutou02.jpg
写真の封筒を使うより、右の手書きのほうが自然ですよね。
表示カバーを見ると、まっすぐ平面な感じですが、ちょっと膨らんでいる感じを出しましょう。
ブラシツールで黒をフチに塗って適当にぼかします。
同じく白のブラシも別のレイヤーに塗って光沢と陰影を出すとこんな感じになります。
rittai01.jpg
rittai02.jpg
右が白と黒のブラシを表示のフチにつけたものです。
ちょっと膨らんだ感じになりましたね。
ただし、フチが革のままってのもちょっと変なので、ベージュ色のフチを入れてあげましょう。
選択範囲をフチの部分だけとって、ベージュ色でベタぬりしたあとに、以下のようなレイヤー効果をかけました。
fuchi.jpg

まとめ

complete.jpg
アイコンなので、もうちょっと色が映えた方がいい場合もあるので、この場合カバー部分にレベル補正をして明るくしました。
さて、本来のアイコンはもうちょっと小さいですね、なので、小さくしてもその形がわかるようにしておきましょう。
あと、今回は手帳をモチーフとしたアイコンなのでこの手順ですが、臨機応変に制作方法はたくさんあるということを憶えておきましょう。
ツールに惑わされないようにしましょう、私達の仕事はクリエイティブなことなので、ツールありきで考えるとつまらないものしかできないことがあります。
私達のつくりたいものを先にツールがある、というイメージで楽しいデザインをこころがけましょう。

デザイナー主体のハッカソンをはじめました

※ハッカソンとは…プログラマが集まって一日、もしくは連日かけて共同で何かアプリなどを作る、というイベント。
Hack+Marathonの造語であるが、エンジニアの会話の中に入れないデザイナーとしては、あまり積極的に参加しにくい傾向があります。
※以降、デザイナーを交えたハッカソンのことを便宜上「デザイナーハッカソン」とここでは言います。

このあいだも、Googleのハッカソンに呼ばれて東京に行って思ったんですが、「知識が豊富なエンジニア達の中にデザイナーを投入してハッカソンを行おう」と、最近そんなことを企画するところが増えだしたな、という気がします。

しかし、企画側の理想は分かるんですが、今までのハッカソンの感覚でやるとまったく意味がないと感じています。
むしろデザイナーを投入するだけ時間の無駄とも言えます。
エンジニアの会話というのは、エンジニア同士でないとなかなか伝わりません。
だから、その場にデザイナーが入り込むと誰とも会話が出来なくなります。

ただし、アプリ全体の完成度を考えると、デザイナーという分野の力は欠かせません。
なぜなら、単に動くだけでは、コンシューマにとって魅力を感じないからです。

デザイナーを交えてハッカソンを行おうとするすべての企画側の人へ

完成のイメージを明確に話し合う、それがないとデザイナーハッカソンは意味がない

まず、アイデアソン(アイデアを話し合う)に完成のイメージを明確にしないとデザインは出来ません。
つまり、そのフェーズを踏まない以上、「デザイナーハッカソンは不可能」と考えて下さい。

では、そのアイデアソンのフェーズなんですが

  • 主なターゲット層を明確に(性別/趣味/年齢層/職業など)
  • UIやビジュアルデザインのイメージを明確に(上記のターゲット層が決定した後だと決めやすい)
  • 画面の手書きラフ(遷移図などを思いついたまま、だんだん清書していく)

さらに、「これは守りましょう」というルールを設けるのもいいでしょう。
・アイデアが出来ないうちに、誰かひとりでもコードを書き始めるとNG(多少の検証はしょうがないとして)
・エンジニアもチーム内すべてが、デザイン面のアイデアソンに加わること

実際の仕事(案件)でも最低限これだけはないと、デザイナーが動けません。

むしろ、将来の私達の業界は、手を動かす人(デザインする人だろうがコードを書く人だろうが)すべてプロジェクトのゴールを明確に見据えるために、発案から参加するスタイルがどんどん必要とされています。
すでにシリコンバレーなど、先進的なITの現場では、このスタイルを導入しています。
「指示が降ってくる」なんて言葉は過去の言葉になるのでしょう。

つまり、この流れを実際にハッカソンで行う事が、私達の制作現場の将来のスタイルを想定しているわけで、私達が5年後、10年後、もっと周囲からの評価が高い仕事を続けていくためには、いまからこのコミュニケーションという難題に触れ、経験し、可能であればその問題解決のすべを自分なりの方法で得なければなりません。

簡単に考えている人は、やってみるときっと頭を打たれるほどの難しさを肌で感じる事でしょう。
とてもシンプルなWebアプリケーションを作るだけでも、リリースまで想定するのであればなんらかの「設計上のデバッグ」が必要となります。

当初のやりとりでうまくいくと想定しても、一つの仕様変更で次々と連鎖的にやり直しとなるでしょう。
でも、ここで見つかったバグをつぶさないと進めてはいけないので、とても進まない事にジレンマを感じます。

デザインのアイデアから設計にいたるまで、チーム全員が参加する必要があるのはそういった理由があるからです。
徹底すると質の高いイベントとなるでしょう。

 

こうなったらデザイナーハッカソンを自分で立ち上げてみました

Designers Hack 001

実はハッカソンに参加したデザイナーの力作が、アプリに反映出来なかったらとても残念な気持ちになり、その気持ちがチームのみんなに伝わらないのは余計つらいんです。
こういった経緯があって、「じゃあ、自分達で企画しよう」ということになりました。

先日和歌山の和歌浦アートキューブに泊まりがけで合宿を行ってきたんですが、これがとても良かったです。

▽とてもおしゃれな和歌浦アートキューブ

とてもおしゃれな和歌浦アートキューブ

一日目はとにかく誰も実装ベースの作業は禁止!
ペンと紙と会話で「完成を想定する」ことで精一杯です。

▽モックをイメージしては書き出し、やりなおし。

モックをイメージしては書き出し、やりなおし。

アプリは「勤怠アプリ」にしました。私達クリエイターにとっては少々くだらないと思えるアイデアも、一般の人にはモチベーションが上がるようなものもあります。
単にアルバイトのスケジュール帳ではなく、稼ぐ毎にアバターが成長/変身していくというもの。

▽出来上がったアバターの原案

出来上がったアバターの原案

iPhoneのSafariで動くことを想定したWebアプリです。最終的にはAndroidでも使えるようにしたいと考えています。

【アプリの概要】
・アルバイトのスケジュールをカレンダーに記帳できる。
・複数のバイト先を新規登録/管理でき、次からスケジュールを記帳しやすいようにする。
・アルバイト先の職種(力仕事やコンパニオンなど)を勤務先単位で登録する。
・職種ごとにアバターが成長していく

【目的】
スケジュール帳として厳密なものではなく、ビジュアルで楽しめる、モチベーションが上がるアプリを目指す。「なんじゃこのアバター?」と思えるようなユルいキャラから変なキャラまで用意。

【メンバー】
・フロントエンドエンジニア…2名
・ビジュアル/UIデザイナー…1名
・キャラクターデザイナー……2名
・HTMLコーダー…………………4名(上記から3名が兼任)
・マネージャー…………………1名

▽いよいよ実装作業開始、想像以上にうまくいかない。。

いよいよ実装作業開始、想像以上にうまくいかない。。

というメンバーで、実はエンジニアがあと2人参加予定だったんですが、風邪と社員旅行で参加出来ず、タイムオーバーとなり、一部実装は持ち越し。

単純なアプリと思っていても、結構大変なコストがかかるという事に打ちのめされます。

▽シンプルな構成案でも矛盾が発生、議論はつづく…

シンプルな構成案でも矛盾が発生、議論はつづく...
▽休憩中に出来上がってきた遷移図のチェック

休憩中に出来上がってきた遷移図のチェック

あと数回の顔合わせをして完成するというスケジュールになります。

目指すところ

このプロジェクトを企画した目的は、僕らデザイナーが良いと思った色やレイアウトを、クライアントという「素人判断」に覆されないためにも、このチームで意図して出来上がったものの価値で、本当に良いものに理由を付けたいと思ったから。

「よいと思うものに言葉はいらない」という人もいるし、すごく分かるけど、ビジネスとしてお金をもらってデザインをする立場だったらそこには説得させる材料が必要。
僕らのハッカソンプロジェクトはそれを実現させて、参加したメンバーが将来本当の意味で良いデザイナーの仕事を続けられるように今から出来る事をしたい、そう思って作りました。

もう「上から仕様変更が…」といって、リリース前に中身のコードをツギハギにしてグチャグチャでも「なんとか動いた」の状態でリリースするような仕事をしなくてもいい将来を作りたいです。

デザインの「修正」に対して思う

fig01.jpg

今回は「デザイン修正」が起こった時の、デザイナーとクライアントとのコミュニケーションを考えてみました。

みなさんはクライアント、もしくは自分に仕事を発注するディレクターさんと、どんな意識の擦り合わせをしていますか?
例えば、ちょっと規模の大きいシステム開発の場合、「こんな風に動くものを作ってよ」と言われてすぐプログラムを組むデベロッパってそういないですよね。
実はシステム開発における予算の大半は「設計(要件定義を含む)」に当てられるほど重要なフローなんです。
つまりこの「設計」というフロー無しには、手を動かして作業出来ない(乱暴に言えば)ということです。
一般的なデザイナーの仕事にとって大変懸念すべき点があります。
それは「デザイナーのワークフローには設計や要件定義を行うフローをしないでデザインする事が多すぎる」んです。
今、とくにWeb制作の中で「デザイナーとデベロッパ」とまるで異次元の人種のようにぶった切られていますが、ホントにそうなんでしょうか?
僕はデザイナーですが、なぜ僕らは彼らデベロッパーのワークフローを踏襲出来ないんだろうか?と考えています。
「修正」
みなさんも好きな言葉ではないと思います。
何時間もかけて、あるいは一晩かけて最高のクオリティに仕上げたロゴやビジュアルを「イメージと違うんだよね」と言われて修正を食らう。
開発現場とデザイン現場にいた経験から、傾向としてはデザイン現場の要件定義フローは軽視されているようです。
【開発】
システム開発で後から修正を入れること自体プロジェクトを危険にさらすから最初にしっかり設計すること。
【デザイン】
上記の開発フローほど厳密に設計などを行わない傾向が高く、デザインの変更は後からでもなんとかなる、と思われがち。

システム設計ばりの「デザインの要件定義」をすること

「まあ、ちゃっちゃっと作ってみてよ」なんて言う人とは仕事はしないです。
少なくとも、デザインをアタマの中でイメージ出来る人はいいのですが、少なくともそんな人から来る仕事は割とスムーズに行くケースがあるので、打ち合わせ段階でコンセンサスを得やすいのです。
ただし問題は「何案か見てみたい」と言われた時のこと。
ほとんどが複数案を提案します。
ただし、今回問題としているのは、打ち合わせ段階でどれだけイメージが集約された複数案なのか?
それともただ、イメージが全然沸かないから、という理由の複数案なのか?
これの大きな違いが、最終的にクオリティやデザイナーの評価を落とす原因にまで発展します。

「何案か見てみたい」…この最悪のケースを想定する

発注者はこの時点で「キーカラーは何色にするのか」「ロゴのテイストはどうするのか」「ビジュアルは写真でいくのかイラストでいくのか」等といった具体的なイメージは出来ていません。
ここでそのまま持ち帰って多数案を提出した最悪のケースへの一歩がこれです。
「もっと別の案も見てみたい」
しかし、その背景(真実)はこういう事だったのです。
(案が多すぎて逆に決め切れなくなった)
つまり、集約するべきアイデアが分散してしまい、正常な判断が出来ない状況に陥った結果です。
こういった原因を作ってしまった張本人が僕らデザイナーだったりします。
そこにクライアントやディレクタの悪口を言うのは違います。
つまり提案が多ければいい、という段階はここで行うべきじゃなかった、ということです。
もっとそれ以前のコミュニケーション作業に答えがあります。

最悪のケースとは

こっちは一生懸命作ります、何案も。

でもその中の1つ以外はボツになり、ヒドい時はどれも決まらず全部ボツになる。
それが分かっている中で、全力を注ぐのは苦しい。
さらに多くの案に時間をかけると、一つ一つの案のクオリティを保つのは至難の業です。 
出来るだけ細部のクオリティに配慮できる時間や気持ちのゆとりが欲しいです。 
これがないと、別に手を抜いているつもりはなくても配慮に対する行動が手薄になりがちです。 
そう、自分が気づかないうちに。
僕はそれを「デザインに若さがない」という。 
若さというのは若者受けという意味ではなく、「あ、精神的に元気がいい状態でデザインしたな」という感じがつたわる空気みたいなものです。 
要は無駄が多いと、言葉では「頑張ってます」でも、クオリティは落ちるのです。 
メカじゃないから人間疲れます、色んな感性が疲れます。 
だから細部に行き届かない。 
だから無駄をすると、自分のクオリティ評価が下がるし、クライアントも幸せになったかというと疑問だし。
死ぬほど徹夜もして疲労困憊な中、努力したのに、クオリティも出せず、最後までデザインもまとまらず評価は最悪、、つまりこれが最悪のケース。

だからもっともっと相手とコミュニケーションをとるんです。

相思相愛の関係で生まれる不思議なコンセンサス

会話の中で、その人が好きなことや気になっていることをすくいあげて、会話の中に弾ませると、相手はもっと自分に興味を示してくれる。
お互い疑心暗鬼になっている状態だと、どちらかがいい案を出しても、ちょっと疑いたくなるのは心情。 
でも、好きになってくると、その人の意見をさらに膨らましてやろうじゃないか!という意欲すら沸いてきます。 
不思議です、今までそういうことが何度もありました。 
そうすると、ここで一旦まとめましょうよ、って場を仕切りやすくなるんです。 
クライアントの前でも「無駄がないように短期間で最高のものを仕上げさせてください」って意思表示が出来る空気にさせてしまうんです。 
無駄、という本質を理解してもらうのもデザイナーのコミュニケーション能力として大事なことです。 
決して楽をするためじゃなく、この仕事に愛情を注げる状態を僕に下さい、と言ってるようなものですからクライアントも徐々に信用してくる。 
そうすると、もう何案も「闇雲」に作るんじゃなく、「自分でも数案試してみたいんですよ」という状態まで持って来れる。
その数案はとても価値があるチャレンジだと思っています。

クライアントにコンセンサスを得るまで手は動かさない

この小見出しが全ての答えなんですが、案をいくつか出すにしてもプロジェクトコンセプトに対して理解するまでは絶対に手は動かさない(要はPCでデザイン作業をしない)ようにします。
理由はたった1つ。
的外れな案に労力をさくより、適案に最大限の時間をかけ、クオリティと「若さ」を全力で注ぐべきだから。
これにおける行動は重要ですが、ある意味、精神/体力勝負ともいえます。
これはクライアントに対し可能な限り要求を聞き出し、自分は持ってるだけのアイデアの引き出しをその場で広げます。
そこで的外れな案を相手に指示させないようにするには、こちらからのそれを覆すだけの理由が必要です。
がしかし、これは「知識」だけ突きつけてもダメな場合があります。
人を引きつける話術で覆すことも時として必要なんです。
しかも人間、フリスクの過去のCMのように、会議が長引くと思考が切れてモチベーションも下がるので、これらを出来るだけ短期間で行います。
そうでないと、余計な疲労が思考を妨げるから、良案もそう見えなくなってくる危険だってあるのです。
ここまで徹底的にやり切ってそこから数案を考える、という話に持っていくことが重要です。
何案か出す時には、より、その案が絞り込まれた中での案なのか、を打ち合わせ段階で明確にしましょう。
ちなみにクライアントにとっては、場合によっては非常に面倒くさがられることがあります。
「そんなことより早く作って見せてよ」というのが本音だからです。
ただし、ここを怠るともうすでに、システム開発では当然の「要件定義」を放棄しているようなもので、今までの経験からすると、こういったケースは最終的に「クオリティに全力を注げなかった残念なケース」に近づいていきます。
クライアントから気に入られたいがために、夜を徹して体力限界まで多数の案を製造してしまいがち。
しかもその状態で求められるクオリティはほぼ「完成形」に近いほどのクオリティだったりするのがほとんど。
fig02.jpg
若い頃から長く経験して思いますが、
精神状態や体力が良好なときに仕上がるデザインと、劣悪な状況で仕上がるデザインのクオリティを両者均等に保てる人なんてまずいません。
人間、クリエイティブとか感性とかを思考する行為って、単純ではありません。
もっとデリケートなもので、「強くなれ」とかいう概念とは次元が異なります。
クオリティは自身の様々な状況に影響します、それも自分が気づかないところで。

理想と現実

色々書いてきましたが、結局「そんな事言っても現実はそうはいかない」と反感を持たれる人もいると思います。
その通りで、場合によっては面倒くさがられて次から仕事が来なくなります。
自分がデザイナーとしてどう生きていきたいか?という大きなテーマに発展しうる問題です。
「やっぱりこの人にお願いしたい」
「この人にお願いするとちょっと高いけど、それでもいいものを作ってくれる」
「この人にお願いする場合、発注する側も刺激になっていいよね」
そんな風に思われるデザイナーになり、今後も高く評価されながら頼りにされることを目指したい。
そう思うなら、手先が器用なだけでなく、コミュニケーションを放棄しないデザイナーであり続ける事だ、と考えます。
話が戻るけど、システム案件の「設計」が必要なように、僕たちデザイナーもイメージの設計というフローが必要です。
そして業界全体のフローを自分自身で変えていければ、僕らの未来もきっと良いものになるでしょう。

今度は段ボールのアイコンを何個か作ってみました

box_1.png
ビジュアルデザインやってる人なので、ってわけでもないけど続編。

前回のエントリーの続きになるんですが、僕がビジュアルデザインさせてもらった「CSS Nite in OSAKA」のサイトで使っているアイコン、あれも僕が作ったものなので、使えるかもしれない状態にしておきます。

これも前回と同じように、個人、商用関わらず、改変使用もOKなので良かったら使ってください。
あと、今更ですが、ブログのfacebookページを作りました。
よかったらいいねしてもらえたら嬉しいなあ、、、いまのとこ3人っ!(笑)
(右サイドの下にあります)
boxes.png
ダウンロードは下記からどうぞ
あと、イーゼルとカレンダーのアイコンも使えるかもしれませんので上記のzipに入れておきました。
よかったらどうぞ。
calender_easel.png

ダウンロードアイコン作ってみました

1480.png

そういえば、前、書籍にデザインサンプルを執筆するためだけに作ったアイコンがあって、トレーにダウンロードするようなイメージのアイコン。

あれのバージョン違いを作っていたのを思い出しました。
個人でも商用でもライセンスにしばりはなく、改変も自由なので、良かったら使ってください。
PSDファイルは下記に置いておきます。
あと、このテイストのアイコンで、例えば「Ai形式のアイコンほしい」とかあれば作れるかもしれません。
お気軽にコメントでも残してください。