淺談移動端和桌面端的區(qū)別（上）

好久沒有更新了，先預(yù)熱一下，由移動端轉(zhuǎn)向桌面端已經(jīng)有幾個月了，做下總結(jié)，淺談一下兩者的區(qū)別

前言：

2008年之前，那時候還是主要是以桌面端，但隨著3G網(wǎng)絡(luò)的普遍和移動端手機的普及，幾乎達到人手一臺手機，從以前只有電腦能用的軟件，搬到了小巧的 移動端，互聯(lián)網(wǎng)用戶暴增，從那時候開始移動端和桌面端就開始了酣戰(zhàn)，到現(xiàn)在市面上幾乎被手機端占領(lǐng)，做桌面端的設(shè)計師越來越少了，大部分都在做移動端。

開門見山，移動端和桌面端最根本的區(qū)別就是屏幕的大小。屏幕的大小決定的信息的容納量，pc端一個頁面可以展示完全的信息可能需要移動端好幾個頁面來承載。 這就導(dǎo)致了移動端的界面多又深，桌面端的界面少有淺，但有的設(shè)計師就會感覺小屏到大屏，大屏到小屏做一下自適應(yīng)就好了，（比如如果把桌面端做成響應(yīng)式 顯示在移動端，但是由于屏幕的限制導(dǎo)致信息的承載量有限，移動端的頁面就會相對加長，顯然這是一個很簡單的處理方式，但是大部分設(shè)計師都忽略了一個問題 ，用戶愿不愿意滑動，這樣就會導(dǎo)致一些重要的信息無法一屏顯示，相繼導(dǎo)致曝光率和點擊量就會大幅度下降，如果是一些比較重要的內(nèi)容，那就得不償失了，所以設(shè)計不能偷懶。

場景差異：

桌面端產(chǎn)品使用起來場景更加正式，移動端產(chǎn)品更多的碎片化時間。PC端使用場景，室內(nèi)、桌椅、長時間；移動端使用場景，任何時間、任何地點。如果只是看幾分鐘，用戶 一般不會選擇打開電腦，而是直接在手機作滿足自己一定的需求。隨著5g網(wǎng)絡(luò)的普及，4g資費的下調(diào)，人們在等車、坐車、排隊時碎片化的使用方式一定會增加。這時用手 機填滿自己碎片化時間的次數(shù)越來越多，但是桌面端也有他不可替代的一面，比如一些比較重的軟件，簡單舉例（Ps，Ai，等一些設(shè)計軟件），都是以桌面端為載體，桌面端 畫圖更精細(xì)，鼠標(biāo)更靈活，使用起來更方便，用戶體驗更好。（所以說各有各的優(yōu)點，總結(jié)來說桌面端就是胖客戶端，手機端就是瘦客戶端）一個比較重，一個比較輕巧。

作步驟：

移動端： 一個頁面，一個任務(wù)，因為移動端用戶使用環(huán)境更加的復(fù)雜多變，更容易受到干擾，所以必須保證界面信息的簡單直觀。 頁面承載量有限，如果在一個頁面信息過多 作起來不方便，容易讓用戶混亂 這里所說信息量并不是指絕對信息量，更準(zhǔn)確的說法應(yīng)該是用戶主觀感受上的信息量。同樣的幾個輸入框，可能在pc端只占了頁面的1/4左右 而在移動端就需要一整個頁面來承載這1/4的信息，給用戶的感觀是完全不一樣的。如果頁面塞的滿滿當(dāng)當(dāng)，容易讓用戶焦慮，還會導(dǎo)致用戶不斷地作滑動頁面，更容易產(chǎn)生 焦慮心里。

桌面端： 一個頁面，多個任務(wù)，桌面端毋庸置疑，屏幕大，信息承載量大，作步驟都會呈現(xiàn)再一個頁面上，無需跳轉(zhuǎn)界面，直接可以就地作，幾乎可以覆蓋大部分的中小型 功能，在硬件得限制下，設(shè)計上還是和移動端區(qū)別很大。

