WEB設計經驗 來自Microsoft設計主管

2021-04-14 12:20:22 字數 4259 閱讀 5193

--網路家園 

作為設計主管,

peter stern

已經領導

microsoft.com

搜尋和註冊等聯機功能。

他為幾個內部工具設計了使用者介面,並且正致力於建立將於今年晚些時候發布的下一代主頁。

從頭銜上,您可能認為我主要關心的是

microsoft.com web

站點幾千個網頁的版面設計。的確,這些確實是我所關注的。視覺上的吸引力是重要的,但是這僅僅是工作的一小部分。而最終的目的是確保整個站點運轉正常。

我的意思是,人們通常在訪問

microsoft.com

時,並未將它當作藝術作品來讚賞。而是為了獲得有關產品的資訊,或者有一些技術問題需要諮詢,或是閱讀有關開發商的期刊。所以**的設計應該盡量清楚和有條理,以便他們能夠容易地找到所需資訊。

設計站點

在進行web

設計時--

在設計過程中

--形式應該服從功能。這種方法應用於我們站點的整個設計過程中。當然,我們有最新的

web

工具,並且能夠將各種可視的小配件上載到網頁上。但是我們認為這樣做將不利於為訪問者提供有效的服務。事實上,我經常發現一些站點未將重點放在功能上。

常見的錯誤包括:

使用者介面元素不一致。例如,同乙個控制項在不同的頁面上功能不同,或者同乙個功能對應幾個使用者介面控制項。

導航欄位置不一致。決定站點的哪些頁和功能需要在站點的任何頁上都可被訪問到。這就是應該保持一致性的「全域性導航欄」。

不太注意或根本不注意基本的圖形設計原則,例如排版式樣、色彩和版面的設計。

相關元素和功能的隨意分組。注意將元素放置在網頁上的位置和目的。這可幫助訪問者從其它相鄰的選擇和位置來推斷某個鏈結的功能。

使網頁過於龐大以至使訪問者需要通過典型的數據機速度的

internet

現在的web

站點仍然存在很多問題,這並不奇怪。畢竟,

web

設計「藝術」相對來說還是個新生事物。在

四、五年以前,

web

頁甚至是普通的。那時,人們好像認為他們的

web

站點將會吸引訪問者只是因為它們存在

--如今的

web

設計師們已經吸取了前人的經驗和教訓。好的站點傾向於簡化和快速,同時在功能上有所提高。這是

microsoft

的目標,而且我們最先承認自己所犯的錯誤(參閱「

microsoft

的web

簡史」看一看以前的主頁設計)。

設計錯誤並不總是顯而易見的。有時在設計上對乙個小元素的移動或更改將有很少或根本沒有影響。但是,在其它情況下,它可能確實會對頁面功能有所影響。而且如果說我們從過去幾年學到了一些東西,那就是小的改動會使

web

頁的執行方式有很大的不同。

明確的流程

若要避免類似問題,我們為新服務(例如「搜尋」)的建立或關鍵的

web

頁(如主頁)設計了乙個明確的流程。

每個專案都是在一定的基礎上開始的,即我們有乙個受益於我們站點上的頁面、部分或使用者介面元素的產品或服務。在早期的產品計畫階段(第

1 階段),我被要求設計一些初級模型:大致描述頁面、部分或功能的草圖。然後產品專案組檢查產品計畫建議,看看此項服務是否可以為

microsoft.com

的訪問者真正帶來一些實惠。

如果答案是「可以」,那麼此專案會獲得批准,我們開始寫專案說明書(第

2 階段)。我們在第

1 階段的草圖和概念基礎上建立並提出乙個更為完整的計畫。這時,我們一般還會開始可用性測試(一般會有書面的模型)以了解潛在使用者將對計畫中的設計做出何種反應。

在最後開發階段(第

3 階段),我們建立執行計畫服務的

web

原型,並且進行全面的可用性測試以及內部複查。然後完成站點的**,修改程式錯誤,最後站點通過實際運轉的

web

站點向客戶發布。

正如您所見到的,可用性在整個流程中扮演著重要的角色(參閱「建立有效的

web

介面需要認真計畫」)。我們可以為使用者執行某項任務計時,這樣我們就可以在產品以後的版本中對比相同的測試。我們可以使用這種方法進行度量,以確定乙個功能的重新設計是否為客戶帶來任何真正的價值。

還有,我們將仔細地觀察以了解可用性物件是否可以計算出如何正確使用新功能

--我們稱為「可發現性」的方法。有時這為我們提供了一些挑戰。例如:在我們的站點上,在

搜尋引擎

中鍵入乙個片語或字會產生一列結果。然後我們請使用者選擇在這些結果中進行搜尋,以便進行更細的搜尋並且導向某一頁或資源。但是即使「在結果範圍內搜尋」被明顯地標記在深色標籤上,很少有人熟悉它。一些使用者認為他們正開始新的搜尋,並且可能毫無結果。我們正在解決這個問題以確保客戶可以利用

