Overshoot

視覚的なバランスを取るために、基準線(e.g. Baseline, Cap Height)を少し超えるようにデザインされる部分のこと

錯視を考慮するデザイン

e.g.

丸い文字

e.g. O, C

尖った文字

e.g. A, V

Cap Heightを少し超える

https://gyazo.com/86d7d30177eeb4e90eab61e223e9d4e8 https://en.wikipedia.org/wiki/Overshoot_(typography)

https://en.wikipedia.org/wiki/Overshoot_(typography)

https://gyazo.com/55f8e98da439036e19a77f56948b4bb4 https://coliss.com/articles/build-websites/operation/design/visually-distorted-when-ui-looks-all.html#:~:text=%E3%81%BF%E3%81%BE%E3%81%97%E3%82%87%E3%81%86%E3%80%82-,05.%20%E6%95%B4%E5%88%97%E3%81%95%E3%82%8C%E3%81%9F%E3%81%AE%E3%81%AB%E6%8F%83%E3%81%A3%E3%81%A6%E3%81%84%E3%82%8B%E3%82%88%E3%81%86%E3%81%AB%E8%A6%8B%E3%81%88%E3%81%AA%E3%81%84,-%E3%81%93%E3%82%8C%E3%81%AFUI

形が異なるものを並べると揃っているように見えないため、あえてずらす

https://coliss.com/articles/build-websites/operation/design/visually-distorted-when-ui-looks-all.html#:~:text=しています%E3%80%82-,06.%20一貫性のないフォームの配置,-フォームで異なる