WebページやスマホアプリのUIをデザインした時に、数値上は均整がとれているのに、人の目の錯覚で違和感を感じることがあります。ちゃんと揃えて配置したのに、同じサイズなのに、同じ色なのに、なんだか違和感があることはありませんか？ この目の錯覚による違和感を取り除くUIデザインのテクニックを紹介します。 Visually distorted - when symmetrical UI looks all wrong by Gil Bouhnick 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 01. ボタンと同じ色だとテキストは明るく見える 02. 同じフォントでも小さいサイズだと細く見える 03. 背景画像の上のテキストは読みにくい 04. 行間が間違っているテキスト 形の扱い方 05. 整列されたのに揃っているように見えない
ブローレンヂ @blurorange_jp blurorange【性別や年齢に縛られず誰もが自由にファッションを楽しめる世の中を目指して】デザインに認知心理学の目の錯覚を応用し、着るだけでどんな人でも美しくみえるお洋服を作っています。 ジェンダーフリーファッションブランド https://t.co/2GF44wkf8E ブローレンヂ @blurorange_jp あんまり気づいてもらえないんだけど、このマネキンMen'sなんです。 目の錯覚をデザインに取り入れていて、男性体型を自然な女性にみせるのが得意なブランドなんですけど、「これMen'sのマネキンに着せてるんですよ」って言わないと気づいてもらえないんです。 pic.twitter.com/7cg81GgcrP 2021-01-06 00:37:01
ハートカフェ スタッフM @heartcafestaffm @TokyoYonakaSnpo 初めまして。仕事でこちらによく行きますが、必ず2,3組見ますね。 多い時は6組とか見たことあります。インスタで検索すると素敵な写真がたくさん出てきます😌
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
UIのデザインでよく見かける、目の錯覚による違和感を取り除くデザインテクニックのまとめ
「ジェンダーフリーの洋服」一見何の変哲もない洋服を着せられたマネキンには目の錯覚を利用した秘密が隠されていた！
東京駅のウェディングフォト、一度に撮影してる人が多すぎてまるで目の錯覚みたいになってる「コスイベ会場かな」