UIの把握しやすさには空間表現が影響します。早速、事例を紹介します。 １．画面内の奥行き表現下記は３枚の紙の画像です。どの紙が上に重なっているかがわかると思います。 ディスプレイ上で３枚のカードを重ねたものを用意しました。右のカードの方が重なっている様に感じると思います。 だから何？　と思うかもしれませんが、これはUIを操作するときに影響します。 以下、スクロール操作を表現したものです。スクロールされたカードがタイトルバーの下に入り込んでいます。 もう１つ、アニメーションを用意しました。 比較してみると下のアニメーションの方が「どこに何があるのか」が、わかりやすいと思います。 影があることにより奥行きが表現され、タイトルバーの下にカードが入り込んだのが、より把握しやすくなります。この様に空間を把握しやすいことはわかりやすさにとって効果的です。 Android、iOS、Windowsはどれも

11 years of Node: Let’s have an honest conversation Anna Henningsen · @addaleax · she/her

accessibility 10 advanced 195 AMP 13 Android 2 API 7 apps 7 autocomplete 2 beginner 173 CAPTCHA 1 Chrome 2 cms 1 crawling and indexing 158 encryption 3 events 51 feedback and communication 83 forums 5 general tips 90 geotargeting 1 Google Assistant 3 Google I/O 3 Google Images 3 Google News 2 hacked sites 12 hangout 2 hreflang 3 https 5 images 12 intermediate 205 interstitials 1 javascript 8 job s

はじめにこのnoteは、私がTwitterで発信した「デザインの思考＆Tips」のなかから、レイアウトデザインに関する内容を編集してまとめたものです。普段のデザイン業務で私が意識している、webデザインを中心としたレイアウトの考え方やTipsを紹介します。 「レイアウト」といっても、ただ単にドキュメント上に要素を置くのは誰でもできます。どんな素材にするか、どんな動線にするかを考えて位置を決めていくのが「デザイン・レイアウト」。こちらがデザイナーの仕事ですね。デザイナーは、達成したい目的のために秩序を与えつつ工夫していくことが求められます。 では、配置するにあたってどのようなことを意識したり注意すればよいでしょうか。 川の流れのようにレイアウトするにあたっては、情報の優先順位を決めてそれをボリュームで割り当てるのが基本です。ただし、これだけだと単に積み重ねているだけで流れが悪いので、視線が滑

マイクロサービスにおける認証と認可の、一般論としての設計パターンを調べたところ、Web 上の複数の記事で似たようなパターンが登場していた。ここでは、まず認証と認可が実現したい一般的な要件と、そのマイクロサービスでの難しさを整理し、認証と認可に分けて調査したパターンをまとめた。 あくまで “一般論” なので、実際には個々のドメインにあわせてアレンジが必要 往々にしてこの “アレンジ” に価値が宿るものだが、まずはセオリーを知っておきたいというモチベーションで調査した Web 上の記事を読んでまとめただけなので、手を動かしての確認はしておらず、理解が甘い部分はご容赦ください 具体的な通信方式やサービス間通信のセキュリティといった具体論までは踏み込めていない。このへんはサービスメッシュやゼロトラストネットワークといったトピックが登場すると思われる これらは次回以降の Todo としています その