UIデザインとは？ 大切な5つのポイントや取り組み事例を紹介｜Goodpatch Blog グッドパッチブログ
ユーザーインターフェース（UI）とは、製品とユーザーとを繋ぐ架け橋になる部分です。 優れたUIをデザインするということは、製品やサービスの魅力を高めることに直結します。その印象や使い勝手を良くするのはもちろんのこと、副次的には製品や会社のブランドイメージを向上させたり、競合製品との差別化を図るなど、中長期目線では製品の使い勝手のみに限定しない、より大きな効果をも期待することができるでしょう。 近頃流行りの魅力的な製品には、大抵優れたUIが備わっています。もしもコンシューマーの「当たり前品質」というものがそのような水準にまで上がっているのだとしたら、当然のごとく、市場の優れた製品と肩を並べても遜色無いような高品質のUIが求められますから、その実現のためにも確かなUIデザインが欠かせません。 「優れたUIとはどういうものなのか？」「UIデザインとは何なのか？」「UIとUXの違いとは？」「UIデ
『はじめよう！ 要件定義』（とそのシリーズ）を読んで、はじめよう！UIデザイン｜金 成奎
『はじめよう！ 要件定義 ～ビギナーからベテランまで』はそのタイトル通り、ソフトウェア開発に携わるエンジニアやPM向けに、要件定義の進め方について優しく解説してくれる書籍です。かわいいイラストと平易な文章がとっつきやすく、するすると読めてしまいますが、要件定義って何をどうやったらいいの？とお悩みの方に対して、まずはこれだけやっておくべき基礎知識を得ることができる、とてもわかりやすい内容になっています。 そしてそして、ここからが本noteの主な趣旨ですが、この3部作はデザイナー目線で読み解くと、極めて明瞭で本質的で実践的な、ユーザー体験設計とUI設計の進め方について学べるデザイン教則本と言えるのです。 以下、その理由と、本シリーズを使ってUIデザインを進めていく方法を実例を踏まえて解説していきます。 要件定義とはUI・機能・データを決めることいきなり『はじめよう！ 要件定義 』のキモ・コンセ
The “dark yellow problem” in design system color palettes
The goal was simple: to define the main colors so that their relative luminances, as defined by WCAG, are close to each other. This way, when designers swap out one status color for another, they are guaranteed by the design system that the color contrast ratio still passes the accessibility requirement. In this design, we don’t want the “in progress” tag to be any more prominent than the “finishe
デザイナーが集まってモーダルUIを話し合ってみた | DevelopersIO
暗黙知になっていることをクラスメソッドのデザイナーみんなで共有してみようの会として、UIの共有会を開催しました。 今回は入力フォームのルールについて対話しました。 これまでの共有会 デザイナー間で命名に関する共有会を実施しました デザイナーが集まってインプットUIを話し合ってみた ひとまず今回に関しては、情報共有して認識を合わせることが目的のため、「クラスメソッドではこうしてます！」みたいなものではない点はご了承ください。 今回の共有会は「モーダル」です。メイントピックとなるモーダルはアプリ上のUIのモーダル（特にiOS）で、PCのUIは今回対象外です。 モーダルについて学ぼう モーダルを知るにはまず「モード」を知るべし ユーザーの操作が必須の場合、外部領域をクリックできなくなるといったインタラクションに制限がかかることがあります。 求められる操作（特定のボタンを押す）が行われるまで
iOS とAndroid の違い クロスプラットフォームのアプリデザインで特に気をつけるべき点｜marin
私が一番最初にAndroid アプリをデザインしたのが2016年の初夏頃で、その頃はまだiOS・Android とデザインが違うのが主流でしたが、2021年現在のアプリはiOS もAndroid もプラットフォームごとの細かな違いはあれどほぼ同じデザインが主流となっています。 これは2016年の10月にAndroid APIがBottomNavigationView に対応してからじわじわ浸透していった変化だと考えているのですが、その辺の歴史の話は省略します。プラットフォームは違えどスマートフォンアプリである以上デザインは同じ方が楽なので、共通化されていったのは自然な流れだと思います。実際両者が全然違うUI・デザインだと大変ですしね……。 とはいえ、プラットフォームが違うので全て同じというわけにもいきません。iOS にはHuman Interface Guidelines、Android
デザインの参考になる！ 最近のWebサイトやスマホアプリで見かけるUI、インタラクションがまとめられたギャラリーのまとめ
最近のWebサイトやスマホアプリで見かけるUI、レイアウト、コンポーネント、アニメーション、インタラクションなどがまとめられたギャラリ−を紹介します。 デザインのアイデアを探している時に、ブックマークしておくと便利です。
「Adobe XD」単体販売を終了、サポート継続へ Figmaとのすみ分けは「何も決まっていない」
アドビが、同社のプロトタイピングツール「Adobe XD」の単体販売を終了したことが1月24日までに分かった。すでに、同社プロダクト一覧ページからAdobe XDの項目が消えている。ただし、「Creative Cloud」コンプリートプランには引き続き提供されており、契約すれば新規でのインストールも可能だ。 同ツールについてアドビに確認したところ「Adobe XDについてはメンテナンスモードとすることを決定いたしました」との回答があった一方で、「現在Adobe XDをご利用のお客様のサポートは今まで通り継続してまいります」と説明。既存ユーザーは引き続きAdobe XDを利用できるようだ。 なお、アドビは2022年9月にAdobe XDと競合するデザインツール「Figma」を200億ドルで買収している。FigmaとAdobe XDの棲み分けについて同社は「何も決まっていない」と回答するにとど
Goodpatch Design Advent Calendar 2022 - Adventar
今年もやってきました、株式会社グッドパッチのメンバーが「デザイン」をテーマにさまざまな記事を発信いたします。お楽しみに！ 過去版： Goodpatch Design Advent Calendar 2021 Goodpatch Design Advent Calendar 2020 Goodpatch UI Design Advent Calendar 2019 Goodpatch UI Design Advent Calendar 2018 エンジニアリング版： Goodpatch Advent Calendar 2022 Goodpatch Advent Calendar 2021 Goodpatch Advent Calendar 2020 Goodpatch Advent Calendar 2019 Goodpatch Advent Calendar 2018 Goodpatch
Web制作を変える！2021年の便利オンラインツール・ベスト100選
この記事では、2021年に公開された便利なWebオンラインツール・ベスト100個+をまとめてご紹介します。 定期的にリストアップしている最新オンラインツールまとめ記事では、2021年にかけて合計338個の新しいツールやサービスを紹介してきました。 その中でも、特にWebデザイン制作に便利なツールを選りすぐったコレクションで、「無料で利用できるツール」を揃えています。 これらのツールやサービスを活用すれば、Webデザイン制作をより快適に進めることができるでしょう。 カテゴリごとに整理しているので、目的にあったお気に入りツールを探してみましょう。 コンテンツ目次 1. CSSツール（11個） 2. パターンツール（3個） 3. イラスト系ツール（9個） 4. デザインツール（17個） 5. 配色ツール（7個） 6. グラデーションツール（12個） 7. SVGツール（9個） 8. スクリーンシ
クリエイティブコーディングの教科書
ゲームエンジンや3Dソフトウェアを利用して高度な表現ができるこの時代でも、プリミティブな描画や動き、アルゴリズムから学べることは多い。それらをJavaScriptで書くクリエイティブコーディングという形で学べる手引書が本書となる。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
フロントエンド開発のための Figma