移動部分設(shè)計：視覺設(shè)計
作為平臺能力的直接反應(yīng)，第一移動網(wǎng)站是一個運動的“妥協(xié)”而不是“工藝”。今天的功能更齊全的設(shè)備，但是，讓我們有機會創(chuàng)造更多的視覺上的設(shè)計，不僅能激發(fā)和吸引用戶，但也增加經(jīng)驗的可用性。然而，隨著這個機會也有新的挑戰(zhàn)。

進(jìn)入1部分：信息架構(gòu)我們探討是什么使得在物質(zhì)和規(guī)格方面的桌面移動不同；如何，在哪里，當(dāng)我們使用移動設(shè)備；以及我們?nèi)绾问褂眠@些設(shè)備時的行為和感受。然后，在2部分：交互設(shè)計我們看著影響這些差異在發(fā)展的結(jié)構(gòu)和功能。這兩篇文章在手機和平板電腦設(shè)計提供依據(jù)。現(xiàn)在我們總結(jié)設(shè)計移動通過必要的探索視覺設(shè)計方案和相關(guān)的最佳實踐，產(chǎn)生美麗的三部分研究中，可用的應(yīng)用程序。
我們先看看移動的物理約束的設(shè)計，包括最佳實踐指南，然后我們再看看設(shè)計通信：利用視覺設(shè)計支持的移動網(wǎng)站和應(yīng)用程序的內(nèi)容。

對于物理約束設(shè)計
物理形式和手機和平板設(shè)備的觸摸屏界面為我們提供了一些基本的可用性的考慮。在一個桌面用戶可以掃描在更廣闊的領(lǐng)域的內(nèi)容或懸停在進(jìn)一步的信息元素，移動用戶都集中在一個較小的區(qū)域，必須以不同的方式演繹的相互作用。牢記定義移動布局和移動的特異性相互作用的細(xì)節(jié)，我們可以創(chuàng)建一個直觀的

移動體驗。
可用的布局
有限的可用空間在手機屏幕上提供了一個有趣的約束在如何最好的展示內(nèi)容和互動。具體的布局需要精簡和集中。
•的布局結(jié)構(gòu)–提供強有力的基礎(chǔ)設(shè)計需要考慮如何最好地利用可用的屏幕空間。網(wǎng)格系統(tǒng)幫助設(shè)計師實現(xiàn)：結(jié)構(gòu)均勻間隔的垂直線作為安排內(nèi)容指南。網(wǎng)格確定活動空間，這使得設(shè)計師確定按鈕，最有效的配置更容易的標(biāo)題，或圖像。安裝這些組件沿網(wǎng)格可以讓用戶在他們的旅程，同時創(chuàng)造一個清潔、美觀的視覺。
 
•空間滾動和滑動–至關(guān)重要的是，用戶可以瀏覽內(nèi)容不承諾行動，他們沒有意愿，沒有激活一個項目時，他們試圖滾動。換句話說，元素之間的間距必須足夠讓用戶能夠方便地瀏覽這些元素。

友好的用戶交互
觸摸屏界面的移動設(shè)備上也意味著視覺設(shè)計必須加強相互作用；換句話說，大小和元素的位置應(yīng)保證使用方便，和指示的重要性和相關(guān)性的行為。
•按鈕災(zāi)區(qū)–我們討論2部分：交互設(shè)計，適當(dāng)?shù)某叽绾烷g距的按鈕將確保他們可以很容易地激活。理想情況下，按鈕應(yīng)該44px和57px之間在標(biāo)準(zhǔn)屏幕和88px到114px對高密度屏幕（視網(wǎng)膜）。這允許足夠的地區(qū)很容易激活一個按鈕一般的指尖。
•可達(dá)性和明顯的控制–如果相關(guān)互動項目是觸手可及的對方會讓用戶更快速地使它們之間的過渡。這將有助于減少任何混淆用戶可能在如何相互連接，加快更復(fù)雜的過程。
為了加強溝通，我們需要讓我們?nèi)绾卫斫夂徒庾x信息的最佳使用。人類大腦對視覺信息比語言快得多，這意味著它可以使用視覺和圖像增強溝通非常有價值。好的視覺造型將增添價值，支持的內(nèi)容或交互的目的，并提高整體的用戶體驗（移動和桌面）。

垂直的節(jié)奏
第一加強溝通我們會考慮是垂直節(jié)奏的運用。信息架構(gòu)創(chuàng)建一個合理的流程內(nèi)容，然而視覺設(shè)計可用于在內(nèi)容的視覺層次創(chuàng)造進(jìn)一步明晰。在內(nèi)容部分的大小和間距合理的使用將創(chuàng)造一個良好的垂直節(jié)奏支持的內(nèi)容層次的溝通。
 
