タグ

uiに関するbopperjpのブックマーク (117)

  • 『オブジェクト指向 UI デザイン』 に書かれていないもの|ai

    私は普段、家の脱衣所で仕事をしているのだが、デスクの隣にある縦型洗濯機がちょうどいい高さということもあり、そこにいつも仕事中に参照するを積んでいる。洗濯機の蓋もまさか、漬物石みたいにが置かれることになるなんて思ってもみなかっただろう。それらのは主に、その時々の仕事に関係するものとか、読みかけのものだったりするから、頻繁に入れ替わっていくのだけど、ずっと置いているお気に入りが、いくつかある。そのうちの一つが、OOUI こと『オブジェクト指向 UI デザイン 使いやすいソフトウェアの原理』- ソシオメディア株式会社、上野 学、藤井 幸多(著) 上野 学(監修)だ。 出版されてから 3 年以上たっても、私は時折このをふと、開いてみてはいつの間にか没頭し、そういえば私は仕事をしていたんだっけな、みたいになってしまう。端的に言って大好きだ。この 3 年間で読書会も 2 度主催したことがある

    『オブジェクト指向 UI デザイン』 に書かれていないもの|ai
  • OOUI実践のコツ | 新規サービスに導入してわかった、5つのこと|スマートキャンプ デザインブログ

    こんにちは、スマートキャンプ デザイナーの柿澤です。 現在、新規サービスのローンチに向けてデザインをしているのですが、その際にOOUI(オブジェクト指向ユーザーインターフェース)を実践する機会がありました。 OOUIの概念自体は前から知っていたのですが、業務として使ったことはなく、実際に取り組んでみるとを読むだけでは理解することのできなかったこと、実践する中で躓いたことやその際の考え方などが勉強になったので、記事ではそれらのことについて紹介していこうと思います。 そもそもOOUIとはOOUIとはユーザーの目当てとなるオブジェクト(もの、名詞)を中心にUIを設計することで、タスク(やること、動詞)をもとに設計するよりも使いやすく開発効率の高いUIを構築することができる設計手法になります。(ざっくりですみませんw) 今回の記事では手法論は割愛させていただきますので、ご興味ある方はぜひ専門書

    OOUI実践のコツ | 新規サービスに導入してわかった、5つのこと|スマートキャンプ デザインブログ
    bopperjp
    bopperjp 2023/08/28
  • なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita

    なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】UXUIDesignUIデザイン画面設計 1.はじめに エンジニアの私がデザインを気で勉強した結果、デザイナーとエンジニアはそもそも思考が大きく違っているということがわかりました。 今回は「それ」をデザインに苦手意識のあるエンジニア方にも理解してもらえたらと思い、わかりやすくまとめてみました。 2.アプリの画面デザインを考えてみよう まず、こんなアプリを考えてみてください。 フィットネストレーナーが使うアプリ トレーニングルームでお客様とお話しながら使う 端末はタブレット そして 会員の個人情報確認 前回までのトレーニング状況の確認 次回の予約受付 といったことをします。 使える情報としては、こんな感じです。 あなたならどう画面デザインをするか、もしお時間があったら考えてみてください。

    なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita
    bopperjp
    bopperjp 2021/12/10
    エンジニアだと、「押しづらいし見づらいよね」まではわかるけど、フォントサイズと情報のレイアウトをどうやればいいのかがわからないのよ。。「優先順位で強弱をつけながら配置」の部分。
  • Material-UIを使ってテックタッチのデザインシステムを実現した話 - Techtouch Developers Blog

    フロントエンドエンジニアのshioriです。 テックタッチでは、約1年前からアプリケーションを丸ごと作り直す再設計プロジェクトを進めており、そのタイミングでデザインシステムを導入しました。 この記事では Material-UI を使ったデザインシステム導入の経緯や導入して良かったことなどを紹介したいと思います。 なぜデザインシステムを導入することにしたのか デザインシステムができあがるまでの流れ スタイルの共通化 コンポーネントの実装 Material-UI を使う上で苦労したこと 導入して良かったこと さいごに なぜデザインシステムを導入することにしたのか テックタッチのプロダクトはデザインファーストで開発を行なっています。デザイナーが FigmaUI/UX をデザインし、それをエンジニアが実装するという流れです。 また、テックタッチは Material Design 等のデザイン

    Material-UIを使ってテックタッチのデザインシステムを実現した話 - Techtouch Developers Blog
    bopperjp
    bopperjp 2021/03/11
  • 今日からできるUXデザイン

    2019/05/08に株式会社gumi様でプログラマ向けに行ったデザイン講義のスライドです。 難しく考えがちなUXデザインですが、今できることからやってこうぜって話です この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。 第一回「これだけ守れば見やすくなるデザインの基礎」はこちら https://speakerdeck.com/kinakobooster/koredakeshou-rebajian-yasukunarudezainfalseji-chu 第二回「UIデザインをはじめよう」はこちら https://speakerdeck.com/kinakobooster/uidezainwohazimeyou ※訪問講座のご案内※ あなたの会社に話しに行きます。料金表はこちら https://xemono.life/#/workw

    今日からできるUXデザイン
  • UIデザインをはじめよう

    2019/04/23に株式会社gumi様で行ったデザイン講義のスライドです。 UIデザインをはじめるために必要な知識を解説しました。 (予告から内容はかなり変わりました) 第一回「これだけ守れば見やすくなるデザインの基礎」はこちら https://speakerdeck.com/kinakobooster/koredakeshou-rebajian-yasukunarudezainfalseji-chu 第三回「今日からできるUXデザイン」はこちら https://speakerdeck.com/kinakobooster/jin-ri-karadekiruuxdezain この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。 ※訪問講座のご案内※ あなたの会社に話しに行きます。料金表はこちら https://xemono.life

    UIデザインをはじめよう
  • これだけ守れば見やすくなるデザインの基礎

    2019/04/18に株式会社gumi様で行ったデザイン講義のスライドです。 デザインとは何か?デザイナーは何を考えてデザインを作っているのか? という話から、実際にデザインを評価・検討するための言葉を紹介しています。 この 作品 は クリエイティブ・コモンズ 表示 - 改変禁止 4.0 国際 ライセンスの下に提供されています。 第二回「UIデザインをはじめよう」はこちら https://speakerdeck.com/kinakobooster/uidezainwohazimeyou 第三回「今日からできるUXデザイン」はこちら https://speakerdeck.com/kinakobooster/jin-ri-karadekiruuxdezain ※訪問講座のご案内※ あなたの会社に話しに行きます。料金表はこちら https://xemono.life/#/workwith/co

    これだけ守れば見やすくなるデザインの基礎
  • 画面をデザインするということ - Qiita

    この記事は社内の勉強会で話した内容を再編したものです。 私自身はPC/ブラウザ/スマホのアプリ開発をしている1エンジニアにすぎないのですが、対客や要件定義から開発、運用、そしてUIのデザインを担当しており、自分なりに伝えられるものがないかと試みたものです。 デザインとは デザインとは単に見た目だけの話ではなく、「ビジネス」と「ユーザーが得る体験価値」から始まり、それを実データと結びつけながら人の認知を通してどう見せるのかという作業です。 始まりの部分は最近だとUXデザイナー、終わりの部分はUIデザイナーとかグラフィックデザイナーとか呼ばれるような人の仕事です。そしてそれらを形にするのがエンジニアです。 画面を設計するまでの作業 ギャレットのUX5段階モデルに従って、どういったことを考えないといけないのか確認します。 (実際にUX5段階モデルを意識して仕事してるわけではありませんが、何かしら

    画面をデザインするということ - Qiita
    bopperjp
    bopperjp 2020/09/16
  • UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ

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

    UIデザイナーが知っておきたい海外の優れたデザインシステム17選 | ベイジのUIラボ
    bopperjp
    bopperjp 2020/06/17
  • 管理画面のUIデザインにおける20の改善ポイント | ベイジのUIラボ~業務システムとSaaSのUIを考える

    私たちの日常業務で使われる管理画面は、大量の情報と複雑な機能で構成され、利用難易度が高い傾向にあります。検索性の乏しい管理画面の一覧から1つの情報を見つけるために、どれだけの時間を費やしているでしょうか。 1億円の工数をかけて開発した機能も、低品質なデザインでは、機能の存在に気付かれなかったり、間違って使われたりと、期待した業務コストの削減に繋がりません。これでは、1億円を捨てたようなものです。 使い勝手の良くないデザインは、ユーザーだけではなく、開発者にも悪い影響を及ぼします。複雑な構造と分かりにくい操作体系の管理画面は、開発やテストの手間を増やし、その後の機能拡張も難しく、改修コストも増大します。 これらのリスクを抑えるためには、UIデザインの基原則を理解し、適切に管理画面を設計することが重要です。 私たちは管理画面のUIデザインの改善やリニューアルを手掛けることも多いのですが、その

    bopperjp
    bopperjp 2020/06/17
  • 『UX原論』の刊行

    2018年の秋に企画を立て、その年の初冬から執筆を始めた『UX原論』が2020年1月にようやく脱稿し、2020年4月28日に販売されることになったので、この場をお借りして、少しPRさせていただきたい。 黒須教授 2020年4月27日 筆者の出版の個人史 筆者は、これまで、ユーザビリティやUXに関連するまとまった書籍として、 黒須正明、伊東昌子、時津倫子 (1999) 『ユーザ工学入門―使い勝手を考える・ISO13407への具体的アプローチ―』、共立出版 ユーザビリティハンドブック編集委員会 (2007) 「ユーザビリティハンドブック」、共立出版 黒須正明 (2013) 『人間中心設計の基礎』、HCD ライブラリー第 1 巻、近代科学社 Kurosu, M. (2016) “Theory of User Engineering”, CRC Press を出してきたので、まずそれについて説明し

    『UX原論』の刊行
  • 僕が今まで愛してやまなかったUI達について語る|Goodpatch Blog グッドパッチブログ

    この記事はGoodpatch UI Design Advent Calendar 2019の18日目の記事です。 こんにちは。UIデザイナーのnaoです。僕は今こうやって仕事としてUIデザインについて接していますが、同時にいちユーザーとして数々の素晴らしいUIデザインに触れてきました。初めて触れたiPhone3GSが発売された2009年から約10年間数々のiOSアプリケーションをインストールしては削除し、中でも特に機能性に長け優れた外観を持つアプリケーションは僕の愛でるUIとして使わない物でも保持してきました。 この10年間、僕のポケットには無限の可能性を秘めたアプリケーション達が入っていてそれらは、晴れの日でも雨の日でも、楽しい時も悲しい時も僕を支えてくれました。はい、こんなエモい文章ではないのでご安心ください。 このAdvent Calendarの記事ではそんな愛してやまなかったiOS

    僕が今まで愛してやまなかったUI達について語る|Goodpatch Blog グッドパッチブログ
    bopperjp
    bopperjp 2019/12/19
    Goodpatch らしいエントリ
  • iOS vs. Android App UI Design: The Complete Guide

    UI Course UX Course LP Course Blog Tools Data Visualization Color Picker Accessible Color Generator Gradient Generator Interactive Typography Tutorial Design Hacks If you’re designing both an iOS and an Android (Material Design) version of an app, this guide is your new best friend 😎. We’re going to cover the most relevant differences between iOS and Android for UX/UI designers. If you’ve created

    iOS vs. Android App UI Design: The Complete Guide
  • OOUI社内勉強会を開催しました - 弥生開発者ブログ

    こんにちは、@torimizunoです。 10月になってHiGH&LOWの新作映画が公開されたことが嬉しく、強く生きているこの頃です。 最近Misocaのデザインチームでは、全6回に渡りOOUIの社内勉強会を行いました。 その後メンバーでオブジェクトについて議論する機会が増えたり、思考やアウトプットに効果を感じているので、どのような目的や流れで勉強会を実施したのかを共有したいと思います。 目的 OOUI(オブジェクト指向ユーザーインターフェース)について、雰囲気理解でなく、個々が理解して考え、UIに落とし込む能力を鍛えるため勉強をする。 知見が高まってきたら、社内でのオブジェクト指向を親会社 (弥生株式会社)との共同プロジェクトにも発展させていきたい。 実施方法 1回1時間の全6回で実施 社内デザイナーは共通理解度を深めるため、基的には参加 デザインパートナーの方や社内メンバーは自由参加

    OOUI社内勉強会を開催しました - 弥生開発者ブログ
    bopperjp
    bopperjp 2019/11/03
  • 優れたダッシュボードをデザインするための10のガイドライン | UX MILK

    Neilは、イギリスのAstraZenecaで働くUXデザイナーです。現在さまざまなUXデザインプロジェクトを率いています。 もしあなたがプロの自転車競技に詳しければ、「アシスト(Domestique)」という用語を聞いたことがあるでしょう。馴染みがない人に向けて説明すると、アシストとは自転車競技のチームにおける選手の役割を指します。「Domestique」はフランス語で「下僕」という意味です。 アシストの選手は、水のボトルをチームの車から集めてほかのチームメイトに渡すという役割を担っています。また、チームの車が近くにいないときに先頭選手の自転車が故障したら、自分の自転車や予備のタイヤを渡します。さらに、遅れているメンバーがいれば、先頭集団に追いつくまで彼らを牽引し、追いついたら自分はペースを落とします。このようにアシストの選手は無欲にひたすら奉仕し続けます。決してアシスト自身がレースに

    優れたダッシュボードをデザインするための10のガイドライン | UX MILK
  • Wantedly(ウォンテッドリー)はたらくを面白くするビジネスSNS

    Wantedlyは、運命のチームや仕事に出会えたり、人脈を広げ、ビジネスの情報収集に使えるビジネスSNSです。

    Wantedly(ウォンテッドリー)はたらくを面白くするビジネスSNS
  • モードレスはどこから来たか – オブジェクト指向UIの起源 – | Backdrop

    いや、「モードレスはどこから来たか」ではなく、来の疑問は「モードはどこから来たか」なのだ。なぜなら自然界にモードはないから。 モードは何もないところに生まれる形だ。混沌に生じた秩序だ。例えばファッションがそう。一般的にモードという言葉は、新しい流行や様式を指す。そして文化的な多様性と進化を促す力として肯定的に受け取られている。つまりモードはデザイン性の証なのだ。 しかしユーザーインターフェースデザインの分野、特にコンピュータソフトウェアの操作性に関するテーマにおいては、モードはほとんどすべてのシステムが宿している原罪として、解決すべき問題として扱われる。 なぜ原罪なのかと言えば、コンピュータというものの発想自体の中に、用途によって役割を変える道具 = 無数のモードを持つ多目的な存在としての性質が込められているからだ。そしてコンピュータは、その宿命であるモードによって、生得的に使いにくいと

    モードレスはどこから来たか – オブジェクト指向UIの起源 – | Backdrop
    bopperjp
    bopperjp 2018/11/08
  • Design For User #2 - コンポーネント指向から考えるUIと設計 | FRESH LIVE(フレッシュライブ) - ライブ配信サービス

    アプリケーション開発におけるUI / View 層は、デザイナー都合やビジネス都合・氾濫するA/Bテストなどによって移ろいやすく、 良くない場面で スマートUI(画面駆動)開発 を進めている現状があります。 UI層のデザインや評価、アーキテクチャとの共存を行う上でますます重要度を増している粒度を小さく考える(マイクロデザイン・インタラクション) コンポーネント指向。 それにまつわる アーキテクチャ や 方法論 などをデザイナー・エンジニアそれぞれの視点から考える勉強会です。 概要 ・Atomic Design の導入・運用事例 ・組織におけるコンポーネント指向のすすめ方 ・オブジェクト指向UX(OOUX)でのコンポーネントの考え方 ・UIデザインの設計・評価のフォーカス ・フロントエンド・バックエンドのアーキテクチャとUI/View層の関係 登壇内容・スピーカー 1. メンタルモデルから紐

    Design For User #2 - コンポーネント指向から考えるUIと設計 | FRESH LIVE(フレッシュライブ) - ライブ配信サービス
  • オブジェクト指向UX | POSTD

    (注:2015/11/18、記事およびタイトルを一部修正いたしました。) CNN.com で働いていた2012年6月に、大統領選挙投票日の夜のユーザエクスペリエンス(以後UX)のデザインを任されました。私はそれからの6カ月間を投票日の夜のための仕事に専念しました。しかし、仕事が成功するかしないかは、選挙結果に関係はありませんでした。私が懸念していたのは、情報の見つけやすさやデータの見やすさ、canvasでのオブジェクトの変形、そして一体どのようにしたら、iPhoneでマウスオーバーのフライアウトが動作するのかでした。CNN.com史上初めてWebデザインをレスポンシブにすることにしたのです。さらに史上初めて私が、その デザイン を担当することになったのです。 大きな賭けでした。CNN.comにとって大統領選挙投票日の夜と言えば、スーパーボウル(プロアメリカンフットボールの優勝決定戦)の日曜

    オブジェクト指向UX | POSTD
  • ソシオメディア | OOUI – オブジェクトベースのUIモデリング

    最近、OOUX という言葉を見聞きしました。これはオブジェクト指向の利用者体験(Object-Oriented User Experience)のことで、いくつかの記事を読んだところ、アプリケーション設計において画面とデータを対応づける際にオブジェクトを手掛かりにするという方法論のようです。つまり OOUX は「オブジェクトベースのUIモデリング」と言い換えることができそうです。そうすると実は以前からそのようなデザイン手法はあり、「OOUI(オブジェクト指向ユーザーインターフェース)」と呼ばれていたのです。最近になって OOUX という言葉が使われるのは、OOUI のことを知らなかったか、もしくは流行語である「UX」を用いた方がかっこいいと考えたからではないでしょうか。 「オブジェクトベースのUIモデリング」というデザイン手法は、GUI アプリケーションをデザインする際の基的なテクニック

    ソシオメディア | OOUI – オブジェクトベースのUIモデリング
    bopperjp
    bopperjp 2018/11/06