並び順

ブックマーク数

期間指定

  • から
  • まで

1 - 40 件 / 149件

新着順 人気順

アクセシビリティの検索結果1 - 40 件 / 149件

  • デジタル庁のサイトやばすぎるwww - Qiita

    はじめに みなさん、デジタル庁のサイトはご覧になったことはありますか?今話題のデジタル庁です。 こちらが2023年6月現在のデジタル庁のサイトです。やばくないですかこれ?最初見たときこれ「やっばw」と思いました。これからこのサイトのやばさを語っていきたいと思います。 洗練されたシンプルさ、そしてデザイン 僕は最初見たときびっくりしました。「なんてシンプルで見やすいんだ!」官公庁のサイトですよ?官公庁のサイトといえば、細かい字がずらっと並んで見づらいイメージでしたが、デジタル庁のサイトはとことんシンプルさを追求して見やすくしてます。フォントもNoto Sans JPを使われててとても読みやすい。黒も #000 でなく見やすい色になっている。 やばいですねこれ。 そしてこのレイアウトを見たとき、余白のおかげでとても見やすいなと思いました。そこでChrome Dev Toolでレイアウトを見てみ

      デジタル庁のサイトやばすぎるwww - Qiita
    • テクニカルライティングの基本 2023年版

      テクニカルライティングの基本を学べます。業務マニュアル、報告書、仕様書、技術解説書などのドキュメントを書く機会がある方向け。 サイボウズの2023年度 新入社員向け研修の資料です。 Twitter:https://twitter.com/naoh_nak 2022年版(初版):https://speakerdeck.com/naohiro_nakata/technicalwriting

        テクニカルライティングの基本 2023年版
      • 「UIの色を変えただけで大量のクレームを頂戴してしまった話」の何が問題か?|moutend

        結論話題の記事「UIの色を変えただけで大量のクレームを頂戴してしまった話」を読みました。ユーザーを軽視した内容に驚愕したのですが、それよりも記事が批判されている原因を理解できていない様子の方が存在することに衝撃を受けました。 現職のデザイナーあるいはデザイナーを目指している方々にお伝えしたいことは以下の3点です。 具体的な不都合を訴える問い合わせは無益なクレームではなく有益なフィードバックです。プロダクトの価値向上につながる貴重な意見ですから無視するべきではありません。 時間の経過でユーザーがUIに慣れることはありません。問い合わせをしても無駄だと学習して離脱したパターンを疑いましょう。受け入れられる場合も含めて画面の変更はユーザーに負担を強いているのだと自覚してください。 色覚特性や色とコントラストについて学びましょう。色だけで情報を伝えるデザインはアンチパターンですから避けてください。

          「UIの色を変えただけで大量のクレームを頂戴してしまった話」の何が問題か?|moutend
        • 【閲覧注意】イライラ不可避なUIデザイン10選 - Qiita

          弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています!興味をお持ちいただける方は、こちらまで。 はじめに 人は見た目が9割 皆さん一度はこの言葉を耳にしたことがあるのでしょう。内面がどれほど素晴らしくても、外見がそれに見合わないと、なかなか本当の価値を認めてもらえないものです。 この話は人間だけでなく、アプリケーションにも当てはまります。どれだけ内容が素晴らしくても、見た目がイマイチだったり使い勝手が悪かったりすると、ユーザーに敬遠されてしまいます。(私は以前ネ⚪︎フリからア⚪︎プラに切り替えたのですが、使いにくく感じたため、すぐに元のサービスに戻しました) エンジニアの皆さん、優れた技術力を持ちながら、デザインが原因でユーザー離れを招いていませんか?そうならないよう

            【閲覧注意】イライラ不可避なUIデザイン10選 - Qiita
          • 「合理的配慮ではなく、合理的調整と呼ぶべき」芥川賞受賞作「ハンチバック」著者、市川沙央さんインタビュー - 成年者向けコラム | 障害者ドットコム

            側弯症の女性が主人公の芥川賞受賞作「ハンチバック」。その作者で自身も側弯症である市川沙央さんに「ハンチバック」の作品に込めた思いなどを尋ねました。作品についての質問から、世間の障害者観についての質問まで、幅広くお答えいただきました。特に、障害者の権利やヘイト言説についての質問には、とても気持ちのこもった痛快な回答でした。 あれでも相手役だった「田中さん」 (c)撮影:深野未季(文藝春秋) ──様々な固有名詞や専門用語などが実名で登場していますが、そこに意図はおありでしょうか。 「医療用語、医療機器名に関してはリアリティとともに、日常感を示すためです。特別なものではないということですね。WEB小説用語もそうですね。いや、『ナーロッパ』とかは、単純に『ナーロッパ』というワードを純文学の文芸誌に載せたかった、WEB小説界からそのように殴り込みをかけたら面白いじゃんと思って書いていたかもしれません

              「合理的配慮ではなく、合理的調整と呼ぶべき」芥川賞受賞作「ハンチバック」著者、市川沙央さんインタビュー - 成年者向けコラム | 障害者ドットコム
            • タッチパネル式食券機を作ってる連中ってバカなの?

              もういろんなところで言われてるけど、最近よく見るタッチパネル式の食券発券機ってなんであんなに無駄なステップが多いの? 行きつけのラーメン屋でノーマルラーメンを頼もうと思ったらこんだけの画面を経なきゃならない。 ・ラーメン、サイドメニュー、ドリンクからラーメン選択 ・ラーメン、チャーシューメン、煮卵ラーメンなどからラーメン選択 ・トッピング選択画面でトッピング無しを選択 ・麺普通、大盛から普通を選択 ・お支払方法選択ボタンをタッチ ・電子マネー、現金から電子マネーを選択 ・いくつかの選択肢からたとえば交通系ICを選択 ・カードをタッチ→発券 こんなのこうすりゃ簡単じゃん。 ・注文画面(=初期画面)で注文する品を選択→他メニューやトッピングも追加選択できる状態で「電子マネーをタッチ、あるいは現金を入れてください」の表示 ・カードをタッチあるいは現金を投入して発券(どの電子マネーかは自動判別)

                タッチパネル式食券機を作ってる連中ってバカなの?
              • 盲目の格闘ゲームプレイヤー「BlindWarriorSven」がEVO2023『スト6』のプール予選で勝利し会場大盛り上がり。サウンドアクセシビリティ機能を利用しエドモンド本田が対空とコンボを華麗に決める

                アメリカ・ラスベガスにて2023年8月4日から8月6日にかけて開催される世界最大級の格闘ゲーム大会「Evolution Championship Series 2023(以下EVO 2023)」の『ストリートファイター6』の第1プール予選が現在開催中だ。 多くの名試合が生まれる中、オランダ出身の格闘ゲームストリーマーBlindWarriorSvenの試合が大きな盛り上がりを見せた。 I’m so pleased for @SvenvandeWege getting the win on stage at @evo! pic.twitter.com/xuhP67G6eR — WSO Logan (@WSOLogan) August 4, 2023 BLIND WARRIOR SVEN! @SvenvandeWege #Evo2023 pic.twitter.com/U1Wdc55yrr —

                  盲目の格闘ゲームプレイヤー「BlindWarriorSven」がEVO2023『スト6』のプール予選で勝利し会場大盛り上がり。サウンドアクセシビリティ機能を利用しエドモンド本田が対空とコンボを華麗に決める
                • 非デザイナーにも知っていて欲しい「色」と「特性」 - Qiita

                  はじめに 数年前から「デザインの民主化」「非デザイナー向けの〇〇」といったワードをよく見るようになりました。それに伴い、デザイナー不在でも制作ができる便利なツールも増えてきましたね。 ReactなどのUI制作に便利なライブラリが広く使われたり、Canvasを使ってのバナー制作を行う人も増えてきた印象があります。 一方で「たくさんあるテンプレートから何を基準に選べば良いのか分からない」「アレンジしたけど、なんだか上手くいかない」という人もいるのではないでしょうか。 「非デザイナー~」シリーズでは「知っているとちょっと得するデザインTIPS」や「話のネタになるデザイン豆知識」をお伝えしていこうと思います。 今回のテーマ「色」と「特性」 今回は色の見え方、なかでも色覚特性について書いていこうと思います。 色覚特性はさまざまな理由から、多数派とは違う色の見え方・感じ方をする状態のことを言います。色

                    非デザイナーにも知っていて欲しい「色」と「特性」 - Qiita
                  • 障害者への差別発言相次ぐ 名古屋城復元めぐる市主催の討論会:朝日新聞デジタル

                    ","naka5":"<!-- BFF501 PC記事下(中⑤企画)パーツ=1541 -->","naka6":"<!-- BFF486 PC記事下(中⑥デジ編)パーツ=8826 --><!-- /news/esi/ichikiji/c6/default.htm -->","naka6Sp":"<!-- BFF3053 SP記事下(中⑥デジ編)パーツ=8826 -->","adcreative72":"<!-- BFF920 広告枠)ADCREATIVE-72 こんな特集も -->\n<!-- Ad BGN -->\n<!-- dfptag PC誘導枠5行 ★ここから -->\n<div class=\"p_infeed_list_wrapper\" id=\"p_infeed_list1\">\n <div class=\"p_infeed_list\">\n <div class=\"

                      障害者への差別発言相次ぐ 名古屋城復元めぐる市主催の討論会:朝日新聞デジタル
                    • デザイナー向けに行なったHTML勉強会の資料を公開します|sakito

                      今回はChatwork株式会社のデザイナー向けに行なったHTML勉強会で使用した解説資料をお伝えします。私は3年ほど前からChatwork株式会社の開発のサポートやデザイン基盤活動のアドバイザーとして参画しており、その活動の一環で会を開催しました。 開催の意図と目的開催概要は@emimさんが、UI設計はHTMLの理解からというタイトルでnoteに書いてくれています。企画の意図は下記のとおりです。 企画の意図 根本としては、情報整理(情報設計)の基礎概念にHTMLがとてもマッチしている、と考えているからです。 ところが、業界的にも昨今よく聞く話ではありますが、最近意外にHTMLに触れる機会がなくプロダクト開発の現場に入る人が多いのが現実です。これは、デザイナーだけでなく、なんならフロントエンドの開発者であっても。 個人的には、HTMLはマークアップ言語であること以上に、構造化のフレームワーク

                        デザイナー向けに行なったHTML勉強会の資料を公開します|sakito
                      • 4年間、7色だけでUIをデザインし続けた話|コウノ アスヤ

                        2019年にフリーランスとして独立した時すぐに声をかけていただいて、そこからずっとUIデザイナーとして関わってきた株式会社FLINTERSが今年で設立10周年なんだそうです。それを記念して、なんとメンバーでリレーしながら133日間ブログを書き続けるチャレンジに挑戦中とのこと。今回はその101日目の記事となります。 漫画アプリ「GANMA!」漫画アプリGANMA!僕が関わっているのはGANMA!のスマホアプリです。iOS向けとAndroid向けがあり、その両方のデザインを担当しています。 オリジナルの作品ですと、最近アニメ化された山田くんとLv999の恋をするなどが有名でしょうか。作品自体はいろんな漫画アプリで読めますが、原作はGANMA!発。最新話が最速で読めるのもGANMA!だけです。 GANMA!のデザイナーはずっと僕1人だけなので、僕の思想や判断がけっこう大きめにデザインに反映される

                          4年間、7色だけでUIをデザインし続けた話|コウノ アスヤ
                        • LINE社員1,361名の"色覚に関するアンケート"

                          LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog はじめに こんにちは。フロントエンド開発センター UIT Accessibilityタスクフォース 岡﨑です。私たちは、Webサイトのアクセシビリティに関するガイドラインの策定・推進、社内に向けたアクセシビリティの勉強会やe-ラーニングを通じて、LINEとそのファミリーサービスのアクセシビリティ向上を目指しています。 色に対する配慮 アクセシビリティの国際規格となっているWCAGでは、テキストにおける色の取り扱いで以下のことが求められています。 色に依存した表現にしないこと コントラスト比を確保すること なぜ、色に対する配慮が必要なのでしょうか? 困っているのはロービジョンユーザーだけではない LINE STYLEの"Alwa

                            LINE社員1,361名の"色覚に関するアンケート"
                          • モバイルファーストのウェブデザインがデスクトップに及ぼす悪影響

                            モバイルファーストのウェブデザインは、デスクトップで閲覧する際に重大なユーザビリティ上の問題を引き起こす。長いスクロールページにコンテンツが過度に分散され、余白が広がり、画像やフォントが拡大されるため、ユーザーが情報を把握し、理解することが難しくなるのである。 The Negative Impact of Mobile-First Web Design on Desktop by Kim Salazar, Tim Neusesser and Nishi Chitale on October 13, 2023 日本語版2024年2月6日公開 最近のウェブサイトの多くは、モバイルファーストなアプローチでデザインされている。こうしたページをデスクトップデバイスで表示すると、コンテンツが過度に大きく引き伸ばされて見えることがある。画面を覆い尽くすような画像、肥大化したテキスト、過剰な余白のせいで、

                              モバイルファーストのウェブデザインがデスクトップに及ぼす悪影響
                            • ローマ字表記、ルール改定へ 実態そぐわず、約70年ぶり | 共同通信

                              ローマ字のつづり方について国が定めたルールが、約70年ぶりに改められる見通しとなった。小学校で習うローマ字もこのルールを踏まえているが、駅名や案内表示など一般社会では、英語の発音により近い別の表記が浸透しているのが実情だ。文化審議会の小委員会は、統一的な考え方を示すことも視野に検討を進めている。 ローマ字のつづりは主に、母音と子音を規則的に組み合わせる「訓令式」と、「ヘボン式」がある。例えば「し」は訓令式では「si」、ヘボン式では「shi」と表記される。「愛知」は「aiti」(訓令式)、「aichi」(ヘボン式)になる。 国は1954年、内閣告示で「一般に国語を書き表す場合」は訓令式を用いると定めた。ヘボン式は「にわかに改めがたい事情がある場合に限り」使うとした。 学習指導要領も、小学3年の国語で、ローマ字について内閣告示を踏まえた学習をするよう求めている。だが、実際には訓令式は定着せず、

                                ローマ字表記、ルール改定へ 実態そぐわず、約70年ぶり | 共同通信
                              • ウェブアクセシビリティを無料で学べる資料まとめ(10年分)|magi1125

                                こんにちは。伊原 力也(@magi1125)と申します。業務アプリケーションのデザイナー、デザインチームのマネージャー、アクセシビリティ関連のコンサルタントなどをやっています。 ウェブアクセシビリティを普及啓発する活動を始めて10年が経ちました。おかげさまで興味を持ってくれる人はかなり増えたと感じています。しかし、人が増えると声は届きにくくなります。「アクセシビリティをどこから学び始めていいかわからない」という意見も目にするようになってきました。 また、私はこれまでにアクセシビリティに関する書籍を何冊か書いていますが、専門書ってちょっと高いので、興味があるぐらいの段階で本を買うのはちょっと……という気持ちもわかります。 ということで、これまで自分が発信したり関わったりしたコンテンツのうち、ウェブアクセシビリティの理解の助けになりそうものをベストアルバム的に一度まとめてみることにしました。

                                  ウェブアクセシビリティを無料で学べる資料まとめ(10年分)|magi1125
                                • 「UIの良さ」ってのはユーザビリティだけじゃないんだよ〜UNDERTALEのUI|Yamashita Angelica

                                  この記事には、ゲーム「UNDERTALE」のネタバレが含まれます。 ネタバレによってゲーム体験を致命的に損なう可能性が高い作品です。今後プレイする予定のある方は、ぜひプレイ後にお読みください。 UNDERTALE(アンダーテール)とは、「知る人ぞ知る」と言うにしてはあまりにも有名になりすぎたインディーゲームです。2015年にPC向けに開発され、現在はSteam、XBOX、PSVITA、PS4、Nintendo Switch…と、多くのプラットフォームで遊ぶことができます。 ほぼToby Fox氏個人で開発した作品でありながら、各メディアのGOTY(ゲーム・オブ・ザ・イヤー)に多数ノミネートされており、「メタルギアやマリオが出てくる受賞ランキングに個人開発ゲームが入ってるってどういうことだよ!!!!!????!!!!!」と当時せっせとゲームスタジオで働いていた私は卒倒しそうになりました。 こ

                                    「UIの良さ」ってのはユーザビリティだけじゃないんだよ〜UNDERTALEのUI|Yamashita Angelica
                                  • 「スマホ使える前提で進めるのやめて」時刻表がQRコード掲示のみの駅が不便→デジタル"のみ"への移行は便利ではないという意見

                                    啓吾郎 @kei56 スマホが使えることを前提にする施策はちょっとブレーキをかけた方がいいです。 スマホが使えない人は置いてけぼりなのです。 レガシーシステムと言われてもラジオの方が簡便かつ強力です。 写真は時刻表がQRコードになった駅の看板。 pic.twitter.com/OHTVHUVmMb x.com/sakkurusan/sta… 2024-02-17 21:10:03 咲来さん@ @sakkurusan AMほぼ全廃で、FMに移行。聴ける範囲が狭まるといっても、radikoがあるからいいだろって声あるが。あのな、radikoには「時差」という最大の弱点があるのよ。しかも2分間以上の長い時差。 ということは、もし緊急地震速報がラジオで流れた場合。radikoで聴いてる場合は全く意味をなさないということ。大津波警報も、2分遅れは確実に命にかかわる。 なのでこの問題はそう簡単な話では

                                      「スマホ使える前提で進めるのやめて」時刻表がQRコード掲示のみの駅が不便→デジタル"のみ"への移行は便利ではないという意見
                                    • [みんなのケータイ]混迷を極めるdアカウント

                                        [みんなのケータイ]混迷を極めるdアカウント
                                      • 羽田で電車に乗った人が送ってきたヘルプ、関東の電車の分かりづらさが示されていた

                                        永山久徳 @h_nagayama 羽田で京急乗った人からヘルプメッセージ。これでは日本人でも地方民にはどこに行くのか分からん。せめて東京・千葉方面か横浜方面かだけでも車内表示できないのか。 pic.twitter.com/ccozg9jRU8 2024-02-20 22:23:38

                                          羽田で電車に乗った人が送ってきたヘルプ、関東の電車の分かりづらさが示されていた
                                        • デジタル庁が公開している『ウェブアクセシビリティ導入ガイドブック』がお勧めらしい/「電車内で動画を見たいのにイヤホンを忘れた」ときにも役立つみんなのためのデザイン

                                            デジタル庁が公開している『ウェブアクセシビリティ導入ガイドブック』がお勧めらしい/「電車内で動画を見たいのにイヤホンを忘れた」ときにも役立つみんなのためのデザイン
                                          • 『ストリートファイター6』盲目のプレイヤーが現行最高ランク「マスター」に到達。困難を乗り越え辿りついた高み - AUTOMATON

                                            『ストリートファイター6』において、あるプレイヤーが日本時間9月26日、エドモンド本田を操作し、本作における最高位のランクである「マスター」に到達した。そのプレイヤーはなんと全盲のゲーマーであった。 『ストリートファイター6』は、カプコンより発売されている対戦格闘ゲーム『ストリートファイター』シリーズの最新作だ。本作は、コマンドを入力して操作する従来のモードであるクラシックタイプに加え、簡易的な入力で必殺技を使用できるモダンタイプというモードを採用している。そしてほかにも『ストリートファイター6』には「サウンドアクセシビリティ」という機能が実装されている。 ゲームをプレイするには基本的に画面の情報が欠かせない。しかし視覚に障がいを持つ人は画面からの情報を得ることができない。そういった人も同じようにゲームをプレイできるような機能が本作の「サウンドアクセシビリティ」となる。相手との距離に応じて

                                              『ストリートファイター6』盲目のプレイヤーが現行最高ランク「マスター」に到達。困難を乗り越え辿りついた高み - AUTOMATON
                                            • 「もうWN03と書く日々は終わったのだ…」サイゼリヤから注文用紙が消えQRコードになっていてたがUIが直感的かつ誘導もスムーズだった

                                              kaoruww @kaoruww サイゼリヤの新オーダーシステムの話|井登友一 note.com/corobutika/n/n… 画面遷移の様子。自分は卓上の説明をほぼ読まずに入力したが迷うポイントはなかった。最後まで読まなかったから、会計時にテーブルの紙の伝票をそのままレジに持っていき支払ったので会計ボタン押さなかったな。問題なかった。 2023-11-23 12:18:20 リンク note(ノート) [UX小話]サイゼリヤの新オーダーシステムの話|井登友一(YuichiInobori) あたしは自他ともに認めるサイゼリヤエンスージアストなんですが、昨夕、出先でWiFiが使いたくなって近くにあったサイゼリヤに立ち寄った際、なんとオーダーシステムが顧客自身のスマホを使ったセルフオーダーシステムに変わっていました。 (店員さんにお聞きしたところ、現時点では全国で数店舗だけの試験導入段階との

                                                「もうWN03と書く日々は終わったのだ…」サイゼリヤから注文用紙が消えQRコードになっていてたがUIが直感的かつ誘導もスムーズだった
                                              • テストピラミッド万歳 | POSTD

                                                クイックサマリー:「テストピラミッド」は、自動テストをUI、サービス、ユニット単位に整理することで、開発に自動テストを組み込む方法を示すために作成されました。2012年に定義されて以降、このモデルは次第に使われなくなってきたように思いますが、本当に廃れてしまったのでしょうか。この記事では、最新のテスト戦略を紹介するとともに、今日のソフトウェア開発におけるテストピラミッドの関連性を検討します。 筆者の同僚であるジャン・フィリップ・ピエトルチェクが、かつてコードを書く開発者の責任について、次のように述べました。 none「我々の仕事の成果を最終的に使用する人々は、(中略)我々がただ最善を尽くすだけでなく、実際に機能するものを作ることを期待しているのです。」 — ジャン・フィリップ・ピエトルチェク 彼の言葉は、私たちが書くコードをそれに依存する人々の観点からとらえている点で非常に印象に残りました

                                                  テストピラミッド万歳 | POSTD
                                                • 見えない人はWebをどう閲覧? 本紙サイトの課題にがくぜん、求められる「不十分と認める勇気」【動画も】:東京新聞 TOKYO Web

                                                  見えない人はWebをどう閲覧? 本紙サイトの課題にがくぜん、求められる「不十分と認める勇気」【動画も】

                                                    見えない人はWebをどう閲覧? 本紙サイトの課題にがくぜん、求められる「不十分と認める勇気」【動画も】:東京新聞 TOKYO Web
                                                  • 画面によってボタンの意味を変えるUIを作るやつは何をやらせてもダメ。(温度を上げようと思って+を押したら次の画面では-だった。何を言っているのかわからねーと思うが以下略)

                                                    フ兄さん@技術士の勉強開始 @fcneet 画面によってボタンの意味を変えるUIを作るやつは何をやらせてもダメ。 (温度を上げようと思って+を押したら次の画面では-だった。何を言っているのかわからねーと思うが以下略) pic.twitter.com/K4NwCf4KK7 2023-11-14 09:39:02

                                                      画面によってボタンの意味を変えるUIを作るやつは何をやらせてもダメ。(温度を上げようと思って+を押したら次の画面では-だった。何を言っているのかわからねーと思うが以下略)
                                                    • UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ

                                                      デザインシステムとは、サービス開発する上で必要となるデザインの概念、スタイルガイド、コンポーネント集などで構成されるデザインのルールです。 Salesforce.comの「Lightning Design System」が2015年に登場して以来、多くの企業がこのデザインシステムを導入するようになりました。 プロトタイピングツールで有名なUXPinが提供するデザインシステムプラットフォーム「adele」では、90個以上(2019年12月現在)ものデザインシステムが公開されています。その企業のラインナップを見ると、大手ITベンダー、SaaSベンダーのみならず、自治体、金融機関、大学など多くの業界で、組織のブランド確立のために、デザインシステムを活用していることが分かります。 GoogleやAppleが提供するデザインシステムは、既に多くのブログで語りつくされていますが、その他の企業でも素晴ら

                                                        UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ
                                                      • ケンタッキーフライドチキン 公式モバイルアプリ、公式Webサイト(2024年3月末まで提供) | チームラボ

                                                        アプリ インフラ構築 保守運用 ケンタッキーフライドチキン 公式モバイルアプリ、公式Webサイト(2024年3月末まで提供) ケンタッキーフライドチキン(以下、KFC)の公式モバイルアプリ、及び、公式Webサイトをリニューアル。企画、運用設計、UI/UX設計、デザイン、開発を担当しました。 今回リニューアルでは、ユーザーにより直観的に情報を提供できるUI/UXと、それを実現可能なシステムをクライアントとともにアイデアを出し合いながら設計しました。公式モバイルアプリと公式Webサイトの更新方法を一元化し、フロントエンドからバックエンドまで、一貫した設計・管理・運用とデータ更新を双方で共通化することで、日々の運用負荷を軽減し、ユーザーに素早く情報を届けることを可能にしました。 また、赤と白を基調とした、KFCのブランドイメージをより印象付けるデザインを企画しました。 *2024年3月末まで提供

                                                          ケンタッキーフライドチキン 公式モバイルアプリ、公式Webサイト(2024年3月末まで提供) | チームラボ
                                                        • なぜ <div> に onClick がダメなのか?

                                                          ■ はじめに <div>要素にonClickを渡すべきではない、ということ聞いたことはないでしょうか? ただ、なぜ渡すべきでないのか? 理解してなかったので今回調べてみました。 サンプルコード 今回動作確認に利用したサンプルリポジトリのコードはReactで書いています。 ■ 結論:<div>にonClickを定義するのがなぜダメなのか? ユーザーにとって操作性の低いボタンになってしまうから、です! 要するに UX が悪くなってしまうから! その理由を解説していきます! ■ 操作性の低いボタンになってしまう理由 大きく3つあると考えています。 div要素は focus を持たないから returnキー, spaceキーをonClickに変換しないから スクリーンリーダーが認識しない要素だから ◎ focus を持たないから <div>要素はfocusを持ちません。 なので、tabキーで要素に

                                                            なぜ <div> に onClick がダメなのか?
                                                          • 「私の赤とあなたの赤は違う色?」誰もが一度は考える疑問に色覚細胞の研究が意外な発見 - ナゾロジー

                                                            私が見ている赤は、他人にも同じような赤として認識されているのか? 私が赤と認識しているものは、別の人にとっては青である可能性はあるのか? これらは誰もが人生で一度は考える疑問だと言われており、古代から哲学者たちの頭を悩ませてきました。 個々の人が持つ主観的な感覚体験のことを「クオリア」と呼びますが、自分のクオリアと他人のクオリアが同じであるかどうかを証明することは困難だからです。 しかし米国のジョンズ・ホプキンス大学(JHU)で行われた研究により、私たちの網膜に存在する色覚細胞がどのような仕組みで生成されるか、またどんな比率で存在するかが確かめられ、この長年の哲学的疑問の答えとなり得る結果が得られました。 研究者たちは「正常な色覚を持つ人たちの間でも、同じリンゴに対して色が少し違って見える可能性がある」と述べています。 今回はまず実験の背景を解説しつつ、次ページ以降でクオリアに関連する発見

                                                              「私の赤とあなたの赤は違う色?」誰もが一度は考える疑問に色覚細胞の研究が意外な発見 - ナゾロジー
                                                            • アクセシビリティ | SmartHR Design System

                                                              アクセシビリティとはアクセシビリティは、サービスや情報をどんな利用者も円滑に利用できるかの度合いです。 アクセシビリティが高いほど、より多くのユーザーが円滑に利用でき、アクセシビリティが低いほど、より多くのユーザーが利用できないということです。 アクセシビリティ向上は、障害当事者だけでなく、さまざまな環境や状況にいる人、高齢者、日本語以外を得意な言語とする人など、すべての人のためのものです。人だけでなく、サービスや情報にアクセスする機械(ロボット)もアクセシビリティの影響を受けます。 SmartHRの開発方針SmartHRは「well-working 労働にまつわる社会課題をなくし、誰もがその人らしく働ける社会を作る。」というミッションを掲げ、働くすべての人を後押しするプラットフォームをつくっています。 誰もがその人らしく働ける社会を実現するため、SmartHRはアクセシビリティの向上に取

                                                                アクセシビリティ | SmartHR Design System
                                                              • アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1) - 水底の血

                                                                ツイッターでアクセシビリティ向上日誌2【目視試験編】‐Akira Tsuda Portfolio and Blogというのを見かけて、そういえばアクセシビリティチェックって何をどうしているのかという話をウェブ上でほとんど見かけない(というか自分は知らない)ので、思い切ってチェックの過程や考え方を書いてみようかなと。 チェック対象のサイトを作った@HeldaForStudy氏に尋ねたところ、題材として使ってよいという返事をいただいたので、「アトリエ金工やまぐち」のサイト1ページをチェックしてみることにします。 対象ページはBasic認証がかかっているので、アクセシビリティ向上日誌1【各種ツール評価編】からたどってください。 @HeldaForStudy氏はレベルはA*1でチェックしたとのことなので、チェック基準はWCAG 2.1レベルAでチェックすることにしましょう。 わたしは普段はCOB-

                                                                  アクセシビリティチェックってどうやってるの?ということで、実際にやってみた。(その1) - 水底の血
                                                                • 全盲のeスポーツプレイヤーたちが開発に協力。『ストリートファイター6』のアクセシビリティ向上はどう実現した? | CINRA

                                                                  近年のビデオゲームの進化はめざましい。技術の発達で、現実と見まがうようなリアルなグラフィックのゲームがいくつもつくられ、またオンラインを介して国籍や言葉を超えた多様なプレイヤーが仮想世界の冒険や戦いや出会いを楽しんでいる。 しかしそれと並行して、じつは進化し続けているのがユーザーのアクセシビリティ。障がいなどがある人でもゲームを楽しめる工夫の進化だ。その最前線を突き進んでいるのが人気格闘ゲームの最新作『ストリートファイター6』だ。同作では、eスポーツを介した障がい者の就労支援を行なう株式会社ePARAと共同し、対戦相手との距離やお互いのコンディションをサウンドで把握する工夫などが随所に盛り込まれている。 今回、同作を制作したカプコンからディレクターの中山貴之、サウンドチームの渥美格之進、小池義規、ePARAから代表取締役の加藤大貴、ブラインドeスポーツプレイヤーのNAOYA、今回の共同プロ

                                                                    全盲のeスポーツプレイヤーたちが開発に協力。『ストリートファイター6』のアクセシビリティ向上はどう実現した? | CINRA
                                                                  • 「推測されやすい」パスワードを入力させないためにフロントエンドエンジニアができること

                                                                    2023/08/26(土)に開催された Frontend Nagoya #11
