フラットデザインとユーザビリティ | Accessible & Usable
公開日 : 2014年9月22日 カテゴリー : ユーザビリティ / アクセシビリティ ここ数年、多くのウェブサイトで「フラットデザイン (flat design)」が採用されるようになりました。立体的な/写実的なあしらいを極力排除することで、ユーザーインターフェース (UI) をすっきりと洗練されたデザインに見せることができる、という表現手法です。 かつては「スキューモーフィックデザイン (skeuomorphic design)」との対比で様々な議論を呼んだフラットデザインですが、実質的に広く定着したと言える現在、フラットデザインの是非を問うよりも、ユーザビリティの高いフラットデザインを実現することが大切だと考えます。実際、色々なウェブサイトやアプリケーションを見ていると、あしらいをフラットに (平坦に) することが目的化してしまっているのでしょうか、使いにくい (あるいは機能に気づき
年間300億。Webユーザビリティ３つの間違い・落とし穴
「ユーザビリティを意識することが大切！」って言われても、何となく意味は分かるけど具体的にどうすれば良いの……と悩んでいる方も多いのではないでしょうか？ ユーザビリティとは、「単なる使いやすさ」のことではありません。特にWebにおいては売上や成果などビジネスを左右する重要な概念です。しかし、多くの人がユーザビリティについて間違った認識を持っているために、みすみす売上や成果を逃しているケースをよく目にします。 ユーザビリティを正しく理解するポイントは、特定のユーザの行動、心理、目的に焦点を当てることです。 本日は、よくある「間違い・落とし穴」を例に出しながら、売上改善に直結する「正しい」ユーザビリティの考え方をご紹介します。ぜひ皆さんもユーザビリティの理解を深め、Webサイトの改良に役立ててください！ 【事例】１つのボタンを変えただけで、年間300億の売上増！売上に直結するユーザビリティとは、
サイトやアプリのユーザビリティを向上させる35のポイント | ベイジの社長ブログ
デバイスがどのように進化しようが、アプリの時代になろうが、ユーザビリティは変わらず求められるものです。Web/IT業界では「使いやすさ」という意味で気軽に使われる言葉ですが、奥は深く、原論を解説した書籍もいくつか出ています。 学術的な解説はそういった書籍に任せるとして、ここでは、経験の浅いデザイナー、あるいは非デザイナー（ディレクター、Web担当者、エンジニアなど）向けに、ユーザビリティの向上に繋がる基本的な要点をまとめてみました。 ボタン、テキスト、コピーなど ボタンやテキストのデザインは、ユーザビリティを左右する大きなポイントです。表面的な美観に流されず、ユーザ視点で考えていきましょう。 1：ボタンじゃない要素は、ボタンと似たデザインにしない ボタンのデザイン次第で、サイトやアプリの使いやすさは大きく変わります。特に、ボタンでない要素にボタンのようなデザインを施すことは、どこが押せるの
効率的に学べた！Webデザインを「職種別」に基礎から勉強出来る総まとめ | コムテブログ
作成：2014/01/6 更新：2014/11/01 Webデザイン > Web制作において、Webデザイナーに関係するものを職種別にまとめました。会社によって分け方は違うと思います。今回は参考サイトとスライドを掲載しています。 エンジニア速報は Twitter の@commteで配信しています。 もくじ アートディレクター １．アクセシビリティ ２．ユーザビリティ ３．UX（ユーザーエクスペリエンス） ４．IA（情報アーキテクチャ） ５．画面設計（ワイヤーフレーム） ６．進行管理 Webデザイナー ７．レイアウト・フォントの知識 ８．配色 ９．Illustratorの使い方 １０．Photoshopの使い方 １１．バナー作成 １２．ボタン作成 フロントエンドエンジニア １３．HTML5 １４．CSS3／Sass １５．javascript １６．jQuery １７．WordPressテー
2013年、この一年で大きく変わったウェブサイトのナビゲーションの5つのトレンド
ウェブサイトに使用されるナビゲーションはこの一年の間に、大きく変わりました。スクリプトやスタイルシートを使い派手なアニメーションやインタラクションを取り入れることもできますが、最近のトレンドはよりシンプルで、すっきりしたデザインが好まれています。 最近のナビゲーションのトレンドを紹介します。 Up and Coming Navigation Trends 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。最近海外のブロガーから他ブログでの無断翻訳・転載の声を聞きます。 ナビゲーションの欠如 スクロールベースのナビゲーション ミニマルなナビゲーション サイドのナビゲーション サークル状のナビゲーション 終わりに ナビゲーションの欠如 最初にあげるナビゲーションのトレンドは、ナビゲーションの欠如です。これは二つの条件が揃えば機能します、一つは
ミニマルデザインとは？7つのヒントと事例 デザイン会社 ビートラックス: ブログ
Keep it Simple – これはAppleのデザインに対する一環したフィロソフィーである。全てをシンプルにする事。それが彼らの中心的な考え方になっている。 実は、彼らに限らずよく海外のデザイン業界では下記のフレーズが頻繁に使われる: Less is more – より少ないことは、より豊かなことEverything you need, nothing you don’t – 必要なものだけPerfection is achieved when there is nothing to take away – 完璧とはこれ以上削れない状態の事であるこれらはシンプルである事がどれだけ重要であるかを端的に表現している。 もしデザインの仕事が問題解決の為のクリエイティブなプロセスだと定義するのであれば、その方法論はシンプルである事に超した事は無い。言い換えると、最も効率的なプロセスで物質の本
タブレットのユーザビリティ
タブレットのユーザビリティを脅かす最大の脅威は、フラットデザインと不適切に縮尺を変更されたデザインである。そしてその後には貧弱なジェスチャーとワークフローが続く。 Tablet Usability by Jakob Nielsen on August 5, 2013 日本語版2013年8月22日公開 これまでタブレットユーザーを対象にしたユーザビリティ調査を6回実施してきた。良い知らせは、タブレットのユーザビリティがまぁまぁ信頼できるものであり、初期の、奇抜なiPadアプリのまとまりの頃に比べると、大幅に改善されてきていることである。あれはユーザーをすっかり当惑させることが多かった。 テストしてきたのは数世代にわたる大小のiPadと、（Kindle Fireを含む）Androidタブレットの多数のモデル、（Microsoft Surfaceを含む）いくつかのWindowsタブレットである。
制作前に要チェック！フラットなデザインのいいとこと悪いとこのまとめ
フラットなデザインに限らず、トレンドを知り学ぶことは大切です。 フラットなデザインの良い面・悪い面を知り、どのようなプロジェクトに使うとより効果的か学んでみましょう。 Pros and Cons of Flat Design 下記は各ポイントを意訳したものです。 はじめに フラットなデザインは、最近のデザインの中で大きな流れであることは否定できません。確かに至るところで見かけます。 このフラットなスタイルは、デザインコミュニティでその正当性とスタイルの適用について激しく議論がされてきました。ここでは、そのフラットなスタイルの良い面と悪い面の両方を見てみましょう。 良い面：フラットなデザインはトレンド フラットなデザインは非常にトレンドです、しかしこのトレンドはいつまで続くでしょうか？ もしトレンドに乗るなら、今がこのフラットなデザインを実行する時です。プロジェクトでフラットなデザインを取り
学会大会サイトのユーザビリティ
今年(2013年)の夏と初秋に参加する(した)、二つの国際会議のウェブサイトがつかいにくく、苦労した。この二つを素材にして、学会サイトのユーザビリティについて書いてみる。 黒須教授 2013年8月12日 今年(2013年)の夏から初秋にかけて参加する(した)二つの国際会議のウェブサイトがつかいにくく、苦労した。ウェブユーザビリティの問題については既に沢山の著書もあり、サイト構築者にとってはもう自明のことになっているのかと思いきや、なかなか周知徹底することは難しいらしい。そんなわけで、HCIに関連したこの二つを素材にして、学会サイトのユーザビリティについて書いてみることにした。できるだけURLをクリックして、実際のサイトを見ながら読んでいただきたい。 ただ、どちらも規模的にはマイナーな学会であり、ACM SIGCHIやHCI InternationalやIFIP INTERACTのような大規
ユーザー体験とは？UX及びユーザビリティについての考察 ｜https://wp.yat-net.com/name
2012年 10月 12日 ユーザー体験とは？UX及びユーザビリティについての考察 カテゴリ： IAシンキング Webデザイン タグ：IAシンキングUXWebサイト構築ユーザビリティ Webに限ったことではありませんが、人が新たな物を利用するにはその使い方を学習する必要があります。 どんな優れた製品でも使い方が分からなければユーザはそれを使うことができません。それを避けるために各メーカーはマニュアルを用意したり、サポート出来る手段を用意しています。 ですが、多くのユーザーはマニュアルを読むより先にまず触ってみるという人が多いかと思います。マニュアル読むのって結構時間もかかるし、早く触りたい・使いたいという欲求が大きいからでしょうね。 であれば、なるべくマニュアルがなくても分かりやすいデザインであった方がユーザーにとって喜ばれるのでしょう。 1.ユーザー体験とは？ 2.ユーザー体験を無視した
ユーザビリティを向上させる25のデザインの基本概念 デザイン会社 ビートラックス: ブログ
ビジネスにおけるユーザーインターフェイス(UI) や、ユーザーエクスペリエンス(UX)の重要性が頻繁に語られる事が多い。 Webサイトやアプリから始まり、自動販売機、券売機、車のダッシュボート、テレビ、トイレ、エレベーターのボタン配置に至るまで、”ユーザビリティー”と表現される ”使いやすさ” の大切さが注目を浴びている。 そして、その使い易さを生み出す最初の入り口がインターフェイスである。 インターフェイスとは、ヒトとデバイスとの円滑なコミニュケーションを達成するための媒介役であり、操作性や使い易さを印象づける点ではソフトやデバイスの成功を最も左右する、唯一無二の存在である。 今さら聞けないUI（ユーザーインターフェース) の基本 最終的なインターフェイスの仕事は “ユーザーゴール + ビジネスゴールの達成”であり、どんなに良いプロダクトを作っても正しい方向にユーザーを導き、ビジネスとし
ウェブサイトのユーザビリティに関する最高の秘訣20か条 ｜SEO Japan by アイオイクスSEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
昨日、ウェブサイトのリーダビリティに関する記事を配信しましたが、意外と好評でした。ということで、2匹目のドジョウを狙って今回はユーザビリティについての記事を紹介したいと思います m(__)m ウェブデザイナーにもSEO担当者にも、基本ながら一読の価値ある内容。 — SEO Japan ユーザビリティは、ウェブサイトにとってものすごく大切なことだ。訪問者が素早く簡単に楽しくウェブサイトにアクセスしてそれを使うことができなければ、ウェブサイトの外観がどんなに格好良くても、コンテンツがどんなに素晴らしくても関係ないのだ。訪問者の多くは、ただ諦めて他のどこかに行ってしまうだろう。 それでは、どうやってできる限り使い易いウェブサイトを作ればいいのだろうか？あなたはラッキーだ。だって、この記事ではあなたのウェブサイトのために20個のユーザビリティの秘訣を特集しているのだ。テクノロジーは常に変化するため
Webサイトの読み込み体感速度が2秒くらい上がるかも。SNSボタンは後から読み込め！ - Web学び
2012年 6月 13日 新しいサーバーでブログをリニューアルして気がついた、SNSボタンの有無でかなり読み込み速度に差がある。といっても2,3秒ほどですが、これは結構命取りだったりします。 まぁ私もそんなに詳しいわけではないので断言できませんが。 ・訪問者はその数秒でサイトから逃げる ・Googleはその数秒を評価基準に入れる たしか遅延ロード(Lazy Load)とかいう技術ですね。 わりとポピュラーなコードで何とかなったので書いときます。 ピュアなJavaScriptではなく、jQuery使いますね。 方法その１ 時限式読み込み body閉じタグの前あたりに書きます。 . . . <div id="snsbox"></div> <script type="text/javascript"> var snscode = 'ここに、SNSのコードを書く' + '一行でつなげても良いが見に
Webユーザビリティを改善するための5つのポイントと方法
先日の記事[競合サイト調査・分析に必要なチェック項目と役立つツール達！]でユーザビリティの調査・分析方法を軽く紹介しましたが、今回はWebユーザビリティを改善するための5つのポイントと方法を紹介したいと思います。 まずユーザビリティとは何なのかについて軽く触れておきます。先日の記事でも紹介しましたが、それは【使い勝手】のことです。WEBユーザビリティの改善とはすなわち、WEBサイトの使い勝手を良くするということになります。ではその使い勝手とは何なのか。それは単純に【使いやすさの程度をあらわした言葉】のことです。使い勝手が良いということは、使った人から見てその【何か】は使いやすかったということになります。そして今回のこの記事は【どうしたらユーザーに使いやすいと感じてもらえるのか】について紹介しています。 この【WEBユーザビリティを改善するための5つのポイントと方法】は下記の項目で紹介するヤ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
