UIのお作法。28個の「〇〇できそう感」をまとめました。｜maiokamoto
UIデザインにおいて「〇〇できそうな感」を出すことは、非常に大切です。予測される動作や意味が、自然に理解できれば、ユーザーにとって優しいデザインになるんじゃないかと思います。アイコン、大きさ、色などなど、デザインは細かい要素の積み重ね。すでに多くのユーザーに浸透し、習慣化されていそうな「〇〇できそう感」を28個まとめました。 １、進めそう感 ２、戻れそう感 ３、進めそう＆戻れそう感 ４、開きそう感（ドロップダウン） ５、開きそう感（アコーディオン） ６、開きそう感（モーダル１） ７、開きそう感（モーダル２） ８、カレンダーが開きそう感 ９、メニューが開きそう感（ハンバーガー） １０、検索できそう感 １１、入力できそう感 １２、検索できそう ＋ 入力できそう感 １３、パスワード入力できそう感 １４、パスワード感（強め） １５、間違えた感（エラー） １６、合ってる感（OK） １７、電話かかる感
100種類以上のマウスホバーエフェクトを手軽に使えるCSSライブラリ「Hover.css」が便利。WordPressでも簡単利用。
Hover.cssとは Hover.cssとは、手軽にホバーエフェクトを利用できるようになるCSSライブラリです。 すべて、CSSで動作するので、AタグなどのHTML要素のクラス指定部分にクラス名を記述するだけで、100種類以上の様々なマウスホバーエフェクトを手軽に使えるようになります。 利用するときは、こんなタグで利用できます。 Font Awesomeのアイコンフォントを利用したことがある方なら、Font Awesomeを利用するように、クラスを指定するだけで使うことができるので、簡単に利用できます。 Hover.cssの主な利用手順 Hover.cssを利用するのに必要な主な手順は、以下の3手順です。 Hover.cssのダウンロード＆設置 Hover.cssを呼び出す Hover.css用のタグを記入する 利用するファイルも、hover.css（縮小版はhover-min.css）
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
