タグ

デザインとUIに関するsnjxのブックマーク (10)

  • なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita

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

    なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita
  • やさしいウェブのためにすべきこと。英国のウェブアクセシビリティ啓蒙ポスターの日本語版が公開 | inquire.jp

    英国内務省がウェブアクセシビリティを高めるための啓蒙ポスターを発表し、日語訳も登場した。障害者にも健常者にもやさしいウェブのために、まずは「知ること」から始めたい。 この夏の参議院選挙で、重度障害者の国会議員が誕生した。快挙に喜ぶのも束の間、「国会議員が国会に登庁する」ために、参議院のバリアフリー化が進められた。 大型の車椅子で利用できるスロープや車いす用トイレの設置、パソコンの持ち込みや、人の代わりに挙手や投票を行う介助者の付き添い。一連の合理的配慮の実施を報じるニュースを通して、健常者が日頃は気づかない「不自由さ」の数々に気づかされた。 オンラインにおける健常者と障害者の壁 こうした「不自由さ」は、私たちが毎日のように利用しているインターネット上にも無数に存在する。障害のある人のうち、半数以上がインターネットを利用しているが、彼らが私たちと同じ体験を得られているわけではない。 例え

    やさしいウェブのためにすべきこと。英国のウェブアクセシビリティ啓蒙ポスターの日本語版が公開 | inquire.jp
  • 医療機器のUI/UXデザイン〜デザインプロセスの全容〜 - 病院経営ウェブマガジン“Healthcare Compass (ヘルスケア・コンパス)”

    私は株式会社ジャイロで医療機器の画面や教育コンテンツのUI/UXデザインおよびディレクションを行なっています。医療機器のデザイン業務は、主にメーカーから受注しています。 10年前に心臓カテーテル用検査装置の画面デザインを受注して以来、心電計、血圧脈波検査装置、産婦人科用ECGモニタ、歯科用CTスキャナ装置、手術室用統合表示モニタなど、いろいろな機器の画面表示部のUI/UXデザインに取り組んできました。 デザイン実施例:手術室用統合表示モニタ(AMEDからの支援プロジェクト「安全性と医療効率の向上を両立するスマート治療室の開発(SCOT:Smart Cyber Operation Theater)」 今回は、医療機器画面のUI/UXデザインについて、どのような流れで受注から納品までの業務を進めているのか、ステップを追ってご紹介します。 ステップは大きく分けると3つあります。 依頼から契約まで

    医療機器のUI/UXデザイン〜デザインプロセスの全容〜 - 病院経営ウェブマガジン“Healthcare Compass (ヘルスケア・コンパス)”
  • 邪悪なUIチェックポイント - その先へ

    ハロー、@seto_hiです。 北海道で避暑をしています。 アプリ開発をしていると様々なコンバージョン率がKPIになることは多いですが、誠実さを欠いたUIを作ると数字がよく伸びることが稀によくあります。 そういったものは一時的な利益には繋がりますが、長期的な利益には繋がらないと考えています。 自分が今後そういったUIを作らないための予防線としてこの記事を書きます。 不利益の排除 ・不利益な動線を奥深くに隠す ・ユーザーが設定を変更する手間を増やす ・「メールマガジンの解除にはメッセージを送ってください」 ・「メールマガジンの解除にはログインが必要です」 ・過度に警告を表示する ・「この設定をOFFにするとアプリが正常に動作しなくなる可能性があります」 ・「当にOFFにしてよろしいですか」 ・不利益な動線を目立たなくする ・不利益な動線のシグニファイアを消す ・スマートフォンならスクロール

    邪悪なUIチェックポイント - その先へ
  • モードレスデザイン|ai

    はじめて iMacG3 を使った時、私はとても前向きな気持ちになった。説明書を読まなくても何をどうすればいいの分かったし、自分の思い描いた通りに動かすことができた。 道具は使う人の能力を拡張させると言うけれど、私はあの丸いマウスと一緒に、文章を書いたり、絵を描いたり、当に何でも出来る気がしたのだ。 それは Mac だけではなかった。iPhone も、iPadも、Apple 製品はいつも私を高揚させた。なぜ私はこんなにも惹かれるのか。不思議に思いながらも、私は Apple 製品を追いかけてきた。 どうして? ... 実はその秘密は既に明らかになっている。 それは、モードレスだからだ。 直感的だとか、シンプルだとか、一貫性があるとか、そういったものは表出された一部にすぎない。 この秘密は、 今から 9 年も前にインターネットに公開されたテキストにあっさり書かれている。ソシオメディアの上野学

    モードレスデザイン|ai
  • iPhone X対応におけるデザイン上の注意ポイント | fladdict

    iPhone Xが発表されたわけですが、なにこのデザイナー泣かせの変態端末。 iPhoneUI設計者グレッグ・クリスティが追い出されて、ジョナサン・アイヴがソフトウェア統括となったのが2014年。 iOS7のフラット化あたりから、どんどんとUI設計が置いてけぼりになった感がありましたが・・・ここにきてまたデザイナー泣かせの豪速球が。 ざっくりデザインガイドラインを読んでの、気になったところメモ。 画面サイズ サイズは従来のベースであった4.7インチの375pt x 667ptから、375 x 812ptに。縦方向に145pt追加された。 想定されるインパクト 表示可能な情報量が増える 縦スクロール系コンテンツのコンバージョンが増加 スクロールで隠れるナビゲーションの必要性が低下 画面上部のボタンのコンバージョンが低下 ゲームなどの全画面イラストに、黒枠が出たり、見切れたりする グラフィッ

    iPhone X対応におけるデザイン上の注意ポイント | fladdict
    snjx
    snjx 2017/09/13
    こういうのOS側で吸収すべきじゃないのかな。
  • キャンセルのキャンセル問題から考えるダイアログデザイン|Goodpatch Blog グッドパッチブログ

    この文脈では、「編集内容のキャンセル」という処理を続行しても良いかをユーザーに確認しています。続行に同意したい多くのユーザーは直感的に同じ表記の「キャンセル」を押したくなるでしょう。しかしそれでは編集のキャンセルが実行されません。 このキャンセルボタンが意味するのは、「『編集内容をキャンセルする』のキャンセル」なのです。つまり、ユーザーが望み通りに編集内容を破棄するためには、反対側のOKボタンを選ぶべきなのです。このような「キャンセルのキャンセル」は二重否定で意味がややこしくなるので避けなければなりません。 ここで「キャンセルのキャンセル」にならなければ良いということで、次のようにボタン名を変えてみました。 これでもう迷うことは無くなりましたか……? 私はこの修正は誤りだと判断します。「はい」「いいえ」は結果を予想しにくい表現なので、ダイアログのアクションボタンに用いることはあまり適切では

    キャンセルのキャンセル問題から考えるダイアログデザイン|Goodpatch Blog グッドパッチブログ
  • プログラマーだってSketchでUIデザインしたっていいじゃない - Qiita

    About プログラマーの皆さんだってたまにはUIをデザインしてみたくですか。 デザインまではいかなくても、もらったデザインをちょっといじったりしたいときありませんか? 最近人気のSketchについてプログラマーがどう覚えていけばよいのか、自分の事例をもとに紹介します。 この記事でやること Sketchをインストールしてまずは動かしてみる Sketchってこんなものなんだあ、というのを知ってもらう この記事でやらないこと Sketchの使い方についての説明 例えばシンボルについての説明 そういうのを書くとキリがないので よいUIデザインのやり方 Sketchとは SketchとはオランダのBohemian Codingという会社がつくっている主にUIやロゴをデザインするためのツールです。 以下の様な特徴があります。 ベクター形式なのでファイルサイズが軽くて拡大縮小してもきれい アートボード

    プログラマーだってSketchでUIデザインしたっていいじゃない - Qiita
  • 本当に有意義なエラーメッセージを書くには | POSTD

    想像してください。あなたは今、オフィスにいます。周りとは仕切られた個別スペースです。今週は、近々新たに展開する予定の製品を紹介するために多くの時間を割いてきました。疲れが溜まり、不機嫌ぎみになっています。今はようやく近づいた週末が待ち遠しくて仕方ありません。 しかしその前に、新製品を紹介するホームページがWindows 10で正常に動かくかどうかを試してみなければなりません。あなたは問題ないはずだと信じています。あなたが信頼を寄せているMacには、Windowsを問題なく実行できるソフトもインストールされています。 ソフトを起動してみると、丁寧にもWindowsがポップアップ通知で可能なアップデートがあることを知らせてくれます。もちろんアップデートを開始するため、あなたは了承します。 すると、こんなものを目にするのです。 訳:何かが発生しました。 何かが発生。 新製品の準備のため期限が迫っ

    本当に有意義なエラーメッセージを書くには | POSTD
  • スマホUI考(番外編) UIやUXを劇的に改善する、『ビッグオー駆動型開発』とは | fladdict

    いま『ビッグオー駆動型開発』とよばれる開発手法が、業界の一部で注目を集めている。 その理由は非常にシンプルだ。『ビッグオー』は非常に安価で簡単な手法でありながら、従来の開発手法に比べ劇的にUIUXを改善できるためである。 製品コンセプトのような上流から、ボタンのレイアウトといった下流工程、さらにはグロースハックやプロモといったリリース後のフェイズまで一つの手法でユーザビリティを評価できる。この汎用性がビッグオー駆動開発の大きな特徴であり、導入時の利点となる。 今回はこのビッグオー、の概要と具体的なやり方について論じたい。TwitterUI拡張予言以来、久しぶりのUI系エントリである。 ビッグオー駆動開発とは何か? ビッグオー駆動開発は、正式には『OKAN Driven Development(オカン駆動型開発)』とよばれる開発手法である。 これは自分のオカンを指標とすることで、低コスト

    snjx
    snjx 2014/02/05
    意外とまじめな話だった
  • 1