界面設(shè)計中的視錯覺

2012-10-25 網(wǎng)頁設(shè)計

一個奇怪的器官，我們的眼睛。一方面，他們經(jīng)常對我們?nèi)鲋e。另一方面，通過了解視覺感知的特殊性，我們將能夠創(chuàng)建更清潔、更易于使用的設(shè)計。字體設(shè)計師經(jīng)常使用光學(xué)技巧來創(chuàng)建可讀和平衡的字體。但是界面設(shè)計師也需要這些東西。

1920年代，出現(xiàn)了視覺感知的格式塔理論。它解釋了我們的眼睛如何感知不同的圖像以及我們的大腦如何解釋它們以及這與界面設(shè)計中的視錯覺有何關(guān)系。也許您已經(jīng)聽說過“鄰近法則”或“命運(yùn)共同體”？在本文中，我們將涉及格式塔理論的某些方面，更多地關(guān)注其實際應(yīng)用而不是科學(xué)研究。

一個 400px 的正方形還是一個 400px 的圓形？從幾何的角度來看，這些圖形的高度和寬度是相同的。但是看圖。眼睛立即注意到正方形超過了圓形。

我將第一個和第二個示例中的形狀疊加在一起。在左邊，我們可以看到一個400像素的正方形的面積大于一個半徑相同的圓的面積。因此，在我們看來，它在視覺上更重。右邊的圓形和方形看起來很平衡。事實上，通過增加圓的直徑，我使它們的面積相等。

在菱形和三角形中可以看到相同的效果。為了實現(xiàn)與正方形的視覺平衡，您需要使它們更寬更高，以使圖形的面積相等。這種方法適用于簡單的表單這如何在界面中應(yīng)用？例如，如果您正在創(chuàng)建一組圖標(biāo)，那么它們的平衡非常重要：它們不會吸引眼球，但不會在其他人的背景下迷失方向。如果您只是將每個圖標(biāo)放入一個方形框架中，那么方形圖標(biāo)自然會顯得更重。但有時我們會使用已經(jīng)存在的圖形：例如，使用“分享”和“喜歡”按鈕的社交媒體圖標(biāo)。Facebook 和 Instagram 的圖標(biāo)都是方形的，但 Pinterest 是字母 P 刻在一個圓圈中，而 Twitter 一般是鳥的剪影。因此，Twitter 和 Pinterest 圖標(biāo)需要放大一點(diǎn)，以使其視覺重量與 Facebook 和 Instagram 相匹配。設(shè)置圖標(biāo)區(qū)域時，為形狀的光學(xué)平衡留出一些空間。如果您正在創(chuàng)建一個所有內(nèi)容都需要保持一致的圖標(biāo)集，這一點(diǎn)尤其重要。

上一篇：開發(fā)網(wǎng)站設(shè)計概念的說明返回觀點(diǎn)列表下一篇：杭州做個網(wǎng)站要多少費(fèi)用

本文標(biāo)簽：

本文地址： http://www.bmwdream.cn/a/3358.html

相關(guān)專題

品牌官網(wǎng)設(shè)計
杭州派迪科技為高端客戶提供品牌官網(wǎng)咨詢策劃，品牌官網(wǎng)設(shè)計，品牌官網(wǎng)建設(shè)開發(fā)服務(wù)，以國際化視野和標(biāo)準(zhǔn)為基礎(chǔ)，為各行業(yè)領(lǐng)軍品牌提供高端企業(yè)網(wǎng)站定制、策劃、設(shè)計、互動與制作
查看詳情
大策略營銷門戶網(wǎng)站
杭州派迪科技有自己的營銷型網(wǎng)站CMS系統(tǒng)，適合白帽SEO網(wǎng)站。特別對大策略的營銷型門戶網(wǎng)站制作有一定的經(jīng)驗，曾經(jīng)為上海天擎外貿(mào)行業(yè)網(wǎng)站、浙江兆龍營銷型門戶、先臨三維門戶營銷網(wǎng)站提供全程的技術(shù)支持及SEO優(yōu)化指導(dǎo)
查看詳情
集團(tuán)/上市公司網(wǎng)站
杭州派迪科技為杭州本地集團(tuán)公司提供網(wǎng)頁設(shè)計、制作、開發(fā)服務(wù)，為集團(tuán)公司網(wǎng)站建設(shè)提供了響應(yīng)式、營銷型、品牌型、門戶型網(wǎng)站建設(shè)需求，歡迎廣大集團(tuán)公司客戶咨詢
查看詳情
外貿(mào)網(wǎng)站建設(shè)
杭州派迪科技為高端客戶提供外貿(mào)網(wǎng)站咨詢策劃，外貿(mào)官網(wǎng)設(shè)計，外貿(mào)官網(wǎng)建設(shè)開發(fā)服務(wù)，以谷歌搜索引起算法為基礎(chǔ)，為各行業(yè)外貿(mào)公司提供高端企業(yè)外貿(mào)網(wǎng)站定制、策劃、設(shè)計、互動與制作
查看詳情
企業(yè)網(wǎng)站建設(shè)
高端專業(yè)、令人印象深刻的用戶界面、易于訪問——企業(yè)網(wǎng)站必須反映一切，因為派迪科技在這里提供幫助，憑借精湛的技術(shù)、豐富的經(jīng)驗、與客戶的持續(xù)溝通以及對每一個細(xì)節(jié)的關(guān)注，我們確保在快速的周期時間內(nèi)提供優(yōu)質(zhì)的服務(wù)。
查看詳情
半定制網(wǎng)站
杭州派迪科技模板網(wǎng)站建設(shè)專題_各行業(yè)方案專題欄目提供各行業(yè)產(chǎn)品適合的網(wǎng)站建設(shè)方案,幫助企業(yè)了解派迪科技建站效果等信息,您可以通過本站了解各行業(yè)網(wǎng)站建設(shè)方案,如需要獲取本行業(yè)定制網(wǎng)站建設(shè)方案,可以聯(lián)系在線客服或撥打電話咨詢
查看詳情