microsoft.com

上所有豐富的功能來提高他們對此站點的認識。

選項「在結果範圍內搜尋」看上去很直觀,但不是非常易發現的。此問題一直是困擾我們的設計的問題之一。

最後階段

大體來講,站點設計是在發生衝突的需要之間求得平衡的藝術。一方面,我要將站點設計得盡量簡單易用。另一方面,我要確保站點中所有強大的工具可為經驗豐富的使用者所用。與此同時,我還要為內部客戶服務

--microsoft

產品專案組

--他們對服務有特殊的需要。所以每天我都要解決一些非常困難的問題,經常處於很緊迫的情形中。我發現這種工作是鼓舞人心和有趣的。

這個職業非常需要更熟練的專業人員。我是經過一系列非常不一般的過程

--在大學學習圖形藝術,然後在多**公司設計

cd-rom

,最後加入

microsoft

並開發應用程式

--才獲得這個職位的。非常奇怪的是,當我申請(並獲得)這份工作時,我以前從來沒有設計過

web

頁。但是我廣泛的設計經歷已經證明是非常有用的,並且我自認為已經驗證了格言「成功的設計就是成功的設計」(不論是什麼**)。許多設計問題對

web

來說是獨一無二的,解決這些問題的方法對於任何**都是一樣的。

對於那些準

web

設計師我的建議是,他們也應該盡可能地擴大設計背景。今天應該確保將一些

web

工作作為互動設計培訓的一部分

--大多數好的設計學校已將其加入課程中。但是在排版、色彩理論、版面設計以及生產等方面的紮實的技術將仍然特別有價值。

在未來,

web

設計師們仍將會繼續被要求給頁面增加更豐富的多**內容,從而為

web

站點的可視性和可操作性增加了新一級的複雜性和技術要求。作為

cd-rom/

web

設計師也將向這些領域發展。

對於屬於

microsoft.com

的我們--

以及在internet

上的其它地方

--那應該是乙個非常有趣的未來。

了解您的觀眾。

調查一下究竟哪些人在訪問您的站點,以及他們為什麼要訪問。新手或不定期上網的

web

使用者與軟體開發商相比有非常不同的興趣和站點需要。

使您的站點對訪問者來說有所幫助。

為您的觀眾提供所需的資訊。使導航元素保持一致,並且確保對訪問率最高的區域進行明顯的標記,是它們易於被找到。

使用清楚的訊息

確保使用者了解此頁面的上下文,並且知道需要他們做些什麼。如果在註冊過程中您要使用者輸入姓名,那麼就直截了當地說。不要讓訪問者自己計算什麼,他們會感到沮喪,於是轉到其它更簡單的站點(例如您的競爭對手的站點!)。

保持一致性

雖然更改不同

web

頁的外觀並不難,但這並不意味著您應該這麼做。將主要功能

--例如返回「主頁」的鏈結或者執行乙個搜尋

--放在每頁的相同位置。在

microsoft.com

上,黑色全域性導航工具欄的位置在四十多萬頁上都是一樣的。

使站點可用

牢記設計和測試站點的可用性。確保使用者可容易地執行任務以獲得所需資訊。估算任務時間和任務完成率,然後努力進行改善。如果新的設計沒有在這些方面獲得改善,那麼就不要實施它。重新從草圖(或最初的計畫)開始並嘗試其它方法。

保持簡潔

說起來容易做起來難。嘗試徵求反饋意見。

有時新人可以很容易找到解決方案。

嘗試新的東西

不要害怕打破常規,嘗試一些完全不同的東西。如果您不試試,永遠不會找到真正的答案。

WEB設計經驗 來自Microsoft設計主管

網路家園 作為設計主管,peter stern 已經領導 microsoft.com 搜尋和註冊等聯機功能。他為幾個內部工具設計了使用者介面,並且正致力於建立將於今年晚些時候發布的下一代主頁。從頭銜上,您可能認為我主要關心的是 microsoft.com web 站點幾千個網頁的版面設計。的確,這些...

來自雅虎效能團隊的web架構設計經驗分享

架構設計的幾個心得 一,不要過設計 never over design 這是乙個常常被提及的話題,但是只要想想你的架構裡有多少功能是根本沒有用到,或者最後廢棄的,就能明白其重要性了,初涉架構設計,往往傾向於設計大而化一的架構,希望設計出具有無比擴充套件性,能適應一切需求的增加架構,web開發領域是個...

經驗 (來自前輩)

解決產品線上的實際問題,比學習新技術更重要。幫助別人解決問題,是提高能力的捷徑。所謂專家,就是在乙個有限的領域裡,把所有的錯誤都犯過一次。拓展興趣,堅持學習。不要囿於技術一隅。和提高技術能力同等重要的是,深入學習 理解你所在的行業。技術是為市場服務的,理解產業鏈的上下游 公司的運營方式 產品的贏利模...