Web・アプリデザイン覚え書き

Neumorphism

• 外側の影: 左上を明るく、右上を暗く（左上から右下にかけて光が当たるイメージ）
• 内側の影: 左上を暗く、右下を明るく（同上）
• 背景が明るすぎたり、暗すぎたりすると影が目立たないのでNG
• border-radiusを設定しないと、角の部分の影の表現がおかしくなり不自然

• react-native（特にandroid）ではbox-shadowの細かい設定ができないため、背面に明るい領域と暗い領域を置くことで影を表現

• 内側の影の表現は難しそう
  

• 影の表現をAdobe XDで設定するのがおそろしく面倒だった。Figma最高

アンチパターン①
「ログイン / 登録」ではなく「全編視聴する」などの文言の方が良い。ユーザはログインしたいわけではなく、コンテンツを見たいと思っているので、その要望に応える文字列の方が親切