不對稱是對稱的反面，但并不意味著不對稱就缺少平衡與和諧。不對稱的設(shè)計(jì)技術(shù)可以在視覺上引人入勝，為內(nèi)容創(chuàng)建出重要程度不同的差異性。這篇文章分享一組鼓舞人心的例子，介紹了不對稱設(shè)計(jì)在網(wǎng)頁中的使用技巧。

大多數(shù)人想到的對稱性都是一種自然發(fā)生的現(xiàn)象，其實(shí)不對稱也是一種自然現(xiàn)象，例如人都是顯性的左撇子或右撇子。不對稱設(shè)計(jì)的用途也非常廣泛，常用來突出重點(diǎn)，讓人的視線自然的被吸引到焦點(diǎn)上面。

大多數(shù)人想到的對稱性都是一種自然發(fā)生的現(xiàn)象，其實(shí)不對稱也是一種自然現(xiàn)象，例如人都是顯性的左撇子或右撇子。不對稱設(shè)計(jì)的用途也非常廣泛，常用來突出重點(diǎn)，讓人的視線自然的被吸引到焦點(diǎn)上面。

不對稱設(shè)計(jì)的應(yīng)用

　　什么樣的項(xiàng)目可以受益于非對稱設(shè)計(jì)？簡單地說，幾乎所有的項(xiàng)目都可以。這項(xiàng)技術(shù)如果能夠合理運(yùn)用，將會(huì)給項(xiàng)目增強(qiáng)對比度和差異性。其關(guān)鍵是要元素的組織和排布以達(dá)到非對稱的平衡。

　　在網(wǎng)頁設(shè)計(jì)中，對稱通常都是指水平對稱，而不對稱都是指首屏部分的內(nèi)容，即用戶不用拖動(dòng)滾動(dòng)條就能看到的那部分。最常用的不對稱設(shè)計(jì)都是把對稱的元素組合在一起，重新排布，下面是幾個(gè)不對稱設(shè)計(jì)的示例。

01. We Are Int

02. 5 Eme Gauche

什么東西都離不開基礎(chǔ)，建房子需要地基，解方程式需要先學(xué)會(huì)乘法表，唱歌需要先會(huì)“哆、來、咪”。頁面設(shè)計(jì) 也同樣需要基礎(chǔ)，這個(gè)基礎(chǔ)就是平面 構(gòu)成。 網(wǎng)頁設(shè)計(jì) 風(fēng)格種多樣，除去一些場景化設(shè)計(jì) 和給力的素材支持，剩下的就全靠平面構(gòu)成和排版了。剛開始接觸網(wǎng)頁設(shè)計(jì) 的時(shí)候，常常會(huì)鉆到某個(gè)局部中去，頁面風(fēng)格還沒出現(xiàn)，就開始做字體細(xì)節(jié)，結(jié)果可想而知咯。經(jīng)過一段時(shí)間的學(xué)習(xí)和實(shí)踐，發(fā)現(xiàn)原來做網(wǎng)頁跟繪畫是一樣，先把內(nèi)容和想法都丟上去，排布出整體風(fēng)格（這里就需要的是平面構(gòu)成排版能力啦），然后再慢慢細(xì)化各部分內(nèi)容。

一、基礎(chǔ)中的基礎(chǔ)：點(diǎn)、線、面

點(diǎn)構(gòu)成線，線構(gòu)成面，這些是平面構(gòu)成中的基本要素，也是所有平面設(shè)計(jì) 的基本要素。那么將這些基礎(chǔ)中的基礎(chǔ)運(yùn)用在網(wǎng)頁設(shè)計(jì)中，又是怎樣的效果呢？ 點(diǎn)、線、面這三個(gè)東西不單純的指一個(gè)點(diǎn)、一根線、一個(gè)平面。我們要善于利用文字和圖形的排布，為自己的網(wǎng)頁增添效果。網(wǎng)頁中的每一個(gè)文字，每一個(gè)點(diǎn)，每一個(gè)圖形都是這個(gè)網(wǎng)頁的組成元件，文字可組成圖形，圖形也可組成文字，這些都不是限定死的。

讓人感動(dòng)的設(shè)計(jì)，紅點(diǎn)最佳概念獎(jiǎng)”Blade a Blade Safe Agua”

