タグ

UIに関するyuu-yuikenのブックマーク (11)

  • Appleの新UI「Liquid Glass」を簡単に実装できる便利ツール -Liquid Glassifier

    Liquid Glassとは、2025年秋にリリースされるiOS 26に採用される新しいUIです。ガラスの光学的特性と流動性を組み合わせ、コンテンツやコンテキストに応じて変化する美しくて優雅なデザインです。 プレーンのHTMLをはじめ、ReactVueAngularなどでも動作するLiquid Glassのボタンを実装するツールを紹介します。 Liquid Glassifier Liquid Glassifier -GitHub 上の画像はアニメーションgifです。 実際の動作は、下記でお試しください。ボタンはクリックしても何も動作しないようにしています。単純な一枚のガラス板でないことが分かると思います。 Liquid Glassは、これまでのグラスモーフィズム(Glassmorphism)とは異なります。Glassmorphismはぼかしと不透明度によって奥行きを偽装していましたが、

    Appleの新UI「Liquid Glass」を簡単に実装できる便利ツール -Liquid Glassifier
    yuu-yuiken
    yuu-yuiken 2025/07/24
    半透明UI、重くてカックカクになるのが嫌なんだよな・・
  • ユニクロ公式サイトが使えません(ついでにレジも)|ブラインドライターズ

    ブラインドライターズのスタッフは9割が視覚障害者。 先日、みんなで「どうやって服を買うか」の話になりました。 マネキンの服は見えないので、コーディネートが分からない 下着を買いたいけど、店員さんの性別が分からないので声をかけづらい ロービジョンなので黒なのか紺なのかわかりにくく、店で買いづらい などと、たくさんの悩みごとがありました。 確かに、異性の店員さんに下着の相談はしにくいですよね。 タグが読めなければ、サイズも分からない。リアルでの買い物は一人ではけっこう難しそうです。 そんなときに便利なのがECサイトです。 色もデジタル表記になっていればPCが読み上げてくれるので選びやすい 下着も人に頼まなくていいので買いやすい マネキンのコーディネートは見えないので、サイトで確認したい また「リピ買いするならサイト」という意見もありました。確かに見えていないと広い店内のどこにあるのかサッパリ分

    ユニクロ公式サイトが使えません(ついでにレジも)|ブラインドライターズ
    yuu-yuiken
    yuu-yuiken 2024/06/03
    ECサイトわからんので店行ったほうが良い。通販ならZOZOで買う
  • デジタル庁デザインシステムβ版

    デジタル庁デザインシステムは、スタイリングの考え方を提供するデザイン言語、情報の視覚表現とインタラクションを具現化するUIコンポーネント、ユーザビリティとアクセシビリティを踏まえた設計や実装のためのガイドラインから構成されるデザインアセットです。 デジタル庁のミッションである「誰一人取り残されない、人に優しいデジタル化を。」の実現に寄与することを標榜し、官公庁や地方自治体などの行政機関や公共性の高い組織等のウェブサイト/ウェブアプリケーション/オンラインサービスまたはシステム等で利用することを念頭に置いて構築されています。

    デジタル庁デザインシステムβ版
  • Tremor – Copy-and-Paste Tailwind CSS UI Components for Charts and Dashboards

    React components to build charts and dashboardsReact components to build dashboards35+ fully open-source, accessible components for dashboards and charts. Built with React, Tailwind CSS and Radix UI.35+ fully open-source, accessible components for dashboards and charts. Built with React, Tailwind CSS and Radix UI.

    Tremor – Copy-and-Paste Tailwind CSS UI Components for Charts and Dashboards
  • UIデザインとUXの超基礎「UI Design & UX for ENGINEER」

    3/26/2014 @LightningSpot Shibuya - Powered by PROsheet - Designed by IMPATH

    UIデザインとUXの超基礎「UI Design & UX for ENGINEER」
  • iOSブラウザのセレクトボックスUIが使い辛すぎ問題 | キノコログ

    WEB屋さんなら、タイトルである程度察してもらえるこの問題。 昨今のWEBサイトは、スマートフォンからのアクセスがほとんどのため、デザインや操作性はスマートフォンでストレスなく使えることが最重要課題となっている。 特に、ユーザーが商品の購入を行う際に、必ず経由するであろう「フォーム」の入力。 ここがストレスなく入力できるかが、成約の肝となるのだが…。 ユーザーに入力する際に、選択肢の中から項目を選んでもらう「セレクトボックス」というものがある。 複数の選択肢の中から、ユーザーに選んでもらう、というフォームを設けたい場合は、「セレクトボックス」が最も使われていると思う。 (ラジオボタンやチェックボックスよりも癖がないため) 「セレクトボックス」とは、↓コレのことである。 今見ている端末によって、このSELECTの仕様が異なっていると思うが、iPhone端末はこんな表示になっている。 いわゆる

    iOSブラウザのセレクトボックスUIが使い辛すぎ問題 | キノコログ
  • UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ~業務システムとSaaSのUIを考える

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

    UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ~業務システムとSaaSのUIを考える
    yuu-yuiken
    yuu-yuiken 2019/12/24
    css
  • トグルスイッチの誤用をやめよう

    AnthonyはUX Movementの設立者で執筆者です。素敵なWeb体験をこよなく愛し、ユーザのために日々奮闘しています。 トグルスイッチを使うべき場合と使うべきでない場合があります。デザイナーが誤った使い方をするとユーザーの混乱とイライラにつながります。使うべきタイミングを知るには、さまざまなタイプのトグルの状態や選択肢について理解する必要があります。 文脈上の状態 vs システムの状態 トグルスイッチとトグルボタンをデザイナーは混同しがちです。両方とも状態を管理しますが、トグルスイッチとトグルボタンには根的な違いがあります。トグルスイッチはシステムの状態を管理し、トグルボタンは文脈上の状態を管理します。文脈上の状態のトグルはユーザーが見ようとしている現在の画面にのみ影響を及ぼしますが、システムの状態のトグルはアプリ全体に影響を及ぼします。 トグルスイッチを文脈上の状態のために使う

    トグルスイッチの誤用をやめよう
    yuu-yuiken
    yuu-yuiken 2019/11/21
    ON/OFFが分かりづらいっていう話かと思って開いたら違った
  • 管理画面用のレイアウトやUIコンポーネントがほとんどすべて揃った、商用利用無料のHTMLテンプレート -Stisla

    商用のプロジェクトでも無料で利用できる、管理画面・ダッシュボードのレイアウトやUIコンポーネントが揃ったテンプレートを紹介します。 このテンプレートを使用すると、管理画面・ダッシュボードで必要なコンテンツを簡単に作成できます。 Stisla 管理画面・ダッシュボードに特化されたUIコンポーネントがほとんどすべて揃ったテンプレート。 30以上のサードパーティのライブラリと統合、多くのコンポーネントを簡単に利用できます。 HTML5とCSS3で記述されており、すべてのモダンブラウザでサポートされています。 Bootstrap 4をベースに、Flexboxでレイアウトされています。 一部のコンポーネントにはより簡単にやり取りするために、JavaScript APIを使用。 MITライセンスで、商用プロジェクトでも無料で利用できます。

    管理画面用のレイアウトやUIコンポーネントがほとんどすべて揃った、商用利用無料のHTMLテンプレート -Stisla
  • むずかしすぎる!五輪大会ボランティア応募フォーム(神田敏晶) - 個人 - Yahoo!ニュース

    KNNポール神田です。 いよいよ、東京五輪の大会ボランティア募集が開始となった。 『ブラックボランティア』などとネットでいくら言われようとも、ボランティアする側が納得していれば、それはブラックなボランティアではないと思う。母国の五輪のボランティアで得られる経験は、人生のうち、何度もあるものではないからだ。 ボクが1963年の東京五輪の聖火リレーを見たのは神戸市の兵庫区だった。たった2歳であったが、あの雨の日の聖火リレーは、しっかりと脳裏に焼き付いている。だからこそ、ボランティアでも五輪に参加したいと考えている。 1963年10月神戸市兵庫区上沢通3丁目 出典:神田友治撮影11万人のボランティアが必要とされている大会ボランティアが8万人(組織委員会)、そして、都市ボランティアが3万人(東京都)の募集が昨日(2018/09/26)より開始となった。それぞれの申し込みページが公開された。 大会ボ

    むずかしすぎる!五輪大会ボランティア応募フォーム(神田敏晶) - 個人 - Yahoo!ニュース
    yuu-yuiken
    yuu-yuiken 2018/09/27
    カレンダークソワロタ
  • バッドデザイン賞を勝手にノミネートしてみた-2017年度版- - 酔いどれデザイン日誌 - Drunken Design Diary -

    忙しい年の瀬ですが、皆さま如何お過ごしでしょうか。 さて、皆さんは「グッドデザイン賞はあるのにバッドデザイン賞が無いのはおかしい」という風に思ったことはありませんか?私は職業柄、日常生活で見かけた良いデザイン事例と悪いデザイン事例を写真に撮ってストックしているのですが、その中には「当にこれギャグじゃないの?」というレベルのバッドデザインがあったりするんですよね。 良いものを良いと評価することも大切ですが、良くないものを無視するのは人類の進歩に大きな影を落としているような気さえします。ということで、勝手にアワード化してしまいました。2017と付いてますが、私が見つけたのが2017年だったというだけで製造年度などとの相関性はなく、特に意味はないです。あくまでジョークコンテンツとしてお楽しみください。 【追記】Twitterの方で一部画像が自分で撮影したものではないのでは?とご指摘頂きました。

    バッドデザイン賞を勝手にノミネートしてみた-2017年度版- - 酔いどれデザイン日誌 - Drunken Design Diary -
    yuu-yuiken
    yuu-yuiken 2017/12/07
    乱視案内板見てるとアイス食ってるやる夫が脳内で揺れてるわ
  • 1