前幾天看到關(guān)于桌面端的文章，借用文章的一句話用到此處，大致可以總結(jié)為，移動端，界面多又深，桌面端，界面少又淺，但是又有人問了，移動端這么多步驟，用戶不會焦 慮嗎？難道不害怕內(nèi)容多嗎？不會，在作步驟時，頁面的內(nèi)容量用戶一眼都能看出來，并且不知道有多少步驟，不知不覺中就已經(jīng)作完了，有一句話說的好，無知無畏，因 為無知，所以無畏。

交互差異：

移動端： 移動端特有的交互方式，觸屏滑動作，相對來說沒那么精準(zhǔn)，現(xiàn)在的智能手機還有很多手勢交互，比如屏幕或者頁面之間自由滑動切換，滑動條目進行刪除，滑動解鎖，側(cè)滑呼出菜單等，還要要考慮屏幕尺寸及布局方式的不同，特別說交互方式采用手指點擊的交互方式而非鼠標(biāo)，考慮拇指的最小觸控范圍，交互方式的設(shè)計也各有千秋。移動端還有各種傳感器，比如錄音、拍照、錄視頻、藍牙、wifi、LBS、NFC、GPS、重力感應(yīng)、push推送、定位精度等，pc端都不具備的。

桌面端： 用戶和界面是通過鼠標(biāo)和鍵盤進行交互，點擊精準(zhǔn)，交互方式比較多，比如最常見的單擊、雙擊、右擊、hover、拖拽、框選、滾輪滾動、長按拖拽滾動，以及鼠標(biāo)箭頭的各種狀態(tài)等等，交互方式多樣，鍵盤輸入的話對比移動端的軟鍵盤來說更方便，有更多的快捷鍵，方便用戶使用，用戶的輸入成本更低。

設(shè)計上需要考慮： 比如一個簡單的按鈕，需要做一個默認(rèn)、一個hover（懸停）、一個點擊、一個置灰，但是一般情況下只需要做兩態(tài)就行，默認(rèn)和懸停，還有就是有各種的導(dǎo)航體系，如網(wǎng)站地圖、樹狀導(dǎo)航、面包屑導(dǎo)航等，還可以開發(fā)新的體系，他沒有一個固定的規(guī)范，但是移動端呢又恰恰相反，移動端 app交互設(shè)計需要參考平臺作系統(tǒng)的設(shè)計規(guī)范，基于ios和android上來說，基本上都是google和Apple制定的標(biāo)準(zhǔn)說的算，移動端上的導(dǎo)航呢就會有標(biāo)簽欄代替。

布局差異：

移動端布局是縱向排版，桌面端橫向排版縱向排版都會有，簡單來說，就說移動端是一維布局，桌面端是二維布局，手機屏幕展示內(nèi)容有限，內(nèi)容一般都是縱向排，桌面端 屏幕空間大，能容納的信息量也多，布局上也更多樣，不僅有縱向，還會有橫向，但是大多是以橫向排版為主，避免像移動端一樣多次進行跳轉(zhuǎn)，從而達到就地作。

再同一個軟件，同一個功能下，移動端可桌面端的展現(xiàn)，和排版也是各有千秋，移動端需要多次跳轉(zhuǎn)，需要多個頁面，多個頁面的排版布局又不一樣，桌面端的話就比較簡單 了，交互上來說不需要多次跳轉(zhuǎn)，界面上只需要進行橫向排版就行，也不一定都是橫向排版，簡單來說是二維布局吧，也就是桌面端經(jīng)常說的多欄布局（為了更好的展示給大 家，就以微信收藏功能為例，很明顯可以看出，移動端需要的三張界面，而桌面端只需要一張就能很明了表達給用戶）

結(jié)語：

桌面端和移動端兩個不同的載體，設(shè)計語言和用戶的使用習(xí)慣都相差較大，所以在設(shè)計時還是要注意這些差異性，先總結(jié)一部分，后邊會在

就兩個平臺的的設(shè)計規(guī)范上進行具體的分析,謝謝大家觀看~

Powered by Froala Editor