譯者注：人腦處理圓形中的信息更加快和有效，設(shè)計(jì)得當(dāng)可兼具良好的使用性以及更大的吸引力，本文以移動(dòng)設(shè)備為例，這一類設(shè)備恰好是使用圓形的指尖形狀，為設(shè)計(jì)提供了更大的自由度，本文適合移動(dòng)端設(shè)計(jì)的同學(xué)以及對此感興趣的同學(xué)，不僅從交互上并且從視覺上都能夠?qū)σ詧A形為基本元素的設(shè)計(jì)起到一定的啟發(fā)作用。

原文地址：http://designmodo.com/mobile-apps-circle/

圓形被認(rèn)為是能夠被人眼最快識別出的對象之一。這就意味著我們的大腦有能力處理在圓形中的信息比處理在常規(guī)的三角或矩形中的數(shù)據(jù)略快一些。對于小型的以手勢為基礎(chǔ)的交互界面中，這種能力真的非常關(guān)鍵。這一點(diǎn)對移動(dòng)設(shè)備來說尤為典型，在大多數(shù)的情況下，這成為了選擇基本UI元素形狀的決定性因素。賞心悅目的曲線取代了尖銳邊緣，有助于營造一種溫暖舒適的氣氛，讓感觀愉悅。它有效地增強(qiáng)了用戶體驗(yàn)，讓交互界面簡單而明了。

選擇圓形一個(gè)最普通的原因就是它模仿指尖的形狀的能力下意識也將圓形元素與按鈕聯(lián)系在一起。因此，作為一條規(guī)律，你很容易發(fā)現(xiàn)行為召喚的按鈕(call-to-action buttons)應(yīng)用在環(huán)形結(jié)構(gòu)后，有相當(dāng)一部分應(yīng)用程序大肆地在設(shè)計(jì)中使用這一形狀。例如，音樂導(dǎo)向的應(yīng)用，或者是可視化的鬧鐘以及時(shí)鐘都離不開環(huán)形結(jié)構(gòu)。

本文的選例都是帶有明確的圓形風(fēng)格的移動(dòng)交互界面，這些界面自然地融入了UI流暢性，更多的可用性和吸引力。

Eli Williamson設(shè)計(jì)的Lock Screen Concept使用絢麗的相片背景來吸引用戶的注意力。緊湊的排版，醒目的圓形圖案以及主體的白色給應(yīng)用增加了雅致與空間感。

　　Cüneyt ?EN設(shè)計(jì)的Timer有著綠色的發(fā)光風(fēng)格。近似霓虹閃爍式的圖標(biāo)及帶有光效圓形在黑暗的純色背景下非常顯眼。

　　Timm Kekeritz設(shè)計(jì)的Partly Cloudy被貼上了懷舊的標(biāo)簽。柔和的調(diào)色板，新穎的旋鈕，復(fù)合的畫布營造出一片舊日情懷。

　　Marco Nenzi設(shè)計(jì)的ClapUp由于逼真的旋鈕和按鈕，新穎的時(shí)鐘以及質(zhì)樸的白色背景而看起來清爽而且高端。

　　Jakub Antalík設(shè)計(jì)的Coffely，由于扁平風(fēng)格的精彩應(yīng)用簡潔而自然地呈現(xiàn)出準(zhǔn)確而輕快的界面。

　　Circle在整個(gè)設(shè)計(jì)中都應(yīng)用了圓形元素，從頭像顯示，狀態(tài)通知以及其它按鈕都用到了圓形。

　　Megamegacube設(shè)計(jì)的Quotes app讓事情保持簡單易懂，將時(shí)髦的紅色背景，平實(shí)的白色的圖案元素以及常規(guī)字體巧妙地結(jié)合在了一起。

　　Corey Liu設(shè)計(jì)的Charging Animation采用了現(xiàn)實(shí)主義方式。設(shè)計(jì)師巧妙地將生活元素植根于帶有綠色液體的中心圖標(biāo)中，使它看起來栩栩如生且魅力非凡。

　　Michael Sambora設(shè)計(jì)的Bikester #2 wip展現(xiàn)了淡色與一系列精致細(xì)節(jié)刻畫核心部件相結(jié)合產(chǎn)生的有力的視覺沖擊。

　　Tomá? Zeman設(shè)計(jì)的Company Income App基于Metro 8美學(xué)，出色的集成了淡淡的二維單色圓形元素及大量自由空間。

　　Nate Dicken設(shè)計(jì)的Foresee – Let’s Go Swimming!特意注入了一些明亮的顏色來使交互界面看起來明亮而歡快。

　　Boris Valusek設(shè)計(jì)的Superminds呈現(xiàn)出慣用的水平條紋式的布局，每一行都包含著圓形頭像和小標(biāo)題。

