絕大多數(shù)移動(dòng)應(yīng)用都是針對(duì)瀏覽信息的需求街佑,無(wú)論是閱讀新聞谢翎、讀文章、看視頻沐旨、聽(tīng)音樂(lè)森逮、刷社交軟件、查看電子郵件磁携、購(gòu)物等等褒侧。
受移動(dòng)端尺寸的限制,在移動(dòng)端瀏覽和選擇遠(yuǎn)比輸入來(lái)的方便谊迄,所以在移動(dòng)端用于瀏覽的內(nèi)容視圖樣式比web更為豐富闷供。
列表
列表視圖可以說(shuō)是移動(dòng)應(yīng)用中最常見(jiàn)的組織內(nèi)容的方式。你打開(kāi)每個(gè)應(yīng)用幾乎都能找到列表形式的內(nèi)容展示统诺。一條列表里可以是純文字形式(信息展示界面)歪脏;圖標(biāo)加文字(設(shè)置界面、聯(lián)系人)篙议;也可以是圖片加標(biāo)題的形式(常見(jiàn)于對(duì)話列表唾糯、新聞資訊怠硼、商品展示等)鬼贱。
點(diǎn)擊列表會(huì)進(jìn)入列表詳情頁(yè),長(zhǎng)按或者左右滑動(dòng)會(huì)呼出操作選項(xiàng)香璃,例如淘寶商品列表長(zhǎng)按會(huì)呼出找同款这难、找相似、收藏的操作葡秒,微信聊天列表左劃會(huì)呼出標(biāo)記和擅長(zhǎng)的操作姻乓。上下滑動(dòng)可以瀏覽更多列表嵌溢,并且現(xiàn)在很多應(yīng)用加入了無(wú)限滾動(dòng),即滑動(dòng)到列表底部應(yīng)用會(huì)自動(dòng)加載更多內(nèi)容蹋岩,這里要注意赖草,加載更多內(nèi)容的時(shí)間不易過(guò)長(zhǎng),通常不超過(guò)一秒剪个,不然會(huì)影響用戶體驗(yàn)秧骑。
網(wǎng)格
網(wǎng)格多用于展示圖標(biāo)或者圖片,常見(jiàn)于相冊(cè)扣囊、音樂(lè)專輯展示乎折、視頻縮略圖等。iPhone的主畫(huà)面就是采用了網(wǎng)格的樣式侵歇,左右滑動(dòng)切換頁(yè)面骂澄。
輪播圖
輪播圖這種形式能夠抓住用戶視覺(jué)焦點(diǎn),所以會(huì)用來(lái)充當(dāng)廣告位惕虑、營(yíng)銷活動(dòng)入口或者重要信息展示坟冲。多放于應(yīng)用首頁(yè)首屏的位置,數(shù)量在2到5個(gè)之間溃蔫,過(guò)多的圖片會(huì)影響信息展示和點(diǎn)擊的效果樱衷。輪播圖可以自動(dòng)輪播,也可以用戶通過(guò)左右滑動(dòng)切換酒唉,并且會(huì)在輪播圖下方加上一個(gè)頁(yè)標(biāo)用來(lái)指示當(dāng)前展示的是第幾張輪播圖矩桂。
泳道
App Store就采用了泳道的形式,泳道很好的平衡了輪播圖的自然瀏覽頻率與信息密度痪伦。垂直方向展示了不同分類的內(nèi)容侄榴,水平滑動(dòng)可以查看某一個(gè)類型的具體內(nèi)容。
卡片
隨著扁平化風(fēng)格的流行网沾,卡片這種形式越來(lái)越深得移動(dòng)端產(chǎn)品的喜愛(ài)癞蚕。卡片作為一種信息承載和展示的形式辉哥,能夠封裝一張或多張圖片桦山、不同層級(jí)的文字、若干個(gè)操作按鈕醋旦,所以卡片廣泛被UI設(shè)計(jì)師永愛(ài)創(chuàng)建和編輯富媒體內(nèi)容恒水。
和列表視圖一樣,隨便打開(kāi)一個(gè)移動(dòng)端應(yīng)用饲齐,你幾乎都能找到卡片這種形式钉凌。
圖文
純圖片形式多見(jiàn)于圖片社交類應(yīng)用。
純文本形式常見(jiàn)于內(nèi)容類App捂人。
更多的詳細(xì)信息是圖文并茂的形式御雕,例如微信公眾號(hào)的文章矢沿。
一個(gè)移動(dòng)端應(yīng)用根本目的是為了達(dá)成商業(yè)目標(biāo)(一般來(lái)說(shuō)都是掙錢(qián)),而友好的實(shí)現(xiàn)用戶目標(biāo)是達(dá)成商業(yè)目標(biāo)的前提酸纲。熟悉移動(dòng)端信息展示的各種不同樣式捣鲸,能夠幫助交互設(shè)計(jì)師和UI設(shè)計(jì)師根據(jù)產(chǎn)品的不同任務(wù)來(lái)選擇恰當(dāng)?shù)恼故拘问剑瑥亩岣哂脩趔w驗(yàn)闽坡,幫助用戶更好的完成用戶目標(biāo)摄狱。