トップクリエイター3名が「UI/UX」の本質を突く！ 灰色ハイジ×中村洋基×伊原力也が語ったコト | キャリアハック（CAREER HACK）
トップクリエイターたちは「UI/UX」をどう捉える？ユーザーにとっての素晴らしい体験を探求し、新しいクリエイティブを仕掛けるクリエイター、灰色ハイジさん、中村洋基さん、伊原力也さんが語ったUI/UX論をお届けします。 灰色ハイジ×中村洋基×伊原力也が語る「UI/UX論」 ことにWeb業界では、「UI/UX」という言葉はすでに馴染み深いものになった。同時に、UI/UXはデザイナーだけのものではなく、プロダクトに関わる多くの人たちも無視のできないものになっている。 真にユーザーにとっての素晴らしい体験を届けるクリエイティブとはなんだろうか？ 先日開催されたイベント「Design Jimoto in 渋谷（※）」にゲストスピーカーとして3人のトップクリエイターが登壇した。そこで語られた話のなかに、UI/UXの本質を紐解くヒントがあった。 [登壇者] LiB Planner, UI/UX Desi
脳に優しいデザインを！「Vertical Rhythm」の基本と実現方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーの王です。 どうも近頃はいぬ肌が恋しく、無性にワンコちゃんをなでなですりすりしたくてうずうずしるのですが・・ こういう写真を眺めているだけで心がほわ～っとしてきますよね 久しぶりに記事を書きます。「Vertical Rhythm」と呼ばれているデザイン手法ご存知でしょうか？さり気なく取り入れることで、文章が読みやすくなったり、レイアウトが整ったりすることが期待できるという。 デザインに限った話ではないが、完璧な正解など存在しないと思うので、あくまで一つの考え方として捉えて頂ければと思います。 実例を挙げながら進めて行きますので、「Vertical Rhythm」の考え方とその良さ、便利さをきっと理解してもらえるんじゃないかと思います。 前書き クライアントに「説得力のあるデザイン」を届けよう！ LIGでデザイナーをやってて、よくベテランデザイナーさんにこういう風に言わ
デザインの力で売上130％！ビジネスに貢献するデザイナーのあるべき姿とは｜UI Crunch 9 | キャリアハック（CAREER HACK）
デザイナーにも”ビジネス力”が求められている！？デザインリニューアルによって売上が130％アップした事例も公開！Fablic・ペロリ・グッドパッチ・ROLLCAKEのデザイナーが語った内容とは如何に？ UIデザイナーに求められるビジネス力とは？ UI Crunchのコンセプトは「UIデザインに関わるすべての人のためのコミュニティ」。デザイナーのみならず、エンジニアやディレクターなどあらゆる人が参加できる。Web業界のトップクリエイターをゲストに迎え、毎回UIデザインの最新トピックスにまつわるトークセッションが開催されている。 第9回目の開催となった、今回のテーマは「UIデザイナーに求められるビジネス力」について。デザイン思考をビジネスへと落とし込む「サービスデザイン」の概念が主流となりつつある今、デザイナーに求められるのはデザインのスキルだけではない。 ブランド価値の向上や採用活動への貢献
米国のデザイン会社のCEOが語る、結果を出すためのデザイン
成功を収めているデザインエージェンシーを経営するというのはどんな感じなのでしょう？ 経営者がデザイナーを兼任する場合、そのバランスはどう取っていくのでしょう？ 今回、私たちは米国のデザインエージェンシーPlatformの設立者で、デザイナーであり事業家でもあるLukas Horak氏を招いて、Platformでの彼の様々な役割について学びたいと思います。 このインタビューではPlatformのデザインプロセスや、数々の有能なデザイナーを率いることへの挑戦などに迫ります。また、Platformの素晴らしいデザインの一部も公開してくれていますので、インスピレーション溢れるチャットセッションを存分にお楽しみください。 デザインで結果を出すということ ―お時間を頂きまして、ありがとうございます。まずは、簡単な自己紹介からお願いします。 デザインに特化したデジタルエージェンシーPlatformのCE
Webデザインの没個性化と認知容易性 | ベイジの社長ブログ
Webサイトのデザインは紙のデザインと異なり、技術的な制約が強く、特に最近は様々な環境（デバイス、ブラウザ、画面サイズ、屋内・屋外など）での閲覧に対応できることを求められます。そのため、戦略から要件、コンテンツ、機能と論理的にデザインを決めていくと、どこかで見たことあるような没個性なデザインになりやすいものです。（注：ここでいうデザインは視覚的なデザインを指します） マルチデバイス、マルチブラウザが進み、レスポンシブWebも選択肢の一つとして一般化した昨今では、Webデザインの没個性化はますます進んだ印象があります。例えば、Googleが公開しているマテリアルデザインのガイドラインを見ても、デザインのパターン化と属人性排除の思想を如実に感じることができます。また、データドリヴンなサイト改善を積極的に行っていくと、「デザインの個性」と成果に大した因果関係がないことを痛感します。 没個性なデザ
「シズル感」と「読みやすさ」ってどうやってデザインで解決する？お菓子専門Webメディアのリニューアルで使った手法 | THE BAKE MAGAZINE
「シズル感」と「読みやすさ」ってどうやってデザインで解決する？お菓子専門ウェブメディアのリニューアルで使った手法 こんにちは、BAKEのデザイナー井手口です。 前職では、グラフィックとウェブデザインの両方を経験できる制作会社に所属していましたが、以前から興味があったブランディングデザインを行いたく、今年の4月からBAKEではたらいています。 BAKEに入ってからは、店舗ブランドで使っている原材料のオリジナルブランド「011」のパッケージ開発や、店舗ブランドのイベント用LP作成やPOPなどのデザインを行いながら、同時進行で進めていたお菓子専門のウェブメディア『CAKE.TOKYO』を8月上旬にフルリニューアルしました。 リニューアルの経緯はCAKE.TOKYOのこちらの記事で書いたので、今回は、サイトのデザインについてデザイナー目線から説明しようと思います。 → CAKE.TOKYO 雑誌の
新サービス立ち上げ時の重要指標のデザイン - クックパッド開発者ブログ
こんにちは、株式会社ビットジャーニーに出向中の出口 (@dex1t) です。ビットジャーニーでは、社内情報共有ツール Kibela*1のサービス設計やプロダクトマネジメントに責任を持ちつつ、エンジニアとして開発全般に携わっています。 今回は、新サービスの立ち上げ時にどのような考えで重要指標*2を設計し、それを実際の開発のなかでどう使っていくかという話をします。 なぜ検証をするのか そもそもなぜ新サービス立ち上げ時に、重要指標や検証といった考えが必要になるのでしょうか。それを考えるにあたって、クックパッド的なサービス開発の流れを改めて整理してみます。 企画と検証は表裏一体 サービス開発といえば、企画・開発・検証をぐるぐる回すというのが一般的だと思います。指標は検証段階で活用する道具です。企画で考えたことを確かめるのが検証段階であり、企画と検証は表裏一体です。 したがって、指標の設計をするにあ
LIGデザイナーの仕事の進め方やコツとは？質問にお答えします！ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。アートディレクターのぺちこです。 「あなたの質問にLIGのデザイナーがお答えします！」というテーマのもと、みなさまから募集した質問に答えています。今回は、仕事の進め方やコツについての質問にお答えしていきます！ 仕事の進め方編 ターゲットやコンセプトなどが決まってから、トップページのワイヤーフレーム、デザインをするのに何時間ぐらいかけますか？ よーいドン、と時間を計りながら作ったことはないので、明確に◯時間！ と言い切ることは難しいのですが、LIGではTOPページデザインの期間をだいたい3～5営業日確保しています。 とはいえ、その日数の中で複数の案件をこなしたり、さまざまなミーティングに駆り出されたりするため、実際の平均は、1日4時間強くらいしかかけていないのでは？ という印象です。 ……となると、トータルでは12～20時間ほど、というところでしょうか。 やはり実務をしていて感じ
デザイナーなら誰もが知ってるグラフィックデザインの基本「スイススタイル」をCSSアニメーションで！ -Swiss in CSS | コリス
デモを見ているだけで、クリエイティブな刺激がもらえる！そんな「Swiss in CSS」を紹介します。 ↓はアニメーションgifですが、実際のページはCSSのアニメーションで動いています。 Swiss in CSS ※アニメーションgifは、Konstruktive Grafik Swiss in CSSはスイススタイルでデザインされたポスターをCSSアニメーションで再現されたもので、美しいタイポグラフィ、精密なグリッド、印象的なカラーなど、現代のWebデザインの参考になると思います。 キャプチャ画像は静止画ですが、リンク先でそのアニメーションをお楽しみください。 ※全部アニメーションgifにしたら重すぎたので、やめました。
なぜデザインはシンプルな方が良いのか – 5つの理由と6つの鉄則 デザイン会社 ビートラックス: ブログ
デザインはシンプルであるべき、5つの理由とは？一方で、シンプルにすることは難しい。その理由は？シンプルにデザインするために覚えておいていただきたい6つの鉄則“Less-is-More (少ない方がより多くを得られる)”。 デザイン業界では遠い昔から使い古されているこの表現、極めて簡単に言い換えると、デザインはシンプルな方が良い、という意味になる。 確かに研ぎすまされたデザインはシンプルであるし、優れたデザイナーになればなるほど、シンプルなデザインをつくり出している気がする。 レオナルド・ダ・ヴィンチはその昔、”シンプルである事は究極の洗練だ” と語った。 近年ではWebデザインやUI、プロダクトデザイン、利用体験、インテリア、そしてライフスタイルにいたるまでミニマリズムに代表されるシンプルなものが良いとされる。 もの作りのプロセスにおいては足し算よりも引き算の方が重要で、どれだけ削れるかが
世界最高の授業。IDEOに学ぶ「デザイン思考」の真髄──2014.3.7 Night School | ライフハッカー・ジャパン
ライフハッカーのナイトスクール開講。IDEOのデザインシンキングを学ぶ。 優れたデザインとは、グラフィックや造形だけでなく、世の中の問題点や課題を明確にして、解決策を導きだすこと。ある意味では医者やコンサルの仕事にも近いのだと思います。近年、そのアプローチは「デザインシンキング（思考）」と呼ばれています。グラフィックデザイナーやクリエイティブディレクターが広告や雑誌にとどまらず幅広い分野で活躍できるのはそのスキルで社会を豊かにできるから。アップル社の初期マウスやPalmをはじめ、数々の世界的企業との仕事で知られる、デザインコンサルティングファーム IDEO（アイデオ） 。彼らが世界的に活躍しているのもデザインが社会に与える影響力の強さを物語っているのではないでしょうか。 『ライフハッカー［日本版］』が主催するナイトスクールは、いまの世の中のキーパーソンに登場いただき、その仕事術を共有する学
Webデザインのアイデアに困ったら覗きたいサイト10選
この記事では、インスピレーションを与えてくれる、Webデザインの参考になるサイトを紹介します。 サイト全体のデザインやレスポンシブデザインに特化したサイト、サイトパーツ、ロゴ、アイコン、バナーなどを収集して紹介しているサイトなど10サイト厳選しました。あなたのWeb制作の刺激になること間違いなしです。 1. MUUUUU.ORG クオリティが高く、縦に長いサイトを収集しているギャラリーサイトです。サイト自体シンプルで使いやすく、またカテゴリー分けが詳細でとても探しやすいサイトです。 2. 現代デザイン 技術的、デザイン性がすぐれたサイトを収集したギャラリーサイトです。カテゴリーは業種と色、日時のみですが、業種を細かく分類しています。また、気に入ったサイトをブックマークに入れることができます。 3. I/O 3000 国内外問わない、秀逸なデザインのサイトを収集しているギャラリーサイト
ユーザーの気持ちを考えてデザインをするために大切なこと - クックパッド開発者ブログ
こんにちは。クックパッド ダイエットのデザイナーの新妻です。 クックパッド ダイエットでは、「正しく食べてやせる」をコンセプトに銀座と代々木にある店舗でのダイエット指導と、ダイエット情報を毎日配信するメディアサイトの運営を管理栄養士と一緒に行っており、私はデザインやコーディングを担当しています。 今回は新規コンテンツを作る中で、ユーザーの声をどのようにデザインに反映していくかというお話をさせていただきます。 どんな気持ちでダイエットラボを利用している？ クックパッド ダイエットは、ユーザーの約85%が女性で、年齢でいうとメディアの方は20代〜40代と幅広く、店舗の方は40代の方を中心にご利用いただいています。 サイトや店舗ユーザーの目的の多くは“ダイエット”ですが、店舗にいる管理栄養士を通して「歳を重ねるごとに痩せにくくなって困っている」「体調が良くないので改善したい」という、より具体的な
エンジニアのデザインが10倍よくなる！「余白恐怖症」を克服する方法とは？
せっかく最高のアプリを作ったのに、デザインがイマイチイケてない。ちょっと気をつけるだけでデザインのクオリティが一気にアップする、余白恐怖症解消のすすめ。 記事を読む前に「ローワン・アトキンソン：地獄へようこそ」を1分ほどご覧ください。 なにに気づきましたか？ 多くの場合、ローワン・アトキンソンの素晴らしい機転のきいた言動に注目しますが、観客が笑うための無言の時間を取っていることには気づきましたか？ これは笑いの間と呼ばれ、コメディアンが成功するために身につける重要なスキルの1つです。 合間に無言の時間がないローワン・アトキンソンのパフォーマンスを想像してみてください。無言であることがそれぞれのジョークを成功させる鍵であるため、無言の時間がないとそこまで面白くなくなってしまいます。重要な意味を持った無言です。 音楽でも同じ状況があります。とはいえ、完全に無音というよりは、徐々に音が大きくなる
フリーエンジニアのIT案件ならレバテックフリーランス
「デザイン思考」は世界中でその有効性が認められている理論であり、デザイナーも非デザイナーも学んでおきたいことのひとつです。 しかし、デザイン思考について一言で表すことは難しく、その上専門性も高いため、理解に苦労している方は多いのではないでしょうか。 だからといって目をつぶったままでは、デザイン思考を理解することはできません。 そこで今回は、非デザイナーがデザイン思考を学ぶ際に役に立つ記事・書籍をまとめて紹介します。 デザイナーが読んでも役立つ内容となっていますので、デザイン思考を学び直したい方もぜひご覧いただければと思います。 自分に合う案件を提案してもらう デザイン思考を学ぶ際に役立つ記事 世界最高の授業。IDEOに学ぶ「デザイン思考」の真髄──2014.3.7 Night School / ライフハッカー［日本版］ http://www.lifehacker.jp/2014/04/14
アニメ版「シドニアの騎士」プライマリーデザイン
少々前の話になりますが、ポリゴン・ピクチュアズさまからお声掛けいただき、2014～2015年にかけてテレビ放送されたアニメ「シドニアの騎士」（原作: 弐瓶勉さん）のプライマリーデザインを弊社 三階ラボ で担当させていただきました。 プライマリーデザインの具体的な内容は以下の２つです。 モニターグラフィックメインビジュアルの開発 シドニアフォントの作成 ともに、原作の漫画にはすでにオリジナルのデザインが存在していますが、しっかりと時間をかけて目視できる静止画とは違い、アニメのような動画では、様々な要素が一瞬しか表示されないことが多くなります。 今回は、原作の素敵なテイストを維持しつつ、アニメ向けにデザインを再構築することが主な目標でした。 モニターグラフィックメインビジュアルの開発 原作の漫画から、モニター内に表示される主なグラフィックを抽出し、機能性や視認性、汎用性を高める再デザインを行い
Atomic Designの考え方と利点・欠点 – wkr.
Atomic Design はデザインシステムを作る方法論となります。 デザインシステムというのはスタイルガイドやブランドのガイドラインなどを指すようです。 日本だとAbemaTV（アベマ TV）で使われています。 （Atomic Design を実案件に導入 - UI コンポーネントの粒度を明確化した結果と副産物 | ygoto3.comより） Atomic Design は今までのページ単位と違いコンポーネント単位でデザインカンプを作る考え方です。 作ったコンポーネント同士の組み合わせでページを作ります。 Atomic Design はコンポーネントの単位を 5 つに分けています。 その 5 つの単位は Atoms（原子）・Molecules（分子）・Organisms（有機体）・Templates（テンプレート）・Pages（ページ）です。 各コンポーネントの詳細は次のとおりです。
フリーランスデザイナーの「つくること、はたらくこと」 - Speaker Deck
Transcript ϑϦʔϥϯεσβΠφʔͷ � ʮͭ͘ Δ͜ͱɺ ͨΒ ͘ ͜ͱʯ ࣗݾհ ͢Έ͔ͩ͋ ʢ֯ాҁՂʣ 8FCσβΠ ϯˍΠ ϥε τ Ϩʔλʔ େࡕࡏॅɺ ੍࡞ձࣾͰͷ8FCσβΠφʔΛܦͯ����ʹϑϦʔϥ ϯεʹɻ ओʹ-1αΠ τͷσβΠϯɺ ΠϥετΛ੍࡞͍ͯ͠·͢ɻ ͱ�ࡀͷஉͷࢠͱ ͏͕͗͞�ඖ͍·͢ɻ Ωϟ ϦΞ͚ͩ ��ʹ ɾ ɾ ɾ ࠓͷ͓͠ͳ͕͖ σβΠϯΛ࡞Δ ʮཧʯ ͱ ʮϏδϡΞϧʯ � ཧฤ � ϏδϡΞϧฤ � σβΠϯͷઆ໌ฤ ϑϦʔϥϯεͱͯ͠ಇ͘ Θͨ͠ͷ৺ಘ 01 02 ࠓͷͶΒ͍ ࠓͷςʔϚ ʮσβΠϯࡇʯ ɻ ʮσβΠϯղܾʯ ͜ͷ͜ͱΛͣͬͱ؊ʹ͡ ͖͚ͯͨΕͲɺ ࠷ۙͲ͏ͬ͘͠ Γ͜ͳ͍ɻ ࠓͷͶΒ͍ ݟ͚͕ͨͩσβΠϯ͡Όͳ͍ɺ ͰσβΠϯͷத Ͱɺ ͖Ε͍ͳ৭ɺ ͖ͯ͢ͳϑ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
黒野 明子 | Adobe Blog
いい仕事をしよう // Speaker Deck
