デザイン思考は期待外れだったのか
デザイン思考は、世界の複雑な社会的課題を解決できると期待されたが、それに十分に応えてきたとはいえない。デザインに批判的に向き合うことで、デザイナーは自分たちの方法論の有効性を証明するためではなく、コミュニティのために働くことができるようになる。 アンヌ＝ロール・フェイヤード Anne-Laure Fayard サラ・ファサラー Sarah Fathallah 非営利団体、政府、そして国際機関は、複雑な社会的課題に対して革新的な解決策を開発するにあたって、しばしばデザイン思考を活用している。特定の人たちの「ために」ではなく、その人たちも含めた他者と「ともに」行う取り組みにおいてとりわけその傾向が強い。デザイン思考は、デザイナーのナイジェル・クロスによって40年以上前に概念化され、1982年に専門誌Design Studiesに掲載された「デザイナー的知識の方法（Designerly Way
エモーショナルUIデザイン｜kana
はじめに2013年にスタートアップに参加したことをきっかけに、今までいくつかのデジタルプロダクトのUIデザインに携わってきました。2020年にTakramに参加してからは、さらに多様な事業のプロダクトに関わらせていただいています。この約10年間のあいだに世の中のUIデザインのノウハウは確立されてきており、既存のコンポーネントなどを組み合わせれば、きれいなUIが誰でも簡単に作れる時代になりました。そんな中で個人的に大切にしてきた価値観として、「ユーザーの気持ちを考えて、その気持ちに寄り添った情緒的なUIをデザインする」ということがあります。今回、この記事を書いているのは、その意味や意図を言語化して再利用可能なものにしたいと思ったことがきっかけです。考えながら書いているため、何度かのシリーズになるかもしれません。また、このテーマについて様々な方と対話ができたらいいなとも思っていますので、興味を
なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita
なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】UXUIDesignUIデザイン画面設計 1.はじめに エンジニアの私がデザインを本気で勉強した結果、デザイナーとエンジニアはそもそも思考が大きく違っているということがわかりました。 今回は「それ」をデザインに苦手意識のあるエンジニア方にも理解してもらえたらと思い、わかりやすくまとめてみました。 2.アプリの画面デザインを考えてみよう まず、こんなアプリを考えてみてください。 フィットネストレーナーが使うアプリ トレーニングルームでお客様とお話しながら使う 端末はタブレット そして 会員の個人情報確認 前回までのトレーニング状況の確認 次回の予約受付 といったことをします。 使える情報としては、こんな感じです。 あなたならどう画面デザインをするか、もしお時間があったら考えてみてください。
Figmaで基本の定番UIアニメーション7つをデザインしよう 無料サンプルデモ有
この記事では、スマホアプリやウェブサイトでよく見られる、代表的な定番アニメーション7つを、プロトタイプツールFigmaで実装、再現する方法をご紹介します。 Figma（フィグマ）とは？ Figma（フィグマ）とは、ブラウザ上で動作する、インターフェース・デザイン・アプリケーションです。 特にチームなど複数人による共同プロジェクトに最適なアプリケーションで、リアルタイムでの同時編集も可能です。 Figmaは本格的なイラストレーションが可能なベクターツール、プロトタイプ機能、ハンドオフのためコード生成など、プロジェクトに必要なすべてのツールを提供してくれます。 機能が不十分なときは、プラグインで拡張することができる点もポイントです。 2020年に注目したい人気プロトツール「Figma」のベストプラグイン厳選52個まとめ Figmaにおけるアニメーションの基本 Figmaのアニメーションの基本を
デザインにおけるメンタルモデル
Interaction Design Foundationはグローバルにデザインレベルの向上を目指す、デンマーク発の非営利団体です。 メンタルモデルは、ヒューマンコンピュータインタラクション（HCI）とインタラクションデザインにおいて重要な役割を果たしています。これらはユーザーが周りの世界をどのように知覚しているかに関連し、事実に基づくコンセプトではなく、人の信念に基づいています。しかし、もしユーザーのメンタルモデルを理解することができれば、あなたはデザインの中でこれらのモデルを再現し、デザインをより使いやすく直感的なものにできるでしょう。 メンタルモデルは信念から生まれたものです。何らかのシステムあるいは反応についてユーザーが持っている信念です。ほとんどの場合、この信念は実生活のモデルとある程度似通っています。ユーザーは将来の行動をメンタルモデルに基づくシステムによって計画したり予想した
新しいデザインの教科書
【ご挨拶】 / 【目次】 / settings / 解釈が変わる写真 / ラインスケッチ / 感覚の変換による観察 / 蓋の分類 / 新しい分け方の基準 / バランスによる新しい価値 / 約束事を共有することで、読みとけるようになる四コマ漫画 / 丸を取り出す / ｷﾘﾄﾘﾑｼ / レイアウトが解釈を生み出す / モノをコントロールするための身体言語 / space / 「解釈が変わる写真」野中大
ウェブデザイン制作が爆速に！便利な最新オンラインツール47個まとめ
ウェブデザイナーやグラフィックデザイナーのデザイン制作をスピードアップさせる、便利な最新オンラインツールをご紹介します。 ゼロから作ると時間のかかってしまいそうなことも、これらのツールを使うことで大幅に制作時間を短縮できるツールが揃います。今後のデザイン制作のワークフローに取り入れてみてはいかがでしょう。 ここでは、カテゴリー別に分けて新しいオンラインツールをまとめています。 コンテンツ目次 1. モックアップツール 2. デザインツール 3. デザインからコードへの変換ツール 4. プロトタイプツール 5. サウンドツール 6. アイコン素材パック 7. コラボレーション、共同作業ツール 8. 面白ツール 9. フォント、書体ツール ウェブデザイン制作を爆速に！便利な最新オンラインツールまとめ モックアップツール Design Camera アニメーション付きの３Dモックアップを数秒で作
課金 UI まとめてみた｜あき - 良いもの作って正しく届ける
売上を伸ばしたい。 課金率を伸ばしたい。 でも、難しい！ コンバージョンするサブスク UI を勉強したかったので、いくつかのアプリをスクショ。あたまの整理にまとめたのでアップ。 Web の LPO はかなりノウハウ系記事がありますが、アプリのサブスク UI は、まだまだ少ない気がします。誰かの参考になれば嬉しいです。 まとめ内のコメントは個人的感想です。まだまだ勉強中なので、お気軽にご意見いただけるとうれしいです。 ※ スクショは少し前に撮影したものなので、一部古くなってるかもしれません。 UI パターン 1. ミニマム型 2. プラン比較型 3. 横スクロール型 4. リスト型 5. ロング LP 型 規約表示パターン 1. 固定表示型 2. 隠しスクロール型 3. フッター型 4. 遷移型 サービスパターン 1. 探索財 2. 経験財 3. 信頼材 UI パターン1. ミニマム型最低限
東京デザインウィーク火災のその後
東京デザインウィーク（TOKYO DESIGN WEEK 2016）で発生した火災で、5歳の子どもが焼け死んだ事件を覚えているだろうか？あれから2か月以上経過して、その後どうなったのかを調べようとしたら、なんかもういたたまれない気持ちになった。 東京デザインウィークのトップページに掲載されてたはずの「お詫び」のメッセージは、いつの間にかなんだかよく分からない「弊社社員が配信したメール」のお詫びに差し替わってた。事故後に掲載されていた本来のお詫び文（前略で始まる奇妙な文章がお詫びなのかは分からないが）は、なぜか「お知らせ」に移動されてる。子どもが、親が観てる前で焼け死んだのを「お知らせ」で片づけてしまうのって……。なんか、気分が悪い。 事の経緯は、年末に東京デザインウィークの社員とボランティアのひとたちが、忘年会を開こうとしてたんだってさ。悪いけど、個人的にはそんなことどうだって良い（本来ど
全ての人が知っておくべきデザイン・レイアウトの基本ルールとテクニック15選 - LITERALLY
デザイナーでなくとも、デザインについてのいくつかのルールを知っておくと、日々の生活で何かと役に立つ。今回は、誰もが知っておくべきデザインの基本原則・テクニックを紹介する。 1.デザインの基本原則を覚えよう 1-1.「1/3ルール」を覚えよう レイアウトや写真の構成を考えるときには、黄金比*1よりも「1/3の法則」が便利だ。上の図のように、全体を9等分割したとき、各線の交点（図の丸点）に主張したいモノを配置するようにする。これだけで、不思議とスッキリとしたデザインになる。技の1つとして覚えておこう。 1-2.端をそろえて線をつくろう 写真や文などの「要素の端」をきちんとそろえると、きれいに整理されて見える。これはデザインにおいてとくに重要な基本ルールだ。全てをそろえる必要はないが、縦にいくつか要素を並べる場合は常に意識しよう。 1-3.視線の流れを意識したデザインにしよう 情報がたくさん詰め
最前線IT企業のデザイナーたちが参考にしてきた「UI・UXの良書」とは | nanapi [ナナピ]
便利なシステムを生み出し、ユーザーの感動体験に欠かせない「UI/UX」。デザイナーとしてお勤めの方はもちろんのこと、IT業界に関わっている・関心があるなら積極的に学んでいきたい分野です。 今回話をうかがったのは、人気IT企業におつとめのデザイナーの方々。「UI/UX」について学び考える上で、おすすめの書籍を教えていただきました。 ご回答いただいた企業はこちら 1 グリー株式会社 2 GMOインターネット株式会社 3 GMOペパボ株式会社 4 ピクスタ株式会社 5 株式会社ブラケット 6 ヤフー株式会社 7 株式会社リブセンス グリー株式会社 細川菜々恵さん スマートフォン向けアプリ開発を担うスタジオ「Wright Flyer Studios」にて、Art UI UXチームのUI/UXディレクターを務める細川菜々恵さん（以下、細川さん）。UI/UXを学ぶにあたり、おすすめを教えていただきまし
![最前線IT企業のデザイナーたちが参考にしてきた「UI・UXの良書」とは | nanapi [ナナピ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/6f819e6fb65420c2b090598b7c6ca5eefd67194b/height=288;version=1;width=512/https%3A%2F%2Fp.cdnanapi.com%2Fr%2F2015%2F11%2F05%2F16%2F5dd1174c-ae44-4a73-aa5b-9b981c8e5b1e.jpg)
植物のフラクタル感にうっかり惑わされてみる : カラパイア
まさに自然の造形美、植物たちを観察してみると、フラクタルめいた幾何学的模様が美しすぎて頭がクラックラするレベル。きっちりと計算されたような規則性があるようで、それでいてランダムだったり、見事に人間を惑わせてくれることよ。
アップルとグーグルのガイドラインに学ぶスマホWebデザインの要点（スライド付） | ベイジの社長ブログ
スマートフォン対応させるWebサイトが急増しています。しかし、スクリーンが小さくタッチ操作がメインのスマートフォンでは、デスクトップ向けWebサイトのデザインで培ったノウハウの多くが通用しません。このような時代におけるスタンダードなデザインルールを学ぶために、弊社デザイナーの荒砂を中心に、Appleが公開しているiOS Human Interface Guidelineと、Googleが公開しているMaterial Design Guidelineの比較を行いました。（以降、両者をガイドラインと略します） スマートフォン向けのWebサイトのデザインを考える上で、アプリのUIデザインの定石を知ることは重要です。なぜなら、スマートフォンにおいてはWebサイトをブラウズする機会は14％しかなく（comScore調査／2014）、多くの時間をアプリの中で過ごしているためです。さらにユーザは「これは
PCサイトのUIデザインにおける12のトレンド | ベイジの社長ブログ
スマートフォンの普及で、PCで閲覧するWebサイト（以下、PCサイト）に対する注目度は下がっています。しかし、BtoBのデジタルマーケティングにおいては、PCサイトが今後も戦略の中心になるでしょうし、BtoCにおいても、PCサイトが不可欠な領域もまだまだ多いです。 ハードウェア的に大きな変化のないPC向けのWebデザインというと、ノウハウは固定化されている印象もありますが、実際には時代の流れを受け、今も変化を続けています。特に以下のような環境変化が、PCサイトのUIデザインにも大きな影響を与えています。 表示デバイスの多用化 スマートフォンアプリの一般化 タッチスクリーンの普及 トレンドに合わせれば成功、というではありませんが、その根底に流れているユーザ動向の変化については、十分に理解しておく必要はあるでしょう。そこでこのエントリーでは、PCサイトのUIデザインにおける最新動向を、その背景
WEBデザインが独学で身につく！WEBデザイナー必見の神サイト20選
2023年2月17日 Webデザイナー1年生はもちろん、Web製作に携わるものなら絶対に知っておきたい神サイトを完全収録しました。 独学でWebデザインを勉強したい人、優秀な先駆者たちの知恵を吸収し飛躍したい人は要チェック。 WEBデザイナー必見の神サイト20コリスWebクリエイターボックスコムテブログかちびと.netバンクーバーのうぇぶ屋ホームページを作る人のネタ帳creive【クリーブ】BlackFlagDesignDevelopArchAteitexe アテークゼウェビメモWebparkNxWorldデザイナーのイラストノート株式会社LIGMdN Design InteractiveドットインストールProgateschooコリス コリス サイト制作に関する最新の情報をご紹介 サイト構築、WordPressのTipsを得られます。ただし、Webデザイナー１年制が、今からの更新情報を受
【最近気になった住宅】日本の細長い家 - glasstruct log
細長い家といえば日本の長屋などを思い浮かべますが、長屋でなくとも地価が高い所だと正方形の土地を半分に切って２軒建てることが多くなるわけで、お住まいの地域によってはよく見かけるかもしれません。 無印も「縦の家」という細長い家を発売しています。こういう家の欠点である「採光」を、家の中心にある天窓とスケルトン階段（スケスケの階段）により解決しようという構成です。窓の家、木の家と比べてどれが一番売れているのかな？なんとなく無印好きな方は縦の家の需要が多そうな気がする。 そんなわけで、間口に対して比較的奥行きが深い、「細長い家」を3軒紹介します。 採光の悪さや狭さに対してどのようにアプローチしているかに注目してみます。 白い、まるい、細長い家 物件名：Love House 設計：保坂猛 敷地：横浜 建築面積：33平米 夫婦とウサギの家族だそうです。 採光の悪さを、昼間に使うＬＤＫスペースを2階に、寝
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
メイカーフェアで来場者を賢くした
Notion – The all-in-one workspace for your notes, tasks, wikis, and databases.
【永久保存版】エンジニア・デザイナー必見！「UI/UX」の基礎が学べるSlideshare30選
デザインって何だ？今こそ学びたい人におススメの書籍15冊