　　Zahir Ramos設(shè)計(jì)的Laundry Master App，通過完美集成擬物化洗衣機(jī)相關(guān)按鈕和旋鈕和驚艷的刻畫，吸引了常規(guī)客戶，從而在這類應(yīng)用中獨(dú)樹一幟，脫穎而出。

　　Ben Dunn設(shè)計(jì)的Napp App成功應(yīng)用一些整齊微妙的整體控制牢牢地抓住了用戶的注意力。

　　Alex Bender設(shè)計(jì)的Movenpick app是一個(gè)美食相關(guān)應(yīng)用。通過用令人垂涎的冰淇淋球照片在交互界面增加圓形風(fēng)格，描述了可以買到的產(chǎn)品的整體多樣性。

　　Vlad Mereuta設(shè)計(jì)的WheelTunes，是一個(gè)基于手勢的帶有很棒音樂氛圍的播放器。中心圓形頭像主圖標(biāo)也起著播放進(jìn)度條的作用。

　　Simon用幾乎所有空白背景，基本的圖形框架和潦潦幾筆文字宣揚(yáng)著最小化設(shè)計(jì)風(fēng)格。

　　Michal Ratajczak設(shè)計(jì)的Trail Offroad Nightmode給人一種模糊的感覺。應(yīng)用類似60年代的圖標(biāo)以及受到鐘表界面的啟發(fā)計(jì)算機(jī)字體，在深色背景的襯托下，增添了UI的復(fù)古情趣。

　　Uriel Albarran O. 設(shè)計(jì)的Mixer elements刻畫了占據(jù)了整個(gè)空間的逼真而精致的黑色輪盤。

　　Louis Saville設(shè)計(jì)的Hack Day App Preview擁有和諧的藍(lán)色風(fēng)格，并出色地被白色相關(guān)加粗樣式和可辨識的圖標(biāo)所補(bǔ)充，體現(xiàn)了很商務(wù)的感覺。

　　Ismail MESBAH設(shè)計(jì)的Phone App UI – Party Maker運(yùn)用跳動(dòng)顏色的混合，和俱樂部主題高度模糊的背景、光滑的粗字體以及派對導(dǎo)向的圖標(biāo)都非常地搭調(diào)。

　　Celia Sun設(shè)計(jì)的Celia’s Weather傳達(dá)出歡快與清澈的感覺。主體的淺灰調(diào)色系，略微膨脹的旋鈕，精巧的陰影，準(zhǔn)確注入的明亮元素，讓交互界面顯得簡潔細(xì)膩。

　　Frantisek Krivda設(shè)計(jì)的Flat Style Color Wheel通過顯眼的由藍(lán)色到白色漸變的圓環(huán)來展示數(shù)據(jù)。

　　Ali O. ??設(shè)計(jì)的Gas combi remote control app是由精巧的圖案、和諧的調(diào)色盤、漂亮的光和影創(chuàng)造出來的。

　　Samuel Bednár設(shè)計(jì)的Alarm Clock App通過交錯(cuò)的樣本刻畫出了非同尋常的鐘表界面，所有元素都是扁平風(fēng)格的設(shè)計(jì)。

　　Arles Festival, iPhone App V2.0利用有吸引力的輕少女風(fēng)格的導(dǎo)航系統(tǒng)?；诰W(wǎng)格，菜單上的每個(gè)項(xiàng)目都有著精細(xì)的點(diǎn)畫筆觸、線框圖標(biāo)和優(yōu)雅的大寫字母。

　　Myroslav Galavai設(shè)計(jì)的Plant monitoring tool擁有自然啟迪風(fēng)格的UI，展現(xiàn)了非常棒的照片操作、相片集按鈕和纖維質(zhì)感的背景。

　　Ronge Ruan設(shè)計(jì)的HR Alarm Clock利用大量圖案元素添以充滿活力的效果。明亮的放射狀漸變和淺色背景帶來了積極的情緒。

總結(jié)

圓形風(fēng)格的應(yīng)用程序交互界面非常常見。旋鈕、按鈕、開關(guān)、進(jìn)度條、頭像以及其他種種經(jīng)常以圓形出現(xiàn)，并添以振動(dòng)狀漸變、巧妙的陰影、精細(xì)的圖標(biāo)、單色扁平感及易辨識的風(fēng)格。這一形狀對于基于手勢的iPhone和其它智能手機(jī)的交互界面并不驚奇。

圓形感覺的交互界面看起來很現(xiàn)代和高級嗎?它們?nèi)菀妆蛔R別嗎?圓形能夠增加應(yīng)用的可用性嗎?請通過評論來和我們交流你的觀點(diǎn)。

來源：騰訊ECD