こんにちは！東芝UIデザインチームnote事務局の小林Jです。 みなさんは「使いやすさ」について、どのように考え、どのようにデザインしていますか？ちゃんと「使いやすい」ものづくりができているか不安になったことはありませんか？ そんな時によりどころになるのが「人間工学」です。 「人間工学」とは、人間にとって使いやすく、安全な道具や製品、システムを考える学問です。人間特性をもとに環境や道具の使い勝手などを研究する学問でもあります。 「人間特性」とは、知覚から認知、身体に至るまで人間特有のあらゆる機能や性質のことです。どうしてそのような行動をするのか、という原理を知っていることが、モノづくりや仕組みづくりをする人たちにはとても大切なんです。 弊社デザイン部門には人間特性ワーキンググループという専門チームがあり、デザイン部門内で情報共有や勉強会を行っております。 noteにも「人間工学シリーズ」と
[B! 増田] 「2時間静かにできない人は映画館来ちゃいけないんです」の行きつく先は我.. 消えちゃったけど。元増田どんまい。 上のブクマカを見ればわかるけどほとんど健常者の傲慢で溢れている 結論から言うと「静かに見たい人」と「静かじゃなくてもいい人・静かにできない人」に分けるべきなんだよ でも映画館のキャパを「静かに見たい人」に100割振ってるから傲慢な意見ばかりになってしまう 例えば「静かに見たい人用2500円」のスクリーンと 「静かじゃなくてもいい人・静かにできない人用1800円」のスクリーンにわければ 誰でも気兼ねなく映画が観ることができるサービスが誕生する 経営側にとっても需要に合わせてスクリーンの割合や料金を調整すれば減益になるとは限らない しかし既存客の「静かに見たい人」にとっては上映回数が減るので不便が生まれる その不便を受け入れられないから傲慢ブコメが並ぶ これは映画館以
増えるタッチパネルに困ってます 視覚障害者には何も伝わらず 「世の中は便利になるけど」増す生きづらさ：東京新聞 TOKYO Web
荒川区町屋の職場近くのスーパーでは、支払い方法をタッチパネルで選ばなければいけない。全盲の長島さんは店員に操作してもらっている。カードの暗証番号は知られたくないので、スマートフォンのバーコード決済を使う。混雑時は店員に申し訳ないと、買い物には行かないようにしている。 銀行のATMは、一部の操作がタッチパネルでないとできない。行員に暗証番号を口頭で伝えて入力してもらう必要がある。視覚障害のある仲間も、マイナ保険証の利用時にタッチパネルで暗証番号の入力を求められ困っている。「信用はしているが、個人情報が守られているだろうかという不安は消えない」
Linearのリニューアル記事がすごく良かった。 A design reset (part I) How we redesigned the Linear UI (part Ⅱ) その記事の中で「LCHカラースペース」について書かれていた。知らなかったので調べてみると、以下の記事を見つけた。 この記事の内容を抜粋しながら、自分用に簡易なメモとしてまとめる。 LCHとは？LCHは簡単に言うと、異なる色相でも同じコントラストに見えるように構成されたカラースペース。 1976年に国際照明委員会 (International Commission on Illumination, CIE) によって最初に定義された色空間であるため、CIELAB とも呼ばれている。 LCH は、Lightness（明度）、Chroma（彩度）、Hue（色相）の略。 HSL と LCH の違いLightness（明度
ウェブページ上には「クレジットカード番号」「郵便番号」「電話番号」といった数値の入力欄が存在することがありますが、実装方法によってはブラウザの挙動によって入力内容が変化してしまったり、テンキーでの入力を受けつけなくなってしまったりします。そこで、数値入力欄の実装時に気を付けるべき点をまとめてみました。 KeyboardEvent - Web API | MDN https://developer.mozilla.org/ja/docs/Web/API/KeyboardEvent Why the GOV.UK Design System team changed the input type for numbers – Technology in government https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-desig
最新ニュース 12星座×タロット占い「魚座（うお座）」2024年4月22日（月）～4月28日（日）のあなたの運勢は？ 総合運・開運メッセージ2024-04-22 23:50(月)詳しくはこちら12星座×タロット占い「水瓶座（みずがめ座）」2024年4月22日（月）～4月28日（日）のあなたの運勢は？ 総合運・開運メッセージ2024-04-22 23:20(月)詳しくはこちら12星座×タロット占い「山羊座（やぎ座）」2024年4月22日（月）～4月28日（日）のあなたの運勢は？ 総合運・開運メッセージ2024-04-22 22:50(月)詳しくはこちら12星座×タロット占い「射手座（いて座）」2024年4月22日（月）～4月28日（日）のあなたの運勢は？ 総合運・開運メッセージ2024-04-22 22:20(月)詳しくはこちら12星座×タロット占い「蠍座（さそり座）」2024年4月22日（
ウェブアクセシビリティハンドブック｜ましじめ株式会社
本ハンドブックは、WCAG 2.0（JIS X 8341-3:2016）の達成基準をもとに すべての利用者がウェブサイト利用できるようにするためのアクセシビリティ向上の具体的な指針と実践的なアドバイスを提供します。 はじめに ウェブアクセシビリティとは 運用時のウェブアクセシビリティの取り組み 開発時のウェブアクセシビリティの取り組み ウェブアクセシビリティ試験 ウェブアクセシビリティ試験の流れ ウェブアクセシビリティ方針（サンプル） ウェブアクセシビリティ検証結果（サンプル） ウェブアクセシビリティ検証試験実施ページリスト（サンプル） 参考 実装の参考 ツールの参考 達成基準（適合レベルA,AAを解説） 1. 知覚可能の原則 代替テキストのガイドライン 【A】非テキストコンテンツの達成基準 時間依存メディアのガイドライン 【A】音声だけまたは映像だけ（収録済み）の達成基準 【A】キャプシ
次の実装例のように、テキストを1文字ずつspan要素で区切ってアニメーションする際の注意点と実装例について纏めたメモ書きです。 実装例テキストアニメーションの実装例（英文）
HTMLを直接読み書きせず、スクリーンリーダーも使わずに、アクセシビリティを向上させられないだろうか（と思ってブラウザ拡張を作ってる）
HTMLを直接読み書きせず、スクリーンリーダーも使わずに、アクセシビリティを向上させられないだろうか（と思ってブラウザ拡張を作ってる） これまでの何年間か、Webアクセシビリティまわりのことをやってきた中で、「Webアクセシビリティに取り組む」上でいろいろな障壁を感じてきました。 「なぜWebアクセシビリティをやるのか」の理解を得る・得てもらうまでの障壁 イノベーター層・アーリーアダプター層な開発者（エンジニアやデザイナー）が取り組みを始める上での障壁 マジョリティ層が取り組みを始める上での障壁 今回はこの3つめの「マジョリティ層が取り組みを始める上での障壁」の話です。 残りの2つについては、私が執筆に参加したWebアプリケーションアクセシビリティが網羅的なガイドになってくれるはずです。しかしコイツは内容的にも物理的にもゴツすぎる問題があると思っていて、導入編としては見えにくい、読みにくい
「あれ、なんか字幕が読みにくいな…」 ガヤガヤと人でにぎわう昼どきの社員食堂。 日替わり定食を食べながらぼんやりとニュースを眺めていたある日、ふと違和感を覚えました。 生放送のニュース番組。すらすらとしゃべるアナウンサーの声に、少し遅れて表示される字幕…。 みなさんはふだん、テレビを字幕付きで見たことはありますか？ テレビ番組表に「字」と書いてあったり、番組の開始直後に「字幕放送」と告知テロップが出たりするので、ご存じの方もいるでしょうか。 ドラマなどの収録番組は、あらかじめ制作過程で字幕を作ることができるので、番組内容と字幕の表示タイミングがきちんと合っています。 一方、ニュースなどの生放送番組（以下、生番組）の場合、アナウンサーや出演者が話すことばが事前に決まっていないため、実際に話されたことばを人が文字起こしして字幕を制作します。 そのため、どうしても数秒から数十秒の作業時間がかかっ
本連載は『Webアプリケーションアクセシビリティ──今日から始める現場からの改善』の第7章「アクセシビリティの組織導入」を公開するものです。 改正された障害者差別解消法や、デジタル庁の取り組みからの影響を受け、アクセシビリティ向上への機運は日ごとに高まっているように感じます。著名な企業がアクセシビリティへのスタンスを表明するケースも増えてきました。 しかし、こうした情報が目に入っているのは、あなたがアクセシビリティに関心がある側の人だからです。多くの場合、社内でのアクセシビリティへの意識はまだまだ高くないのが実態です。 個人や有志による非公式な取り組みでも、アクセシビリティは徐々に改善することは可能です。しかし、いずれは限界を迎えます。企業が提供するWebサイトやWebアプリケーションは組織で開発されており、大規模であり、かつ成長していくからです。 継続的に取り組み、成果を出し続けるため
（メモ）「ウェブアクセシビリティ導入ガイドブック」は自身がアクセシビリティ規格を満たしているわけではない - 水底の血
デジタル庁が提供しているウェブアクセシビリティ導入ガイドブックは、ウェブアクセシビリティの理解の一歩として有用な資料ですが、このガイドブック自身は残念ながらPDFのアクセシビリティ規格であるISO 14289-1 (PDF/UA-1)を満たしているわけではない…という話。 どうやってチェックしたかですが、veraPDFというツールでチェックを行いました。チェック対象ファイルは2024年3月29日発行のウェブアクセシビリティ導入ガイドブックです。 チェックに使用するveraPDFのバージョンですが、veraPDF/veraPDF-libraryのReleasesを見る限り、Developmentバージョン（v1.26.0 RC）でもいろいろPDF-UA/1周りの修正が入っているようですので、今回はv1.26系列を使ってみることにします。ビルド済みのjarファイル（インストーラー）はhttps
imgタグのalt属性について
alt属性について調べる機会があり、自分なりにまとめてみました。 間違い・ご指摘などあればご教示いただければと思います。 alt属性に結局何入れればいいのか問題 alt属性は入れるべきというのは聞いたことあるけど、実際どのように入れればいいのかわからないという方は多いと思います。明確な決まりがなく、適切ではない文言を入れたとしても目に見えてエラーが出るわけでもないため、曖昧な理解になりがちだと思います。 W3C WAIというWEBのアクセシビリティに関してのガイドラインの作成などをしている組織が「画像チュートリアル」というものを公開しています。「画像チュートリアル」ではalt属性の指定の仕方、具体的な事例や考え方が記載されています。このガイドを基準にしてalt属性を決めると、無駄に悩むことが減り、なぜこのような指定にしているかという根拠や参照元としての説得力もあるので、非常に有用だと思いま
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザインスキルを上げるならこれを読むべし！基本の人間工学記事 3選｜東芝 UIデザイン
批判されまくったけど「2時間静かにできない人は映画館来ちゃいけないんです」は間違いだよ
LCHは、UIにベストなカラースペース｜hirotoarakawa
ウェブページに「数値の入力欄」を実装する際はテンキーの存在を考慮する必要あり
“読書バリアフリーの実現”に向けて…国立国会図書館の検索サービス「みなサーチ」を紹介 - TOKYO FM+
テキストを1文字ずつアニメーションさせる時の注意点と実装例 ｜ TAKLOG
ストレスフリーで字幕が見られる？「ぴったり字幕」開発の舞台裏｜NHK広報局
台湾にグーグルの新オフィス誕生、ハードウェア開発などを行う
第1回 情報を共有して仲間を探す | gihyo.jp