網站計劃剖析:UI應遵守的三大網站計劃原則

若何為網站打造一個好口碑
2016-05-13
優化角度若何掌握好的域名
2016-05-13
Show all

網站計劃剖析:UI應遵守的三大網站計劃原則

  跟著技巧的退化,Web計劃的藝術和技能也在賡續退化。新的技巧發明瞭新的挑釁,而新的挑釁請求新的辦理計劃。我們平日事情在未知范疇,須要給出全新的辦理計劃。 斟酌到有限的Web計劃汗青,我們必需超出當前的范疇去答復更有挑釁性的題目。為此,我們能夠經由過程鑒戒其他沒有相幹范疇的成長汗青,如音樂,從中追求能夠贊助我們辦理題目的計劃。上面將枚舉一個18世紀初期關於巴赫的一個小故事。

  巴赫和《The Well-Tempered Clavier》1972年,巴赫完成瞭一部著作《The Well-Tempered Clavier》(《十二均勻律鋼琴曲集》),分高低兩卷,每卷各有24首前奏曲與賦格曲。如今它已被譽為西方音樂汗青中最主要作品之一。 在其時,為12個重要的琴鍵分離譜曲是完整弗成能的。而巴赫卻從團體上為全體的12個音作曲。恰是他的這套《十二均勻律鋼琴曲集》,終極向人們證實瞭十二均勻律是能夠用來作曲的,並且其後果之美好,從前的人們從不曾領會過。

  在這個進程,所采取的辦理計劃是從新界說瞭合調的觀點。經由過程修正必定的距離,使每一個琴鍵稍稍偏離完善的聲調,從而發生一種調音體系,許可人們在全部的琴鍵上吹奏出合調的琴樂。就義少許的個別品德以到達更完善的團體後果,被稱為均勻律。 該案例雖與網站計劃沒有相幹,但目標是一樣的:使每一個琴鍵都稍出缺陷,以便鍵盤團體表示完善。

  UI計劃師須要做甚麼?

  比來幾年,針對多裝備舉行計劃已成為Web計劃范疇最使人高興的開辟事情。從前重要存眷網站是不是能夠在兩個分歧閱讀器上運轉一般,如今則轉移到它是不是能夠在具有完整分歧特征的多種裝備上一般運轉,這些裝備具有分歧的屏幕尺寸、分歧的機能、分歧的應用情況及分歧的界面。 固然相應式計劃和針對裝備定制網站能夠贊助我們制造出針對分歧體驗的計劃,但仍有許多時刻我們必需做出同一的決議計劃。這時候,均勻律的觀點大概有些贊助。 該觀點在UI計劃中的運用一個簡略的進程:為瞭針對一系列分歧裝備計劃出好的體驗,我們必需許可某些界面湧現偶然的沒有完善。我們必需做出小小的讓步,以包管我們的計劃能夠很好地順應其他的情況。 觸摸優先計劃 具有均勻律特征的網站已將觸摸式界面應有到瞭比來的桌面網站計劃中。 在占用面積上,手指要大於鼠標指針,以是手指須要更大的觸控地區。為瞭確保可用性,交互元素須要更大。當交互元素的面積增大後,其他元素也須要響應的增大以堅持均衡。這就須要經由過程margin和padding兩個屬性來設定。

  新版Gmail計劃有大批的空缺地區,對按鈕設定瞭分外的Padding。固然它隻是針對桌面的計劃,但也能夠很好地兼容觸摸裝備。 iPad在觸摸界面和分歧巨細桌面屏幕之間搭建瞭橋梁。而iPad的風行加快瞭觸摸屏在桌面界面計劃中的影響。假如你不雅察一些剛經由從新計劃的有名產物,如Gmail,Twitter,你就會發明Web計劃已有顯著的分歧。他們看上去更飽滿。有更多的空缺地區,按鈕有更多的Padding,上面的元素團體看來增大瞭很多。固然,其他的身分也在施展感化,好比桌面屏幕尺寸的穩固增加。 當為鼠標供給瞭過量的空間,而對付手指來講,空間方才好時,我們的計劃就算完成瞭。我們許可與某體驗的尺度有稍稍的誤差,以得到對全部大概體驗的更好支撐。 有一點值得提出,對觸摸友愛的UI對付應用桌面鼠標的用戶來講,更容易用。輕易觸摸操控的按鈕,更輕易被點擊。

  微軟Metro作風的計劃遭到瞭觸摸優先思惟的影響

  相應式計劃,到達同一計劃的目標

  固然關於相應式計劃的許多評論辯論都是關於相應式計劃技巧的,但相應才能自己其實不是終極目的。它是到達目標的一種手腕。計劃具有相應才能,是為瞭到達其他的一些目標。大概為瞭支撐分歧的內容,辦事於低寬帶中傳輸的圖片,在更小的屏幕中更好地展現結構。也大概為瞭在大規模分歧的裝備上供給同一的體驗。 搭載相應式計劃的火車,能夠達到同一的用戶體驗計劃的目標地。

  Boston Globe網站在這方面做得很棒。

  Boston Globe精彩地將相應式計劃運用到瞭大型網站中 相應式計劃計謀可使一個簡略的計劃順應用戶瀏覽Boston Globe所應用的任何裝備(即使是Apple Newton)。這不但僅是前端工程師的功績。合營應用Media Queries和JavaScript兩種技巧,也能夠殺青這類後果。

  挪動優先計劃 之前的案例重要針對圖片計劃,但均勻律的觀點應當運用於產物計劃、用戶體驗、信息架構中險些計劃的其他任何范疇。讓我們看看產物計劃及挪動優先的計劃思惟。 從挪動裝備角度動身開端計劃進程,構建能夠知足挪動情況中各類限定的產物,你須要專註於產物的最主要元素上。正如Luke Wroblewski所表述的: 當團隊舉行挪動優先計劃時,終極是要打造一種體驗,該體驗重要專註於用戶願望完成的最重要義務,沒有任何的繞彎子與界面碎片。這對付用戶體驗和商務都是有益的。 Twitter比來的一次改版考證瞭這些原則。

  新版Twitter采取瞭繁復化計劃,在各類裝備上具有同等的體驗。 Twitter改版的目的之一是為瞭向用戶供給同等體驗,不管在電腦上照樣在各類挪動裝備上。得到同等的視覺和感觸感染體驗對付UI來講是一個挑釁,但全部產物在分歧裝備上得到同等的體驗則是更大的挑釁。針對這兩方面的挑釁,挪動優先計劃能夠幫我們完成。

  在Twitter的改版中,我發明瞭一件很風趣的事,即挪動體驗對全部產物計劃的影響。比方,除Tweet按鈕外,全部的行動按鈕均安排在Home、Connect、Discover、Me四個標簽上面。該簡略化的計劃在小屏幕裝備中運轉完善,四個項目也能在標簽欄中和諧相處。 在桌面網站中,固然新增瞭一些其他特征,但樹立在挪動版本基本上的簡練仍需存在。固然桌面版本上有大批的空間來完成更多的龐雜計劃,但計劃仍要有所束縛、有更好的順應性,以確保到達同等的多裝備體驗。

Comments are closed.