タグ別アーカイブ: Design

hireLink vol.7 インパクト溢れるコンテンツの作り方 明日から使える発想法と着地術

Introduction

WebサイトやWebサービスを立ち上げる際にどのように最初のアイデアを発想するのか、
また、いいアイデアを思いついた時にどのように完成形に落としこむかについて、面白法人カヤックを経て株式会社PARKを立ち上げた佐々木智也さんにお話いただきます。
デザイナーからエンジニアまでWebに関わる全ての人(特にクライアントの希望を形にするお仕事の方)に向けた内容です。

登壇者

佐々木智也

sasaki

1979年生まれ。横浜市出身。東京造形大学デザイン学科卒。
広告制作会社、外資系広告会社にてマス広告の企画制作に携わったのち、面白法人カヤックに入社。アートディレクターとしてWebキャンペーンからサービス、プロダクトまで多岐に渡る領域を担当。
TIAA銅賞、ADSTARS Finalist、日経広告賞準部門賞、グッドデザイン賞他。JAGDA正会員。
共著に『現場のプロが教えるWebデザイン&レイアウトの最新常識』。

hireLinkとは

logo600

hireLink(ハイヤーリンク)は株式会社トライブFAbank事務局が主催するクリエイターとエンジニアのための無料勉強会 / 交流会です。
その名前には”hiring”=雇用と”higher link”=志の高い者同士のつながりという意味が込められています。
勉強会には成長企業のエンジニアやクリエイターを招き、プレゼンテーションまたはパネルディスカッション形式で最新トレンド技術を学習していただきます。
勉強会後の交流会では登壇者や企業代表と直接お話しいただき、就業やキャリアアップにつなげていただけます。

詳細

flyer_square

■日時: 10月1日 (木) Open 19:00 / Start 19:30
■会場: 株式会社トライブ 3F ラウンジ
■住所: 〒150-0044 東京都渋谷区円山町5-5 NAVI渋谷V3F
■オフィシャルサイト: hireLink
■入場料: 無料
■進行

19:00 開場
19:30 開演
19:30 – 20:20 佐々木氏ご登壇
20:20 – 20:30 質疑応答
20:30 – 21:30 交流会
21:30 終了

■定員: 30名
■持ち物: 筆記用具とお名刺をご持参ください。
■主催: 株式会社トライブFAbank事務局
■Info: TEL:03-5428-5170
Mail: fabank@tribe.bz

アクセス

JR、半蔵門線、銀座線、副都心線、東急田園都市線、京王井の頭線「渋谷駅」より徒歩8分
マークシティ口より徒歩2分
京王井の頭線「神泉駅」より徒歩5分
詳細はこちらを御覧ください。

応募

hireLink vol.4 簡単そうでむずかしい!「シンプルなデザイン」の裏側 イベントレポート

こんにちは!FAbank事務局の工藤です。本日は去る9月2日に開催されたhireLink vol.4 簡単そうでむずかしい!「シンプルなデザイン」の裏側 イベントレポートをお送りいたします。

今回のアジェンダ

今回のアジェンダは今話題のデザイン。中でも数年前からトレンドとなっているシンプルなデザインさらにフラットデザインに関して『フラットデザインの基本ルール』という著作をお持ちの佐藤好彦先生に徹底解説していただきました。

フラットデザイン流行の要因

近年Webの世界でフラットデザインが流行している(もはや流行と言えないほど主流になってきていますが)理由には以下の要因があるといえます。

  • Web技術の変化 - Webfont、SVG、レティーナディスプレイの登場
  • モバイルの普及 - ファーストビュー重視からスクロールへ、コンテンツ量を抑制したシンプルなサイト構造へ
  • ユーザーの慣れ - UIからコンテンツ重視へ
  • 美意識の変化 - 抽象と感情移入
  • グローバルIT企業の戦略 - Apple, Google
  • 社会環境の変化 - メタファーが意味を持たない、スキューモーフィズムの限界

「シンプルデザイン」とは何か

