你是不是還在用PC的思路做移動端的設(shè)計？不要不承認，我剛開始平面轉(zhuǎn)網(wǎng)頁時怎樣做頁面都像DM單頁。不管承不承認我還是相信有一些設(shè)計師還是會這樣做的。那么什么是PC的思路？移動端的設(shè)計又該怎么表現(xiàn)？天權(quán)中國資深設(shè)計師與大家探討一下這個問題。

PC的思路

首先我們大致的過一下PC的思路。這對于大多數(shù)網(wǎng)頁設(shè)計師來說是一個很容易回答的問題，亦或者思路會比較清晰。首先是導(dǎo)航，接下來是banner，緊接著是內(nèi)容部分，之后是footer。這好像是一個完美的結(jié)構(gòu)邏輯，至少多數(shù)的客戶都能夠接受這樣的布局。接著我們再來說一下PC的設(shè)計元素都會用到哪些。在PC的元素中我們常見的應(yīng)該是箭頭吧，各種大小形狀的箭頭分布在不同的位置，起著同一個作用。還有什么？各種聯(lián)系、關(guān)注（QQ，微信，微博之類）、返回頂部的按鈕吧，還有更多和返回之類的按鈕。另外下拉菜單好像也是PC的標配。之后我們提一下PC的主流瀏覽方式，好像只有鼠標點點點，應(yīng)該沒有其他方式了吧。

移動端思路

說了這么多PC端的特點，其實對我們今天的主題只是鋪墊。我們先來反思一下在操作移動端項目的時候是否會經(jīng)常把以上的某些經(jīng)驗帶到項目中，而這些思路，元素真的是符合移動端項目嗎，符合用戶思維嗎，或者根本就是雞肋？究其原因，我認為很大的問題是智能移動設(shè)備的搭載功能和交互方式與PC有著天壤之別。就需要設(shè)計師在設(shè)計的過程中，更多的去考慮這些因素，呈現(xiàn)出來的功能引導(dǎo)要往這些方面靠攏。

以智能手機為例：手機搭載了傳感器：包括攝像頭、陀螺儀、麥克風(fēng)等設(shè)備；手機的主要交互方式是：手勢、滑動、長按、點擊、搖晃等。所以如果用PC的思路來做移動的設(shè)計時總會給人一種非常“別扭”的感覺。用戶的很多習(xí)慣被這種思路延伸出來的設(shè)計弄得很懵。舉個簡單的例子：PC端的banner經(jīng)常是長方形的矩形，當成比例搬到手機上是否會一種很擁擠的感覺？如果這個可以接受的話那在banner這個部分還可以舉出更直接的例子。PC的banner一般都會用箭頭的元素進行切換，但是當把箭頭搬到移動端上的時候是否會很雞肋？設(shè)想一下，你會在手機上去觸碰箭頭進行切換嗎？大多數(shù)情況下手機用戶都是用手勢滑動的交互方式進行切換。如果說你想要引導(dǎo)用戶這里有多張圖片，完全可以設(shè)計一些精致簡單的幾何圖形排列在圖片的下方，用戶自然不會去點擊指頭根本觸碰不到的小圖形也會意識到這里有多張圖片切換。這就是簡單的用PC思路做移動端的真實事例。

沉浸式體驗

另外，我覺得應(yīng)該用沉浸式的體驗進行移動端設(shè)計。沉浸式體驗——好像很高大上，很虛幻，說白了就是用設(shè)計流程去減少用戶的思考，讓用戶一路到底的進行瀏覽，盡量減少打斷用戶瀏覽的思路。我認為沉浸式的體驗同樣也是品牌營銷的一種體驗。為什么這么說？試想，品牌營銷的目的就是加深印象或轉(zhuǎn)化。而使用手機瀏覽信息的用戶大多是利用碎片化的時間進行瀏覽，有可能上車下車的動作都會打斷他們的瀏覽路徑，所以設(shè)置各種環(huán)節(jié)的設(shè)計和跳轉(zhuǎn)，是不明智之舉。用戶在碎片化時間被打破后根本回想不起我剛才瀏覽了什么，瀏覽到哪里了，使他根本不能快速進入主題，快速得到想要的內(nèi)容信息。結(jié)果就是棄你的頁面而去，而那時不管你的設(shè)計有多漂亮，動效有多酷，都吸引不了他。所以在這方面，我們就必須減少像PC端一樣放置各種查看更多按鈕讓用戶到處跳轉(zhuǎn)。當然這不是一個的問題，該需要跳轉(zhuǎn)還是需要的。

所以我們該用什么樣的思路去做移動端呢？

簡-減-檢。對，我用3個jian來概述設(shè)計移動端的思路。

簡

你的頁面盡量的簡單，盡量不出現(xiàn)PC端左右內(nèi)容的排版，大多采用上下的排版（前方高能，記住，純色塊和留白還有圖片是這種排版方式的調(diào)和劑，能很好的幫助設(shè)計師來調(diào)整頁面的節(jié)奏）

減

為了沉浸式的體驗，設(shè)計師必須摒棄PC的習(xí)慣，將移動端的內(nèi)容設(shè)計表現(xiàn)的更加順暢，減少各種關(guān)卡環(huán)節(jié)。我總結(jié)了一下，移動端的交互，點擊是目的，滑動是習(xí)慣。所以，至關(guān)重要的內(nèi)容我們就用點擊的方式讓用戶操作，當然點擊開的內(nèi)容一定是重要的，比如是成交動作，而其他的內(nèi)容就用滑動來實現(xiàn)吧。不管是左滑右滑還是上滑下滑（說到這里，插一點。有的設(shè)計師說又不讓跳轉(zhuǎn)又不讓出下拉，移動端的屏幕本來就小，怎么設(shè)計。其實我認為有限的屏幕寬度背后我們可以通過滑動來實現(xiàn)無限的展示空間。比如像地圖，我是不是很機智，你們腦補一下。）順便舉個例子吧：有一種洗衣機是那種左邊洗衣，右邊脫水的雙桶洗衣機。它解決了之前更老的不能脫水的洗衣機能讓衣服快速晾干的過程。當全自動洗衣機出現(xiàn)的時候人們是不是更青睞于全自動呢，設(shè)定程序連洗帶甩甚至烘干一步操作完成。再舉個例子吧，簡直停不下來。我們在使用支付寶支付的時候是不是發(fā)現(xiàn)根本沒有確定按鈕，輸入金額指紋支付，錯誤給個返回，成功給個提示。僅僅只是少了一步，感覺好爽。

檢

當然是檢測啦。自己做好的設(shè)計在手機上多滑動滑動，自己試用一下看看是否順暢，邏輯是否通順，這很容易做到的。不斷的非否定自己，不斷的改正設(shè)計。你離一個優(yōu)秀的設(shè)計師已經(jīng)不遠了。（推薦大家一款在移動端及時預(yù)覽PS中設(shè)計稿的神奇——Ps Play）

當然還有更多其他的一些應(yīng)該注意的點這里就不一一贅述，我相信，聰明的設(shè)計師根據(jù)這篇文章一定可以舉一反三。

再啰嗦一句：贏在之后一步，贏在比別人少一步。