成人午夜视频全免费观看高清-秋霞福利视频一区二区三区-国产精品久久久久电影小说-亚洲不卡区三一区三区一区

APP設(shè)計(jì)常見(jiàn)分割方式

2021-05-20    分類(lèi): App設(shè)計(jì)

每一年設(shè)計(jì)都會(huì)有新的設(shè)計(jì)方向,今年用的最多是留白分割,但我們?cè)O(shè)計(jì)的時(shí)候不能光看別的產(chǎn)品上使用,我們也照搬,我們需要的是找到對(duì)自己產(chǎn)品最適合的設(shè)計(jì)方向。而我們今天要討論的是模塊與模塊之間的分割設(shè)計(jì),不同類(lèi)型的分割設(shè)計(jì)都是如何使用的。
一、分割布局的作用
APP中分割布局是產(chǎn)品對(duì)界面信息架構(gòu)功能點(diǎn)梳理、分類(lèi)之后形成的視覺(jué)排版產(chǎn)物,將視覺(jué)上或者內(nèi)容上需要區(qū)分的內(nèi)容用不同的分割形式,造就了視覺(jué)上對(duì)于一款app頁(yè)面信息的整體和獨(dú)立感,能夠幫助用戶了解頁(yè)面的層次結(jié)構(gòu),賦予頁(yè)面內(nèi)容以組織性。
二、常見(jiàn)的分割方式
1、背景欄分割
背景欄分割有點(diǎn)像一個(gè)容器上放了不同維度的內(nèi)容,能夠在內(nèi)容區(qū)分的同時(shí),還能保持界面的統(tǒng)一性。如下圖所示:
APP分割方式
對(duì)內(nèi)容的干擾:強(qiáng),這種布局會(huì)分散用戶的注意力,阻礙用戶快速掃覽
分割的強(qiáng)弱:弱
上下滑動(dòng)的視覺(jué)感受:每個(gè)被分割的卡片都是相對(duì)獨(dú)立的維度,但是放在一個(gè)界面后,視覺(jué)上又會(huì)比較規(guī)整且統(tǒng)一,但由于分割感比較強(qiáng),因此視覺(jué)阻斷較強(qiáng),閱讀成本較高。
2、分割線分割
分割線是UI設(shè)計(jì)中最常見(jiàn)的一種分隔方式,能幫助用戶理解頁(yè)面層次,有分隔、組織的作用,一般是為了將內(nèi)容分割開(kāi),形成獨(dú)立的內(nèi)容和信息。如下圖所示:
APP分割方式
對(duì)內(nèi)容的干擾:弱,分割線因?yàn)榇嬖诟胁惶珡?qiáng),適合劃分有關(guān)聯(lián)性的內(nèi)容,并且能夠有效的提升瀏覽效率
分割的強(qiáng)弱:一般
上下滑動(dòng)的視覺(jué)感受:貫穿線的存在感由線的顏色深淺決定,目前大部分頁(yè)面的分割線存在感都不是很強(qiáng),也因此瀏覽時(shí)信息比較流暢。
3、留白分割
利用間距來(lái)設(shè)計(jì)界面,對(duì)應(yīng)的就是現(xiàn)在流行的無(wú)框設(shè)計(jì),不適用分割線,純粹依靠間距來(lái)實(shí)現(xiàn)界面的排版,目前來(lái)說(shuō)這是一個(gè)大趨勢(shì),很多主流的APP都是通過(guò)留白來(lái)做的頁(yè)面分割。
APP分割方式
對(duì)內(nèi)容的干擾:弱,由于本身是依靠間距來(lái)分割的不同模塊,因此不存在對(duì)內(nèi)容的干擾。
分割的強(qiáng)弱:弱
上下滑動(dòng)的視覺(jué)感受:頁(yè)面大多是以圖片為主,本身的邊緣就具備分割作用,內(nèi)容少并且極有規(guī)律,整體界面風(fēng)格簡(jiǎn)潔大方易識(shí)別。
4、卡片投影
卡片投影一直是以小巧整齊的內(nèi)容容器的形式而存在,每一個(gè)卡片的都承載不同的信息,是用戶了解更多細(xì)節(jié)信息的入口。如下圖所示:
APP分割方式
對(duì)內(nèi)容的干擾:強(qiáng)
分割的強(qiáng)弱:強(qiáng)
上下滑動(dòng)的視覺(jué)感受:陰影在卡片上的疊加,使卡片上的內(nèi)容層級(jí)在視覺(jué)上提高了不少,能更好的拓展視覺(jué)深度以及可操作性,但使用這種分割對(duì)空間的要求有點(diǎn)高,也因此會(huì)顯得整體頁(yè)面視覺(jué)比較空。
三、不同類(lèi)型 APP 常見(jiàn)的分割方式
1、電商類(lèi)APP
電商類(lèi)的APP屬于業(yè)務(wù)比較復(fù)雜的界面,既要保證首頁(yè)業(yè)務(wù)展示的完整性,又要保證用戶使用時(shí)的流暢感,設(shè)計(jì)時(shí)都要考慮一些技巧和思考維度,那么電商類(lèi)的首頁(yè)都是采用的什么樣的分割形式呢?我們來(lái)分析一下,如下圖所示:
APP分割方式
淘寶、一淘和京東使用的是大背景上增加白色卡片作為分割版塊,使功能復(fù)雜的頁(yè)面看起來(lái)很規(guī)整并且簡(jiǎn)潔,同時(shí)界面的空間使用率也很高。
2、音樂(lè)類(lèi)APP
音樂(lè)類(lèi)APP屬于界面功能比較簡(jiǎn)單一點(diǎn)的頁(yè)面,功能上最根本就是聽(tīng)歌,但不同的流媒體音樂(lè)都有各自的個(gè)性,及獨(dú)特的賣(mài)點(diǎn),也因此視覺(jué)設(shè)計(jì)上都有各自的風(fēng)格,如下圖所示:
APP分割方式
上圖中蝦米、QQ、MOO音樂(lè)模塊的分割使用的都是留白分割,雖然整體視覺(jué)上風(fēng)格都不同,但是使用的分割方式都是大留白,讓整個(gè)頁(yè)面看起來(lái)很統(tǒng)一且規(guī)整。
3、漫畫(huà)類(lèi)APP
漫畫(huà)類(lèi)的APP大多都是靠?jī)?nèi)容IP撐起來(lái)的,產(chǎn)品的核心是IP,也因此設(shè)計(jì)的時(shí)候封面占漫畫(huà)首頁(yè)的80%,這也要求了分割線不能太過(guò)強(qiáng)的存在感,如下圖所示:
APP分割方式
快看漫畫(huà)、騰訊動(dòng)漫、知音漫畫(huà)都是用的留白分割,我看過(guò)之前知音漫畫(huà)的改版,之前使用的是背景分割,對(duì)此我的看法是上面提到的背景分割對(duì)用戶閱讀時(shí)造成的干擾比較大,而漫畫(huà)類(lèi)的首頁(yè)圖片存在感就很強(qiáng),因此降低分割線的存在感才是合適的做法。
4、內(nèi)容類(lèi)APP
內(nèi)容型APP的產(chǎn)品核心在于UGC內(nèi)容的呈現(xiàn),因此這種類(lèi)型界面設(shè)計(jì)時(shí)就需要凸顯用戶和內(nèi)容的關(guān)聯(lián)性,從而促進(jìn)信息在用戶之間溝通。如下圖所示:
APP分割方式
最右、Lofter、即刻背景欄分割,因?yàn)樽鳛閁GC內(nèi)容頁(yè)面,每個(gè)用戶發(fā)送的內(nèi)容都相對(duì)獨(dú)立,而且上面按鈕比較多,簡(jiǎn)單地說(shuō)就是一個(gè)功能多且內(nèi)容少的一個(gè)獨(dú)立模塊,因此使用背景欄分割,是內(nèi)容自然的呈現(xiàn)出來(lái),讓用戶發(fā)掘自身興趣所在。
5、FM音頻類(lèi)
在碎片化時(shí)間越來(lái)越多的快節(jié)奏的時(shí)代里,知識(shí)類(lèi)電臺(tái)漸漸成長(zhǎng)為電臺(tái)市場(chǎng)的生力軍,同時(shí)“聽(tīng)”也已經(jīng)變成了工作生活中很重要的場(chǎng)景,如下圖所示:
APP分割方式
得到、蜻蜓FM、喜馬拉雅使用的是背景分割,F(xiàn)M類(lèi)的APP首頁(yè)內(nèi)容有很多不同的種類(lèi),情感、學(xué)習(xí)、英語(yǔ)等滿足各種用戶的需求,所以使用背景分割,能更好的將這些信息處理并形成統(tǒng)一的視覺(jué)輸出。
小結(jié):從上面五種不同的類(lèi)型的產(chǎn)品,我們能夠看出,分割與產(chǎn)品類(lèi)型是有一定關(guān)聯(lián)的,所以我們?cè)谠O(shè)計(jì)的時(shí)候,首先要確定好產(chǎn)品的類(lèi)型,才能更好的選擇界面分割方式,從而能有更好的視覺(jué)輸出和效果。
(鄭重聲明:本文版權(quán)歸原作者海鹽社潘團(tuán)子所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如有侵權(quán),請(qǐng)聯(lián)系我們刪除;如作者信息標(biāo)記有誤,請(qǐng)聯(lián)系我們修改。)

網(wǎng)站名稱:APP設(shè)計(jì)常見(jiàn)分割方式
轉(zhuǎn)載源于:http://jinyejixie.com/news33/114333.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷(xiāo)seo公司;服務(wù)項(xiàng)目有App設(shè)計(jì)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

網(wǎng)站建設(shè)網(wǎng)站維護(hù)公司
贞丰县| 故城县| 河津市| 碌曲县| 泌阳县| 泾源县| 绥德县| 岑溪市| 中方县| 衡阳市| 云阳县| 九寨沟县| 天祝| 新密市| 长治县| 武冈市| 敦化市| 略阳县| 安福县| 同德县| 阿拉善右旗| 婺源县| 米易县| 西贡区| 桐庐县| 梓潼县| 墨竹工卡县| 永康市| 防城港市| 隆德县| 宁夏| 宾川县| 蛟河市| 肇庆市| 湘潭市| 成都市| 怀集县| 东阿县| 永济市| 科技| 会同县|