デザイナーが選んだ。私が好きなデザイン 2018年4月号

デザイナーが選んだ。私が好きなデザイン

デザインは見た目を美しくできます。使いたい気持ちにさせたり、感動を与えることもできます。そして地域社会や環境保護にも貢献できます。デザインは様々な力を持っています。今月紹介されているデザインは、どんな価値を提供しているでしょうか？

カワマタさとし、デザイナー、creative label nor（ポートフォリオサイト：カワマタさとし）

私がご紹介するのは、マークダウン式のノートアプリ『Bear』です。

なかなか自分に合ったメモ帳アプリが見つからなかったのですが、Bearは「ちょうどいい使い勝手」で今では手放せない道具となりました。普段使ってらっしゃる方も多いのではないでしょうか。

好きなデザイン：Bear

まず、文字のサイズ感、使っている色、レイアウトなどが絶妙に調整されていると感じます。H1、H2などの見出しと本文のバランスは、大きくも小さくもなくちょうど良いです。メモを取るという行為を心地よく行うことができます。

また、Bearの標準テーマは、全体的に色のトーンが優しく設定されています。特に文字色は黒から少しグレーに落としており、文字そのものの主張を抑えています。文字色と背景色のコントラストが自然な組み合わせで、心地よいです。他にもいくつかのテーマ（有料）が用意されています。背景色が少し明るかったり、文字色が少し濃かったりするだけで、印象は大きく変わるでしょう。

さらに、普段の仕事のワークフローに対しても考慮がされています。例えば、簡単なタスク管理にも使えるようになっています。マークダウンで記述することができるチェックボックス機能があり、日々のちょっとしたタスク管理はBearで十分です。メモだけでなく「普段の仕事のUX」がデザインされている点も素敵です。

Bearを開発しているチームのビジョンは、「It’s not business. It’s personal.」です。「ビジネスではない。おれたちが必要なものを作っているんだ」と言っています。デザインとエンジニアリングといった垣根は無く、自分たちが必要だと思うものは自分たちで作っています。Bearに触れているとそういった姿勢を感じられ、さらにBearを好きになっているんだと思います。こういったものづくりはデザイナーとしても非常に憧れますね。

荒川洋人、デザイナー、Recruit Marketing Partners Co.,Ltd.

今回、私がご紹介するのは「HUGE」という海外のエージェンシーと、そのWebサイトです。

小さなWeb制作会社としてスタートしたHUGEは、今では世界中にオフィスを抱えるデジタルエージェンシーに成長しました。

彼らが制作しているクリエイティブは、Webサイトだけでなくアプリや動画、オフライン広告など様々です。どのクリエイティブも、ブランドやプロモーションメッセージを最大限に表現しつつも、使いやすくてわかりやすく、ブランド表現とユーザビリティのバランスを高いレベルで実現しています。

そのバランス感は、彼らの自社サイトを見ても読みとれます。

好きなデザイン：HUGE

キャッチコピーの大胆なフォントと背景に広がり目を引く画像の組み合わせは、シンプルなレイアウトとミニマムな情報量で、まさに「HUGE（巨大）」を表現しつつも、読みやすい・わかりやすいデザインです。

また、ハンバーガーメニューをなくしてロゴの「H」にナビゲーション機能を集約したり、ページ遷移のシームレスなトランジションを実装していたりするなど、新しいインタラクションにも挑戦しています。

ブランド表現とユーザビリティのバランスは、デザインの難かしいところのひとつです。ユーザーやデバイスの性質と、クリエイティブの役割をきちんと理解した上で、違和感なく受け止められる体験を提供しなければなりません。しかも、体験のベースになるテクノロジーはどんどん進化しています。
そんな中で、デジタルエージェンシーとして最先端を行くHUGEのクリエイティブは、とても参考になると思います。

彼らはMediamでデザインとテクノロジーの記事「MAGENTA.」を更新しているので、ぜひチェックしてみてください。

安達日向子、アートディレクター、一般社団法人フィッシャーマン・ジャパン

優れたクリエイティブはシンプルにメッセージを伝えるだけでなく、もっと大きくて根の深い問題にも立ち向かえる力があると思います。

私たちフィッシャーマン・ジャパンは、石巻に拠点を置き、若手の漁師や魚屋を中心に、プロデューサーや写真家やデザイナーなど多様な職種のメンバーが集まった、次世代へと続く未来の水産業の形を提案していくチームです。今回はその仲間で制作したサイトをご紹介します。

先日、好きな漁師に仕事を依頼できる新感覚のEC サイト「海のヒットマン」をリリースしました。食べたい魚を選んで注文するのではなく、「漁師の技」から気に入った漁師を選び、その漁師に仕事を発注するという新しい購入体験を提供しています。選んだ漁師からは、様々な形で海の幸が届きます。

好きなデザイン：海のヒットマン

一口に漁といってもいろんな種類の漁があり、漁師にはそれぞれがこだわりをもって磨いている技があります。サイトでは漁師一人ひとりの技の個性を表現しており、訪問者は漁師や商品を選んでいるうちに、水産業の知られざる一面に触れることができます。また、サイト全体が映画の特設サイトのようなデザインで統一され、漁師の仕事が持つドラマチックな側面を強調しています。

このサイトはただ面白さを目指した企画ではなく、水産業が抱える大きな問題「後継者不足」への取り組みの一環です。閉鎖的に見られがちな水産業にとって、この問題を解決するには、まず「漁師と若者の接点を作ること」が必要です。そのため、海の仕事に取り組む若い漁師や魚屋を主役にすることで、同世代の人達に興味を持ってもらうことを目指しました。

いままでデザイナーが主体的に関わってこなかった世界はたくさんあるのではないでしょうか。そこに参加するデザイナーが増えれば、いろんなアイデアに満ちた、優れたクリエイティブがつくられるようになると思います。

吹上花菜子、デザイナー、ABEJA, Inc.（ポートフォリオサイト：takana8.com）

私がご紹介したいデザインは、2015年に公開された「In Pieces」という30種の絶滅危惧動物をグラフィカルに紹介するインタラクティブなWebサイトです。

サイトを読み込むと、穏やかに始まる音楽と繊細なアニメーションで彩られた独自の世界観にすぐに引き込まれます。”EXPLORE THE EXHIBITION”をクリックすると現れるのは、三角形と美しい色合いで描かれた動物たち。その特徴をうまく捉えた細やかなアニメーションが、可愛らしさを一層引き立てます。Golden Lion Tamarinの小首を傾げる動きが絶妙でおすすめなので、ぜひサイトでご覧ください。

好きなデザイン：In Pieces

動物の右側に表示される”WHAT’S THE THREAT?”をクリックすると、絶滅に瀕することになった要因や現在の生息数など、その動物を取り巻く状況を詳しく知ることができます。私は学生時代に動物の研究をしていたくらい動物が大好きなのですが、そういう人にもそうでない人にも、もっと見たい、知りたいと思わせる魅力に溢れているなと感じました。

このサイトはCSSのclip-pathで作られた三角形の各座標をCSSでアニメーションさせるという方法で実装されており、動物を切り替えるときのトランジションは目が離せない仕上がりです。（※アニメーションを楽しむには、Google ChromeやSafari等のWebKit系ブラウザで閲覧してください）

2015年にこのサイトを初めてみたときに、FlashでもCanvasでもWebGLでもない！という事実に大きな衝撃を受けました。制作者本人がこのサイトのメイキングをSmashing Magazineで紹介しているので、合わせて見てみるとWebデザイナー＆デベロッパー的にはよりいっそう楽しめると思います。