之所以說Blade a Blade（巴爾德，西班牙語“桶”的意思），是因?yàn)樵谶@個(gè)世界上，還有很多地區(qū)因?yàn)闉?zāi)難、戰(zhàn)亂、經(jīng)濟(jì)、政治和基礎(chǔ)設(shè)施落后貧困，甚至沒有我們已經(jīng)習(xí)以為常的自來水，水車運(yùn)送來的水，用大大小小的容器裝著使用，不方便的同時(shí)，也不衛(wèi)生。而”Blade a Blade Safe Agua”為這些地區(qū)的人們考慮，可以與任何容器連接使用，使全球46%沒有自來水的人們享用便利、健康的自來水。文末視頻更好的詮釋。
“Blade a Blade Safe Agua”是一種便攜式龍頭，可以與任何容器連接，而且成本低廉，使用非常方便，通過虹吸原來，將水從容器中引出，通過龍頭結(jié)構(gòu)設(shè)計(jì)，可以調(diào)節(jié)水流大小以及開關(guān)功能，僅單手就可以操作，另一個(gè)重要的好處，就是在這些用水不便的地區(qū)可以更好的節(jié)省水資源。因此”Blade a Blade Safe Agua”也獲得了紅點(diǎn)概念設(shè)計(jì) 獎(jiǎng)，綠色設(shè)計(jì)最佳獎(jiǎng)！當(dāng)之無愧。

為什么要改版？

隨著科技的發(fā)展，時(shí)代的進(jìn)步，微博用戶的上網(wǎng)設(shè)備也在快速更新。研究一下微博用戶的屏幕分辨率使用數(shù)據(jù)我發(fā)現(xiàn)，屏幕分辨率越來越高的同時(shí)，伴隨的一個(gè)數(shù)值，也就是顯示器顯示網(wǎng)頁外的空白面積也越來越大，如何利用好這部分空間是一個(gè)值得研究的課題。

前期看了一些同類產(chǎn)品

Clear的出現(xiàn)引起了大家對手勢操作的熱忱, Google新專利采用“連續(xù)手勢”也讓我們看到了個(gè)性化手勢的前景。確實(shí)，手勢操作能夠減少界面元素，提升效率；但其不可見性，抽象性，需記憶性等特點(diǎn)也決定了它的弊端。如何揚(yáng)長避短，根據(jù)現(xiàn)有手勢的特點(diǎn)在合適的情境中使用，同時(shí)根據(jù)文化約定、實(shí)物隱喻、表音、表意等發(fā)想創(chuàng)新手勢，而非一味地追逐跟風(fēng)，值得我們思考。本文結(jié)合了珊璞之前對客戶端手勢應(yīng)用的分享以及網(wǎng)上的相關(guān)資料，從手勢的空間感帶來的心理感受，手勢賦予的功能，引導(dǎo)方式，與動(dòng)畫的配合，創(chuàng)新幾個(gè)角度進(jìn)行了總結(jié)。許多是大家已知的想法，在這里僅做簡單的梳理；而引導(dǎo)方式、與動(dòng)畫的配合等，希望大家能有更多的思考，因?yàn)橥ㄟ^動(dòng)畫、轉(zhuǎn)場、擬物等方式，可以使注意力與流程更加流暢，同時(shí)貼合現(xiàn)實(shí)世界，從而有助于手勢的抽象性、需記憶性的克服。閱讀全文

一、空間感帶來的心理感受

作為專業(yè)的頁面構(gòu)建工程師，除了在專業(yè)技能上有很高的要求以外，還需要具有一定的對設(shè)計(jì)圖的審稿能力。審圖，并非是意味著追求跟PSD一模一樣，甚至耗費(fèi)大量時(shí)間截屏跟PSD去“對像素”。在我的理解中，審圖是通過對UI設(shè)計(jì)稿的分析，充分理解UI設(shè)計(jì)師的意圖，再結(jié)合UE的交互狀態(tài)，從中做到真正的“還原設(shè)計(jì)稿”。

事例一：有取有舍，方是領(lǐng)悟

比如，在這樣一張?jiān)O(shè)計(jì)稿中

攝影構(gòu)圖的畫面設(shè)計(jì)，最重要的一點(diǎn)就是構(gòu)圖的均衡美。

只是我們?yōu)槭裁匆獦?gòu)圖？目的是什么？

首先構(gòu)圖不能成為目的本身，因?yàn)闃?gòu)圖的基本任務(wù)，是最大的可能闡明藝術(shù)家的構(gòu)思

構(gòu)圖的目的是：把構(gòu)思中典型化了的人或景物加以強(qiáng)調(diào)、突出，從而舍棄那些一般的、表面的、繁瑣的、次要的東西，并恰當(dāng)?shù)匕才排泱w，選擇環(huán)境，使作品比現(xiàn)實(shí)生活更高、更強(qiáng)烈、更完善、更集中、更典型、更理想，以增強(qiáng)藝術(shù)效果?？偟膩碚f，就是把一個(gè)人的思想情感傳遞給別人的藝術(shù)，這話可真切地表達(dá)了構(gòu)圖的目的。