タグ

UIとDesignに関するiishunのブックマーク (6)

  • Design Systemへの取り組み 〜Frontend編〜 | メルカリエンジニアリング

    この記事は、Mercari Bold Challenge Monthの1日目の記事です。 こんにちは、MercariのArchitectチームでDesign Systemに取り組んでいる@usagi-fです。 Design Systemはただのスタイルガイドラインではなく、会社として保持するデザインフィロソフィーから実装コードに落とし込まれたUIコンポーネントまで、広い範囲をさす言葉として認知されてきています。 現在私たちは格的に構築へ着手しており、少しずつ進捗が見えてきました。この記事では主にDesign Systemにおける「UIコンポーネントの定義と実装」の部分に焦点をあて、私が担当しているWeb Frontendの事例を紹介していきます。 MercariにおけるDesign System Mercariでは将来的な組織規模の拡大に向けて様々な取り組みを行っていますが、Design

    Design Systemへの取り組み 〜Frontend編〜 | メルカリエンジニアリング
  • DarkModeのデザインを中心とした色彩設計の考え方 - くらげだらけ

    こんにちは、くだくらげです。最近ははじめてのUIデザインというを共著で書きました。 おかげさまでたくさんの人に読んでいただいて、コメントをもらえたりして嬉しいです。ありがとうございます! PEAKSさんから出版しており購入できますので、よろしければ手にとってみていただけると嬉しいです。 peaks.cc 概要 WWDC 2019で新しく発表されたiOS13でOSレベルでのDarkMode設定が搭載されることになりました。MacOSの方は以前より追加されていましたが、iOSではなかったので個別のアプリが各々対応していました。 今回、iOSにもDarkMode設定が標準搭載されたことによって、iOSアプリのダークモード対応が必然的に迫られることになって来るのではないかと思っています。 ダークモードを好んで使う人は一定数存在していて、かく言う私もダークモードを好んで使っています。目に優しいだっ

    DarkModeのデザインを中心とした色彩設計の考え方 - くらげだらけ
  • 複雑な乗換体験を直感的に! 乗換案内アプリのデザイン

    これらを鑑みると、 アプリの画面上では乗り入れ箇所で路線色が変わり、誤って降車するリスクがある 行き先が異なる複数の乗客に対して、駅員さんは「直通運転」であることはアナウンスできても「乗換不要」という案内はできない アプリの画面を見ているのは人のみ、かつ目的地まで目視できるので「乗換不要」と伝える方が有益 このような経緯から、あえて「乗換不要」としています。 手法は大事、ユーザー視点はもっと大事 文言はサービス内で表現のズレが起きないよう、用語辞典を作成しています。「ルート/経路」「電車/列車/鉄道」など。ただし意味が伝わりづらい箇所では、表現のズレを許容しています。注意しなければならないのは、このようなフレームワークや手法などを優先して、ユーザー視点を見失わないようにすることです。 ワイヤとビジュアルを並行して行うことでUX品質を高める 路線情報チームのデザイナーは、ワイヤフレームとビ

    複雑な乗換体験を直感的に! 乗換案内アプリのデザイン
  • エンジニアにオススメしたい、デザインが学べる記事10選 | Goodpatch's Blog

    こんにちは! 先日はグッドパッチ仕事図鑑【エンジニア編】を公開したところ、いつもより多くのエンジニアの方に読んでいただけたようでした。 日はエンジニアがデザインを勉強するときにおすすめの、アプリケーションデザインやインタラクションデザイン、チームデザインについて書かれた記事をまとめました!ぜひ参考にしてみてください。 1. キャンセルのキャンセル問題から考えるダイアログデザイン

    エンジニアにオススメしたい、デザインが学べる記事10選 | Goodpatch's Blog
  • Devices from Design at Meta

    Meta supports a diverse audience around the world and an equally diverse set of devices. To emphasize that in our design mocks, we redrew a range of devices to show the global diversity of the people using our products. Many of the devices come with a bitmap of the device with and without shadows. Please do not repackage and redistribute these as your own. Please see disclaimer for full details.

  • Facebook Design | What's on our mind?

    Every pixel. Every word. Every part of the experience aims to deliver on that promise.

  • 1