さて、そもそもシンプルなデザインとは何でしょうか?アップルのチーフデザイナー、ジョナサン・アイブは「シンプルさは、秩序によって実現される」と述べています。
Jonathan_Ive_2009
Jonathan Ive 2009” by Gary CohenJonathan Ive Objectified. Licensed under CC BY-SA 2.0 via Wikimedia Commons.

なにかモノを作る時には直感的な判断と、論理的な判断の両方を行いながら作業をすすめていきます。直感や感情を重視して作り出されたものよりも、バランスを重視して理性的に作ったほうが秩序のあるものになります。感情表現を重視する意匠を凝らした装飾的な造形を表現主義とすれば、意匠よりも構造を、感性よりも理性を、直感よりも理論を重視する造形は構成主義的です。この構成主義的造形のほうが、秩序があり、シンプルなデザインに近づきやすくなります。

これは1920年代に登場し建築の世界を席巻したインターナショナルスタイル - 意匠つまり装飾を排除することで個人個人の感性や地域性を超える、世界的に共通する様式の創造を目指したもの - に通じる考え方というわけですね。
Bauhaus
Bauhaus” by Mewes in de-Wikipedia – Own work. Licensed under Public Domain via Commons.

これは縄文土器と弥生土器にもなぞらえられます。
Jomon_vessel_3000-2000BC
Jomon vessel 3000-2000BC” by Chris 73 / Wikimedia Commons. Licensed under CC 表示-継承 3.0 via ウィキメディア・コモンズ.
Footed_jar
Footed jar” by Elmo rainy day投稿者自身による作品. Licensed under CC 表示-継承 3.0 via ウィキメディア・コモンズ.
この二つのどちらがシンプルなデザインといえるのかは一目瞭然ですし、それはどちらが機能的であるかとほぼイコールで結ばれるでしょう。
スティーブ・ジョブズの言葉「多くの人がデザインと聞くと、どのように見えるかを重視して考えるが、私たちはどのように”機能”するかを一番に考える」もこの考え方を裏打ちしていますよね。

まとめ

シンプルなデザインを作るには、単に要素を少なくするとか、色を少なくするとかではなく(それも大事なのですが)、計算に基づいて本質的な構造や機能を表現することが大事という事がよくわかりました。
また、その本質を理解するためにもヴィルヘルム・ヴォリンガー『抽象と感情移入』とか、ニーチェ『悲劇の誕生』といった古典を面倒臭がらずに読んでおくべきなだなあと感じました。

…またコーディングを行うこともある自分としてはhtml cssのマークダウンにおいてもpxではなくrem (root em, 指定されたフォントサイズを基準とした倍率)を使うことが多くなってきているのもその辺が関係してるのかなと思いました。「ルートに対する」という部分が大事になりますし、常に意識することになりますからね。

質疑応答

マテリアルデザインはフラットデザインとどこが違うのか?

「フラットデザインは2012年のWindows8のMetro UI登場くらいから市民権を獲得し、以後どんどんフラット化が進んでいきましたが、画面上のどこが押せる要素かがわかりにくいなどの問題もあった。そこで2014年、グーグルはフラットデザインを推し進めた考え方である「マテリアルデザイン」を提唱しました。フラットデザインとどこが違うのかというと、それはコンポーネントにより質感(マテリアル感)を与えているということです。全くの平面を組み合わせるのではなくボタンやカードには影をつけ、質感、モノ感を表現している。先ほどの話に戻ると、構造:意匠の比が9:1か9:2のデザインといえるのではないでしょうか。(Googleのマテリアルデザインのガイドラインはこちら)」

新刊情報

この日インプレスさんからは佐藤さんの新著「ビジネス教養としてのデザイン」を頂戴いたしました。こちらはデザイナーさん向けというよりはあらゆる人に向けたデザイン思考をわかりやすく解説している内容となっており大変オススメです!
71-Bp4pInVL
佐藤先生、ご来場いただいた皆さまどうもありがとうございました!