タグ

UIに関するsaken649のブックマーク (6)

  • モバイルファーストのウェブデザインがデスクトップに及ぼす悪影響

    モバイルファーストのウェブデザインは、デスクトップで閲覧する際に重大なユーザビリティ上の問題を引き起こす。長いスクロールページにコンテンツが過度に分散され、余白が広がり、画像やフォントが拡大されるため、ユーザーが情報を把握し、理解することが難しくなるのである。 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日公開 最近のウェブサイトの多くは、モバイルファーストなアプローチでデザインされている。こうしたページをデスクトップデバイスで表示すると、コンテンツが過度に大きく引き伸ばされて見えることがある。画面を覆い尽くすような画像、肥大化したテキスト、過剰な余白のせいで、

    モバイルファーストのウェブデザインがデスクトップに及ぼす悪影響
  • なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita

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

    なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita
  • 成功法則が詰まったBtoBサイトの標準ワイヤーフレームを無料配布します | knowledge / baigie

    約1年前、BtoB企業における顧客獲得型サイトの勝ちパターンをまとめた『BtoBサイト・チェックリスト』を、ベイジ、才流さん、WACULさんの3社連名で発表し、大きな反響をいただきました。 このチェックリストはブログで公開しただけではなく、私たちのウェブ制作の現場でもフル活用されています。この1年間に手掛けた多くのBtoBサイトが、このチェックリストを満たすように設計され、多くのBtoBサイトでコンバージョン数/率やフォーム誘導数/率の向上など、ポジティブな変化が生まれました。 このような活動の中から、『BtoBサイト・チェックリスト』の内容を満たした『BtoBサイト・ワイヤーフレーム』なるものが誕生しました。これを今回、皆さんにご提供します。リード情報なども一切取らず、そのまま丸ごとお渡しします。 BtoBサイト標準ワイヤーフレームXD版(770KB) BtoBサイト標準ワイヤーフレーム

    成功法則が詰まったBtoBサイトの標準ワイヤーフレームを無料配布します | knowledge / baigie
  • 8の倍数ルールでデザインする理由とメリット・デメリット | Yuya Kinoshita

    デザインする際に意識している8の倍数ルールについての記事です。Webサイトやアプリなどスクリーン用のデザインの際には、基的に要素の大きさを8の倍数ピクセルで設計しています。 ここでいう要素とは、コンテンツ幅、ボタンの大きさ、余白の大きさ、バナーの大きさ、メインビジュアルの大きさなど、サイズ指定が必要なほぼ全て要素を指しています。 8の倍数によるデザインルールはこれまでに16以上のプロジェクトで活用してきました。ルールを用いることのメリット・デメリットや、そのルールを使い続けている理由を当Webサイトの事例と共にまとめています。 ※フォントサイズは8の倍数ではなく、18pxを基準とした倍率計算によって算出する方法を試しています。詳しくは以下の記事にまとめています。 Webサイトで明快なデザインと運用しやすいコーディングを両立する文字サイズ強弱の仮説・検証 8の倍数で設計する理由とメリット

    8の倍数ルールでデザインする理由とメリット・デメリット | Yuya Kinoshita
  • 画面をデザインするということ - Qiita

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

    画面をデザインするということ - Qiita
  • ✕はなぜ閉じるのシンボルなのか歴史を読み解く|みーた

    先日Cybozu Frontend Monthly #1 にてb4h0_c4tさんの「HTMHell special: close buttons」のお話を聴いていた中で、一つ引っかかるものがあった。 「そもそも✗(バツ)は閉じるって意味じゃないから!」 確かに。 現代、様々なUIを触ってきた中でなぜ ✕ を閉じるものと捉えているのだろうと不思議に思った。 ✕ではなくx(エックス)で表現されることも多々あるようで、こんな名言もある。 ✕とはなんなんだろう ではなぜこのクロスの記号(✕)が閉じるの意味を持ってしまったのか考えてみる。 一旦✕を見て思い出すものを上げてみようと思う。 ・◯と✕(日の正誤表記) ・✓と✕(海外...主に欧米の正誤表記) ・プレステのコントローラー ・海外ゲームだと決定が✕、キャンセルが◯ ・宝の地図なんかで在り処を記す ・上記のツイートのようにx(エックス)とし

    ✕はなぜ閉じるのシンボルなのか歴史を読み解く|みーた
    saken649
    saken649 2020/08/02
  • 1