2016-2017 ブログまとめテスト

こんにちは、はらです。私の年内最後の更新となります。
今回は2016-2017年のデジマースブログの中からUIに関してクイズ形式でいくつか出題したいと思います。
どの問題もデジマースブログを毎週チェックしている方ならわかるはずです!?
※解答はページ下部に記載しています。
  read more

押せる画像・ボタンについて考えてみる

*。゜・。ここでは全部を理解せずとも、デザイナーでなくとも
何となく分かるをベースに書いております。・。゜*

▼押せる画像・ボタン①

サイト内で画像やボタンを押す際に分かり辛くて、踏みとどまったり、探したりしたことはありませんか?
さて今回はそんな画像やボタンをどうしたらユーザーへ認識してもらいやすくなるか、改めて考えていきたいと思います。 read more

UIと配色

配色とは、2色以上の色を組み合わせ、配置および構成をする事です。 UIデザインでは、どのような配色を行うのかによって、使用感やユーザーに与える印象が大きく変化します。といってもUIデザインに限りませんが…。 色の扱い方はとても奥が深く、国や地域によって色に対するイメージは変わります。また、組み合わせ方は数え切れないため一言で配色について語りきる事はできません。一言でなくとも語りきれないと思います。 今回はよりカテゴリを絞り、色は色でもUIデザインにおける色(配色)のポイントについていくつかご紹介致します。

70% 25% 5%の配色

UIに使用する色数の目安は3色です。3色以上にする事が間違いと言うわけではありませんが、色数を増やしすぎると、どこを強調しているのか、どこに触れる事ができるのかなどが伝わりにくくなり、情報が整理されていないような見づらいUIになってしまいます。
しかし、色数を押さえたからといって適切に配色ができているわけではありません、使用する量も重要になります。UIにおいて実際に3色をどのようにして選び、使用するのかということは「70・25・5の法則」を意識すると選びやすくなります。70・25・5の配色はベースカラー70%、メインカラー25%、アクセントカラー5%にする配色法です。ちなみにこの「70・25・5」の考え方はwebデザインでは基本とされている配色方法です。 read more

サイト内で迷子にさせないために

サイトに遊びに行ったときに迷子になったことはありませんか?
迷子になってしまうとユーザー本人もせっかく訪問したのに目的が達成し辛くなり、しまいにはサイトを離れてしまいます。
提供側もせっかく訪問してくれたユーザーを離脱させてしまう事はとても勿体ないことです。
では、どういった状況でそのような事が生まれてしまうのでしょうか、改めて考えていきたいと思います。 read more

スマホ画面サイズユーザビリティ

今回はモバイル端末を中心に、「画面サイズ/画素密度と目の距離に関係するユーザビリティと満足度」を考えてみます。

画面サイズと画素密度の相対関係を考えると非常に奥が深く楽しそうなので、まずは個人的に思い入れがある端末でスペック表を作ってみました↓ read more

ユーザーを混乱させないUIとは

アプリを使用するとき、皆さんは操作に関してストレスなく使用できていますか?あえて説明を聞かなくても、「これは押せる」「これを押せば戻る」など理解できていますか? 普段アプリを使用している方なら、チュートリアルを確認したり説明を聞かずとも「これは押せるな」と、“ある程度予想ができ”スムーズな操作ができるはずです。 実はこの“ある程度予想できる”というのはユーザーの使用経験が豊富というだけではなく“ある程度予想できる”ように設計されているからなのです。 UIでユーザーが混乱してしまう場面は様々です。目的の機能が見つからない、操作方法がわからない、表示されているアイコンの意味がわからないなど、書き出したらキリがないほどあります。 今回は色使い、エフェクト、位置でユーザーを混乱させないための方法をご紹介いたします。

ユーザーを混乱させないためには…

UIでユーザーを混乱させないためには、デザインのルールを決めサービス内で統一する事が必要です。UIデザインでは、色使い、エフェクト、レイアウトなどサービスを通して統一させる必要があります。 read more

カルーセルとユーザビリティー

カルーセルとは?

カルーセル[carousel](バナー/パネル/スライド)とは、
複数画像を左右にスライドさせることで表示させる展開(回転)構造を持ったWebコンポーネントです。


スマートフォンが登場した黎明期から、
カルーセルはナレッジと予見が必要な敷居の高い機能であった為、PC/スマフォでの使用には賛否がありました。
特に最終スライドまでの認知は、構造上少なくなっていく傾向は止むを得ません。 read more