上兩篇瞭解過了視覺誤差對UI造成影響的其他兩個因素， 本文主要講視覺誤差對UI造成影響的最後一個因素——視覺圓角。
視覺圓角什麼可以比圓形更圓？我曾經認為沒有什麼。
但正如我在本文開頭所說的那樣， 我們的眼睛很奇怪， 眼睛看到的東西不能全信。 那麼， 下面的圖片中的哪個圓圈看起來最圓？
我之前詢問的人都是在3號和4號之間進行選擇， 數字1和2絕對太瘦， 5太豐滿。
鑒於高品質字體是基於人類視覺感知而建立的， 並且使用了複雜的光學構造系統， 我認為字體O的圓形看起來比幾何形狀更圓。
讓我們將它們與幾何圓圈重疊， 即使是最幾何的Futura的“o”也有四個突出部分。 除此之外， Circe和Geometria都比圓圈寬， 但即使它們具有相同的高度和寬度， 我們也可以看到這四個“肚子”更胖。
看看下圖：左手邊的圓是一個正圓， 右手邊的圓是一個經過“變胖”的圓， 但是“變胖”的圓看起來更像正圓。
我們如何規避這種現象？
比如：常見的ios圓角， 當然是為了四捨五入！如果使用Photoshop， Illustrator或Sketch中的功能畫圓角， 視覺看上去， 是不能畫出準確的圓角的。
人眼可以馬上檢測到一條直線突然變成曲線，軟體做出來的圓角並不自然。
我在考慮到我們的視覺感受的情況下，用非正圓畫出來的圓角非常平滑。
正圓之外還增加一點額外的部分，多出來的那點正好給予了一定的過渡，讓直線向曲線的改變更加平順。
比較一下：
現在我們可以將這種方法應用于圓角按鈕。
我想你可能已經注意到，右邊的按鈕有更圓滑的圓角，視覺效果更好。與應用程式圖示也是相同的，不會簡單地使用標準的圓角來達到完美的效果。
但在我們深入探討這個話題之前，讓我們來看看兩種：
第一個是一個圓角矩形，我在Sketch中創建。第二種形狀是超橢圓形，也稱為 Lamé 曲線。
它是由法國數學家 Gabriel Lamé 發現並命名，根據所使用的公式不同，可能會有所不同，很明顯，右邊那個更像 iOS 的 icon。
從 iOS7 起，iPhone 所有的 icon 都基於此進行設計。
曲線的方程式
後來，根據黃金分割等理論加上了一些必要的輔助線。
重要的是要記住：
因為您可以很容易地看到直線突然變成曲線的點，因此幾何圓角看起來很生硬。制做自然的圓角矩形需要特殊的公式或對形狀進行一些手動調整。前兩篇：
視覺誤差會對 UI 造成什麼樣的影響？(二)
本文由 @VisualCC翻譯發佈于人人都是產品經理。未經許可，禁止轉載
題圖來自 Pexels ，基於 CC0 協議
人眼可以馬上檢測到一條直線突然變成曲線，軟體做出來的圓角並不自然。
我在考慮到我們的視覺感受的情況下，用非正圓畫出來的圓角非常平滑。
正圓之外還增加一點額外的部分，多出來的那點正好給予了一定的過渡，讓直線向曲線的改變更加平順。
比較一下：
現在我們可以將這種方法應用于圓角按鈕。
我想你可能已經注意到，右邊的按鈕有更圓滑的圓角，視覺效果更好。與應用程式圖示也是相同的，不會簡單地使用標準的圓角來達到完美的效果。
但在我們深入探討這個話題之前，讓我們來看看兩種：
第一個是一個圓角矩形，我在Sketch中創建。第二種形狀是超橢圓形，也稱為 Lamé 曲線。
它是由法國數學家 Gabriel Lamé 發現並命名，根據所使用的公式不同，可能會有所不同，很明顯，右邊那個更像 iOS 的 icon。
從 iOS7 起，iPhone 所有的 icon 都基於此進行設計。
曲線的方程式
後來，根據黃金分割等理論加上了一些必要的輔助線。
重要的是要記住：
因為您可以很容易地看到直線突然變成曲線的點，因此幾何圓角看起來很生硬。制做自然的圓角矩形需要特殊的公式或對形狀進行一些手動調整。前兩篇：
視覺誤差會對 UI 造成什麼樣的影響？(二)
本文由 @VisualCC翻譯發佈于人人都是產品經理。未經許可，禁止轉載
題圖來自 Pexels ，基於 CC0 協議