除了垂直網(wǎng)格系統(tǒng)前面所提到的，一個基線網(wǎng)格可以幫助創(chuàng)造一個良好的垂直節(jié)奏，使內(nèi)容更容易閱讀和理解。具體來說，基線網(wǎng)格創(chuàng)建一個結(jié)構(gòu)雖然線的高度規(guī)范。這個定義的字體和大小提供了明確的領(lǐng)導(dǎo)水平的規(guī)則，但也可用于定義內(nèi)容組之間的間距。遵循這些規(guī)則將確保段落復(fù)制清晰，用戶可以清楚的區(qū)分和功能組之間的部分。基線網(wǎng)格很難準(zhǔn)確執(zhí)行在HTML和CSS，但不提供有用的指導(dǎo)，在開發(fā)和設(shè)計過程中的間距尺寸。

使用的顏色
顏色是一個非常有價值的交流工具，可以用多種方式支持內(nèi)容和相互作用。
•傳達(dá)一種色調(diào)或風(fēng)格色彩設(shè)計是很主觀的，依賴于個人經(jīng)驗和文化。然而，使用特定的音調(diào)和色調(diào)可以幫助傳達(dá)的目的的一個整體印象。明亮大膽的顏色，創(chuàng)造出一種樂趣，暗色調(diào)創(chuàng)造一種優(yōu)雅而柔和的色調(diào)或氣氛更灰可以創(chuàng)造一種復(fù)古的感覺。學(xué)習(xí)更多關(guān)于色彩理論有助于我們選擇最適合的設(shè)計目標(biāo)的顏色。
•區(qū)分部分顏色可以用來突出內(nèi)容的項目，說明項目是相關(guān)的，或支撐結(jié)構(gòu)的內(nèi)容如內(nèi)容如何分離。
 
•區(qū)分靜態(tài)項和交互的功能，用強烈的對比將有助于溝通差異的目的或內(nèi)容或功能之間的聯(lián)系。使用混合的中性和明亮的顏色，或顏色在色輪結(jié)束反對將確保具體項目脫穎而出，給用戶。創(chuàng)建一致的顏色的使用，例如在靜態(tài)的、活躍的和不活躍的項目，整個設(shè)計也將展示內(nèi)容和功能的差異更明顯。
隱喻可以用不同的方式來支持通信的消息或主題。
•支持一個潛在的主題-隱喻可以超越一個單一的設(shè)計元素，而成為設(shè)計或功能的一個關(guān)鍵主題。在Flipboard應(yīng)用，翻轉(zhuǎn)過渡是用戶互動的一個組成部分，和本的順利實施是在應(yīng)用程序的成功的一個因素。用一個比喻這樣可以讓概念的快速通信的用戶，以及幫助應(yīng)用程序都有一個獨特的命題。
 
•按鈕和交互設(shè)計時使用簡單的借殼按鈕可以有一個簡單的方法來模擬現(xiàn)實生活中的互動元素，使功能明顯。然而，值得注意的是，如果奉承方式必須符合品牌或風(fēng)格指南那么可以有效如果顏色和樣式可以明確區(qū)分靜態(tài)項目。Wunderlist采用按鍵與現(xiàn)實造型
•影像學(xué)圖標(biāo)可以設(shè)計移動時，在有限的屏幕空間允許的復(fù)雜概念的快速通信。使用視覺隱喻的圖標(biāo)是圖標(biāo)，已經(jīng)成為網(wǎng)絡(luò)標(biāo)準(zhǔn)，如刪除，攝像頭，和電子郵件圖標(biāo)我們提及，意味著他們可以經(jīng)常工作沒有標(biāo)簽，雖然可以理解的一瞥。設(shè)計簡單，卻清晰的圖標(biāo)是一個具有挑戰(zhàn)性的任務(wù)，所以重要的是要了解如何圖標(biāo)影響你設(shè)計的清晰性。

移動的未來
一個清晰的認(rèn)識和標(biāo)準(zhǔn)的約束，如本系列介紹，有任何移動的設(shè)計師。然而，一旦我們掌握了這些，才能有超越的指引的能力；打破規(guī)則和推動創(chuàng)新創(chuàng)造出燦爛而獨特的。這樣，隨著不斷的用戶考慮，允許我們創(chuàng)建功能和美學(xué)理想的平衡。
設(shè)計的移動有一些非常激動人心的挑戰(zhàn)和機會在它前面。科學(xué)技術(shù)的迅猛發(fā)展和用戶環(huán)境的不斷變化意味著今天的約束，不可能在未來幾年存在。創(chuàng)新思維和創(chuàng)新能力，將有助于我們發(fā)掘看待這些挑戰(zhàn)的新方法，并允許我們繼續(xù)尋找新的、美麗的和有用的在我們前面的設(shè)計問題的解決方案。

牧羊人設(shè)計文章推薦：

與主題預(yù)做布局
網(wǎng)站專業(yè)人員的工具
你的網(wǎng)頁網(wǎng)頁創(chuàng)意生涯