タグ

designに関するmizdraのブックマーク (69)

  • D65光源 - Wikipedia

    D65の分光分布。 D65光源(D65こうげん)、CIE標準光源D65 (CIEひょうじゅんこうげんD65、D65とも記載[1][2]) は、国際照明委員会 (CIE) により定義された標準光源である[3] 。Dシリーズとして定義されている光源の一つであり、屋外の照明環境を再現することを目的に定義されている。 D65は、欧州/北欧における平均的な正午の光  (直射日光と晴天の空による拡散光の合わさった光) に対応しており、昼光光源とも呼ばれている。 標準光源は波長ごとの平均スペクトルとして定義されているので、統計的に同じ相対分光分布(英語版)を持つ光源は、D65光源であるとみなすことができる。実際のD65光源というのは存在せず、D65光源をシミュレートする疑似光源しか存在しない。光源の精度はCIE条件等色指数で評価される[4][5]。 CIEはD65光源を標準昼光光源として以下のように位置

    D65光源 - Wikipedia
  • OKLCH in CSS: why we moved from RGB and HSL—Martian Chronicles, Evil Martians’ team blog

    The new CSS Color 4 specification has added the new oklch() notation for declaring colors. In this article, we explain why this is important for design systems and color palettes. The extremely short version oklch() is a new way to define CSS colors. In oklch(L C H) or oklch(L C H / a) each item corresponds as follows: L is perceived lightness (0%-100%). “Perceived” means that it has consistent li

    OKLCH in CSS: why we moved from RGB and HSL—Martian Chronicles, Evil Martians’ team blog
    mizdra
    mizdra 2024/10/19
    LCH を改善した OKLCH/OKLAB 色空間について。LCH は青色で予期せぬ色相の変化が生じるが、OKLCH ではそれが修正されている。発案者のブログ見たら OK な LAB だから OKLAB だぜと書いてあってウケる https://bottosson.github.io/posts/oklab/
  • CIE 1931 色空間 - Wikipedia

    CIE1931色空間(シーアイイー 1931 いろくうかん) あるいはCIE1931表色系(シーアイイー 1931 ひょうしょくけい) は、電磁波の可視スペクトル域における物理的な色(複数の波長から構成される) と、生理学的な人間の色覚における知覚色との間の関係を初めて定量的に定義した色空間である。これら色空間により定義される数学的な関係式は、カラーマネージメントに欠かせないツールであり、印刷用インキ・トナーやディスプレイ、デジタルカメラなどの記録装置を扱う場合において非常に重要な情報になっている。 CIE 1931 RGB色空間、及びCIE 1931 XYZ色空間の2つの色空間が、1931年に国際照明委員会 (CIE)により定義された。[1][2] これらの色空間は、1920年代後半に行われたウィリアム・デビッド・ライト[3] とジョン・ギルド[4] の複数の実験結果から導き出された。こ

  • https://www.figma.com/community/file/1424823581198686752

    mizdra
    mizdra 2024/10/11
    新しい色空間である OKLCH と、新しいコントラスト基準である APCA を組み合わせて、デザインシステム向けのカラーパレットを作る話。人間に見やすく、パレットを設計する人にとっても扱いやすい。
  • 第2回 スクロールとページングのUIを考える(2) | gihyo.jp

    スクロールするUI UIの基を見てきましたが、Web UIの世界では、今まで当たり前だったものが、時代の変化に伴って廃れていったり、新しいものに置き換えられていくということが頻繁に起きます。今回のテーマであるスクロールとページングを例に、まずはスクロールバーの歴史を紐解いていきましょう。 スクロールバーとは スクロールバーは上下または左右にスクロールするために使用されるGUI(Graphical User Interface)の代表的なUIコンポーネントの一つで、近年、役割が変化しつつある部品です。 スクロールバーの役割としては次のようなものが挙げられます。 ページ全体の分量がどの程度なのか把握する 現在の位置がどこなのか把握する 指定位置にジャンプする 細かいスクロールをする 最初に登場したスクロールバーは、直接操作して画面を上下または左右に動かすものでした(図1・注3⁠)⁠。 図1 

    第2回 スクロールとページングのUIを考える(2) | gihyo.jp
  • 第2回 スクロールとページングのUIを考える(1) | gihyo.jp

    連載2回目となる今回は、WebページにおけるスクロールとページングのUIを取り上げます。ユーザに最高のUX(User Experience)を提供するためにフロントエンドUI(User Interface)設計は欠かせません。エンジニア観点から見たUI設計思想について語りたいと思います。 UIの基礎知識 最適なUIというものは、表示するデータの性質や利用者の使い方、使用しているデバイス、慣れによって変化していきます。 「万人にとって普遍的で、そこそこ使いやすいUI」を目指すべきなのか、あるいは、「⁠一部の人にとって最高に使いやすいUI」を目指すべきなのか。UIを設計する人それぞれでポリシーは異なるでしょう。 誰でもそこそこ迷わずに使える優等生的デザイン。最初はとっつきにくくても、慣れれば最速で使える奇抜なデザイン……。一口にWebページのUIと言っても多種多様です。 たまにしか使わないサ

    第2回 スクロールとページングのUIを考える(1) | gihyo.jp
    mizdra
    mizdra 2024/05/22
    10年以上前の記事だけど良いこと書いてある
  • 初公開!「家計簿プリカ B/43」のデザイントークンの設計 - inSmartBank

    こんにちはスマートバンクのデザイナーのputchomです。普段は「家計簿プリカ B/43」のプロダクトデザインやデザインシステムの構築を担当しています。 先日、CreatorZineさんでプロダクトデザインに関するスマートバンクの連載記事を書かせていただいたのですが、今回はその中でお伝えしきれなかった「デザイントークンの設計」についてご紹介しようと思います。 デザイントークンとは? そもそもデザイントークンとは、色、タイポグラフィ、サイズ、不透明度、影などのデザインをするための最小要素のことであり、スマートバンクではデザインの一貫性を保ったり、関わるメンバーがよりデザインに対する共通認識を持てるようにして、プロダクトの価値提供を早くするために定義しています。 まず完成形です。このあと説明する様々な工程を経て、以下のようなデザイントークンをJSONで定義しました。(すべて記述するとかなり長く

    初公開!「家計簿プリカ B/43」のデザイントークンの設計 - inSmartBank
  • 佐々木良 / キンモクセイ on Twitter: "ちょwわーーかったからw! わかったからちょっとシーーw! http://t.co/KmV18oJGxN"

    ちょwわーーかったからw! わかったからちょっとシーーw! http://t.co/KmV18oJGxN

    佐々木良 / キンモクセイ on Twitter: "ちょwわーーかったからw! わかったからちょっとシーーw! http://t.co/KmV18oJGxN"
    mizdra
    mizdra 2024/05/15
    テプラ貼りまくりコーヒーマシン
  • Jetpack Composeのコンポーネントはなぜ返り値がないのか - Blog - Mori Atsushi

    先週、「Jetpack Compose, React, Flutter, SwiftUIを比較する」という記事で宣言的UIの各ツールの比較を行いました。 その中で、Jetpack Compose特有の特徴としてコンポーネントに返り値がないことを紹介しました。 @Composable fun Greeting(name: String) { Text("Hello $name") }これは、React等で遵守されてきたコンポーネントは純粋関数として扱うというルールから逸脱したものとなります。 その理由について、Jetpack Composeの開発に携わるJim SprochさんからTwitterで以下のようにリプライを頂きました。SwiftUI Four reasons: (1) more natural for conditionals and loops, where coalescin

    Jetpack Composeのコンポーネントはなぜ返り値がないのか - Blog - Mori Atsushi
    mizdra
    mizdra 2024/04/08
    分かりやすくてよかった
  • 資料1 長谷川敦士教授説明資料

    ダークパターン その構造と向き合い方 2022_09_26 長谷川敦士, Ph.D. / Information Architect CONCENT / MAU / SDN / HCD-Net 資料1 1. ダークパターンとはなにか 2. ダークパターンの構造 3. ダークパターンに対してどう向き合っていくか 「ダークパターン」その仕組みと向き合い方 TODAY ダークパターン とはなにか • 「ユーザーを騙すために慎重に作られたユーザーインターフェイス」 • 「プライバシー侵害や人々の判断力低下などの問題が指摘されている」 出典: フリー百科事典『ウィキペディア(Wikipedia)』 Dark pattern ダークパターン • 欺瞞的カウントダウンタイマー:タイマーが切れてもオファーは有効 ダークパターン事例 ダークパターンとはなにか 出典:Arvind Narayanan, et

    mizdra
    mizdra 2024/04/04
    ダークパターン
  • 世の中を良くする不快のデザイン展 - デザイン・アートの展覧会 & イベント情報 | JDN

    東京のGOOD DESIGN Marunouchiにて、GOOD DESIGN Marunouchi 第2回企画展公募選出企画「世の中を良くする不快のデザイン展」を3月24日から4月23日まで開催します。 「世の中を良くする不快のデザイン展」は、“不快”を効果的に使うことで“世の中を良くするデザイン”になっているコト・モノを、心理効果から紐解き展示する企画展です。 一般的に良い印象を持つデザインは、「使いやすく、わかりやすいこと」「見た目が美しく、洗練されているもの」「誰もが幸せになるもの」といった側面が強く、“快”を求める傾向にあります。一方、“不快”なものは排除されがちで、不要なものとして捉えられています。ですが、世の中を見渡すと、“不快”という視点に着目し、世の中を良くするデザインへと昇華させたコト・モノが数多く存在します。私たちの暮らしの中で心理効果を上手く使い、“不快”の側面から

    世の中を良くする不快のデザイン展 - デザイン・アートの展覧会 & イベント情報 | JDN
  • UIから「白」が消える日|ritar

    これは designing plus nine Advent Calendar 19日目の記事です。 こんにちは。ritarと申します。 今年の10月頃、YouTubeに大きいデザイン変更がありました。 アイコンの変更、角丸やレイアウトなど全体的に一新されているのですが、中でも自分が仰天したのは「アンビエントモード」という新機能です。 アンビエントモードこのモードをオンにすると、動画の下側のUI領域が、まるで動画部分から光が漏れているかのようにじんわりと色づきます。 これを見たとき自分は度肝を抜かれました。なんたってUIの領域にコンテンツの色が侵しているのです。 これを踏まえて、最近UIと色について考えたことを、UIデザインの歴史を振り返りながら記していきます。先に要点を言うと、UIはどんどん「無色透明」になっていくと考えます。これは「技術が生活に浸透することによってUIは存在感を減らし

    UIから「白」が消える日|ritar
    mizdra
    mizdra 2022/12/20
    コンテンツを目立たせるためにブランドカラーを目立たなくするのなるほどー
  • 再利用可能なコンポーネントはアンチパターン - ジンジャー研究室

    言いたいこと Webフロントエンド界隈で「コンポーネント」という言葉が蔓延していて、「再利用可能になるように設計すべきだ」という論調があるが、実際には当に再利用可能である必要性があるまで、極力考えないほうが良い。YAGNIとも言う。 以下、現時点での考え。 ビューの階層化自体はOK ここはReactの恩恵と言っても良い気がしていて、それまであんまり明言されて来なかった「ビューの階層化」について公式で説明している点がとても良くて、開発者全員がビューはツリーになってるよねというマインドで統一できた功績は大きいと思う。 再利用可能なコンポーネント ビューはツリーでいいんだけど、それをコンポーネントと呼んでいるのでなんとなくDatePickerとかTextEditorみたいな汎用的なものを想像して、「アプリケーションの事情を知っていてはいけない」という気持ちになって疎結合に作りたくなってしまう。

    再利用可能なコンポーネントはアンチパターン - ジンジャー研究室
  • Refactoring UI

    Make your ideas look awesome, without relying on a designer.Learn how to design beautiful user interfaces by yourself using specific tactics explained from a developer's point-of-view.

    Refactoring UI
  • SmartHR Design System

    だれでも・効率よく・迷わずに。SmartHR Design Systemは、すべての人によりよい体験を届けるためのデザインシステムです。SmartHRに関わる人はどなたでも利用・参加できます。 デザインシステムとは?

    SmartHR Design System
  • Adobe to Acquire Figma

    Combination of Adobe and Figma Will Usher in New Era of Collaborative Creativity SAN JOSE, Calif.--(BUSINESS WIRE)-- Today, Adobe (Nasdaq:ADBE) announced it has entered into a definitive merger agreement to acquire Figma, a leading web-first collaborative design platform, for approximately $20 billion in cash and stock. The combination of Adobe and Figma will usher in a new era of collaborative cr

  • いい感じのアニメーション研究会 - Hatena Design Group

    こんにちは。id:akawakami です。今回は、はてなデザイングループで定期開催している「デザインゼミ」から「いい感じのアニメーション研究会」というプレゼンテーションをご紹介します。 デザインゼミとは デザインゼミは、はてなデザイングループの取り組みの一つで、社内メンバーに限定したクローズドな勉強会です。プレゼンテーションのテーマは自由。シニアデザイナーが交代で講師を担当します。 日頃蓄積された知見や経験、個人的な関心テーマ、ちょっとした工夫などを、みんなで聞いたり、話したりして、わいわい出来る、ちょっと砕けた感じのまかない勉強会です。 気軽な会なので、体系立てられた深い知識でなくても、超個人的な思いつきやアイデア、細かすぎるネタなどもテーマに採用しやすく、講師を担当する側としても、楽しみながらプレゼンテーションの準備が出来ています。 いい感じのアニメーション研究会 最近の個人的な関心

    いい感じのアニメーション研究会 - Hatena Design Group
  • Cloudscape - Cloudscape Design System

    Cloudscape offers user interface guidelines, front-end components, design resources, and development tools for building intuitive, engaging, and inclusive user experiences at scale.

    Cloudscape - Cloudscape Design System
  • フロントエンドエンジニアが変える現場のモデリング意識/modeling-awareness-changed-by-front-end-engineers

    フロントエンドエンジニアが変える現場のモデリング意識/modeling-awareness-changed-by-front-end-engineers

    フロントエンドエンジニアが変える現場のモデリング意識/modeling-awareness-changed-by-front-end-engineers
    mizdra
    mizdra 2022/07/07
    めっちゃ良い
  • 入社3ヶ月目のデザイナーから見たLayerXのデザインプロセス - LayerX エンジニアブログ

    この記事は、6月から始まっている #LXベッテク月間 18日目の記事です。 昨日の記事は弊社代表fukkyyさんの「LayerXの第3の事業、Privacy Tech事業を始めます、という話」でした。 note.com はじめまして。SaaS事業部デザイナーのわたなべなつきです。 バクラクシリーズ担当のプロダクトデザイナーとして3月に入社し、早3ヶ月経過しました。 日は入社3ヶ月目の比較的フレッシュな目線で、バクラクシリーズのデザイナーとしての働き方についてお話したいと思います。 まず入社して驚いたのは・・・ デザイナーがUIデザインしていない! 入社前から、どうやらデザイナーがUIデザインしてないらしい、ということは聞いていましたが、Figmaに一切ファイルがないので「当にUIデザインしてないんだ・・・」とびっくりしました。 tech.layerx.co.jp バクラクシリーズは基

    入社3ヶ月目のデザイナーから見たLayerXのデザインプロセス - LayerX エンジニアブログ