大數(shù)據(jù)時代，到處都是信息的載體 - 屏幕。設(shè)計師們將信息整合后，通過視覺語言適配各種大小的移動端屏幕，讓信息準(zhǔn)確的傳達(dá)給用戶。

為了讓用戶能在不同的場景中合理的使用，設(shè)計師就需要針對不同場景用戶會使用到的不同尺寸屏幕進(jìn)行不同設(shè)計。設(shè)計方向包括功能、交互、已經(jīng)視覺展現(xiàn)，從而讓產(chǎn)品能夠更友好的被用戶使用。

屏幕的大小不同，所能承載的信息數(shù)量自然也不同。為了保持不同分辨屏幕下，設(shè)計風(fēng)格的一致。設(shè)計師可以通過合理合并功能按鈕、十字交互、增加可關(guān)閉容器、規(guī)整排列等等視覺語言進(jìn)行信息傳達(dá)。

合理合并功能按鈕

設(shè)計來源于生活，移動端的設(shè)計靈感也可以從生活中領(lǐng)悟。

來回想下身邊小家電，因為體積的限制，小家電的操作按鈕少而精，通常將很多按鈕合并。

比如，時間控制器、溫度控制器、流量控制器等等，他們的共同點(diǎn)就是，合理的把相同功能按鈕合并為一個，以節(jié)省空間。

同樣的設(shè)計方式，我們也可以用于設(shè)計中。

如圖，相同位置，不同狀態(tài)的按鈕，讓按鈕在不增加占位面積的前提下，增加了頁面承載內(nèi)容，滿足了更多的功能需求。

十字交互

這樣的交互方式雖然能夠幫助我們更好的利用“屏幕外”的空間，但卻存在誤操作的可能。所以，運(yùn)用時一定要注意功能使用的區(qū)域間隔和可操作空間。

可關(guān)閉、隱藏內(nèi)容

想一想各大Web站與Wap站的菜單區(qū)別，Wap站用一個“漢堡Icon”將多個跳轉(zhuǎn)鏈接隱藏收起，大大減少了界面占位的同時，保留了原有的菜單內(nèi)容。

除此之外，可關(guān)閉提示氣泡、新手引導(dǎo)、下拉菜單、上浮菜單、選擇器等，都是常見的可關(guān)閉、隱藏內(nèi)容的容器。

規(guī)整排列

大家有沒有遇到過，隨著產(chǎn)品功能的不斷增加，或是需要將大屏設(shè)備功能，整合到小屏界面上時可涉及區(qū)域太小的問題呢？

移動設(shè)備設(shè)計中，九宮格、刪格、區(qū)域劃分等，就可以解決空間不夠的問題，并增加可操作內(nèi)容排列的靈活性和可變性（一般會通過icon+文字的方式進(jìn)行呈現(xiàn)）。

現(xiàn)，很多應(yīng)用都將此排列方式與可編輯功能相結(jié)合，制造為可自定義界面，大大增加了用戶體驗度。

總結(jié)

以上只是數(shù)據(jù)整合展現(xiàn)方式中的一小部分，但無論是那種整合方式都離不開數(shù)據(jù)篩選匯總，也就是前期的準(zhǔn)備工作。

我們在使用視覺語言完成移動端屏幕信息傳達(dá)的同時，也要注意不要脫離了用戶需求的本質(zhì)，這也是我們將信息進(jìn)行可視化處理的基礎(chǔ)。

原創(chuàng)： Quines·QQQ

公眾號： 海鹽社