のセッションで使用したスライド資料です。

                                                                      「推測されやすい」パスワードを入力させないためにフロントエンドエンジニアができること
                                                                    • 新山口駅にある透明なボックスに入った消火設備のデザインと機能性が秀逸だと話題になるも賛否両論、さまざまな意見が集まる

                                                                      佐野五月|でざいん姉さん @irohazum_s 心はずむ、みらいを共創する irohazum代表|ブランディングデザイナー|事業、プロダクト、人の想いを世の中に伝える架け橋になりたいです|本・陶器・歴史・文化・旅・ゲーム・ロックが大好きです|ONLINE上司チーフ|姉さんと呼んでね|サブ @irohazum_ss|#irohazum_Works x.gd/p8PuM 佐野五月|でざいん姉さん @irohazum_s 設置場所は新山口駅で、この写真は山口県へ旅行へ行った時のものです。 ですので普段の新山口駅についてわかりかねることをご了承ください🙏 設置場所について、このボックスは新山口駅の「新山口駅南北自由通路」に設置されています。横幅が広い通路で下記URLから見ていただけるとイメージ沸くと思います。ボックスがある写真もあります。 x.gd/E1pWC ここから私の感想ですが、人の流れ

                                                                        新山口駅にある透明なボックスに入った消火設備のデザインと機能性が秀逸だと話題になるも賛否両論、さまざまな意見が集まる
                                                                      • 2024年のWebアクセシビリティ | gihyo.jp

                                                                        あけましておめでとうございます。株式会社ミツエーリンクスの中村直樹です。昨年と同じく、2023年のWebアクセシビリティに関連する出来事を振り返りつつ、2024年のWebアクセシビリティの展望について俯瞰していきたいと思います。 WCAG 2.2の勧告とWCAG 2.1の更新 長らく待ちわびていたWCAG 2.2について、2023年10月5日付けでようやくW3C勧告(Recommendation)となりました(日本語訳はまだありません。詳細は後述の「臨時WGの活動状況」を参照⁠)⁠。また、これと連動する形でWCAG 2.1(日本語訳)の勧告も改めて発行されました。 今回のWCAG 2.1の更新では、達成基準4.1.1構文解析に注記が設けられています。これにより、WCAG 2.2で削除された達成基準4.1.1の扱いについて連続性が保たれるようになっています。WCAG 2.1からの変更点は、公

                                                                          2024年のWebアクセシビリティ | gihyo.jp
                                                                        • 信号機の「音」、「通りゃんせ」から「ピヨ」「カッコー」に統一…視覚障害者の要望で

                                                                          【読売新聞】 視覚障害者向けに横断歩道で童謡「おうま」「通りゃんせ」などのメロディーを流す信号機が激減している。地域ごとに曲が違うと、青信号の合図かどうかがわかりにくいからだ。このため、「ピヨ」「カッコー」といった鳥の鳴き声式への切

                                                                            信号機の「音」、「通りゃんせ」から「ピヨ」「カッコー」に統一…視覚障害者の要望で
                                                                          • 東急東横線横浜駅のトイレの設計は悪手?「こういう分け方と色使いをすると人間って先入観で左が男子トイレだと思い込んでしまう」

                                                                            Ryo Nakagome @moraqualitas @saru787 仮に日本人でも、こういう場合先入観で間違えることってあるんですよね。 店員がいるレジは受付可能である。みたいな。 そういうところを考慮しない設計者がいるんだろうなぁと思います。 2024-02-16 16:52:12 Ryo Nakagome @moraqualitas なんかいろんなこと言われてるので何が言いたかったかご説明すると ピクト見りゃわかるだろ、文字見りゃわかるだろということではなく 一つの区画の入り口でこのような分け方と色使いをすると、人間って先入観で左が男子トイレだと思い込んでしまうんですね。 実際間違えて引き返す人間結構いたので。 2024-02-17 08:38:09 Ryo Nakagome @moraqualitas 改札側から入ると男子トイレが脇の方にはあるのは当然見えると思いますが、 ホーム

                                                                              東急東横線横浜駅のトイレの設計は悪手?「こういう分け方と色使いをすると人間って先入観で左が男子トイレだと思い込んでしまう」
                                                                            • まだ日本ではWebアクセシビリティが義務化されません(2024年4月から6月の時点では)

                                                                              筆者は、より多くのWebサイトやWebサービスが、より高いアクセシビリティをもつものになることを強く願っています。 (2024/02/04追記)もう少しわかりやすく書き直したものを投稿しました Webアクセシビリティと合理的配慮 「2024年からWebアクセシビリティ対応が義務化される」というようなことが書かれたWeb上の記事が増えているようです。 しかし、2024年1月現在、日本で「Webアクセシビリティ」について法的な義務が発生している・または2024年内に発生するようになる法的な根拠はおそらくありません。法律の改正が施行され、「やったほうがいい」度合いは高まっていると解釈できますが、「Webアクセシビリティは義務です」とまでは明言できないはずです。 ところが、「アクセシビリティ 義務化」などでWebを検索すると、「2024年にアクセシビリティが義務化します」と説明していたり、あるいは

                                                                                まだ日本ではWebアクセシビリティが義務化されません(2024年4月から6月の時点では)
                                                                              • freee、デザインシステム「vibes」を公開 アクセシビリティをはじめとするフロントエンド開発のノウハウが満載 | プレスリリース | フリー株式会社

                                                                                freee、デザインシステム「vibes」を公開 アクセシビリティをはじめとするフロントエンド開発のノウハウが満載 ■マジ価値サマリー(このお知らせでお伝えしたいこと) ・freeeのアクセシビリティをはじめとするフロントエンド開発のノウハウが詰まったデザインシステム「vibes」を公開します ・あらゆる組織でシステム開発に携わるエンジニアやデザイナーの皆様に、「vibes」を利用してシステムを構築いただく、またはコード等を参照いただくことで、社会全体としてアクセシビリティ向上の取り組みが広がることを目指しています freee株式会社(本社:東京都品川区、CEO:佐々木大輔、以下「freee」)は、freeeがこれまで培ってきたアクセシビリティをはじめとするフロントエンド開発のノウハウが詰まったデザインシステム「vibes(読み:ヴァイブス)」を公開しました。本デザインシステムを公開するこ

                                                                                  freee、デザインシステム「vibes」を公開 アクセシビリティをはじめとするフロントエンド開発のノウハウが満載 | プレスリリース | フリー株式会社
                                                                                • LCHは、UIにベストなカラースペース|hirotoarakawa

                                                                                  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(明度

                                                                                    LCHは、UIにベストなカラースペース|hirotoarakawa