欧美videos另类精品-欧美videos另类极品-欧美vide-欧美va在线视频-欧美va在线观看-欧美va在线播放免费观看

首頁

深度拆解騰訊視頻app的細(xì)節(jié)設(shè)計(jì)

博博

1.內(nèi)容結(jié)構(gòu)作為視頻內(nèi)容平臺(tái),通過對騰訊視頻APP的結(jié)構(gòu)梳理,發(fā)現(xiàn)產(chǎn)品內(nèi)大部分的內(nèi)容都是圍繞視頻來進(jìn)行拓展,整體框架分為:首頁、短視頻、VIP會(huì)員、熱議、我的這幾個(gè)模塊。本次我們主要針對于首頁與播放器這兩個(gè)場景進(jìn)行重點(diǎn)分析

2.首頁首頁作為騰訊視頻的首個(gè)場景,主要以視頻內(nèi)容推廣為主,主要內(nèi)容有如下:頂部操作區(qū)、內(nèi)容推薦區(qū)、各分區(qū)推薦頁等

2.1頂部操作區(qū)
頂部操作區(qū)一般集合著大量的操作入口,主要功能如下:加追與預(yù)約:其中包含用戶添加的追劇列表、熱門預(yù)約、歷史觀看記錄等功能搜索:點(diǎn)擊進(jìn)入搜索結(jié)果頁,其中包含熱門榜單、歷史記錄,用戶也可以快速搜索自己需要查找的視頻內(nèi)容游戲中心:游戲中心主要是推廣騰訊自家的游戲內(nèi)容,通過游戲中心對游戲進(jìn)行引流與拉新周邊商城:周邊商城里面為視頻的周邊產(chǎn)品,用戶可以在周邊商城中進(jìn)行商品購買

2.1.1產(chǎn)品亮點(diǎn):加追與預(yù)約功能在首頁左上角增加最近再追功能,此功能讓用戶在首頁就可以更快速的找到自己在追的內(nèi)容,而且在頁面中還包含新片預(yù)約和歷史瀏覽記錄功能,讓用戶在了解更多預(yù)約內(nèi)容與歷史記錄。此功能放在首頁很好的降低用戶操作成本,提升產(chǎn)品體驗(yàn)。

2.1.2設(shè)計(jì)誤區(qū):加追功能關(guān)閉交互加追功能在關(guān)閉時(shí)有一個(gè)縮放交互,此交互場景可以很好的讓用戶感知當(dāng)前是從哪里進(jìn)行跳轉(zhuǎn),出發(fā)點(diǎn)是好的,但由于在點(diǎn)開時(shí)沒有縮放動(dòng)畫與縮放的樣式不太理想反而導(dǎo)致此交互效果并不好,所以可以適當(dāng)優(yōu)化下。

2.1.3設(shè)計(jì)亮點(diǎn):滑動(dòng)屏幕頂導(dǎo)隱藏與出現(xiàn)交互當(dāng)用戶滑動(dòng)屏幕時(shí),頂部操作區(qū)會(huì)跟隨手勢進(jìn)行向上隱藏,這樣可以在用戶向上滑動(dòng)瀏覽信息時(shí)給界面帶來更多的展示空間,當(dāng)用戶向下滑動(dòng)一定距離時(shí)頂導(dǎo)出現(xiàn),方便用戶對頂導(dǎo)進(jìn)行相關(guān)操作。這里的交互細(xì)節(jié)很舒適,大家可以多多學(xué)習(xí)。

2.1.4設(shè)計(jì)亮點(diǎn):頂部背景跟隨banner顏色進(jìn)行變化頂部背景跟隨banner進(jìn)行變化,當(dāng)用戶滑動(dòng)banner時(shí)頂部背景會(huì)跟隨banner的顏色進(jìn)行變化,這樣可以讓界面的配色看起來更加和諧,提升界面視覺一致性。同時(shí)賦予用戶體驗(yàn)驚喜感。

2.1.5設(shè)計(jì)亮點(diǎn):下拉刷新新玩法大多數(shù)產(chǎn)品下拉都為刷新界面操作,但騰訊視頻對下拉進(jìn)行兩部交互操作,用戶下拉到第一個(gè)階段會(huì)出現(xiàn)提示"下拉發(fā)現(xiàn)更多好玩"當(dāng)前這時(shí)用戶松手可以進(jìn)行常規(guī)刷新操作, 但用戶看到這樣的提示會(huì)更想知道在向下拉到會(huì)帶來怎么的內(nèi)容,當(dāng)用戶再次下拉后會(huì)出現(xiàn)對應(yīng)的內(nèi)容推薦,類似于游戲推廣與熱播劇推廣,賦予用戶驚喜感的同時(shí)還能增加廣告收入。

2.2內(nèi)容推薦區(qū)內(nèi)容推薦區(qū)主要以推薦視頻內(nèi)容為主,主要功能分為:Banner:banner主要推薦站內(nèi)的熱門內(nèi)容與廣告,支持滑動(dòng)切換與自動(dòng)切換展示雙瀑布流推薦位與大卡片推薦:卡片形式采用“封面/視頻+標(biāo)題+標(biāo)簽”的形式,推薦一些站內(nèi)的熱門內(nèi)容與廣告內(nèi)容定制內(nèi)容頁:熱門的視頻會(huì)定制內(nèi)容頁,為視頻定制界面樣式與布局

2.2.1設(shè)計(jì)亮點(diǎn):Banner切換的創(chuàng)新交互方式騰訊視頻的Banner 切換動(dòng)畫是十分有特點(diǎn)的,整體是logo的剪影效果,并且在右下角的數(shù)量指示點(diǎn)也是logo的形狀,很好的突出品牌形象,設(shè)計(jì)創(chuàng)新的同時(shí)強(qiáng)化品牌在用戶心中的位置。

2.2.2產(chǎn)品亮點(diǎn):雙瀑布流推薦機(jī)制banner下方共6個(gè)雙瀑布流推薦位,這種排列方式可以在一屏中展示更多的信息,但不足就是如果界面全部都是這種排列方式會(huì)導(dǎo)致用戶瀏覽成本提高,降低用戶的瀏覽欲望,所以騰訊視頻把內(nèi)容控制在6個(gè),不會(huì)給用戶增加瀏覽負(fù)擔(dān),其次在推薦機(jī)制上對前兩個(gè)卡片進(jìn)行“最近在看”標(biāo)簽,和視頻預(yù)覽,相比其他靜態(tài)卡片可以讓用戶更加快速的發(fā)現(xiàn)自己想看的內(nèi)容。

2.2.3產(chǎn)品亮點(diǎn):視頻大卡片推薦這種樣式的推薦形式雖然同屏下相比雙瀑布流的可推薦內(nèi)容少,但可以讓用戶更注重內(nèi)容視頻本身,推薦的視頻內(nèi)容都為該作品的熱門片段,小編經(jīng)常看著看著就安利了一個(gè)新劇,很適合作為長視頻推薦列表使用

2.2.4設(shè)計(jì)亮點(diǎn):不一樣的定制化分區(qū)內(nèi)容頁騰訊視頻會(huì)根據(jù)站內(nèi)的熱門內(nèi)容進(jìn)行定制化分區(qū)內(nèi)容頁,雖然這種形式在各個(gè)視頻平臺(tái)都有設(shè)計(jì),但騰訊視頻的似乎更加與眾不同,它相比其他競品不僅增加了開屏動(dòng)畫,加強(qiáng)界面氛圍感,同時(shí)在功能上增加了一級(jí)標(biāo)題,如在長相思專題中的“獨(dú)家花絮、有聲書、看微綜、相思榜”等入口,可以讓用戶在頁面中發(fā)現(xiàn)更多劇情本身以外的衍生內(nèi)容,一級(jí)標(biāo)題的形式也可以讓用戶直達(dá)視頻播放頁,快速了解想要看到的視頻內(nèi)容。

2.2.5設(shè)計(jì)誤區(qū):分區(qū)中的入口icon設(shè)計(jì)電視劇作為騰訊視頻的高頻點(diǎn)擊分區(qū),在頭部的icon確實(shí)有失大廠風(fēng)范,圖標(biāo)過大、視覺比例不一致、風(fēng)格不統(tǒng)一等問題,很影響界面的視覺美感,但入口的點(diǎn)擊轉(zhuǎn)化是否有影響未知。

3.播放器相關(guān)播放器作為視頻產(chǎn)品的核心使用場景,其中的功能非常龐大,騰訊視頻的播放器內(nèi)容主要分為:豎屏播放頁與橫屏播放器

3.1豎屏播放頁豎屏播放頁為用戶點(diǎn)擊進(jìn)入視頻的第一個(gè)場景,主要功能為:頂部播放器:頂部為視頻播放區(qū)域詳情:詳情中包含視頻標(biāo)題、選集、討論、周邊、視頻推薦等功能底部快捷操作區(qū):包含再追、下載、投屏、一起看、分享等功能

3.1.1設(shè)計(jì)亮點(diǎn):定制化的視頻播放器對于熱門的內(nèi)容,騰訊視頻依然會(huì)定制化頁面,給予專屬的配色與標(biāo)題,給用戶提供更加沉浸的氛圍感

3.1.2產(chǎn)品亮點(diǎn):底部操作區(qū)功能相比其他產(chǎn)品,騰訊視頻在進(jìn)入豎屏播放頁后不會(huì)再頂部的視頻中默認(rèn)展示操作內(nèi)容,給用戶帶來更好的觀看體驗(yàn),并且把視頻相關(guān)的操作內(nèi)容放置底部做成一個(gè)底部操作區(qū),用戶可以在底部快速的對視頻進(jìn)行操作如:下載、投屏、一起看、分享等。而不是把功能分散在界面中,這樣不僅可以降低用戶的尋找這些高頻操作的成本,同時(shí)提升視頻的觀看體驗(yàn)。

3.2橫屏播放器橫屏播放器是大家在使用產(chǎn)品中最高頻的操作,這里騰訊視頻也是下了很大的成本,也有不少的細(xì)節(jié),界面的主要功能有:頂部操作區(qū):標(biāo)題、一起看、臻彩視聽、投屏等功能左右側(cè)操作區(qū):鎖屏、討論、拍照、錄像等功能底部操作區(qū):進(jìn)度條、暫停、彈幕、倍速、發(fā)電、選集等功能其他場景:彈幕播放、特效、音量控制、快進(jìn)等功能

3.2.1設(shè)計(jì)亮點(diǎn):定制化進(jìn)度條與標(biāo)記糖點(diǎn)對應(yīng)熱門視頻內(nèi)容,騰訊視頻會(huì)定制化進(jìn)度條樣式與進(jìn)度點(diǎn)樣式,(如《長相思》中定制紅色木槿花)讓用戶更加沉浸的觀看體驗(yàn),同時(shí)在進(jìn)度條上方有標(biāo)記樣式,用戶點(diǎn)擊會(huì)觸發(fā)標(biāo)記動(dòng)效與糖點(diǎn),所有標(biāo)記的糖點(diǎn)數(shù)據(jù)也會(huì)以波動(dòng)圖的形式顯示在進(jìn)度條上方,提高互動(dòng)玩法。

3.2.2產(chǎn)品亮點(diǎn):發(fā)電功能為自己支持的CP上分在底部操作區(qū)增加發(fā)電功能,用戶可以點(diǎn)擊為自己支持的cp送出禮物,不僅可以滿足用戶的“嗑CP”心理,同時(shí)對直播場景中的核心送禮功能很好的結(jié)合到視頻產(chǎn)品中,給視頻內(nèi)容提供了商業(yè)價(jià)值,提高產(chǎn)品收入。

作者:不是作家
來源:站酷

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

奧卡姆剃刀 | 設(shè)計(jì)師需要知道的設(shè)計(jì)原則!

博博

有這么一句話:“復(fù)雜的事情簡單做,你就是專家;簡單的事情重復(fù)做,你就是行家;重復(fù)的事情用心做,你就是贏家”。前言

設(shè)計(jì)師是一個(gè)工作類型較為多元化的崗位,如UI除界面視覺外,還要會(huì)點(diǎn)插畫、動(dòng)效、品牌、交互等,而UE除交互體驗(yàn)之外,還得懂視覺、運(yùn)營、業(yè)務(wù)以及前/后端知識(shí)...。這就逐漸讓設(shè)計(jì)師們形成了一種習(xí)慣,涉及的方面越多、經(jīng)驗(yàn)越豐富,就越容易過度思考,把事情也想的、做的復(fù)雜,雖說是為了提升設(shè)計(jì)價(jià)值而想盡辦法,但最終臃腫復(fù)雜的解決方案不斷分散、混淆用戶的意志力,讓用戶體驗(yàn)變得非常糟糕。有這么一句話:“復(fù)雜的事情簡單做,你就是專家;簡單的事情重復(fù)做,你就是行家;重復(fù)的事情用心做,你就是贏家”。沒錯(cuò),要解決那些臃腫且復(fù)雜的設(shè)計(jì),首先要做的就是化繁為簡,我們可以采用一個(gè)非常經(jīng)典的設(shè)計(jì)理論「奧卡姆剃刀原則」。奧卡姆剃刀是經(jīng)過很多前輩反復(fù)實(shí)踐驗(yàn)證過的設(shè)計(jì)法則,特別在方案的設(shè)計(jì)與評估階段非常有效,今天筆者就和大家一起來看看,如何利用奧卡姆剃刀給設(shè)計(jì)做減法。
分享目錄
一、認(rèn)識(shí)奧卡姆剃刀原則二、優(yōu)秀的設(shè)計(jì)案例(iPhone)三、奧卡姆剃刀與設(shè)計(jì)的結(jié)合四、不能“剃”的過猛五、結(jié)語
一、認(rèn)識(shí)奧卡姆剃刀原則

1.奧卡姆剃刀背景
奧卡姆剃刀原則是由英國學(xué)者、邏輯學(xué)家、圣方濟(jì)各會(huì)修士奧卡姆威廉(William of Ockham)于中世紀(jì)提出,也被稱為「奧康的剃刀」、「簡單有效原理」。他在《箴言書注》中指出:“切勿浪費(fèi)較多的東西去做用較少的東西同樣可以做好的事情”。奧卡姆剃刀原則意味著當(dāng)現(xiàn)有的幾個(gè)理論都能對現(xiàn)象進(jìn)行解釋時(shí),應(yīng)該使用假設(shè)最少的那個(gè)。我們不能人為的將事情復(fù)雜化、為自己制造的麻煩而煩惱,需要保持事情的簡單性才能抓住根本、解決實(shí)質(zhì)性的問題,如果將該原則簡化為八個(gè)字,即為“如無必要,勿增實(shí)體”。

2.各行業(yè)中的應(yīng)用
投資領(lǐng)域:應(yīng)該用奧卡姆剃刀來應(yīng)對復(fù)雜的投資市場,對于需要消耗大量時(shí)間、金錢及精力的事情加以區(qū)分并將其簡單化,重新定義自己的投資策略,方能那些那些困境;科學(xué)領(lǐng)域:不管有幾個(gè)存在競爭地位的理論,如果最終得出的結(jié)論相同,那么就選擇最簡單的那個(gè);企業(yè)管理領(lǐng)域:在制定管理決策時(shí),應(yīng)該抓住主要矛盾、剔除干擾,盡量將復(fù)雜的事情簡單化才能解決企業(yè)最根本問題,保持正確的發(fā)展方向。奧卡姆剃刀原則還廣泛應(yīng)用于政治、社會(huì)、經(jīng)濟(jì)、設(shè)計(jì)等領(lǐng)域。不僅如此,很多名人都有過類似該原則的描述:

愛因斯坦:萬事萬物應(yīng)該都應(yīng)盡可能簡潔,但不能過于簡單。
羅伯特-格羅斯泰斯特:在其他條件相同的情況下,要求得越少的那個(gè)就越好,越有價(jià)值。
亞里土多德:自然界選擇最短的道路。
艾薩克·牛頓:每件東西都應(yīng)該越簡單越好,不能只是稍微簡單一點(diǎn)兒。
奧卡姆的威廉:如無必要,切勿假定繁多。
......

3.設(shè)計(jì)領(lǐng)域中的應(yīng)用
“剃刀”的意思是將多余的內(nèi)容削去,刪除不必要的步驟、簡化冗余信息、減少多余的消耗、呈現(xiàn)最直觀的樣子、尋找解決問題的最短路徑等,都是奧卡姆剃刀原則最直觀的體現(xiàn)。奧卡姆剃刀出自心理學(xué)和物理學(xué),雖然不是為設(shè)計(jì)而生,但很多設(shè)計(jì)師已經(jīng)將其運(yùn)用在提升信息傳達(dá)效率以及用戶體驗(yàn)之上。將復(fù)雜的設(shè)計(jì)需求簡單化,去除無關(guān)內(nèi)容對視覺的干擾,讓設(shè)計(jì)更嚴(yán)謹(jǐn)、純粹,確保核心元素能在第一時(shí)間被用戶察覺并理解對設(shè)計(jì)師來說至關(guān)重要。當(dāng)然,奧卡姆剃刀也要視情況而定,當(dāng)內(nèi)容簡化到不能再簡化時(shí),就需要設(shè)計(jì)師通過一些視覺表現(xiàn)手段去吸引、引導(dǎo)用戶獲取信息,讓內(nèi)容更好的呈現(xiàn)。說的直白點(diǎn)就是在不影響功能、視覺的前提下去除多余元素,同時(shí)已保留的內(nèi)容需要用更簡單、清晰的方式呈現(xiàn)給用戶。

二、優(yōu)秀的設(shè)計(jì)案例(iPhone)

蘋果的產(chǎn)品在設(shè)計(jì)領(lǐng)域無論哪一方面都能作為業(yè)界領(lǐng)袖、數(shù)一數(shù)二的存在,縱觀 iPhone 的發(fā)展史,無論是硬件外觀、還是系統(tǒng)界面,都在一刀一刀的不斷去除繁瑣、無必要的東西,那把奧卡姆剃刀從來都沒放下過。

1.iPhone 硬件外觀
2007年,當(dāng)大家還拿著大部分空間位置都被按鍵占用(屏幕占小部分)的傳統(tǒng)手機(jī)時(shí),蘋果推出了第一代 iPhone,它直接將機(jī)械化按鍵變成了界面觸控,你用它就在那里,不用就自動(dòng)隱藏了,釋放了大部分界面空間資源,顯示更多內(nèi)容,整個(gè)手機(jī)正面減的就剩下一個(gè) Home 按鍵。另外,滑動(dòng)解鎖、兩指變焦、重力感應(yīng)等功能更是減少了大量的操作步驟,讓操作變的更簡單、更容易。2010年的 iPhone 4 是喬布斯時(shí)代最經(jīng)典的杰作,更是為 2012年的 iPhone 5s 創(chuàng)下巔峰打下了良好的基礎(chǔ),機(jī)身從弧形設(shè)計(jì)變成方形和棱角分明的外觀設(shè)計(jì),到后來的充電接口和插孔的變窄、Home 鍵去掉中間小方塊、機(jī)身的變薄、以及再后面充電插口與耳機(jī)插口的合并,無一不是在彰顯著減法的魅力。直到 2017年 iPhone X 全面屏的問世,將手機(jī)正面唯一的 Home 給減掉了,雖然“劉海”的存在一度被吐槽,且全面屏的概念是由小米率先提出的,但如果說是 iPhone 在引領(lǐng)潮流一點(diǎn)都不為過,熄屏后的 iPhone X 就像一塊完整的玻璃,即便是劉海也不應(yīng)效果它簡潔且獨(dú)特的美感。

2.iOS 系統(tǒng)界面
當(dāng)2007年 iPhone Runs OS X(iOS 1 系統(tǒng))出現(xiàn)時(shí),應(yīng)用界面和操作上跟現(xiàn)在的系統(tǒng)很像,里面也有了郵件、日歷、照片、時(shí)鐘、文本、Safari、便箋等應(yīng)用。流暢的動(dòng)畫、多點(diǎn)觸控的交互方式、簡潔的UI足以顛覆人們對于傳統(tǒng)意義上手機(jī)界面的認(rèn)識(shí)。隨后,iOS 系統(tǒng)每次新版本的出現(xiàn),都有一些變化,但與iOS 7 相比,就是小巫見大巫了。2013年,iOS 7 的發(fā)布,是迄今為止 iOS 系統(tǒng)史上設(shè)計(jì)風(fēng)格的最大一次升級(jí),UI設(shè)計(jì)由之前的擬物化轉(zhuǎn)向扁平化,整個(gè)系統(tǒng)外觀看起來十分簡潔,新增的指紋解鎖、控制中心設(shè)置快速切換、中國人喜愛的九宮格輸入法,以及簡化的圖標(biāo)、交互的過渡動(dòng)畫等,基本上每一各元素都在根據(jù)用戶的操作及行為習(xí)慣發(fā)生變化。毫不夸張的說,iOS 7 系統(tǒng)改變了近十年的設(shè)計(jì)風(fēng)格,設(shè)計(jì)趨勢也正式從擬物化(復(fù)雜)時(shí)代走向扁平化(簡約)時(shí)代。iOS 12 在設(shè)計(jì)上雖然沒有太大變化,但系統(tǒng)的流暢度相對提升了很多,例如相機(jī)啟動(dòng)速度提升70%、App啟動(dòng)速度提升40%,新增勿擾模式、密碼自動(dòng)填充等,包括后面 iOS 13 更加省電、面部解鎖速度提升、安裝包/更新包內(nèi)層變小等,無一不是在將事情變的更簡單、更容易。

三、奧卡姆剃刀與設(shè)計(jì)的結(jié)合

1.簡單直接的話術(shù)
用戶的每一次操作及信息的接收都是與產(chǎn)品的一次交流,在對話方面,不應(yīng)該使用多重否定、較長的定語或含糊其辭的描述,以免用戶出現(xiàn)認(rèn)知偏差導(dǎo)致理解上的錯(cuò)誤,減少用戶出錯(cuò)率最直接的方法就是用通俗易懂的極簡話術(shù)與其交流。

2.N次能解決就不要用N+1
用戶在進(jìn)行一個(gè)任務(wù)時(shí),提升任務(wù)完成率最好的辦法就是避免復(fù)雜,任何一個(gè)流程,能用N次操作解決的事情,就不要用N+1次操作來完成,讓用戶以最少的點(diǎn)擊次數(shù)就能完成任務(wù),以提升用戶對產(chǎn)品的滿意度與忠誠度。下圖是用戶登錄未勾選「用戶服務(wù)協(xié)議」,圖1、圖2分別給出了不同的交互流程,顯然,圖2的操作次數(shù)更少,讓登錄變的更容易完成。在設(shè)計(jì)一個(gè)功能時(shí),如果存在多種交互方案,那么最簡單那個(gè)肯定是最好的。▽圖1:四步操作完成登錄

▽圖2:兩步操作完成登錄

3.只放置必要的功能
在設(shè)計(jì)一個(gè)頁面之前,需盡可能簡化內(nèi)容和操作步驟,但這并非不讓產(chǎn)品給用戶提供更多信息,可以將「更多信息」用其他方式呈現(xiàn)。例如,某個(gè)產(chǎn)品有A、B、C三個(gè)功能,A和B是主功能,C是輔助,很多用戶更喜歡C,但C的存在會(huì)使很多用戶離開主功能,這是就需要用到奧卡姆剃刀“削去”輔助功能,讓主功能不在受到干擾。這個(gè)例子從表面上看似舍棄了優(yōu)秀的輔助功能,卻很大程度的提高了主功能的完成率。“削去”并不意味著刪除,如果某些功能不重要但需要存在,可通過削弱視覺權(quán)重來做減法,例如將其放在不顯眼的位置或提供入口/鏈接也是很常見的一種設(shè)計(jì)手段。

4.盡可能的減少選項(xiàng)
這一點(diǎn)與「希克定律」的表達(dá)是一致的,做過多的決定對用戶來說也是一種麻煩,產(chǎn)品所提供的內(nèi)容不能讓用戶有過多的思維負(fù)擔(dān),盡可能的減少選項(xiàng),避免用戶因選擇性困難導(dǎo)致迷茫,如果選項(xiàng)過多,將不常用的隱藏起來。關(guān)于這一點(diǎn),先不多做贅述,后續(xù)筆者會(huì)輸出一篇介紹「希克定律」的文章,會(huì)有更詳細(xì)的描述。

5.克制顏色的使用數(shù)量
在同一個(gè)產(chǎn)品中,應(yīng)使用一個(gè)主題色貫穿整個(gè)設(shè)計(jì),作為強(qiáng)調(diào)重點(diǎn)的存在,然后再選擇1~2個(gè)輔助色作為點(diǎn)綴使用。不要添加太多花里胡哨的顏色,增加額外的視覺噪音,尤其是在B端設(shè)計(jì)中,克制顏色的使用能讓整體看起來更加簡潔有層次感。

6.已知方案“A”,勿增方案“B”
如果已經(jīng)有一個(gè)非常不錯(cuò)且成熟的設(shè)計(jì)方案,那么我們應(yīng)該將其設(shè)定為統(tǒng)一的標(biāo)準(zhǔn),在后續(xù)的同類設(shè)計(jì)中應(yīng)該與這個(gè)方案保持一致,不要固步自封去搞“創(chuàng)新”,因?yàn)樾碌姆桨负芸赡艽嬖诼┒础⒒蚺c之前的法案發(fā)生沖突。當(dāng)然,如果你能承受失敗帶來的損失,也可大膽嘗試。

四、不能“剃”的過猛

將復(fù)雜的設(shè)計(jì)簡單化,剔除大部分多余元素是奧卡姆剃刀在設(shè)計(jì)中的核心理念,但它并不是一味的強(qiáng)調(diào)簡單的就是好的、復(fù)雜的就是差的,應(yīng)確定好這兩種形式的邊界在哪里、目的是什么。回歸設(shè)計(jì)本身,剔除的目的不在于追求至簡,而是通過合情合理的減法讓用戶更好的接收信息以及完成目標(biāo),一旦“剔”的過猛就會(huì)傷筋動(dòng)骨。2007年,巨頭企業(yè)微軟推出的 Metro UI 就是一個(gè)很好的例子,全面去除光影、色彩變化以及質(zhì)感等細(xì)節(jié),直接以簡單的色塊+icon組合展示,讓其變的毫無層次感,多用一點(diǎn)時(shí)間就會(huì)發(fā)現(xiàn)這種簡潔過于單調(diào),很容易讓人產(chǎn)生審美疲勞。雖說微軟設(shè)計(jì)師的這套扁平設(shè)計(jì)理念新穎且超前,但用戶并沒有買賬,極度的扁平直接導(dǎo)致極度的冷淡。Metro UI 的失敗讓后面的 Windows 10 直接放棄了這套設(shè)計(jì)語言,重新引入了豐富的細(xì)節(jié),讓設(shè)計(jì)從純粹的扁平中得以解脫。超前一代是天才,超前兩代就是瘋子,很顯然,Metro UI 超前過頭了,這一反面案例應(yīng)該值得所有設(shè)計(jì)師深思。當(dāng)然,這么說有點(diǎn)“馬后炮”的味道,但前輩們已踩過的坑就是我們最好的避坑經(jīng)驗(yàn)。

作者:大漠飛鷹CYSJ
來源:站酷

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

從用戶場景拔高信息瀏覽體驗(yàn)的交互設(shè)計(jì)策略

鶴鶴

詳情頁不會(huì)僅僅承載房源基礎(chǔ)信息,也將是越來越多元化信息的承載體

眾所周知,鏈家在二手房業(yè)務(wù)中深耕多年,無論是線下服務(wù)體系和線上產(chǎn)品工具都處于行業(yè)內(nèi)頭部水平。但相較于二手業(yè)務(wù),新房業(yè)務(wù)的整體發(fā)展還存在較大差距,部分業(yè)務(wù)流程仍處于線上化建設(shè)中。



聚焦到經(jīng)紀(jì)人的作業(yè)工具來看,二手和新房的產(chǎn)品使用體驗(yàn)差異也很大,其中房源模塊的問題尤為突出。如果二手房源產(chǎn)品體驗(yàn)是80分,那新房可能只有20分。而房源是新房經(jīng)紀(jì)人最重要的作業(yè)模塊,在產(chǎn)品滿意度貢獻(xiàn)權(quán)重最高。但滿意度偏低,因此其體驗(yàn)問題亟待解決。


圖1 節(jié)選自《2021H1新房經(jīng)紀(jì)人滿意度調(diào)研報(bào)告》





一、為什么改版


1.改版契機(jī):

新房信息質(zhì)量正穩(wěn)步提升


很長一段時(shí)間以來,新房房源詳情頁是被“棄用”的,大多數(shù)經(jīng)紀(jì)人使用第三方工具獲取房源信息。最底層原因是內(nèi)部工具上房源信息質(zhì)量差(不全不準(zhǔn))。而質(zhì)量差則是由于之前在新房基礎(chǔ)建設(shè)人力不足、產(chǎn)品迭代慢,不能滿足城市業(yè)務(wù)發(fā)展需求

城市為保證各自發(fā)展,使用了更靈活的第三方工具進(jìn)行新房信息傳遞。2021年上半年隨著項(xiàng)目「新房基礎(chǔ)信息建設(shè)」的進(jìn)行,新房信息質(zhì)量正穩(wěn)步提升,且城市也在使用第三方工具中發(fā)現(xiàn)諸多問題,這正是新房房源詳情頁重振旗鼓的最好契機(jī)。


2.產(chǎn)品價(jià)值:

促進(jìn)新房信息線上化正循環(huán)


作為新房信息線上化的其中一環(huán),新房房源詳情頁起著信息呈現(xiàn)的作用。好的呈現(xiàn)方式能夠幫助經(jīng)紀(jì)人更好地消費(fèi)信息,讓經(jīng)紀(jì)人認(rèn)可平臺(tái)產(chǎn)品和服務(wù),同時(shí)經(jīng)紀(jì)人的正向反饋也能激勵(lì)生產(chǎn)新房信息的駐場們更有動(dòng)力去維護(hù)信息,從而促進(jìn)新房信息線上化的正循環(huán)。


圖2 新房信息線上化流程




3.現(xiàn)狀問題:

欠缺規(guī)劃,信息可讀性差


改版前,新房詳情頁繼承著二手房詳情頁的頁面結(jié)構(gòu),但由于業(yè)務(wù)場景不同,當(dāng)前信息組織方式并不適合新房經(jīng)紀(jì)人的作業(yè)場景。另外近一年內(nèi),詳情頁在沒有統(tǒng)籌規(guī)劃下,陸續(xù)接入了“各自為戰(zhàn)”的新內(nèi)容模塊

新房詳情頁逐漸出現(xiàn)信息冗余和混亂的問題,直接影響了信息的呈現(xiàn)效率和可讀性。比如在新房業(yè)務(wù)中房源圖片一般是效果圖,不能像二手房一樣通過圖片識(shí)別房源,經(jīng)紀(jì)人表示不會(huì)優(yōu)先關(guān)注圖片,但卻占據(jù)了首屏1/4的空間。


圖3 詳情?頭圖占據(jù)高優(yōu)空間卻無實(shí)際作用




諸如此類的問題還有很多,但散點(diǎn)式的解決問題可能會(huì)引發(fā)新的問題,因此設(shè)計(jì)應(yīng)該重新    回歸起點(diǎn),從用戶    使用場景出發(fā)。



二、新房經(jīng)紀(jì)人

真實(shí)的看房流程


通過訪談經(jīng)紀(jì)人和觀察他們的實(shí)際作業(yè)操作,我們發(fā)現(xiàn)經(jīng)紀(jì)人需要查看房源內(nèi)容的場景可以分為兩種——    熟悉樓盤和    回答客戶問詢,兩種場景下的行為目標(biāo)和對房源信息的關(guān)注順序有所不同。


圖4 經(jīng)紀(jì)人看房的真實(shí)過程





看房場景1:熟悉樓盤


在「熟悉樓盤」的場景下,  經(jīng)紀(jì)人是在自己準(zhǔn)備功課,無客戶時(shí)識(shí)別一些好樓盤來找客戶,這一場景下,經(jīng)紀(jì)人會(huì)經(jīng)歷以下四個(gè)步驟:

識(shí)別(樓盤是什么)  

吸引(樓盤亮點(diǎn))  

深入(了解房源細(xì)節(jié))  

匹配(房與客)  

需要按照經(jīng)紀(jì)人的判斷邏輯展示房源信息,逐漸引導(dǎo)其做成合理判斷。


看房場景2:回答客戶問詢


與二手房經(jīng)紀(jì)人駐扎在小區(qū)附近不同的是,新房經(jīng)紀(jì)人的客戶多來自線上商機(jī)咨詢,即客戶在  貝殼APP上看到某個(gè)感興趣的樓盤后向經(jīng)紀(jì)人發(fā)起咨詢。經(jīng)紀(jì)人  需要在短時(shí)間內(nèi)的交流給客戶留下好印象,讓客戶信任自己,才能進(jìn)一步產(chǎn)生線下看房行為促進(jìn)成交。

       而信任的第一來源便是經(jīng)紀(jì)人對于客戶問題的快速又專業(yè)的解答。這一場景下,經(jīng)紀(jì)人通常經(jīng)歷3個(gè)步驟:

識(shí)別(樓盤是不是客戶感興趣的)    

定位(查找客戶問題的答案)    

回復(fù)(解答客戶問題)  

對樓盤熟悉度高的經(jīng)紀(jì)人,能夠?qū)⒋蟛糠謽潜P信息背誦下來,直接回復(fù)客戶。但對于大多數(shù)經(jīng)紀(jì)人來說,  需要先查找到相關(guān)樓盤的信息。尤其是目前多數(shù)新房經(jīng)紀(jì)人的司齡都時(shí)長較短,快速查找到信息則對他們來說十分關(guān)鍵。



三、快速聚焦的


信息閱讀體驗(yàn)



基于以上兩種看房場景,我們可以發(fā)現(xiàn),經(jīng)紀(jì)人查看房源信息是一個(gè)有規(guī)律的漸進(jìn)式的判斷過程,而經(jīng)紀(jì)人在其中的心路歷程正是對詳情頁改版設(shè)計(jì)最根本的依據(jù)。而且我們也發(fā)現(xiàn),目前經(jīng)紀(jì)人所使用的第三方工具內(nèi)容的組織方式也基本符合上述場景。


綜合前期調(diào)研的所有結(jié)論,包括對經(jīng)紀(jì)人使用反饋的收集、第三方工具內(nèi)容的分析和經(jīng)紀(jì)人看房流程的梳理,最終確定了本次改版的設(shè)計(jì)目標(biāo)和設(shè)計(jì)策略,如下圖所示:



圖5 改版目標(biāo)及策略





1.頁面結(jié)構(gòu)重建,

符合經(jīng)紀(jì)人看房流程


新房房源詳情頁的作用就是幫助經(jīng)紀(jì)人在兩種場景下能夠輕松完成任務(wù),那么就需要沿著經(jīng)紀(jì)人的心路歷程對詳情頁內(nèi)容進(jìn)行更加合理的信息結(jié)構(gòu)設(shè)計(jì)。

改版方案中,綜合兩種場景的看房流程,將詳情頁整體內(nèi)容進(jìn)行梳理歸類。在刪除冗余信息后,按照“識(shí)別→吸引→深入→匹配”的順序排列,保證經(jīng)紀(jì)人在自然向下瀏覽時(shí)毫不費(fèi)力地獲取房源信息。

這一順序下,“識(shí)別→定位→回復(fù)”也能同時(shí)得到滿足。


圖6 新版詳情頁結(jié)構(gòu)





2.整合強(qiáng)關(guān)聯(lián)信息,

減少閱讀跳點(diǎn)


在前期調(diào)研中發(fā)現(xiàn)一個(gè)痛點(diǎn):明明是關(guān)系緊密需要一起閱讀的信息卻分散在多處位置,造成經(jīng)紀(jì)人閱讀時(shí)出現(xiàn)跳點(diǎn)和斷點(diǎn)。比如在了解戶型信息時(shí),經(jīng)紀(jì)人通常需要一起看戶型格局圖、戶型樣板間,貝殼也提供了靜態(tài)圖、視頻講解和VR三種形式。

但在舊版詳情頁中,戶型模塊只能看到戶型圖,樣板間信息需在頁面頭圖中查看。當(dāng)經(jīng)紀(jì)人想完整地看幾個(gè)戶型的格局和樣板間時(shí),不得不在兩個(gè)位置來回跳動(dòng),不僅操作麻煩,也在不停中斷閱讀進(jìn)程。因此改版時(shí),我們將戶型相關(guān)的信息都集中在戶型模塊,經(jīng)紀(jì)人可一次性完整地獲取戶型信息。


圖7 戶型信息模塊優(yōu)化前后對比



在經(jīng)紀(jì)人深入了解樓盤信息時(shí),會(huì)涉及到戶型、樓棟、小區(qū)概況、區(qū)位配套和開發(fā)商/物業(yè)共五個(gè)維度的信息。在舊版詳情頁中,小區(qū)概況信息放在了二級(jí)頁面且入口在頁面頭部位置,而戶型等其他信息則位于頁面中下部。這種結(jié)構(gòu)給經(jīng)紀(jì)人帶來一定困擾,有的經(jīng)紀(jì)人以為壓根沒有小區(qū)概況信息,知道入口的經(jīng)紀(jì)人則需要在中途切換位置。

因此改版方案中,我們按照真實(shí)物理空間中從小到大的順序,將戶型、樓棟、小區(qū)概況、區(qū)位配套依次排列,即便經(jīng)紀(jì)人只關(guān)注某幾個(gè)模塊信息,也不會(huì)迷失于找入口。


圖8 樓盤詳細(xì)信息優(yōu)化前后對比




3.縮短路徑,

實(shí)現(xiàn)信息快速觸達(dá)


在完成結(jié)構(gòu)和單個(gè)模塊的內(nèi)容閱讀體驗(yàn)優(yōu)化后,我們發(fā)現(xiàn)了另一問題:新房房源的信息體量很大,為了讓經(jīng)紀(jì)人在一級(jí)頁面能夠獲得核心完整的信息,頁面高度已經(jīng)達(dá)到5屏。而在「回答客戶問詢」場景下,經(jīng)紀(jì)人則需要快速查找到某個(gè)位置靠后的模塊信息,那么如何解決這個(gè)問題呢?

舊版中有常規(guī)的模塊定位導(dǎo)航,但問題是該導(dǎo)航無法在首屏暴露,經(jīng)紀(jì)人需要上滑頁面再左滑Tab導(dǎo)航找到對應(yīng)模塊內(nèi)容。在需要即刻回復(fù)客戶時(shí),這種方式肯定是不夠快速的。

        于是,我們便增加了快捷導(dǎo)航,它固定在可見屏幕的右側(cè),經(jīng)紀(jì)人可一鍵定位至模塊位置。目前快捷導(dǎo)航呈現(xiàn)的4個(gè)入口也是調(diào)研經(jīng)紀(jì)人后挑選出的高頻使用模塊,同時(shí)這4個(gè)定位點(diǎn)也基本能夠均分整體頁面,即便想看其他模塊,也能輔助快速定位。


圖9 詳情?導(dǎo)航優(yōu)化前后對比




除了在整體結(jié)構(gòu)上縮短觸達(dá)路徑,在單個(gè)模塊的內(nèi)容查看上也做了細(xì)節(jié)交互調(diào)整。比如作業(yè)規(guī)則模塊細(xì)分了6個(gè)子分類,舊版方案是需要橫滑查看的Tab導(dǎo)航,經(jīng)紀(jì)人反饋不知道可以橫滑甚至有人不知道可以點(diǎn)擊切換分類。新版方案則優(yōu)化成了標(biāo)簽導(dǎo)航并將分類全部展示,足夠直接。


圖10 客戶規(guī)則分類優(yōu)化前后對比





四、能夠快速捕捉的

"顯著線索"


盤源詳情頁作為B端新房信息承載最重要的頁面,體量大且繁雜,當(dāng)海量內(nèi)容如決堤般襲來時(shí),信息被割裂的更加碎片化,經(jīng)紀(jì)人往往會(huì)感到失焦,從而引起心理抵觸。

        而詳情頁面向90%為司齡時(shí)長較短的經(jīng)紀(jì)人,處在業(yè)務(wù)熟悉階段居多,會(huì)停留較長時(shí)間查找信息,導(dǎo)致講盤或熟盤的過程體驗(yàn)感降低。因此,如何在短時(shí)間內(nèi)引導(dǎo)經(jīng)紀(jì)人快速觸達(dá)到有用的“線索”,降低經(jīng)紀(jì)人的信息理解成本,找到記憶打點(diǎn)的形式則顯得尤為重要。

詳情頁改版的核心目的在于打造快速聚焦的閱讀體驗(yàn),提升新房信息線上化的服務(wù)體驗(yàn)。根據(jù)產(chǎn)品定位及改版目標(biāo),我們對盤源工具中高價(jià)值信息進(jìn)行強(qiáng)化感知,凸顯視覺重點(diǎn),弱化次要信息,在吸引經(jīng)紀(jì)人快速定位的同時(shí),盡可能降低頁面其余元素的干擾。因此提煉了以下“顯著線索”:


1.視覺聚焦線索


這里我們以萊斯托夫效應(yīng)為設(shè)計(jì)的切入點(diǎn)-什么是來萊斯托夫效應(yīng)?意指在同質(zhì)類材料中具有差異化表現(xiàn),視覺突出便于記憶,實(shí)際上說明了材料的特獨(dú)性對大腦處理信息時(shí)起到一定作用。

        例如詳情頁是一座山,我們可以通過“峰頂”和“谷底”的對比來抓取眼球,同等于用夸張或強(qiáng)化的形式去吸引注意力,直觀的幫助經(jīng)紀(jì)人明確焦點(diǎn)信息是什么,從而降低其腦力資源的消耗。

如何聚焦信息?首先需要對盤源關(guān)鍵信息進(jìn)行有效的聚類整合,其次無限貼合業(yè)務(wù)場景,獲取不同階段下經(jīng)紀(jì)人的關(guān)注點(diǎn)及訴求,再以合適的差異化表現(xiàn)形式配合信息節(jié)奏,優(yōu)化整體信息的透傳路徑。

(1)拆解功能,聚類整合
人的大腦擅長處理具有區(qū)塊感的內(nèi)容,塊狀信息能夠快速抓住用戶焦點(diǎn),我們可以把盤源詳情頁拆解成顆粒度不一的各類模塊,再進(jìn)行歸納收攏。

對比舊版詳情頁中的盤源基礎(chǔ)信息結(jié)構(gòu)散亂,對經(jīng)紀(jì)人的閱讀及認(rèn)知造成一定負(fù)擔(dān),所以在設(shè)計(jì)中,我們把頁面拆解成樓盤賣點(diǎn)、基礎(chǔ)信息以及作業(yè)內(nèi)容三大結(jié)構(gòu),在頭部信息處理上,將盤源賣點(diǎn)與基礎(chǔ)信息利用Z軸空間關(guān)系劃分了層級(jí),重色塊與白卡片互相襯托,形成強(qiáng)烈對比,在保證賣點(diǎn)凸顯的同時(shí)也能強(qiáng)化卡片信息;


圖11 詳細(xì)?頭部優(yōu)化前后對比




舊版頁面的戶型模塊與樣板間信息呈現(xiàn)位置不同,導(dǎo)致經(jīng)紀(jì)人的閱讀割裂感很強(qiáng),因此在新版設(shè)計(jì)中,對戶型信息做了功能比重的協(xié)調(diào)處理。基于熟盤或講盤特點(diǎn),經(jīng)紀(jì)人及客戶對于戶型圖的需求較高,因此在視覺上擴(kuò)大其占比,強(qiáng)調(diào)一眼定位戶型模塊,同時(shí)集合三種功能,使卡片結(jié)構(gòu)更加緊密,讓經(jīng)紀(jì)人在有限的空間內(nèi)能夠快速找到對應(yīng)功能,提升整體的閱讀及操作效率。


圖12 戶型功能優(yōu)化前后對比




(2)色彩定位,視覺抓取
由于人們的視覺更容易受到更大面積的影響,所以利用色彩差異化,對經(jīng)紀(jì)人最為關(guān)注的賣點(diǎn)及激勵(lì)信息進(jìn)行了色彩輔助突出,通過放大視覺對比,減輕經(jīng)紀(jì)人的閱讀壓力、從而達(dá)到有效快速聚焦的目的。

首先樓盤賣點(diǎn)是輔助新手經(jīng)紀(jì)人作業(yè)的核心信息,在特定場景下需要第一時(shí)間幫助決策和溝通,因此頭部以大面積藍(lán)色背景做襯托,在視覺上輔助經(jīng)紀(jì)人快速定位,并與基礎(chǔ)信息進(jìn)行了區(qū)域分割,在視覺上更聚焦于核心話術(shù),便于更快找到且即時(shí)表達(dá)。

其次新房經(jīng)紀(jì)人賦予激勵(lì)和規(guī)則的了解訴求比較大,需要實(shí)時(shí)關(guān)注政策及傭金激勵(lì)等變化情況,此類信息也是最能刺激經(jīng)紀(jì)人后期的作業(yè)效果,所以在設(shè)計(jì)上做了較為夸張的處理。卡片采用對視覺搶眼的紅色背景,輔助“喇叭”插畫形式襯托內(nèi)容,加深經(jīng)紀(jì)人對于公告信息的認(rèn)知和記憶。


圖13 色彩輔助效果圖




整體從屏效層面來說,頭部利用了色彩差異劃分了信息組,能夠保證在首屏快速聚焦到詳情?最核心的三塊信息,比舊版?面大大提升了信息觸達(dá)的效率。


2.認(rèn)知理解線索


此次改版出發(fā)點(diǎn)是讓經(jīng)紀(jì)人們能夠做到“傻瓜式閱讀”,盡可能降低其認(rèn)知理解成本。我們可排列文本邏輯順序,明確引導(dǎo)路徑,從而形成有效焦點(diǎn)的內(nèi)容組,讓用戶輕負(fù)擔(dān)地找到有用信息。


圖14 “傻瓜式”閱讀策略




(1)貼近用戶,彌補(bǔ)斷層
若想讓用戶感到好用,設(shè)計(jì)的核心還是要了解用戶當(dāng)下目標(biāo),并去不斷貼近其工作路徑及閱讀習(xí)慣,站在對方視角去感知頁面呈現(xiàn)的效果是否達(dá)到目的,拉齊心智彌補(bǔ)認(rèn)知斷層,防止以自身視角做判斷。

(2)給予規(guī)律,優(yōu)化結(jié)構(gòu)
根據(jù)線性瀏覽習(xí)慣,盤源基礎(chǔ)信息的呈現(xiàn)需要保證服務(wù)者的講盤順序及閱讀邏輯,在新版設(shè)計(jì)中,對有邏輯關(guān)系的信息產(chǎn)生聯(lián)系,給予規(guī)律性,保證經(jīng)紀(jì)人的理解轉(zhuǎn)化。

我們基于理解順序及習(xí)慣,可對應(yīng)表達(dá)價(jià)格、盤源屬性及標(biāo)簽的親疏關(guān)系,通過緊密度讓用戶感知到信息組的規(guī)律。例如,盤源基礎(chǔ)卡片是要引導(dǎo)經(jīng)紀(jì)人先關(guān)注盤源的相關(guān)價(jià)格,因此價(jià)格關(guān)聯(lián)的信息間距更緊密,其次是用途、面積、位置等屬性相關(guān),最后利用標(biāo)簽概括總結(jié)樓盤特性,再次強(qiáng)調(diào)整體盤源特點(diǎn),從而由淺至深的強(qiáng)化用戶認(rèn)知和記憶。

此次改版的視覺側(cè)重點(diǎn)是將信息差異放大,打造一定的記憶點(diǎn),使得經(jīng)紀(jì)人在進(jìn)入詳情頁時(shí),可不仔細(xì)查看信息,即可大致定位模塊內(nèi)容,從而進(jìn)行快速瀏覽,提升整體的信息閱讀效率。在這個(gè)過程中,不僅需要對業(yè)務(wù)場景下經(jīng)紀(jì)人的作業(yè)邏輯進(jìn)行把控,合理的梳理信息關(guān)系以及具有良好的表達(dá)形式,同時(shí)更多的是需要平衡自身感知與用戶感知,明確目標(biāo)用戶的感知顆粒度大小,以對方視角有側(cè)重性的強(qiáng)化信息,這樣才能提升服務(wù)體驗(yàn)。

文章來源:優(yōu)設(shè) 作者:姜佳欣


分享此文一切功德,皆悉回向給文章原作者及眾讀者.

免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)




如何提升界面交互中的「信息識(shí)別」體驗(yàn)

博博

在產(chǎn)品界面中信息交互過程中,信息最為常見的四種載體:圖形、文字、音頻、視頻(全景圖、gif圖、動(dòng)效圖在大類暫時(shí)可算圖形,不作細(xì)分),而圖、文占據(jù)了絕對的比重,所以需要重點(diǎn)關(guān)注圖、文信息的識(shí)別體驗(yàn)。

根據(jù)美國哈佛商學(xué)院有關(guān)研究人員的分析資料表明,人的大腦每天通過五種感官接受外部信息的比例分別為:視覺83%、聽覺11%、嗅覺3.5%、觸覺1.5%、味覺1%(數(shù)據(jù)暫不涉及短視頻直播領(lǐng)域)在群核體系下的產(chǎn)品,圖和文分別是有哪些?

在界面中以圖形化的形式表達(dá)動(dòng)作、品牌、說明等信息,讓用戶能直觀的感知到信息的含義,圖形的類型有:動(dòng)作執(zhí)行類操作、品牌示意、輔助說明、圖例展示4大類型;
在界面中以文字的形式表達(dá)信息,主要文案的類型有:動(dòng)作命令、解釋說明、專業(yè)名詞、標(biāo)點(diǎn)符號(hào)。

如何提升以上幾個(gè)類型的信息識(shí)別體驗(yàn):直觀的圖形提升信息識(shí)別的準(zhǔn)度和效率、規(guī)范的文案提升信息表達(dá)的精準(zhǔn)度。

直觀的圖形提升信息識(shí)別的準(zhǔn)度和效率
以下幾個(gè)案例是項(xiàng)小組試點(diǎn)探索驗(yàn)證信息表達(dá)優(yōu)化如何對業(yè)務(wù)有效的驗(yàn)證,可以直觀理解圖形的準(zhǔn)度和效率對業(yè)務(wù)指標(biāo)有哪些影響。
案例1:工具入口的圖形化表達(dá)用戶從工作臺(tái)進(jìn)入到設(shè)計(jì)工具,純文本的表達(dá)用戶很容易產(chǎn)生疑惑,在不改變業(yè)務(wù)邏輯的情況下,進(jìn)行圖形化表達(dá)。

用戶進(jìn)入到下一步的成功率相比原版提升了10.2%,因此可以說明圖形化信息表達(dá)更有助于用戶識(shí)別并進(jìn)行下一步?jīng)Q策。案例2:模型專題
群核下的設(shè)計(jì)工具,以專題化的形式聚類商家、平臺(tái)推薦的模型是基本的運(yùn)營動(dòng)作,如下圖,原本以真實(shí)效果圖的方式展示模型專題,用戶難以感知是方案還是模型。通過封面圖形的優(yōu)化:將核心的模型類型展示出來,用戶能夠預(yù)見里面的內(nèi)容。

僅改版封面后,UV環(huán)比提升120.4%,此案例可以說明更精準(zhǔn)的信息識(shí)別體驗(yàn)?zāi)軌蛑I(yè)務(wù)指標(biāo)的增長。
案例3:對象菜單鼠標(biāo)偏好設(shè)置在設(shè)計(jì)工具中,選擇對象喚出菜單,在酷家樂工具中可以設(shè)置為鼠標(biāo)左鍵點(diǎn)擊即喚出菜單(僅展示圖標(biāo)),也可以鼠標(biāo)右鍵喚出菜單(圖標(biāo)文字結(jié)合)。

用戶可以自定義偏好,但上線很長時(shí)間很多還是不知道如何修改,在對提示進(jìn)行圖形化調(diào)整后,發(fā)現(xiàn)切換點(diǎn)擊數(shù)據(jù)提升了300%,因此可以說明更精準(zhǔn)直觀的信息能直接影響用戶的行動(dòng)決策。
案例4:產(chǎn)出圖紙的操作
在酷家樂工具中定制用戶用戶完成設(shè)計(jì)后,可以直接自動(dòng)產(chǎn)出圖紙,但由于之前操作入口的信息過于相似,用戶難以決策點(diǎn)哪個(gè)是自己需要的,或很容易產(chǎn)生誤操作,經(jīng)過調(diào)研發(fā)現(xiàn)用戶很容易混淆圖紙類型從而生成對自己無用的圖紙。

在新版優(yōu)化中圖形化的表達(dá)了圖紙類型的差異,即便增加了流程步驟數(shù),最終用戶點(diǎn)擊圖紙的UV提升了15%,此案例可以說明,更精準(zhǔn)有效的對象表達(dá)能吸引更多用戶來使用此功能,對業(yè)務(wù)產(chǎn)生直接效果。
案例5:戶型命令圖例
戶型繪制和調(diào)整是酷家樂工具的必經(jīng)之路,由于對象間用2D圖形圖例表達(dá)比較難辨識(shí)出來準(zhǔn)確意思,因此設(shè)計(jì)做了圖形信息的優(yōu)化,讓命令更為直觀,更高效的拾取命令操作。

上線后通過問卷調(diào)研用戶滿意度相比舊版提升了21.66%,因此可以證明,更精準(zhǔn)的圖形輔助用戶更高效的使用工具操作。

規(guī)范的文案提升信息表達(dá)的精準(zhǔn)度
在界面交互中,文案作為信息傳遞的載體,占據(jù)的比重是最大的,在群核的產(chǎn)品中,我們規(guī)范了文案的表達(dá)提升信息表達(dá)的精準(zhǔn)度,之前有針對工具文案做了梳理。
結(jié)合人設(shè)和語氣確定,以及酷家樂定義“善解人意、理想、直率”的文案原則,在工具操作中我們梳理了以下幾類比較容易出現(xiàn)問題的場景,試圖通過文案來提升信息表達(dá)的精準(zhǔn)度,從而讓用戶更流暢的進(jìn)行界面交互。
動(dòng)作命令:結(jié)合直率的文案原則,簡潔高效的描述命令動(dòng)作

解釋說明:結(jié)合理性、直率的原則,精煉的去解釋內(nèi)容

專業(yè)名詞:結(jié)合善解人意和直率原則,避免讓用戶產(chǎn)生多重疑惑,專業(yè)名稱平民化、通用化

作者:酷家樂UED
來源:站酷

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

交互設(shè)計(jì)之組件認(rèn)識(shí)與解析

博博

組件是設(shè)計(jì)師常用且基礎(chǔ)的知識(shí)點(diǎn),隨著軟件設(shè)計(jì)和開發(fā)越來越成熟,已經(jīng)延伸出很多的類型,能否正確合理的使用也是衡量交互設(shè)計(jì)水平的一個(gè)標(biāo)準(zhǔn)。文章里理論知識(shí)比較少,我想說點(diǎn)比較實(shí)用的東西,給大家解惑。所以關(guān)于基本的控件/組件類型的基礎(chǔ)知識(shí)不做過多說明,理論和實(shí)踐相輔相成,理論知識(shí)大家可以去優(yōu)秀平臺(tái)學(xué)習(xí)并吸收,但實(shí)踐需要帶入更多的思考。

分清控件和組件

控件可以理解為平臺(tái)系統(tǒng)定義的某種形式,嚴(yán)格意義上來說,控件的專業(yè)叫法為“原生控件”,不過大家都習(xí)慣性的順口說“控件”,這樣會(huì)更簡單點(diǎn)。

組件從字面理解就是組裝而成,在技術(shù)層面,代碼是需要封裝的,那被封裝在一起,就可以形成組件,能自定義內(nèi)容,名稱等。

原生控件相比較組件,顆粒感更細(xì),一個(gè)組件可以包含多個(gè)控件,單個(gè)控件也可以作為組件。可以使用一個(gè)簡單的例子來闡述他們的關(guān)系,控件就好比是藥材,那么藥方就可以理解成是一個(gè)組件。如果還不能理解,那可以用更具體的案例來說明下;

如下圖是用戶登陸流程中的一個(gè)交互組件,該組件由兩種原生控件來組成,輸入框和按鈕,這樣結(jié)合就構(gòu)成“賬號(hào)輸入”的組件;

再如下圖,單獨(dú)的輸入框控件也可以成為一個(gè)獨(dú)立的“賬號(hào)輸入”組件;

以上兩個(gè)例子,說明了組件可以由單一或多個(gè)的控件類型進(jìn)行組成,如何去定義組件的構(gòu)成,其實(shí)還需要結(jié)合具體的設(shè)計(jì)需求,上面第一個(gè)組件給賬號(hào)修改增加一個(gè)按鈕的控件,讓用戶可以通過按鈕清除所有的字段,讓用戶直接重新輸入,通過手動(dòng)和按鈕操作的兩種方式去進(jìn)行賬號(hào)修改,第二個(gè)組件僅支持手動(dòng)鍵入進(jìn)行修改。通過增加了清除的交互方式,組件的構(gòu)成就會(huì)有不一樣的設(shè)計(jì)方式。

再深入聊下組件

各平臺(tái)基本都有自己獨(dú)立的設(shè)計(jì)體系,有自己定義的組件和組件庫,學(xué)習(xí)組件要了解它分為基礎(chǔ)組件和業(yè)務(wù)/高級(jí)組件兩種類型。基礎(chǔ)組件是一種底層組件,例如輸入框、按鈕、單選框;其特點(diǎn)是比較獨(dú)立單一,通用性很強(qiáng),適應(yīng)各種業(yè)務(wù)場景;業(yè)務(wù)組件是一個(gè)基礎(chǔ)組件集合而成的大組件,也可以叫高級(jí)組件,是復(fù)合型的區(qū)塊組件,主要是針對解決業(yè)務(wù)問題;如下截圖是flomo筆記用用的網(wǎng)頁版本,以它的首頁為例;頁面按照左右結(jié)構(gòu)類型區(qū)分,可以定義為兩個(gè)大的業(yè)務(wù)組件,由淺入深,可以再細(xì)分,得到再定義更多的業(yè)務(wù)組件,這里,我以“發(fā)布筆記”的組件具體說明下,它是怎么組成來解決業(yè)務(wù)問題的;首先我們拆解下組成部分:文本內(nèi)容,工具按鈕(添加標(biāo)簽和圖片、文本編輯、快速引用等三種類型),發(fā)布按鈕。用戶發(fā)布筆記的行為主要為文字輸入-內(nèi)容編輯-發(fā)布完成;結(jié)合用戶行為和組件設(shè)計(jì),解決了用戶輸入文本內(nèi)容,給筆記歸納,增加圖片,修改文本樣式,快速引用,最終進(jìn)行發(fā)布的問題。產(chǎn)品在迭代過程中,我們會(huì)發(fā)現(xiàn)更多的需求,業(yè)務(wù)組件就要通過再優(yōu)化幫用戶解決實(shí)際問題。

學(xué)做組件管理

結(jié)合自己的學(xué)習(xí)和設(shè)計(jì)經(jīng)驗(yàn),我把組件相關(guān)的內(nèi)容和知識(shí)整理定義為組件管理,包括組件的樣式定義,組件和組件庫設(shè)計(jì),搭建,沉淀優(yōu)化應(yīng)該都算是它的組成部分。組件和組件庫作用,和基本概念我就不做過多描述了,畢竟市面上關(guān)于這些內(nèi)容已經(jīng)有很多了,我想從小的點(diǎn)去做深度思考,講點(diǎn)有用的東西,呈現(xiàn)給大家;組件和組件庫首先一定是遵循和圍繞著設(shè)計(jì)的原則、理念、目標(biāo)去構(gòu)思,如蘋果的《人機(jī)交互指南》里面提到的系統(tǒng)設(shè)計(jì)三大主旨(清晰、遵從、層次)和六大原則(完整性、一致性、直接性,反饋感、隱喻性、控制感),安卓系統(tǒng)《材料設(shè)計(jì)1,2》中提到的三大原則(材料就是隱喻、大膽,生動(dòng),有意、運(yùn)動(dòng)提供意義)。還有國內(nèi)b端最權(quán)威的螞蟻設(shè)計(jì)體系A(chǔ)nt design,從設(shè)計(jì)價(jià)值觀延伸設(shè)計(jì)原則,從而思考設(shè)計(jì)模式。

這里可以總結(jié),平臺(tái)在創(chuàng)造設(shè)計(jì)標(biāo)準(zhǔn)時(shí),思考的方向都會(huì)不一樣,所以系統(tǒng)遵循什么,沒有統(tǒng)一的模式,況且這些名詞本身就很抽象,這需要設(shè)計(jì)師們?nèi)ニ伎紤?yīng)該把平臺(tái)系統(tǒng)設(shè)計(jì)成什么樣。這確實(shí)很依賴和考驗(yàn)設(shè)計(jì)師各方面的綜合能力。所以組件設(shè)計(jì)和搭建,它并不是某一個(gè)人的事,而是整個(gè)團(tuán)隊(duì)的任務(wù)。

組件和組件庫的設(shè)計(jì)和搭建過程中,需要了解系統(tǒng)平臺(tái),是蘋果端還是安卓,web端,不同的系統(tǒng)設(shè)計(jì)的差異性很大,對應(yīng)系統(tǒng)的控件類型我們也要很熟練的掌握。例如安卓一直保留的原生的底部導(dǎo)航欄的操作控件(返回、主頁、菜單),反觀蘋果最早出現(xiàn)在底部的HOME鍵,隨著硬件設(shè)計(jì)的升級(jí),物理按鈕的作用已經(jīng)完全被交互手勢操作替代,根據(jù)設(shè)計(jì)準(zhǔn)則,可以先設(shè)計(jì)出確定的初版組件樣式,然后設(shè)計(jì)師們要熟悉項(xiàng)目業(yè)務(wù),深挖每個(gè)功能中的不同業(yè)務(wù)場景,并設(shè)計(jì)出對應(yīng)的業(yè)務(wù)組件;這樣設(shè)計(jì)師最終對于當(dāng)前組件進(jìn)行整合分類,做出版本的組件庫;組件和組件庫是設(shè)計(jì)和開發(fā)相結(jié)合的,設(shè)計(jì)師呈現(xiàn)頁面上的模塊是直觀的,但都是技術(shù)人員進(jìn)行底層代碼拼接的再封裝而成的,有規(guī)模的公司一般都會(huì)做成開源的組件庫。去提升項(xiàng)目人員之間的協(xié)作效率,復(fù)用率高,節(jié)省成本。如下圖是Ant design里面的部分按鈕組件的樣式和代碼演示,作為國內(nèi)獨(dú)一檔的免費(fèi)學(xué)習(xí)的設(shè)計(jì)體系網(wǎng)站。如果大家能夠從頭到尾研究一遍,相信對你構(gòu)建組件和組件庫有十分大的幫助。

最后組件和組件庫的優(yōu)化迭代是貫穿整個(gè)產(chǎn)品設(shè)計(jì)的生命周期的,從搜集組件需求、思考組件優(yōu)化、設(shè)計(jì)組件優(yōu)化方案、驗(yàn)收更新組件和組件庫;

搜集組件需求

項(xiàng)目角度:設(shè)計(jì)師開發(fā)過程中遺漏的、新的業(yè)務(wù)場景中發(fā)現(xiàn)的組件問題,設(shè)計(jì)和開發(fā)者評審討論出來的包括影響協(xié)作效率的,不合理的問題;用戶體驗(yàn):產(chǎn)品中的用戶反饋的功能體驗(yàn)不好,使用時(shí)體驗(yàn)差的模塊;外部借鑒:團(tuán)隊(duì)人員從優(yōu)秀的組建案例中發(fā)現(xiàn)的可借鑒的需求;

思考組件優(yōu)化

思考方向1:設(shè)計(jì)師可以查閱資料,研究優(yōu)秀的組件平臺(tái),從成熟的產(chǎn)品中查看同類的組件設(shè)計(jì)案例;或者和開發(fā)者、設(shè)計(jì)師進(jìn)行深度交流,得到有用的建議;

思考方向2:結(jié)合業(yè)務(wù)場景,最好能夠?qū)?yīng)用場景窮舉梳理出來,具體到某個(gè)的功能,考慮該功能里存在的每一個(gè)場景中,組件需要有什么樣的狀態(tài)和變化;

設(shè)計(jì)組件優(yōu)化方案

設(shè)計(jì)師根據(jù)以上步驟完成組件優(yōu)化的分析之后,可以相對應(yīng)的設(shè)計(jì)組件優(yōu)化方案,組織開發(fā)人員一起多次的評審,大家一起去討論完善,最終技術(shù)人員再進(jìn)行組件代碼的開發(fā)和封裝;組件設(shè)計(jì)優(yōu)化,設(shè)計(jì)師要注意在既定的設(shè)計(jì)原則下合理優(yōu)化,要保留分析材料和思考過程,進(jìn)行有理有據(jù)的評審論證;

驗(yàn)收更新組件和組件庫

當(dāng)開發(fā)人員將組件樣式通過代碼落地之后,優(yōu)化中的組件方案需要帶入到實(shí)際功能場景中進(jìn)行測試檢查,驗(yàn)證組建優(yōu)化的是否符合預(yù)期,在優(yōu)化過程中,可以用一張《組建優(yōu)化表》進(jìn)行記錄,可以方便項(xiàng)目人員追蹤和查看。

組件設(shè)計(jì)的應(yīng)用和思考

組件的設(shè)計(jì)本質(zhì)上也是為了解決某種特定場景的問題。例如提示彈窗,為了讓用戶在操作過程中有反饋提示,提示中又可以通過解決某種場景問題,選擇讓用戶進(jìn)行操作或者不操作,所以平臺(tái)設(shè)計(jì)出這種彈窗組件,即模態(tài)和非模態(tài)彈窗類型。下面通過兩個(gè)例子,結(jié)合功能和場景具體分析產(chǎn)品應(yīng)該如何做組件設(shè)計(jì);

案例1:支付寶“商家轉(zhuǎn)賬功能”組件設(shè)計(jì)

我們?nèi)ド痰曩徺I東西使用支付寶支付的過程中,可以通過掃描商家二維碼,進(jìn)行轉(zhuǎn)賬交易,轉(zhuǎn)賬支付的流程主要包括輸入數(shù)額,選擇支付方式,確認(rèn)支付;因?yàn)槊總€(gè)流程中的組件都十分復(fù)雜,我們僅拿其中一個(gè)流程,對用戶操作過程中涉及的組件進(jìn)行拆解說明;輸入金額和添加備注流程:頁面的組件主要是用戶信息文本,輸入框、備注組件、鍵盤控件,彈框組件;這個(gè)流程包括2個(gè)行為事件,4個(gè)大的業(yè)務(wù)場景;

行為事件一:用戶在商店通過掃碼商家二維碼,分別兩次給商家轉(zhuǎn)賬20000和100000元的金額,

業(yè)務(wù)場景1:用戶沒有輸入任何金額

業(yè)務(wù)場景2:用戶轉(zhuǎn)賬輸入的金額沒有超過限制

業(yè)務(wù)場景3:用戶轉(zhuǎn)賬輸入的金額超過最大限制

業(yè)務(wù)場景123主要應(yīng)用金額輸入框組件,輸入框組件根據(jù)用戶操作行為,會(huì)有不一樣的設(shè)計(jì),用戶沒有任何操作,輸入框內(nèi)有默認(rèn)文案提示“輸入付款金額”,用戶輸入金額后,計(jì)算單位超過‘百’,數(shù)字金額上方會(huì)有單位提示,同時(shí)顯示刪除按鈕,支持刪除,重新輸入,業(yè)務(wù)場景2中根據(jù)金額輸入范圍定義了產(chǎn)品業(yè)務(wù)規(guī)則,再細(xì)分出三種場景,不同范圍內(nèi)的金額,可以對應(yīng)的組件設(shè)計(jì)方案解決確認(rèn)轉(zhuǎn)賬確認(rèn)問題;

(1)當(dāng)輸入金額范圍在1-50000,進(jìn)入新頁面,通過點(diǎn)擊按鈕組件,進(jìn)行轉(zhuǎn)賬確認(rèn)

(2)當(dāng)輸入金額范圍在50000-99999,在當(dāng)前頁面使用模態(tài)彈框組件,進(jìn)行轉(zhuǎn)賬確認(rèn)
(3)當(dāng)輸入金額范圍在100000-999999,進(jìn)入新頁面,重新輸入框內(nèi)輸入轉(zhuǎn)賬金額,進(jìn)行確認(rèn),若兩次金額不一致,出現(xiàn)彈窗提示用戶操作。

當(dāng)輸入的金額超過限制后,彈框組件配合進(jìn)行超限的toast提示。

通過拆解行為事件1,我們細(xì)分出了3個(gè)業(yè)務(wù)場景,通過運(yùn)用輸入框、鍵盤、和toast彈窗,它們相互關(guān)聯(lián)解決了輸入金額產(chǎn)生的各種問題;

無金額輸入時(shí),輸入框能給予用戶提示,這是比較常見的輸入框組件設(shè)計(jì),預(yù)置提示文本;

輸入金額未超出限制,輸入框中會(huì)帶入計(jì)量單位,這就是組件設(shè)計(jì)的細(xì)微之處,轉(zhuǎn)賬金額是一個(gè)關(guān)聯(lián)自己財(cái)產(chǎn)的行為操作,應(yīng)當(dāng)是需要謹(jǐn)慎的,所以計(jì)量單位也是在用戶輸入過程中出現(xiàn),給用戶一個(gè)提示,沒有任何打斷操作的意思,出現(xiàn)的時(shí)機(jī)很適合,再加上輸入的文本數(shù)字已經(jīng)足夠醒目,能夠提示用戶輸入有足夠的準(zhǔn)確度,如果沒有加入這個(gè)字段,確實(shí)也不影響用戶操作,但這種雙重衡量的方式,潛意識(shí)里會(huì)讓自己輸入的更放心,不怕自己有誤差;這就是組件設(shè)計(jì)給用戶帶來的驚喜感。

金額超出限制后,通過組件toast提示“付款金額超限”,第一提示框組件很好的限制鍵盤的數(shù)字輸入,避免用戶無效輸入,第二toast提示框的觸發(fā)時(shí)機(jī)設(shè)計(jì),這里的方案是當(dāng)輸入金額超百萬,按數(shù)字鍵盤的時(shí)候就會(huì)給予提示,而不是等用戶輸入完之后,再去按確認(rèn)鍵的時(shí)候,彈出來提示金額超限。

行為事件二:用戶點(diǎn)擊備注按鈕,添加轉(zhuǎn)賬信息。

業(yè)務(wù)場景4:確認(rèn)完成輸入金額后,給商戶添加備注信息,20個(gè)字以內(nèi);

輸入轉(zhuǎn)賬金額后,文字鍵盤上方出現(xiàn)備注按鈕,點(diǎn)擊彈出備注信息彈窗,在彈窗的輸入框中寫備注信息,其實(shí)添加備注,可以在頁面中使用文本框,可為何去使用彈窗中增加輸入框,確認(rèn)之后再展示到頁面中呢?輸入金額和添加備注的行為的優(yōu)先級(jí)來看,備注信息應(yīng)該是比較低的,信息的展示的重要性也比較低。首先如果使用文本框,和輸入框的組件層級(jí)在同一級(jí),用戶的關(guān)注點(diǎn)會(huì)被干擾,所以使用不突出的文字按鈕組件進(jìn)行區(qū)別,另外備注文字按鈕出現(xiàn)的觸發(fā)條件也是因?yàn)橛休斎虢痤~這個(gè)動(dòng)作,所以備注的信息展示在產(chǎn)品設(shè)計(jì)中就是很弱。另外在彈窗輸入框中也提示了備注信息20個(gè)字以內(nèi),有這樣的信息規(guī)則,彈窗組件比文本框更適合短文本的信息錄入,這樣和金額輸入框組件能夠被區(qū)分。

作者:Q什伍
來源:站酷

轉(zhuǎn)賬是涉及財(cái)產(chǎn)安全的業(yè)務(wù),所以組件的設(shè)計(jì)除了解決不同場景下用戶體驗(yàn)問題(及時(shí)反饋、合理提示、增加驚喜、操作方便),還要處理核心的業(yè)務(wù)問題(保證用戶的財(cái)產(chǎn)問題)
藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

設(shè)計(jì)賦能商家等級(jí)體系建設(shè)

博博

本文講述從0到1的商家等級(jí)激勵(lì)體系建設(shè)中,如何通過設(shè)計(jì)舉措進(jìn)一步推動(dòng)效益最大化。前言

用戶激勵(lì)體系是數(shù)字化時(shí)代產(chǎn)品運(yùn)營中非常重要的一環(huán),它可以有效促進(jìn)用戶的活躍和留存,同時(shí)也能夠激發(fā)消費(fèi)行為,為產(chǎn)品帶來更多的收益。常見的用戶激勵(lì)方式包括積分、金幣、等級(jí)、優(yōu)惠券、禮品、抽獎(jiǎng)等,而針對不同的人群,需要設(shè)計(jì)不同的激勵(lì)體系。本文以百度商業(yè)的商家等級(jí)體系為例,旨在簡述針對To B產(chǎn)品的用戶激勵(lì)手段的設(shè)計(jì)思路,希望能夠給您帶來一些啟發(fā)。

一、項(xiàng)目背景
在大商業(yè)背景下,當(dāng)前缺少一套完整的商家等級(jí)體系,從平臺(tái)視角出發(fā),客戶的行業(yè)多樣&推廣投放能力參差不齊,沒有商家等級(jí)導(dǎo)致平臺(tái)缺少對客戶的細(xì)分,無法給客戶提供更適配的服務(wù)能力;從客戶視角出發(fā),客戶不明確自己在整個(gè)生態(tài)下所處的分位,自然也沒有明確的提升目標(biāo)和路徑;從用戶視角出發(fā),各個(gè)商家良莠不齊,沒有一個(gè)關(guān)鍵標(biāo)準(zhǔn)可以輔助決策。所以亟需一套商家等級(jí)來解決這些問題,那應(yīng)如何從0到1建設(shè)一套完善的商家等級(jí)體系呢?

二、設(shè)計(jì)目標(biāo)推導(dǎo)

在設(shè)計(jì)之初,我們從不同的視角思考,對目標(biāo)進(jìn)行拆解和分析以獲得更全面、更多維的解決方案。從平臺(tái)視角分析,通過商家等級(jí)希望幫助商家快速定位服務(wù)短板,并提供有針對性的運(yùn)營優(yōu)化策略,從而提高商家質(zhì)量和粘性;商家視角則希望通過商家等級(jí)獲得更多權(quán)益加持,從而提升轉(zhuǎn)化;C端用戶視角希望通過商家等級(jí),幫助降低決策成本,建立更多信任。

平臺(tái)視角-建設(shè)商家等級(jí)表達(dá)體系

設(shè)計(jì)的基本出發(fā)點(diǎn)是幫助業(yè)務(wù)建設(shè)平臺(tái)等級(jí)模型的表達(dá)體系,將業(yè)務(wù)目標(biāo)轉(zhuǎn)化為用戶行為,設(shè)計(jì)清晰而直觀的商家分層表達(dá)體系,將不同商家等級(jí)與其對應(yīng)的特權(quán)、服務(wù)等信息進(jìn)行明確的關(guān)聯(lián)和傳達(dá),以便商家能夠快速理解和辨識(shí)商家等級(jí)的差異和優(yōu)勢。

商家視角-強(qiáng)化感知,明確路徑

我們要強(qiáng)化商家的等級(jí)感知,通過視覺和交互引導(dǎo)等方式,強(qiáng)化商家對等級(jí)感知的重要性和影響。

我們要建設(shè)明確的成長路徑,從權(quán)益吸引、任務(wù)驅(qū)動(dòng)、等級(jí)提升和權(quán)益增多等環(huán)節(jié),明確成長行為路徑,鼓勵(lì)商家積極參與平臺(tái)的活動(dòng),提升自身的業(yè)務(wù)能力,從而實(shí)現(xiàn)商家等級(jí)的提升和成長。

用戶視角-建立用戶信任

我們需要建立C端用戶信任,傳達(dá)商家等級(jí)的重要性,提升用戶對商家的認(rèn)可度和信任度,幫助用戶減少?zèng)Q策成本,同時(shí)增加商家的自豪感和動(dòng)力,促進(jìn)商家與用戶,商家與平臺(tái)之間的價(jià)值轉(zhuǎn)化。

綜合以上分析,設(shè)計(jì)舉措應(yīng)注重建立商家等級(jí)表達(dá)、強(qiáng)化商家的感知和增強(qiáng)用戶的信任。希望通過設(shè)計(jì)目標(biāo)的實(shí)現(xiàn),為商家分層模型帶來更好的用戶體驗(yàn)和商業(yè)效益,提升商家的參與度和忠誠度,促進(jìn)商業(yè)生態(tài)飛輪的正向運(yùn)轉(zhuǎn)。

三、設(shè)計(jì)方案實(shí)施

  1. 平臺(tái)視角 - 建設(shè)商家等級(jí)表達(dá)體系

合理的信息組織:通過功能信息分層分類,結(jié)構(gòu)化呈現(xiàn),提信息查找效率

信息分層:開始頁面設(shè)計(jì)之前需要設(shè)計(jì)信息結(jié)構(gòu)和組織方式,以便商家可以輕松找到需要的信息。以商家等級(jí)為例,首先根據(jù)信息價(jià)值將信息分為<等級(jí)-權(quán)益-任務(wù)>三大類(等級(jí)作銜接、權(quán)益提供驅(qū)動(dòng)力、任務(wù)是需完成的動(dòng)作)。

信息重組:分層后,將商家置于設(shè)計(jì)的核心位置,通過深入理解商家需求、行為和期望,以確保設(shè)計(jì)方案符合商家的真實(shí)需求。例如在商家等級(jí)場景,商家期望獲取更多權(quán)益,獲取更多的C端展現(xiàn)。所以此場景以權(quán)益作吸引,通過披露待解鎖權(quán)益驅(qū)動(dòng)商家完成任務(wù),提升等級(jí)。

最終圍繞等級(jí)、權(quán)益、任務(wù)建設(shè)核心成長路徑,三者相輔相成,逐步增強(qiáng)商家參與度和忠誠度。

信息可視化:通過可視化圖表,提高信息獲取效率。

當(dāng)復(fù)雜的信息難以被商家理解時(shí),可視化作為有效手段,旨在把數(shù)據(jù)資料以視覺化的方式表現(xiàn)出,有效地向受眾傳播信息。可視化首先要根據(jù)信息結(jié)構(gòu)進(jìn)行圖表選型,在商家等級(jí)項(xiàng)目中,我選擇了兩種數(shù)據(jù)圖表(進(jìn)度條VS儀表盤)來進(jìn)行商家等級(jí)的可視化表達(dá),當(dāng)兩種圖表放到一起時(shí),可以很明顯的發(fā)現(xiàn)兩者之間的差異,基于這個(gè)項(xiàng)目想要強(qiáng)調(diào)的等級(jí)概念,最終選擇進(jìn)度條展示商家等級(jí)的成長進(jìn)度,并激勵(lì)其追求下一個(gè)等級(jí)的提升。這樣,商家能夠準(zhǔn)確感知成長進(jìn)度,衡量自己在商家等級(jí)體系里所處的分位以獲取更多成長動(dòng)力。

  1. 客戶視角 - 強(qiáng)化感知,明確路徑

加強(qiáng)平臺(tái)引導(dǎo):通過增加視效容器縮短觸達(dá)路徑,幫助商家快速觸達(dá)

彈窗:作為常見的通知容器,常用于向用戶提供重要的通知、更新、提醒或行動(dòng)建議。在此項(xiàng)目中,為了增強(qiáng)商家的感知,我們選擇2個(gè)場景以彈窗的形式給予商家強(qiáng)提示,一是在功能上線后以彈窗的形式顯示對應(yīng)等級(jí)的信息,以吸引商家的注意力并傳達(dá)商家等級(jí)的關(guān)鍵信息,可以增加商家的感知并引導(dǎo)他們進(jìn)入商家等級(jí)開始經(jīng)營;二是當(dāng)商家的等級(jí)提升時(shí)使用彈窗通知,激勵(lì)商家持續(xù)經(jīng)營。

浮層:將操作入口前置披露,提升商家感知同時(shí)還可以縮短操作步長。在商家等級(jí)項(xiàng)目里,衡量商家主動(dòng)經(jīng)營的標(biāo)準(zhǔn)是做任務(wù),所以任務(wù)入口的前置披露是提升主動(dòng)經(jīng)營的關(guān)鍵舉措。于是,圍繞商家等級(jí)包裝了“經(jīng)營助手”的概念,幫助平臺(tái)給商家推薦一些成長任務(wù)和優(yōu)化建議,并在平臺(tái)首頁主動(dòng)彈出,以此提高任務(wù)觸達(dá)率。但使用這種主動(dòng)觸達(dá)手段時(shí),需要考慮對商家的打擾和阻斷情況,所以需要對主動(dòng)彈出的頻率作限制,然后配合氣泡和標(biāo)簽等視效元素吸引商家視線。這樣可以引導(dǎo)商家參與商家等級(jí)完成任務(wù),促進(jìn)其成長和等級(jí)提升。

強(qiáng)化徽標(biāo)設(shè)計(jì):通過引用金銀銅、鉆石等具有普遍認(rèn)知的元素營造榮譽(yù)感。

需求分析:開始設(shè)計(jì)之前,我們首先做了背景研究,了解徽標(biāo)的設(shè)計(jì)需求、目標(biāo)受眾和使用場景,為設(shè)計(jì)提供更準(zhǔn)確的方向。在本項(xiàng)目中,商家等級(jí)覆蓋百度商業(yè)場景所有B端業(yè)務(wù),所以設(shè)計(jì)風(fēng)格要考慮整體質(zhì)感和適配性;另外商家等級(jí)是一個(gè)同時(shí)面向商家和用戶兩者的體系,所以設(shè)計(jì)師需要考量雙端展現(xiàn)的異同點(diǎn);最后,商家等級(jí)特有屬性成長、榮譽(yù)需要在徽標(biāo)中有所體現(xiàn)。

競品調(diào)研:明確背景后進(jìn)行競品分析和行業(yè)研究,了解相關(guān)公司或品牌的LOGO設(shè)計(jì)風(fēng)格、趨勢和差異。這有助于避免與競爭對手相似的設(shè)計(jì),并幫助我們了解徽標(biāo)在B端和C端呈現(xiàn)時(shí)設(shè)計(jì)有哪些差異。在商家等級(jí)項(xiàng)目中,我們通過競品調(diào)研提取了一些風(fēng)格關(guān)鍵詞:幾何、簡潔、明亮、飽滿。

具象表達(dá):有了設(shè)計(jì)關(guān)鍵詞,通過頭腦風(fēng)暴獲取了一些可以體現(xiàn)這些關(guān)鍵詞的具體事物:鉆石、VIP、箭頭、Blingbling、3D、金銀銅等,希望通過具象的事物表達(dá)抽象的情緒詞,于是我們從「鉆石」開始入手,把鉆石和VIP、箭頭不斷結(jié)合,同時(shí)融入BlingBling,金銀銅色等具有普遍認(rèn)知的元素,用偽3D效果來增加徽標(biāo)的立體感,最終打造一種獎(jiǎng)牌的形態(tài),給客戶帶來更多榮譽(yù)感知,突出商家等級(jí)的重要性。

  1. 用戶視角 - 建立用戶信任

增加C端披露:通過挖掘C端披露場景,幫助用戶提高優(yōu)質(zhì)商家獲取效率

從用戶視角出發(fā),商家等級(jí)項(xiàng)目的主要目標(biāo)是建立用戶信任,所以設(shè)計(jì)師在強(qiáng)化徽標(biāo)設(shè)計(jì)的同時(shí),更需要挖掘用戶視角的披露場景,通過增加C端披露,幫助用戶了解該商家在百度生態(tài)內(nèi)的等級(jí)情況,以輔助用戶決策。本項(xiàng)目中在C端共新增3個(gè)場景進(jìn)行商家等級(jí)的披露,①搜索前卡;②營銷頁頭卡;③店鋪頁首卡。在3個(gè)重點(diǎn)場景披露商家的等級(jí)徽標(biāo),用戶在選擇商家時(shí)可以參考商家的等級(jí),增強(qiáng)對商家的信任和認(rèn)知。

通過以上實(shí)施方案,設(shè)計(jì)師從不同視角切入,通過權(quán)益激勵(lì)吸引商家參與,通過明確用戶成長路徑促進(jìn)等級(jí)提升和商家質(zhì)量的提升,為用戶提供更好的服務(wù),實(shí)現(xiàn)平臺(tái)生態(tài)的正向發(fā)展。

四、收益復(fù)盤

平臺(tái)通過建設(shè)商家等級(jí),將商家分層并提供適配的服務(wù),實(shí)現(xiàn)了精準(zhǔn)運(yùn)營;商家等級(jí)給商家?guī)淼臋?quán)益吸引和任務(wù)引導(dǎo),促進(jìn)了商家活躍度和質(zhì)量的大幅提升;C端披露的等級(jí)徽標(biāo)幫助用戶快速鑒別優(yōu)質(zhì)商家,頁面的CTR有顯著的正向增長,商業(yè)生態(tài)下的商家等級(jí)激勵(lì)體系已初步建成。但后期在做客戶訪談的過程中,有客戶反饋某些權(quán)益感知度比較弱。權(quán)益是吸引商家的核心驅(qū)動(dòng)力,如何圍繞權(quán)益建設(shè)開展有效的設(shè)計(jì)?這是應(yīng)該是接下來需要展開研究的課題。

五、總結(jié)

商家等級(jí)的建設(shè)是一個(gè)復(fù)雜的項(xiàng)目,涉及技術(shù)、算法、產(chǎn)品和運(yùn)營等多個(gè)部門的合作。商家分層的核心目標(biāo)是提升優(yōu)質(zhì)商家的比例和運(yùn)營效率。

本文主要介紹了百度商業(yè)生態(tài)下的商家等級(jí)體系的設(shè)計(jì)思路。以商家為切入,通過視效引導(dǎo)等舉措吸引商家參與,為用戶提供更好的服務(wù),實(shí)現(xiàn)平臺(tái)生態(tài)的正向發(fā)展,助力平臺(tái)-客戶-用戶的三方飛輪正向運(yùn)轉(zhuǎn)。

然而,要設(shè)計(jì)出完美的商家等級(jí)建設(shè)方案,需要根據(jù)具體的業(yè)務(wù)場景進(jìn)行深入研究,并結(jié)合產(chǎn)品和業(yè)務(wù)的實(shí)際情況進(jìn)行不斷的迭代和優(yōu)化。只有不斷地根據(jù)用戶反饋和市場需求進(jìn)行調(diào)整和改進(jìn),才能實(shí)現(xiàn)商家等級(jí)體系的最佳效果。

因此,在實(shí)際實(shí)施過程中,需要依托業(yè)務(wù)場景,深入研究產(chǎn)品和業(yè)務(wù),不斷迭代和優(yōu)化設(shè)計(jì)方案,以確保商家等級(jí)體系的成功建設(shè)和業(yè)務(wù)效果的提升。

作者:百度MEUX
來源:站酷

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

百度小說人文感設(shè)計(jì)

博博

本文闡述了百度小說設(shè)計(jì)團(tuán)隊(duì)如何基于人文感設(shè)計(jì)理念,打造直觀易用的產(chǎn)品體驗(yàn),從而提升產(chǎn)品競爭力和用戶滿意度。百度小說是百度APP內(nèi)最核心的垂類業(yè)務(wù)之一,作為一款平臺(tái)型產(chǎn)品,百度小說設(shè)計(jì)團(tuán)隊(duì)一直以用戶體驗(yàn)為核心關(guān)注點(diǎn)。為了保持產(chǎn)品的市場競爭力,百度小說團(tuán)隊(duì)近期進(jìn)行了一次設(shè)計(jì)改版。本次改版旨在提升產(chǎn)品的功能性、美觀性和易用性,以滿足用戶日益增長的優(yōu)質(zhì)體驗(yàn)需求和市場的快速變化。

鑒于此次設(shè)計(jì)改版背景,小說設(shè)計(jì)團(tuán)隊(duì)提出了人文感的設(shè)計(jì)理念,貫穿在本次改版的內(nèi)容中。

一、什么是人文感設(shè)計(jì)?

人文感設(shè)計(jì),是立足用戶需求和情感,貼近用戶期待的體驗(yàn)設(shè)計(jì),我們以用戶為核心,深入了解用戶的喜好、行為習(xí)慣和需求,從而設(shè)計(jì)出貼心、直觀、易用、愉悅的產(chǎn)品。

百度小說的產(chǎn)品核心是由書籍組成的,閱讀讓千萬級(jí)用戶匯集在此,而千萬級(jí)的用戶正是由每一個(gè)獨(dú)立的“人”組成。因此,“人”的需求就是我們在設(shè)計(jì)中尤為關(guān)注的。小說設(shè)計(jì)團(tuán)隊(duì)從“人”的需求、“人”的情感和“人”的文化三個(gè)維度,深入地思考如何將閱讀與用戶的需求完美地結(jié)合起來。

宋朝詩人汪洙在《神童詩》中有這樣的千古名句:“萬般皆下品,唯有讀書高。”讀書自古以來是成為高雅風(fēng)韻的文人士大夫的必經(jīng)之路。由此可見,自古以來讀書和雅致之間就結(jié)下了不解之緣,閱讀與國風(fēng)雅頌的風(fēng)格也就找到了完美的交匯點(diǎn),因此小說設(shè)計(jì)團(tuán)隊(duì)在確定設(shè)計(jì)風(fēng)格的探尋中,選擇了國風(fēng)的風(fēng)格來體現(xiàn)百度小說的人文感的設(shè)計(jì)。

二、構(gòu)建小說的人文感的視覺新風(fēng)格

人文感設(shè)計(jì)語言融合了簡約、舒適、自在的設(shè)計(jì)體驗(yàn),讓人能夠輕松沉浸其中,并感受到獨(dú)特的國風(fēng)韻味和情感內(nèi)涵。小說設(shè)計(jì)團(tuán)隊(duì)從“色、字、構(gòu)、畫”四個(gè)維度進(jìn)行拆解。

色—清新淡雅的色彩

牛皮紙卷通常是手工制作的,它會(huì)給人一種溫暖的感受。設(shè)計(jì)團(tuán)隊(duì)通過提煉牛皮紙卷的色彩,衍生出萱草橙作為主色調(diào),傳遞出閱讀樸實(shí)和親切的寓意。

在輔助色上提取上,通過參考古代藝術(shù)品,并結(jié)合現(xiàn)代審美,提煉出鳳仙粉,葵扇黃、姚黃綠、晴山青等古典色彩,確保輔助色與主色相融合,形成一套和諧的色彩組合。

字—規(guī)范文字使用規(guī)則

基于國風(fēng)意韻感,設(shè)計(jì)團(tuán)隊(duì)在文字的使用上,也選擇了一套襯線體字體,該字體字形瘦長,柔美清透且識(shí)別度高。在界面中,主要在標(biāo)題區(qū)應(yīng)用這套字體,將其中的一筆進(jìn)行跳色點(diǎn)綴,不僅讓用戶閱讀舒適,而且提升百度小說的品牌識(shí)別度。

構(gòu)—構(gòu)建秩序感的頁面

在頁面結(jié)構(gòu)上將頁面容器的邊距進(jìn)行了優(yōu)化調(diào)整,使構(gòu)圖更加飽滿,封面是頁面上最引人注目的元素之一,通過調(diào)整封面的尺寸可以使其更加突出。采用了更大的封面尺寸,使畫面內(nèi)容更加飽滿,將大圓角優(yōu)化為更小的圓角,視覺上更加精致和細(xì)膩。

為了讓用戶第一時(shí)間就能夠看到自己感興趣的標(biāo)題內(nèi)容,在內(nèi)容展示上,我們針對重點(diǎn)的信息進(jìn)行了強(qiáng)化。將主次信息,從色彩到字重上進(jìn)行了優(yōu)化。新版的設(shè)計(jì)采用加粗的標(biāo)題文字和淺灰色的輔助信息,拉開對比,強(qiáng)化重點(diǎn),讓用戶更快找到自己感興趣的內(nèi)容。

在頁面細(xì)節(jié)元素設(shè)計(jì)上,將角標(biāo)樣式優(yōu)化為右側(cè)的書簽的樣式,整體感受更像現(xiàn)實(shí)生活中的書簽。在輔助標(biāo)簽的設(shè)計(jì)上,將純文字樣式優(yōu)化為右側(cè)這種多彩面型的樣式,強(qiáng)化內(nèi)容的豐富和多元。

畫—打造國風(fēng)特色的插畫風(fēng)格

圖形的設(shè)計(jì)是最容易識(shí)別和產(chǎn)生共鳴的。在插畫元素的提煉上,為了能夠與小說網(wǎng)文氛圍結(jié)合的更緊密,我們以小說類型為劃分維度得出了一系列的具象的聯(lián)想關(guān)鍵詞。

例如,女生的插畫圖形,首先劃分為偏向言情類型,由此聯(lián)想到一只小鳥站在桃花上,整體采用粉色調(diào)的場景進(jìn)行展現(xiàn),夢幻而唯美。男生的插畫圖形則偏向玄幻類型,從而聯(lián)想到葫蘆,由此繪制出葫蘆和浮云結(jié)合的畫面,自由而飄逸。

同時(shí),插畫的設(shè)計(jì)采用簡約的幾何圖形,畫面強(qiáng)調(diào)詩意和美感。

在話題落地頁等沉浸感的場景下,也融合了插畫元素作為裝飾,用戶在當(dāng)前的場景能夠有更強(qiáng)的沉浸感和共鳴感。

三、人性化產(chǎn)品體驗(yàn)

以人為本的設(shè)計(jì)理念不僅僅是視覺層面的展現(xiàn),還需要從用戶需求維度提供人性化的產(chǎn)品體驗(yàn),因此,我們提煉出了四組設(shè)計(jì)手段:更貼心、更高效、更熱鬧、更滿足。

更貼心—貼心的設(shè)計(jì)讓用戶體會(huì)到關(guān)懷和舒適的享受

以人為本的設(shè)計(jì)能夠更貼心地滿足用戶的需求和期望,通過關(guān)注用戶的喜好、行為和習(xí)慣,讓用戶體會(huì)到關(guān)懷和舒適的享受。因此,針對于不同的用戶行為進(jìn)行了精細(xì)化的設(shè)計(jì)。對于未登錄、書架為空的用戶,我們默認(rèn)為用戶錨定到精選的tab,而針對本地書、網(wǎng)頁書的用戶,我們?yōu)槠涠ㄎ坏綍艿膖ab,方便用戶更精準(zhǔn)的切入場景。

同時(shí),我們在精選的頭部增加了運(yùn)營區(qū),針對于無歷史記錄的用戶,為其推薦優(yōu)質(zhì)的內(nèi)容,提高用戶的找書效率。而對于有歷史記錄的用戶,外露上一次閱讀的書籍,方便用戶更快捷的進(jìn)行續(xù)讀。

更高效—高效的設(shè)計(jì)能讓用戶體驗(yàn)更便捷,決策更精準(zhǔn)

只有貼心的服務(wù)是遠(yuǎn)遠(yuǎn)不夠的,以人為本的設(shè)計(jì)還需要為用戶打造更高效的設(shè)計(jì)體驗(yàn),我們通過簡化設(shè)計(jì)流程,智能化推薦等手段,讓用戶體驗(yàn)更便捷,決策更精準(zhǔn)在各類場景新增書籍標(biāo)簽?zāi)K,提升用戶篩選書籍的精準(zhǔn)度,使得用戶在各類場景下找書更高效。

在推薦形式上,我們也采用了多樣化的推薦方式。例如在首頁增加了feed流形態(tài)的信息模塊,以更直觀的圖文展現(xiàn)方式,幫助用戶發(fā)現(xiàn)他感興趣的內(nèi)容。在書架場景,針對于書架內(nèi)容少的用戶,自動(dòng)的放置兩本高流量書籍,幫助用戶高效的觸達(dá)內(nèi)容。與此同時(shí),我們還會(huì)根據(jù)用戶行為數(shù)據(jù),采用彈窗形式和章尾推薦等形式主動(dòng)向用戶推薦與其喜好度高的內(nèi)容,方便用戶高效的觸達(dá)他感興趣的內(nèi)容。

更熱鬧—熱鬧的設(shè)計(jì)能給用戶帶來活力和趣味的體驗(yàn)

以人為本的設(shè)計(jì)應(yīng)該是有人氣兒的,為了增強(qiáng)互動(dòng)氛圍,我們搭建了書友社區(qū),為用戶提供求書、薦書的功能,書友熱聊落地頁頭部在設(shè)計(jì)上采用了彈幕的形式;話題模塊的設(shè)計(jì)采用雙列流的交互形式,給頁面增加動(dòng)態(tài)感和活躍感。通過打造熱鬧的氛圍,既能為用戶帶來更具活力和趣味的體驗(yàn),同時(shí)提升了用戶的互動(dòng)活躍度。

閱讀器場景是用戶使用時(shí)長最長的一個(gè)場景。因此我們?yōu)橛脩籼峁┝硕卧u功能,方便用戶閱讀過程中和書友進(jìn)行交流,為了不影響閱讀的流暢性,我們采用弱化的段評圖標(biāo)樣式和色彩,段評入口設(shè)計(jì)在段落尾部,減少對閱讀的干擾。

更滿足—滿足的設(shè)計(jì)能夠讓用戶獲得成就和收益

以人為本的設(shè)計(jì)能夠讓用戶在產(chǎn)品中獲得成就和滿足感,從而形成愉悅的產(chǎn)品體驗(yàn)。為了讓用戶能夠獲得滿足的感受,我們將舊版的簽到系統(tǒng)升級(jí)為金幣激勵(lì)體系,采用做任務(wù)賺金幣的形式,增加用戶的成就感。

整體的設(shè)計(jì)風(fēng)格也延續(xù)了國風(fēng)意境感。首頁頂部采用招財(cái)樹的圖形設(shè)計(jì),強(qiáng)化福利感知。領(lǐng)取金幣場景通過獲得金幣的動(dòng)效,讓用戶產(chǎn)生滿足感。

同時(shí),我們對用產(chǎn)品內(nèi)的用戶進(jìn)行了分層設(shè)計(jì),針對新用戶增加了七天限時(shí)福利活動(dòng),讓新用戶感受到平臺(tái)的福利,從而愿意留下來繼續(xù)體驗(yàn)。

在閱讀器場景,我們增加了章尾和半層金幣領(lǐng)取提示,即時(shí)提醒用戶領(lǐng)取福利,同時(shí),強(qiáng)化領(lǐng)取成功樣式,增強(qiáng)用戶的獲得感。

在運(yùn)營活動(dòng)的設(shè)計(jì)上,延續(xù)國風(fēng)意境的設(shè)計(jì)風(fēng)格,我們將九宮格的抽獎(jiǎng)活動(dòng)入口前置在福利中心的首頁,方便用戶快捷的參與抽獎(jiǎng),獲得收益。爆更一夏,看小說瓜分金幣活動(dòng),整體是采用古典荷塘的景色,讓用戶在參與賺錢的過程中感受到清爽夏日的氛圍,通過多樣化的運(yùn)營活動(dòng)豐富用戶獲取收益的方式,增強(qiáng)滿足感。

結(jié)語小記

百度小說設(shè)計(jì)團(tuán)隊(duì)堅(jiān)持以用戶為中心,秉承人性化、情感化設(shè)計(jì)和文化傳承性的設(shè)計(jì)理念,讓用戶感受到獨(dú)特的情感連接,融入文化元素,傳承歷史與情感,最終形成百度小說的人文感設(shè)計(jì)。

作者:百度MEUX
來源:站酷

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

如何提升界面交互中的「信息識(shí)別」體驗(yàn)

鶴鶴

自上個(gè)世紀(jì)70年代圖形化的人機(jī)界面出現(xiàn),人與機(jī)器的對話從特殊命令行交互變?yōu)橹庇^的圖形界面,到后來語音、視頻、動(dòng)作等多模態(tài)的發(fā)展讓人和機(jī)器的發(fā)展有了更多自然、直觀的交互場景。

交互設(shè)計(jì)基礎(chǔ)定律-泰斯勒定律

博博

當(dāng)涉及到交互設(shè)計(jì)基礎(chǔ)定律時(shí),有許多原則和規(guī)律需要被考慮。這些原則旨在優(yōu)化用戶體驗(yàn)、提高用戶滿意度和增強(qiáng)系統(tǒng)的可用性。以下是一些常見的交互設(shè)計(jì)基礎(chǔ)定律,詳細(xì)闡述它們對設(shè)計(jì)的影響和應(yīng)用。
馮·諾依曼定律(Von Neumann’s Law):該定律強(qiáng)調(diào)將界面與功能相分離。設(shè)計(jì)師應(yīng)該確保用戶界面簡潔直觀,與后端功能邏輯相互獨(dú)立,使用戶能夠?qū)W⒂谌蝿?wù)的完成而不受干擾。
布魯克斯法則(Brooks’ Law):布魯克斯法則指出,在開發(fā)過程中增加人員可能會(huì)帶來更大的溝通和協(xié)調(diào)成本,從而減慢開發(fā)速度。團(tuán)隊(duì)在設(shè)計(jì)過程中應(yīng)適度增加人力資源,以避免開發(fā)效率的下降。
摩爾定律(Moore’s Law):摩爾定律指出,處理器性能和計(jì)算能力每隔一段時(shí)間就會(huì)翻一番,而成本和體積則會(huì)減半。在交互設(shè)計(jì)中,利用摩爾定律的發(fā)展,在用戶界面中提供更強(qiáng)大的功能和更流暢的體驗(yàn)。
布特法則(Butter’s Law):布特法則表明,用戶生成內(nèi)容的價(jià)值與其信息質(zhì)量和數(shù)量成正比。交互設(shè)計(jì)師應(yīng)該提供方便易用的用戶內(nèi)容生成工具,以激發(fā)用戶參與和積極貢獻(xiàn),增加系統(tǒng)的價(jià)值和吸引力。
霍夫曼定律(Hofmann’s Law):霍夫曼定律指出,用戶界面上的復(fù)雜性會(huì)導(dǎo)致用戶的困惑和挫敗感。為了避免這種情況,設(shè)計(jì)師應(yīng)該采用簡潔、直觀的界面設(shè)計(jì),減少用戶的認(rèn)知負(fù)荷。
羅森索爾姆定律(Rosenzweig’s Law):羅森索爾姆定律強(qiáng)調(diào)用戶的參與和反饋的重要性。在交互設(shè)計(jì)中,應(yīng)充分考慮用戶的參與和需求,通過用戶研究和用戶測試等方法來評估和改進(jìn)界面的可用性。
巴金森定律(Parkinson’s Law):巴金森定律指出,工作量會(huì)隨著可用的時(shí)間擴(kuò)展。在交互設(shè)計(jì)中,時(shí)間管理很重要。設(shè)計(jì)師應(yīng)該設(shè)定明確的時(shí)間框架和優(yōu)先級(jí),以避免無限擴(kuò)展的工作量。
弗茲定律(Fuzzy’s Law):弗茲定律表明,事情總是花費(fèi)比預(yù)期更長的時(shí)間。設(shè)計(jì)師在規(guī)劃時(shí)間和資源時(shí)應(yīng)考慮這一定律,并留出適當(dāng)?shù)木彌_時(shí)間。
彭DRY原則(Parnas’ DRY Principle):DRY是"Don’t Repeat Yourself"的簡寫,旨在避免重復(fù)的設(shè)計(jì)和冗余的代碼。在交互設(shè)計(jì)中,設(shè)計(jì)師應(yīng)遵循彭DRY原則,以提高設(shè)計(jì)的效率和可維護(hù)性。
韋伯定律(Weber’s Law):韋伯定律指出,人類對于刺激的感知增量是相對恒定的比例關(guān)系,而不是絕對差異。在界面設(shè)計(jì)中,設(shè)計(jì)師可以利用
11.泰斯勒定律(Tesler's Law),也被稱為“保持簡單定律”(Keep It Simple, Stupid,KISS),是交互設(shè)計(jì)中的一個(gè)基礎(chǔ)定律。該定律由計(jì)算機(jī)科學(xué)家Larry Tesler提出,旨在指導(dǎo)設(shè)計(jì)人員在創(chuàng)建用戶界面時(shí)遵循簡單和直觀的原則。

泰斯勒定律的核心思想是“保持簡單”。它強(qiáng)調(diào)在設(shè)計(jì)用戶界面時(shí),應(yīng)該盡量減少復(fù)雜性和冗余,使用戶能夠輕松理解和使用系統(tǒng)。簡單界面能夠降低用戶的認(rèn)知負(fù)擔(dān),提高用戶的效率和滿意度。
根據(jù)泰斯勒定律,設(shè)計(jì)人員可以通過以下幾個(gè)原則來實(shí)現(xiàn)簡單性:

  1. 去除不必要的元素和功能:通過精簡界面,去除冗余的功能和信息,只保留最核心和必要的元素,減少用戶的認(rèn)知負(fù)擔(dān)。
  2. 提供一致性和可預(yù)測性:保持界面的一致性,使用統(tǒng)一的設(shè)計(jì)語言和交互模式,使用戶能夠快速學(xué)習(xí)和掌握系統(tǒng)的使用方式。
  3. 使用自然和直觀的交互方式:設(shè)計(jì)人員應(yīng)該傾向于使用用戶熟悉和自然的交互方式,減少用戶的學(xué)習(xí)成本。例如,使用常見的圖標(biāo)和手勢,遵循用戶的習(xí)慣和心理模型。
  4. 提供明確和簡潔的反饋:在用戶操作后,及時(shí)提供明確和簡潔的反饋,讓用戶知道他們的操作是否成功,減少用戶的不確定性和焦慮感。
  5. 隱藏復(fù)雜性和技術(shù)細(xì)節(jié):設(shè)計(jì)人員應(yīng)該盡量隱藏系統(tǒng)背后的復(fù)雜性和技術(shù)細(xì)節(jié),讓用戶專注于任務(wù)的完成,而不是被技術(shù)細(xì)節(jié)所干擾。
    泰斯勒定律在交互設(shè)計(jì)中具有重要的指導(dǎo)意義。通過遵循簡單和直觀的原則,設(shè)計(jì)人員可以創(chuàng)建易于使用和理解的用戶界面,提高用戶體驗(yàn)和滿意度。同時(shí),簡單的設(shè)計(jì)也有助于減少錯(cuò)誤和提高效率,為用戶帶來更好的使用體驗(yàn)。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

設(shè)計(jì)師如何用ChatGPT提高工作效率?給你16個(gè)例子!

博博


當(dāng)設(shè)計(jì)師利用ChatGPT提高工作效率時(shí),可以通過以下16個(gè)例子來實(shí)現(xiàn):
獲得設(shè)計(jì)靈感:設(shè)計(jì)師可以向ChatGPT提出關(guān)于特定主題或風(fēng)格的問題,以獲取創(chuàng)意和靈感,幫助他們更快速地開展設(shè)計(jì)工作。
快速生成設(shè)計(jì)草圖:設(shè)計(jì)師可以與ChatGPT交流,描述自己的設(shè)計(jì)想法,然后ChatGPT可以幫助生成初步的設(shè)計(jì)草圖或構(gòu)思,從而加速設(shè)計(jì)流程。
獲取設(shè)計(jì)反饋:設(shè)計(jì)師可以與ChatGPT分享他們的設(shè)計(jì),并詢問對于改進(jìn)的建議。ChatGPT可以提供反饋和專業(yè)意見,幫助設(shè)計(jì)師改進(jìn)設(shè)計(jì)。
設(shè)計(jì)布局優(yōu)化:設(shè)計(jì)師可以提供設(shè)計(jì)布局的描述和需要解決的問題,ChatGPT可以提供布局改進(jìn)的建議,包括元素的排列、間距和對齊等。
確定色彩方案:設(shè)計(jì)師可以向ChatGPT描述設(shè)計(jì)項(xiàng)目的需要和目標(biāo),ChatGPT可以提供符合品牌形象和用戶體驗(yàn)的色彩方案建議。
輔助設(shè)計(jì)圖標(biāo)和圖形:設(shè)計(jì)師可以向ChatGPT描述需要的圖標(biāo)或圖形的特點(diǎn)和樣式,ChatGPT可以提供相關(guān)圖標(biāo)和圖形的素材或幫助設(shè)計(jì)符合要求的圖標(biāo)。
設(shè)計(jì)文件管理:設(shè)計(jì)師可以向ChatGPT咨詢最佳的設(shè)計(jì)文件組織方式,包括文件命名規(guī)范、文件夾結(jié)構(gòu)和版本控制等,提高工作流程的整體效率。
自動(dòng)生成設(shè)計(jì)規(guī)范:設(shè)計(jì)師可以與ChatGPT共享設(shè)計(jì)樣式和規(guī)范的要求,ChatGPT可以幫助生成一致和易于理解的設(shè)計(jì)規(guī)范文檔,以供整個(gè)團(tuán)隊(duì)使用。
快速解決設(shè)計(jì)問題:當(dāng)設(shè)計(jì)師遇到設(shè)計(jì)上的難題時(shí),可以向ChatGPT描述問題,ChatGPT可以提供解決方案和提示,幫助設(shè)計(jì)師迅速解決問題。
交互設(shè)計(jì)優(yōu)化:設(shè)計(jì)師可以向ChatGPT詳細(xì)描述用戶界面的交互流程和問題,ChatGPT可以提供改進(jìn)交互設(shè)計(jì)的建議,包括交互動(dòng)畫、狀態(tài)轉(zhuǎn)換和用戶反饋等。
設(shè)計(jì)審查支持:設(shè)計(jì)師可以將設(shè)計(jì)文件和說明發(fā)送給ChatGPT,并請求審查和評估。ChatGPT可以檢查設(shè)計(jì)是否符合最佳設(shè)計(jì)實(shí)踐、用戶體驗(yàn)原則和可訪問性要求。
自動(dòng)生成設(shè)計(jì)文檔:設(shè)計(jì)師可以與ChatGPT共享設(shè)計(jì)細(xì)節(jié),ChatGPT可以協(xié)助生成詳細(xì)的設(shè)計(jì)文檔,包括設(shè)計(jì)決策、功能說明和交互模型等,減少手動(dòng)編寫文檔的時(shí)間。
設(shè)計(jì)項(xiàng)目管理:設(shè)計(jì)師可以向ChatGPT咨詢項(xiàng)目管理技巧和工具推薦,以提高團(tuán)隊(duì)的項(xiàng)目管理效率和協(xié)作效果。
快速響應(yīng)常見設(shè)計(jì)問題:當(dāng)設(shè)計(jì)師遇到常見的設(shè)計(jì)問題時(shí),可以向ChatGPT提問,ChatGPT可以提供解決該問題的最佳實(shí)踐和建議。
設(shè)計(jì)素材搜索和篩選:設(shè)計(jì)師可以向ChatGPT描述他們需要的設(shè)計(jì)素材,ChatGPT可以提供相應(yīng)的搜索結(jié)果和篩選條件,幫助設(shè)計(jì)師快速找到合適的素材。
用戶測試和反饋解讀:設(shè)計(jì)師可以向ChatGPT分享用戶測試數(shù)據(jù)和反饋,ChatGPT可以幫助解讀和分析數(shù)據(jù),提供對用戶體驗(yàn)的深入理解和改進(jìn)意見。

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.73404.com.cn )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)BS界面設(shè)計(jì) cs界面設(shè)計(jì)ipad界面設(shè)計(jì)包裝設(shè)計(jì)圖標(biāo)定制 用戶體驗(yàn)交互設(shè)計(jì)網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)UI設(shè)計(jì)公司界面設(shè)計(jì)公司UI設(shè)計(jì)服務(wù)公司數(shù)據(jù)可視化設(shè)計(jì)公司UI交互設(shè)計(jì)公司高端網(wǎng)站設(shè)計(jì)公司UI咨詢用戶體驗(yàn)公司軟件界面設(shè)計(jì)公司

日歷

鏈接

個(gè)人資料

存檔

主站蜘蛛池模板: 天天插综合网 | 亚洲最大福利网站 | 久久先锋 | 免费在线视频你懂的 | 天天做天天爱天天综合网2021 | 欧美一级在线免费 | 国产精品99久久免费黑人人妻 | 内射无码专区久久亚洲 | av在线网站观看 | 午夜毛片视频 | 少妇bbbb做爰 | 伊人色婷婷 | 国产真实交换配乱淫视频 | 亚洲熟女综合一区二区三区 | 成人亚洲综合av天堂 | 日韩视频中文字幕在线观看 | 思思99热久久精品在线6 | 超碰av男人的天堂 | 久久精品女人 | 久久久999精品 | 天天射天天日本一道 | 136fldh福利视频导在线 | 中文字幕日本最新乱码视频 | 蜜臀av性久久久蜜臀av流畅 | 日韩av无码精品一二三区 | 久久久久成人精品免费播放动漫 | 国产精品久久毛片av大全日韩 | 理论片福利片 | 女人脱精光让男人躁爽爽视频 | 一本久久a久久精品亚洲 | 91精品一区二区三区在线观看 | 少妇高潮网站 | 少妇与公做了夜伦理 | 国产青青视频 | 杨幂一区二区三区免费看视频 | 91国产丝袜播放在线 | 国产精品免费久久久久 | 欧美a网 | 午夜剧场91| 日本三级带日本三级带66 | 日韩少妇内射免费播放 | 国产男女性潮高清免费网站 | 夜夜爽天天操 | 国产在线拍 | 九九热99久久久国产盗摄 | 国产乱码精品一区二区三区忘忧草 | 香蕉一区二区 | 日韩av激情在线观看 | 久久国产精品波多野结衣 | 日本女人hd| 日韩性在线 | 少妇性俱乐部纵欲狂欢电影 | 亚洲产国偷v产偷v自拍色戒 | 在线欧美中文字幕农村电影 | 亚洲熟妇色xxxxx欧美老妇y | 香蕉网站在线观看 | 91青青视频 | 日韩一级中文字幕 | 亚洲黄色免费看 | 日本免费精品一区二区三区 | 久涩涩福利视频在线观看 | 无翼乌口工全彩无遮挡h全彩 | 亚洲三级网 | 欧美三级三级三级爽爽爽 | 亚洲老熟女性亚洲 | 精品视频www | 久久精品国产99久久无毒不卡 | 人人妻人人澡人人爽人人精品浪潮 | 在线观看视频一区二区三区 | 久久99精品久久久秒播 | 亚洲人交乣女bbw | 国产在线视频99 | 精品一区二区三区无码免费视频 | 中国女人特级毛片 | 成人无号精品一区二区三区 | 亚洲色大成网站www永久 | 国产夫妻自拍小视频 | 国产真实伦视频 | 爱爱小视频网站 | 五月天综合社区 | 日本久久高清视频 | 日本国产一区二区三区 | 99久久精品国产第一页 | 少妇呻吟内裤揉搓水 | 欧美日韩国产二区 | 久久久中日ab精品综合 | 国产高清精品软件丝瓜软件 | 日本在线 | 中文 | 久久久久久免费免费精品软件 | 亚洲午夜精品久久久 | 中文字幕在线观看不卡 | 精品国产av 无码一区二区三区 | 波多野结衣av高清一区二区三区 | 在线不卡日本 | 狠狠躁天天躁夜夜躁婷婷 | а√中文在线8 | 国产精品一区二区在线 | 全免费又大粗又黄又爽少妇片 | 亚洲色中文字幕在线播放 | 午夜伦全在线观看 | 亚洲交性网 | 国内精品久久久久影院男同志 | 国产亚洲精品自拍 | 亚洲中文无码mv | 久久你懂的 | 六月婷婷网 | 精品伦一区二区三区免费视频 | 岳的好大精品一区二区三区 | 麻豆影院免费夜夜爽日日澡 | 色婷婷午夜 | www.日韩欧美 | 桃色网站在线观看 | 国产免费视屏 | 一线二线三线天堂 | 中文天堂在线播放 | 九一九色国产 | 麻豆专区 | 黄色片一区 | 日本妞xxxxxxxxx68 | 国产亚洲无线码一区二区 | 亚洲日韩国产av无码无码精品 | 国产一级在线播放 | 日韩中文字幕免费视频 | 日本久久成人 | 亚洲色图自拍 | 91视频 - 114av | 中文字幕一区在线观看视频 | 日韩成人在线免费观看 | 国产精品 27p | 18成人片黄网站www | 久久久久国产精 | 人妻毛片网站 | www九色91| 亚洲乱亚洲乱妇50p 亚洲va中文字幕无码久久不卡 | 中文字日产幕乱五区 | 国产精品高跟丝袜一区 | 欧美性另类 | 国产精品有码无码av在线播放 | 国产精品96| 91丨九色丨国产在线观看 | 欧美日韩精品一区二区三区蜜桃 | 少妇性l交大片欧洲热妇乱xxx | 老牛影视av一区二区在线观看 | 成年人在线视频网站 | 呻吟揉丰满对白91乃欧美区 | 免费看片啪啪tv | 777色狠狠一区二区三区 | 亚洲精品成人av在线 | 黄色毛片网站 | 一级黄色小视频 | 毛片在线观看网站 | www.久久爱.com狼人 | 久久久一本精品99久久精品66 | 青青草自拍 | 黄色综合网 | 日本v片做爰免费视频网站 日本www | 91高清国产| 日本va欧美va欧美va精品 | 成人青青草 | 青青青手机视频 | 超h高h污肉校园np在线观看 | 欧美亚洲激情 | 国产伦精品一区 | 免费a级毛片在线看 | 亚洲最大福利视频 | 蜜臀久久久久久999 免费 成 人 黄 色 | 嫩草嫩草嫩草嫩草嫩草 | 全部免费毛片在线播放 | 久久综合99re88久久爱 | 国产欧美日韩综合精品二区 | 欧美亚洲二区 | 精品国产一区二区三区久久久蜜臀 | 五月婷婷在线观看视频 | 欧美交换配乱吟粗大在线观看 | 潮喷大喷水系列无码久久精品 | 亚洲区一区二 | 国产精品自在在线午夜出白浆 | play在线海量a v视频播放 | 18禁黄污吃奶免费看网站 | 国产精品乱码一区二区三区 | 色欲精品国产一区二区三区av | 国产18在线观看 | 免费无码av片在线观看 | 好湿好紧太硬了我太爽了视频 | 日批av | 手机在线看片日韩 | 亚洲精品乱码久久久久久按摩 | 男人猛吃奶女人爽视频 | 欧美性生交活xxxxxdddd | 正在播放东北夫妻内射 | h肉动漫无码无修6080动漫网 | 少妇大叫太大太粗太爽了 | 久久久久97国产精 | 欧美视频在线观看一区二区 | 日韩精品一卡2卡3卡4卡乱码的功能 | 91精品无人区卡一卡二卡三 | 91在线视频观看 | 特黄aaaaaaaaa真人毛片 | 免费人成视频在线观看网站 | 人人做人人爽人人爱 | 久久无码中文字幕久久无码app | 亚洲制服在线观看 | 国产污污视频 | 女人a级毛片 | 9l视频自拍九色9l视频大全 | 国产黑丝在线 | 午夜免费视频 | 国产精品国产三级国产普通 | 丰满诱人的人妻3 | 九九国产精品无码免费视频 | 欧美亚洲91 | 精品国产乱码久久久久久闺蜜 | 丁香社区五月天 | 国产在线拍偷自揄拍视频 | jzjzz成人免费视频 | 欧洲午夜精品 | 欧美福利一区二区三区 | 欧美一区二区三区在线观看 | 国产美女诱惑 | 日韩一区二区三区在线视频 | 国产乱子伦精品视频 | 免费精品视频在线观看 | 国产视频每日更新 | 老太婆性杂交欧美肥老太 | 91中文字幕在线播放 | 人妻无码不卡中文字幕系列 | 日本中文字幕免费观看 | 日韩看片 | 国产成人涩涩涩视频在线观看 | 久久精品国产最新地址 | 顶级尤物极品女神福利视频 | 中文字幕天堂在线 | 国内自拍一二三四2021 | 爱久久视频 | 男女啪啪无遮挡免费网站 | 国产精品日韩一区二区三区 | 极品白嫩的小少妇avove | 又大又硬又爽18禁免费看 | 亚洲成人免费在线 | 97久久超碰国产精品2021 | 日日噜狠狠噜天天噜av | 国产一区不卡视频 | 他也色在线 | 大地资源在线播放观看mv | 亚洲va视频 | 懂色av色吟av夜夜嗨 | 国产999精品 | 大学生高潮无套内谢视频 | 男女啪啪无遮挡 | 亚洲人成网站18禁止 | 亚洲人成网站999久久久综合 | 好爽好大久久久级淫片毛片小说 | 国产 校园 另类 小说区 | 久久禁 | 91区人人爽人人都喜欢人人都有 | 女同av久久中文字幕字 | 日韩美女乱淫免费看视频大黄 | 福利在线免费 | 国产精品久久久久777777 | 黑人3p波多野结衣在线观看 | 欧美jizzhd精品欧美18 | 99精品欧美| 午夜精品久久久久久久99芒果 | 日本涩涩网 | 青青艹在线视频 | 一区二区精品在线 | 久久夜色精品亚洲噜噜国产mv | 亚洲天堂男 | 舐め犯し波多野结衣在线观看 | 国产午夜片无码区在线播放 | 成人手机视频在线观看 | 国产影视av| 不卡的一区二区 | 天天舔天天爱 | 精品一区二区三区激情在线欧美 | 77777五月色婷婷丁香视频 | 午夜999| 特级淫片aaaaaaa级附近的 | 搡老岳熟女国产熟妇 | 日本老熟妇毛茸茸 | 欧美日韩a v | 亚洲精品在线不卡 | 内射人妻无码色ab麻豆 | 欧美成人综合 | 三级免费 | 欧美大片在线看免费观看 | 无码精品人妻一区二区三区湄公河 | 日本中文字幕有码在线视频 | 亚洲福利视频在线 | 91精品一区二区中文字幕 | 91大神久久| 免费av一区二区 | 中文字幕美人妻亅u乚一596 | 日本人作爰全过程 | 欧洲lv尺码大精品久久久 | 欧美一区二区日韩 | 国产又粗又猛又爽又黄的视频小说 | 国产精品xxx在线观看www | 人妻体内射精一区二区三四 | 成人在线午夜 | 一级片视频网站 | 欧美日本另类 | 日本一级少妇免费视频乌克兰裸体 | 日韩中文一区二区三区 | 黑人粗一硬一长一进一爽一a级 | 大屁股大乳丰满人妻 | 撕开奶罩揉吮奶头视频 | 久久久久久久岛国免费网站 | 日本另类αv欧美另类aⅴ | 精东av在线 | 99精品国产99久久久久久97 | 九九夜 | 国产精品国产自产拍高清av | 国内久久久| 欧日韩在线| 99精品国产免费久久 | 中文字幕免费在线播放 | 色婷婷婷婷色 | 91黄色视屏 | 亚洲综合专区 | 小视频在线免费观看 | 一 级做人爱全视频在线看 亚洲成a∨人片在线观看不卡 | 精品久久久久久国产 | 欧美14一18处毛片 | 欧美性猛少妇xxxxx免费 | av鲁丝一区鲁丝二区鲁丝三区 | 亚洲精品lv | 国产成人精品日本亚洲第一区 | 国产真实露脸精彩对白 | 一级黄网站 | 国产高清在线精品一区不卡 | 亚洲av禁18成人毛片一级在线 | 婷婷情更久日本久久久片 | 春色影视| 无限看片在线版免费视频大全 | 97夜夜澡人人双人人人喊 | 99精品久久毛片a片 在线亚洲高清揄拍自拍一品区 | 亚洲婷婷一区 | 日韩av在线看免费观看 | 欧美精品播放 | 久久精品无码av | 亚洲国产天堂久久综合226114 | 久久精品黄色 | 一区二区三区四区精品视频 | 成年午夜无码av片在线观看 | 欧美孕妇姓交大片 | 3d成人动漫在线观看 | 女朋友闺蜜奶好大下面好紧视频 | 黄色一区二区三区 | 荫道bbwbbb高潮潮喷 | 91精品国产高潮对白 | 亚洲色图欧美 | 激情五月亚洲 | 国产成人美女视频网站 | 夜夜揉揉日日人人 | 国产乱码精品一区二区三区忘忧草 | 欧美日韩一区二区三区在线观看视频 | 性猛交xxxx| 国产一级aa大片毛片 | 伊人无码精品久久一区二区 | 2019nv天堂香蕉在线观看 | 国产精品永久在线 | 99国产精品99久久久久久 | 久久中文字幕一区 | 特黄 做受又硬又粗又大视频 | 熟妇五十路六十路息与子 | 亚洲免费一级片 | 乱亲女h秽乱长久久久 | 香蕉视频网页 | 国产一级黄色片视频 | 国产欧美一区二区三区视频 | 91亚洲精品国偷拍自产在线观看 | 欧美又粗又大xxxxbbbb疯狂 | 欧美激情猛片xxxⅹ大3 | 久久公开视频 | 久久久久偷看国产亚洲87 | 黄色毛片毛茸茸 | 欧美精品免费播放 | 国产美女精品aⅴ在线播放 国产美女精品人人做人人爽 | 亚洲精品国偷拍自产在线观看 | 999zyz玖玖资源站在线观看 | 成人做爰www免费看视频网站 | 欧美黑人一级 | 99热最新| 天天爽夜夜爽 | 97人人澡人人爽人人模亚洲 | 18禁黄污吃奶免费看网站 | 人人鲁人人莫一区二区三区 | 欧美一级大片在线观看 | 亚洲1级片| 国产精品久久久久久久久免费看 | 邻居少妇张开腿让我爽了在线观看 | 久久婷婷网站 | xxxxx日韩| 精品1区2区3区 | 性欧美一区二区 | 成人免费观看av | 国产专区在线播放 | 日本韩国欧美一区 | 国产精品社区 | 忘忧草在线社区www中国中文 | 五月婷婷久 | 国产福利社 | 狠狠色综合网久久久久久 | 日韩精品你懂的 | 少妇激三级做爰在线观看 | 天啦噜最新官网入口 | 狠狠色综合网站久久久久久久 | hs在线观看 | 四虎8848精品成人免费网站 | 无遮挡啪啪成人免费网站 | 日本少妇又色又爽又高潮看你 | 精品国产99高清一区二区三区 | 天天夜碰日日摸日日澡性色av | 亚洲一区 欧美 | 天天射网 | 久久99精品久久久久久秒播放器 | 麻豆精品国产传媒 | 青青草免费视频在线播放 | 狠狠色丁香婷婷综合潮喷 | av网址在线免费观看 | 久久国产avjust麻豆 | 国产精品国产三级国产av主播 | 天堂а√中文最新版地址在线 | 日本一级待黄大片 | 国产精品久久久久久久免费软件 | 国产精品无码翘臀在线观看 | 自拍偷拍av | 天天撸在线视频 | 天堂网www | 日本美女动态图 | 精品国产乱码一区二区三区 | 国产精品久久久久久吹潮 | 黑人狂躁曰本人aⅴ | 午夜美女福利视频 | 中文字幕网址在线 | 久久久久国精品产熟女久色 | 亚洲三级高清免费 | 最近中文字幕2019在线一区 | 奇米影视777久色在线 | 91久久久久久久久久久久 | 扒开双腿被两个男人玩弄视频 | 久久99成人| 3d毛片 | 久久精彩 | 亚洲黄色天堂 | 日本激情网址 | 国产又黄又硬又湿又黄的网站免费 | 九九热在线观看视频 | 手机在线看永久av片免费 | 国产精品91在线 | 99久久精品一区二区三区 | 亚州综合| 国产素人在线 | 激情视频网址 | 亚洲免费三级 | 国产美女视频一区二区三区 | 成人天堂资源www在线 | 国产精品va在线播放我和闺蜜 | 国产精品视频全国免费观看 | 高清不卡一区二区三区 | 少妇精品蜜桃偷拍高潮系列 | 精品国产一区二区三区蜜殿 | 天天草天天干 | 91av看片| 国产一级免费不卡 | 国产成人精品一区二三区 | 久久韩国| 欧美性xxxx最大尺码 | 综合色久 | 99久久久国产精品免费蜜臀 | 男人下部进女人下部视频 | 精品国产乱码久久久久久1区2区 | 91麻豆蜜桃一区二区三区 | 国产精品久久久久久久久久妞妞 | 香蕉网站视频 | 人妻中出受孕 中文字幕在线 | 中文av免费| 久久精品导航 | 少妇又紧又色又爽又刺激视频网站 | 无码人妻少妇久久中文字幕 | 夜夜爽夜夜 | 国产专区精品 | 制服丝袜亚洲中文综合懂色 | 99久久久久久久久久久 | 日本免费视频在线观看 | 国产成人在线精品 | 业余 自由 性别 成熟偷窥 | 91免费国产视频 | 欧美性猛交xxxx乱大交 | 日日摸夜夜添夜夜添毛片av | 毛片网页| 国内丰满熟女出轨videos | 毛片毛片免费看 | 国产丝袜在线观看视频 | 天天干天天舔 | 久热国产精品视频一区二区三区 | 国产亚洲精品久久久闺蜜 | comwww在线观看免费软件 | 国产精品99久久久久久董美香 | 国产色视频网免费 | 可以看av | 国产精品去看片 | 夜夜摸狠狠添日日添高潮出水 | 久久久久久国产精品免费播放 | 精品乱码一区二区三四区视频 | 国产黄色av片 | 色婷婷视频在线 | 亚洲精品20p| 国产精品情侣 | 欧美午夜精品理论片a级按摩 | 手机免费av片 | www内射国产在线观看 | 三级黄色毛片 | 欧美伦理一区二区三区 | 国产精品亚洲精品日韩已方 | 免费无遮挡无码视频网站 | 久久天天干 | 草比视频在线观看 | 亚洲已满18点击进入在线看片 | 日日摸夜夜添夜夜添一区二区 | 丁香婷婷久久 | 涩涩网站在线看 | 日韩在线三级 | 日本大尺度吃奶呻吟视频 | 中文免费在线观看 | 丰满少妇作爱视频免费观看 | 日日碰狠狠躁久久躁9 | 国产999精品久久久久久 | 日本小视频网站 | 青青草国产在线 | 男人的天堂网在线 | 99国产精品国产精品九九 | 污网站免费在线观看 | 动漫羞羞 | 亚洲精品456在线播放dvd | 丰满少妇小早川怜子影片了 | 午夜福利无码不卡在线观看 | 国产美女久久 | 天天曰天天爽 | 中文字幕美人妻亅u乚一596 | 国产精品人人爽人人做我的可爱 | 一级二级av | 日本japanesexxx人妖 | 亚洲 精品 综合 精品 自拍 | 51久久国产露脸精品国产 | 丰满妇女毛茸茸刮毛 | 精品无码人妻一区二区免费蜜桃 | 成人片网址 | 免费午夜视频在线观看 | 国产成人精品一区二区三区 | 中文字幕在线播放一区 | 成年无码av片完整版 | 日日爱网站 | 日本高清视频一区 | 特一级一性一交一视一频 | 精品人伦一区二区三区蜜桃视频 | 久久久麻豆精品一区二区 | 国产极品美女高潮无套在线观看 | 日本老熟欧美老熟妇 | 大地资源中文在线观看官网第二页 | 欧美日韩片 | 操一操干一干 | 日本精品久久久久久 | av网站不卡 | 国产剧情v888av | 亚洲视频久久 | 亚洲欧美高清一区二区三区 | 国产一区二区三区久久久 | 亚洲视频1区 | 久热免费在线 | 一个人在线观看www软件 | 一边摸一边抽搐一进一出视频 | 亚洲成人高清在线 | 国产成人免费视频精品含羞草妖精 | 国产va在线观看 | 国产精品免费一视频区二区三区 | 国产精品不卡一区二区三区 | 久久精品一区二区视频 | 午夜视频一区二区三区 | 国产视频一区二区在线 | 亚洲国产精品无码久久久久高潮 | 男人激烈吮乳吃奶爽文 | 91精品日韩| 色偷偷av一区二区三区 | 少妇久久久久久久久久 | 久久99精品久久只有精品 | 狠狠色狠狠色综合网 | 九色视频国产 | 国外成人在线视频 | 91久久久久久久久久久久久 | 天天射中文 | 免费观看美女裸体网站 | 精品国产毛片 | 国产精品欧美一区二区三区不卡 | 性一爱一性一乱 | 乱码人妻一区二区三区 | 国产精品久久久久久久久果冻传媒 | 日日碰 | 国产精品日本一区二区不卡视频 | 国产精品免费大片 | 一线毛片 | 国产青青在线 | 国产精品偷乱一区二区三区 | 久久精品女人毛片国产 | 在线性视频 | 肉丝袜脚交视频一区二区 | 久久久久麻豆 | 在线观看精品黄av片免费 | 欧美视频免费看 | 日韩精品一二三四区 | 成人激烈床戏免费观看网站 | 乖女从小调教h尿便器小说 关秀媚三级 | 毛片a级片 | 就要操就要日 | 日韩在线观看一区二区 | 亚洲欧美成人一区二区在线电影 | 真实亲伦对白清晰在线播放 | 后宫一级淫片免费放 | 放荡的少妇2欧美版 | 午夜精品福利在线 | 992tv又爽又黄的免费视频 | 欧美成网站 | 精品视频免费播放 | 日本理伦片午夜理伦片 | 少妇粉嫩无套内谢 | 小12箩利洗澡无码视频网站 | 国产精品调教奴变态 | 91麻豆产精品久久久久久 | 国产女教师bbwbbwbbw | a免费网站免费观看 | 久青草视频 | 免费三片在线视频 | 日韩精品一卡 | 夜夜添狠狠添高潮出水 | 老司机午夜福利av无码特黄a | 国产丝袜美女精品av | 天天躁夜夜躁狠狠是什么心态 | 九九九九九九伊人 | 天天干天天操天天拍 | 亚洲国产日韩在线视频 | 日本中文字幕网站 | 午夜丰满寂寞少妇精品 | 99久久99久久精品免费看蜜桃 | 亚洲处破女av一区二区中文 | 亚洲毛片在线免费观看 | 狠狠色噜噜狠狠狠狠av不卡 | 18禁黄网站禁片免费观看 | 最全aⅴ番号库 | 91精品福利视频 | 天堂资源最新在线 | 手机在线观看毛片 | 欧美精品国产 | www.久久av| 国产91丝袜在线播放 | 女教师~淫辱のavhd101 | 国产中年熟女高潮大集合 | 极品少妇啪啪高清免费 | 国产又爽又黄游戏 | 欧美一区不卡 | 国产对白叫床清晰在线播放图片 | 极品少妇在线观看 | 国内成人精品2018免费看 | 亚洲啪啪aⅴ一区二区三区9色 | 91康先生在线国内精品 | av免费不卡| 亚洲精品无码永久中文字幕 | 国产精品区二区三区日本 | 美女一二区 | 熟妇人妻av中文字幕老熟妇 | 永久免费av网站 | 五月婷婷激情小说 | 国产欧美一区二区三区网站 | 精品国产一区二区三区久久久狼 | 久久久久无码中 | 日本黄漫动漫在线观看视频 | 亚洲精品久久久久中文字幕欢迎你 | 国产丰满美女做爰 | 一区二区三区高清在线观看 | 成人av社区| 日韩操比| 国产一级精品毛片 | 欧美日韩国语 | 人人妻人人澡人人爽人人精品浪潮 | 日韩成人大屁股内射喷水 | 男女视频一区二区 | 香蕉成人臿臿在线观看 | 黄色不雅视频 | 91久久极品少妇xxxxⅹ软件 | 精品久久久久久无码人妻热 | 超碰美女在线 | 日韩影院在线 | 欧美人与动交tv | 麻豆传媒一区二区 | 91免费黄视频 | 无毒的av网站 | 中文字幕福利视频 | 91日日日| 欧美少妇一区二区三区 | 国产伦精品一区二区三区在线观看 | 中文字幕在线播放不卡 | 一区二区视频在线观看免费 | 无码国产激情在线观看 | 少妇太紧太爽又黄又硬又爽 | 日韩a∨精品日韩在线观看 日韩avav | 夜夜高潮夜夜爽国产伦精品 | 成人午夜一区 | 三个少妇的按摩69xx | 97久久综合亚洲色hezyo | 黑人操亚洲女 | 男人在线网站 | 毛片国产精品 | 国产青草 | 午夜无人区免费网站 | 丰满少妇高潮惨叫久久久 | 蜜桃视频成人在线观看 | 国产成人成网站在线播放青青 | 性做爰过程免费视频美女按店 | 欧美日韩在线不卡 | 岛国大片在线 | 天天做天天爱夜夜爽 | 国产精品一品二品 | 撕开奶罩揉吮奶头视频 | 亚洲韩国在线 | 日日碰狠狠添天天爽五月婷 | 亚洲字幕av一区二区三区四区 | 亚洲一区二区高潮无套美女 | 精品无人区无码乱码毛片国产 | 欧美精品video | 精品久久8x国产免费观看 | 亚洲综合色av | 无码国产精品一区二区免费虚拟vr | 亚洲精品成人av在线 | 国产无套精品 | 少妇洁白178在线播放 | 久久精品无码一区二区小草 | 激情总合网 | 波多野结衣家庭主妇 | 国产一区久久 | 97中文字幕在线观看 | 国产露脸xxⅹ69 | 亚洲成人在线视频网站 | 在线不卡av| 亚洲伊人久久大香线蕉综合图片 | 九色视频偷拍少妇的秘密 | 亚洲色婷婷综合开心网 | 综合无码一区二区三区 | 成人精品啪啪欧美成 | 毛片资源| 国产a18片免费观看 国产aⅴxxx片 | 中文字幕第6页 | 成人免费午夜视频69影院 | 日本一区二区不卡在线 | 麻豆av一区二区三区 | 亚洲精品sm一区二区 | 中国美女囗交视频免费看 | aaaa大片少妇高潮免费看 | 老熟妻内射精品一区 | 成人高清网站 | 黄色国产一级 | 久久影视中文字幕 | 九九黄色片 | 7788色淫网站免费 | 懂色av一区二区夜夜嗨 | 亚洲欧美在线免费观看 | 无码午夜福利视频一区 | 色婷婷综合久久久久中文一区二区 | 久久久久女教师免费一区 | 99午夜视频| 中文字幕在线播 | 亚洲永久精品视频 | 亚洲日韩中文字幕一区 | 风流还珠之乱淫h文 | 麻豆黄色网| 影音先锋亚洲天堂 | 日本艹逼视频 | 69久久久成人看片免费一区二 | 国产福利酱国产一区二区 | 午夜黄色福利视频 | 欧美黑人激情性久久 | 日本三级在线观看免费 | 日韩精品一区二区三区四区 | 久草福利资源在线 | 国产一区二区精品久久岳 | 国产猛男猛女超爽免费视频 | 麻豆网站免费观看 | 国产日韩欧美在线播放 | 91成人免费在线视频 | 国产精品天堂avav在线 | 日产国产欧美视频一区精品 | 99久久精品国产一区二区三区 | 手机看片一区 | 91亚洲精华国产精华液 | 成人免费网站www网站高清 | 九九九久久久久久 | 性色a码一区二区三区天美传媒 | 成人亚洲性情网站www在线观看国产 | 亚洲精品一区二区三区新线路 | 免费国精产品—品二品 | 深夜成人在线 | 国产成人tv| 希岛婚前侵犯中文字幕在线 | 成人免费毛片片v | 日本精品一区二区在线观看 | 日韩中文av | 四虎精品影视 | 免费看成人毛片 | 国内国内在线自偷第68页 | 国产超碰精品 | 国产又黄又爽又色的免费视频白丝 | 欧美顶级metart裸体全部自慰 | 成人激烈床戏免费观看网站 | 色播亚洲视频在线观看 | 小视频成人 | 91精品国产综合久久香蕉922 | 538国产精品一区二区 | 四虎影视成人永久免费观看亚洲欧美 | 国产欧美亚洲精品a | 艳妇av| 久久精品蜜桃 | 艳妇乳肉豪妇荡乳av | 国产成人精品福利 | 最大胆裸体人体牲交免费 | 国产视频xxxx| 亚洲精品久久久久中文字幕欢迎你 | 中文字幕一区二区三区免费视频 | www亚洲国产 | 99福利视频导航 | 国内自拍在线观看 | 久久黄色片视频 | 精品久久久久亚洲 | 国产内射老熟女aaaa | 国产日韩成人 | 国产欧美精品一区 | 欧美裸体女人 | 亚洲综合色丁香婷婷六月图片 | 麻豆影视免费观看 | 91精品综合久久久久久五月天 | 中国丰满少妇熟乱xxxx | 精品国产区一区二 | 柠檬福利视频导航 | 小莹浴室激情2 | 超碰人人干 | 风流老熟女一区二区三区 | 欧美日本日韩 | 最近中文字幕在线中文视频 | 有码中文 | 国产精品久久久久无码人妻 | 国产成人精品777 | 91精品国产福利一区二区三区 | 大肉大捧一进一出好爽mba | 乱熟女高潮一区二区在线 | 性欧美1819性猛交 | 久久欧洲| 让少妇高潮无乱码高清在线观看 | 欧美三p| 日本午夜无人区毛片私人影院 | 完美奇遇在线观看 | 暖暖视频日本在线观看 | 中文av网| 国产精品亚洲综合一区二区三区 | 中字幕视频在线永久在线观看免费 | 少妇高潮无套无遮挡内谢小说 | 999视频在线 | 欧美超逼视频 | 精品综合久久久久久98 | 欧美激情爱爱 | 无线日本视频精品 | 国产黄色精品视频 | 国产精品无码电影在线观看 | 日韩黄色一级网站 | 欧美另类z0z变态 | 狠狠躁夜夜躁人人爽天天天天97 | 日本熟妇色一本在线视频 | 白嫩嫩翘臀美女在线视频 | 91人人揉日日捏人人看 | 和粗大男人做爰过程 | 天堂av资源 | 免费无码成人av片在线在线播放 | 久久久久久免费精品 | 久久亚洲色一区二区三区 | 欧美成人免费在线视频 | av片免费在线播放 | 天天插插插 | 欧美激情va永久在线播放 | 亚洲不卡视频在线 | 美女毛片 | 亚洲婷婷丁香 | 亚洲午夜天堂吃瓜在线 | 少妇太爽了太深了太硬了 | 狠狠色香婷婷久久亚洲精品 | 午夜视频福利在线观看 | 3d啪啪动漫精品少妇 | 超碰97av| 久久在线免费观看视频 | 四虎影库久免费视频 | 亚洲加勒比在线 | 国产精品国产三级国产a | 女人高潮av国产伦理剧 | 免费无码专区毛片高潮喷水 | 国产白嫩受无套呻吟 | 色呦呦在线免费观看 | 台湾佬自拍偷区亚洲综合 | 在线一区二区三区视频 | 13一15学生毛片视频软件 | 国产成a人亚洲精v品无码性色 | 国产好大好紧好爽好湿视频唱戏 | 极品福利在线 | 亚洲深深色噜噜狠狠网站 | 欧美三级影院 | 亚洲日韩欧美国产高清αv 性夜久久一区国产9人妻 | 无码里番纯肉h在线网站 | 老熟女毛茸茸浓毛 | 日韩欧洲亚洲 | 日日干干| 日本午夜精华 | 久久久受| 日韩欧美在线第一页 | 国产小屁孩cao大人 亚洲国产精品久久精品 | 93看片淫黄大片一级 | 久久午夜网站 | 国产色频| 九九人人 | 人妻无码中文久久久久专区 | 好吊日精品视频 | 国产欧美日韩三区 | 女人av | 精品人妻中文字幕有码在线 | 国产精品人人做人人爽人人添 | 久热精品在线观看 | 亚洲欧洲日本综合aⅴ在线 国语自产偷拍精品视频偷 午夜无码区在线观看 | 无码福利日韩神码福利片 | 日本无遮挡吸乳呻吟视频 | 欧美久久成人 | 久久婷婷香蕉热狠狠综合 | 国产九九热 | 色婷婷综合成人 | 欧美在线观看一区二区 | 美女av免费看 | 青草av.久久免费一区 | 国产成人精品一区二区仙踪林 | 国产精品视频偷伦精品视频 | 国产精品区在线观看 | 日产一二三四五六七区麻豆 | 精品久久久久久无码专区不卡 | 亚洲第一性理论片 | 国产乱人偷精品人妻a片 | 精品日韩久久 | 欧美专区在线播放 | 天天艹逼网 | 九九热视频免费观看 | 三级免费网站 | 丰满少妇被猛男猛烈进入久久 | 三男一女吃奶添下面视频 | 人妻少妇精品中文字幕av | 亚洲国产精品人人做人人爱 | 日韩国产高清在线 | 深夜福利视频网站 | av片在线观看免费 | 国产高清av首播原创麻豆 | 成人黄性视频 | 国产日产欧美a级毛片 | 毛片在线免费视频 | 日韩在线亚洲 | 中文字幕欧美在线 | 国产精品久久久久久影视 | 6699嫩草久久久精品影院 | 精品亚洲一区二区三区四区五区 | 超碰97在线人人 | 蜜桃视频一区二区三区四区开放时间 | 国产又粗又大又爽视频 | 久久久久久久亚洲精品 | 日本老太做爰xxxx | 国产成人在线免费观看 | 男人边做边吃奶头视频 | 中文在线最新版天堂 | 嘴交的视频丨vk口舌视频 | 欧美一区二区三区久久 | 亚洲午夜福利在线视频 | 在线观看av网 | 免费成年人视频在线观看 | 成人中文字幕+乱码+中文字幕 | 日韩视频第一页 | 国产精品无码永久免费888 | 午夜国产福利 | 亚洲人成色77777 | 一级片在线免费 | 成人网av| 五月天黄色小说 | 国产欧美久久久精品免费 | 伊人影院中文字幕 | 亚洲精品一区二区三区四区五区 | a∨变态另类天堂无码专区 人妻丰满熟妇av无码区不卡 | 欧美久久久久久 | 国产精品爽爽爽爽爽爽在线观看 | 国产一级理论 | 日日摸日日碰夜夜爽亚洲精品蜜乳 | 一级裸体视频 | 色一情一伦一子一伦一区 | 韩日视频| 风间由美性色一区二区三区四区 | 伊人免费在线观看 | 少妇真人直播免费视频 | 国产精品区一区二区三区 | 天天做天天爱夜夜爽毛片毛片 | 你懂的网站在线观看 | 天堂av在线中文 | 色妞www精品视频 | 78m成人永久免费78m | 欧美精品一区在线 | 黄色一区二区三区视频 | 成人免费毛片免费 | 欧美黄色一级生活片 | 97在线视频免费观看 | 忘忧草社区在线www 内射老阿姨1区2区3区4区 | 亚洲理论影院 | 亚洲成a人片 | 亚洲熟妇少妇任你躁在线观看无码 | 成人综合婷婷国产精品久久蜜臀 | 亚洲色图狠狠干 | 少妇色综合 | 午夜理论片yy8860y影院 | 精品在线播放视频 | 女人裸体做爰免费视频 | 亚洲熟女www一区二区三区 | 午夜在线视频观看日韩17c | 亚洲欧美一区二区三区视频 | 亚洲精品日本久久一区二区三区 | 国产女主播白浆在线观看 | 中文字幕在线影视 | 在线看色网站 | 11月流出美女撒尿偷拍在线播放 | 亚洲国产婷婷综合在线精品 | 精品久久国产字幕高潮 | 女人与拘性猛交视频 | 国产黄色片免费 | 国产强被迫伦姧在线观看无码 | 成年人黄色网址 | 少妇与子乱毛片 | 欧美性天天 | 做爰猛烈叫床91 | 桥本有菜免费av一区二区三区 | 综合色吧| 韩国午夜理论在线观看 | 东京一木一道一二三区 | 在线人成视频播放午夜福利 | av在线免费网址 | 久久中文骚妇内射 | 人善交video另类hd侏儒 | 国产美女av| 中文字幕一区2区3区 | 青青草视频在线观看 | av国产网站 | 欧美成人三级伦在线观看 | 国产中文字幕乱人伦在线观看 | 日韩欧美群交p片內射中文 三级4级全黄60分钟 | 欧美日韩a | 性少妇裸体野外性xxxhd | 日韩精品一区二区三区四区视频 | 欧美啪啪小视频 | 三上悠亚日韩精品二区 | 久久婷婷亚洲 | 中文在线好最新版在线 | 中文字幕第23页在线 | 辽宁熟女高潮狂叫视频 | 91精品一区二区 | 欧美成人aa | 成人国产欧美 | 999视频在线播放 | 色啦啦视频 | 九九热在线精品视频 | 成人试看120秒体验区 | 久久少妇视频 | 五月天中文字幕 | 久久精品无码专区免费东京热 | 五月激情av | 精品国产一区二区三区久久狼黑人 | 精品日本一区二区三区在线观看 | 我要看三级毛片 | 久久99精品久久久久久动态图 | 蜜桃视频一区二区三区四区开放时间 | 国产又粗又猛又大爽又黄老大爷 | mm1313亚洲国产精品无码试看 | 欧美极品在线 | 在线亚洲高清揄拍自拍一品区 | 2018天天干天天射 | 在线免费观看av不卡 | 国产成人无码一区二区三区 | 人人澡人人妻人人爽人人蜜桃麻豆 | 国产极品久久 | 国产一级黄色录像 | 日韩视频在线一区二区 | 久久亚洲天堂网 | 少妇高潮a一级 | 青青草视频免费观看 | 日韩毛片在线 | 国产无遮挡又黄又爽免费视频 | 久久久无码精品亚洲日韩按摩 | 国产精品久久久久不卡 | 国产精品久久久久久久久免费樱桃 | 日韩视频免费看 | 青青久久av北条麻妃海外网 | 性做久久久 | 在线观看日韩中文字幕 | 欧美成人一级视频 | 精品欧美一区二区三区精品久久 | 国产成人jvid在线播放 | 日韩免费毛片 | 国产黄色网址在线观看 | 91成人短视频免费版 | 亚洲欧美中文日韩在线v日本 | 97超碰在线免费观看 | 国产成人aaaa | 久久无码av三级 | 亚洲区和欧洲区一二三四 | 国产一级一片射内视频 | 色天堂影院 | 国产无遮挡成人免费视频 | 人妻三级日本三级日本三级极 | 国产精品久久久久免费 | 潘金莲三级野外 | av在线成人| 在线观看中文字幕第一页 | 污污视频网站免费在线观看 | 欧美精品久久久久久久多人混战 | 少妇毛片久久久久久久久竹菊影院 | 亚洲中文字幕av在天堂 | 久久99久久99精品免观看 | 玖玖在线视频 | 亚洲第一成肉网 | 国产精品午夜在线观看 | 精品人妻无码区在线视频 | 在线超碰 | 免费观看毛片网站 | 综合久久国产九一剧情麻豆 | 日韩午夜片 | 91精品久久久久久久久久入口 | a天堂资源 | 狠狠色婷婷久久一区二区三区 | 成人国产免费观看 | 91在线精品李宗瑞 | 成年人国产精品 | 有码视频在线观看 | 欧美性猛交xxxx免费看久久 | 中文字幕不卡在线 | 亚洲视频网址 | 18成人片黄网站www | 色香色香欲天天天影视综合网 | 精品国产18久久久久久依依影院 | 女优中文字幕 | 人妻丰满熟妇无码区免费 | 久久精品国产乱子伦 | 日韩精品在线免费看 | 91灌醉下药在线观看播放 | 国产人妖视频一区二区 | 欧美成视频人免费淫片 | 尤物视频在线观看免费 | 黄色在线免费观看视频 | 大尺度网站在线观看 | 97超碰资源站 | 久久五月精品中文字幕 | 自拍1区 | 成人久久毛片 | 国产成人久久久精品免费澳门 | 大地资源影视在线播放观看高清视频 | 久久精品一区二区三区不卡牛牛 | 久久98精品久久久久久久性 | 二区国产| 久久精品国语 | 国产内射在线激情一区 | 日日操网 | 午夜福制92视频 | 末发育娇小性色xxxxx视频 | 成人免费在线观看av | 精品亚洲一区二区三区四区五区 | 日本人六九视频 | 女人做爰全过程免费观看美女 | 美女脱免费看网站女同 | 中文字幕狠狠 | 欧美在线视频精品 | www.嫩草.com | 国产精品久久久久桃色tv | 91看片成人| 日本成人中文字幕 | 中文字幕av一区 | 日韩尤物 | 国产亚洲精品一区二区三区 | 亚洲射情 | 欧美日韩在线a | 91久久综合| 色婷婷一区二区三区四区 | 久久免费视频1 | 日本公妇乱淫hd | 777精品伊人久久久久大香线蕉 | 国产免码va在线观看免费 | 久久99婷婷国产精品免费 | av免费在线观看不卡 | 青青草手机视频在线观看 | 国产嫩草在线观看 | 欧洲精品va无码一区二区三区 | 亚洲一本在线观看 | 午夜91视频 | 老色批永久免费网站www | 禁片天堂 | 国产网站免费观看 | 国产a一级片 | 国产爽爽视频 | 男女乱淫真视频免费播放 | 69xxx免费视频 | 欧美日韩国产二区 | 日韩在线第一 | 操操网av| 亚洲精品18 | 成人精品在线 | 全网免费在线播放视频入口 | 啪啪福利| 99精产国品一二三产区网站 | 国产特级毛片aaaaaaa高清 | 97青草超碰久久国内精品91 | 亚洲人成网站999久久久综合 | 亚洲经典久久 | 精品国偷自产在线 | 97精品视频在线播放 | 蜜桃成人av | 欧美大片免费观看在线观看网站推荐 | 中文字幕一区二区三区四区五区 | 91九色国产蝌蚪 | 欧美另类变人与禽xxxxx | 国内丰满少妇猛烈精品播 | 日韩一级片一区二区三区 | 丁香花开心四播房麻豆 | 人人澡人人妻人人爽人人蜜桃麻豆 | 欧美激情久久久 | 亚洲色图图片区 | 少妇人妻精品一区二区三区 | 亚洲中字幕 | 超碰人人国产 | 中文字幕av专区 | 91tv亚洲精品香蕉国产一区 | 国产一区二区在线视频观看 | 成人区精品一区二区婷婷 | 亚洲精品一区二区三区大桥未久 | 不卡免费视频 | 国产成人aaaa | 亚洲精品国产品国语在线观看 | 亚洲成人777| 五月亚洲综合 | 一级做a爰片久久 | 国产性色视频 | 又粗又硬又大又爽免费视频播放 | 国产精品国三级国产av | 青草伊人久久 | 久久久69| 无码av岛国片在线播放 | 日本三级久久 | 成年片黄色日本大片网站视频 | 黑人大长吊大战中国人妻 | 黄色在线视频网址 | 寂寞d奶大胸少妇 | 欧美成人影院亚洲综合图 | 美女的奶胸大爽爽大片 | 国产精品永久免费 | 美女av一区二区三区 | 国产精品又黄又爽又色无遮挡 | 欧美草逼视频 | 天天干导航| 好紧好爽再进去一点在线视频 | 精品免费国产一区二区 | 精品国精品国产自在久国产87 | 成人动漫区 | 成人免费区一区二区三区 | 午夜影院18 | 黄色片小视频 | 亚洲视频在线观看网址 | 91美女在线 | 国产成年人视频 | 亚洲韩国在线 | 国产精品欧美一区二区三区不卡 | 午夜肉伦伦影院 | 久久久久无码精品国产h动漫 | 亚洲日本va午夜中文字幕 | 亚洲字幕在线观看 | 中文在线а天堂中文在线新版 | 国产全肉乱妇杂乱视频男男 | 91国内精品自线在拍白富美 | 99视频+国产日韩欧美 | 乱码人妻一区二区三区 | 精品 日韩 国产 欧美 视频 | 久久久精品2019免费观看 | 777天堂麻豆爱综合视频 | 97视频免费看 | 免费看黄色a级片 | 蜜桃一本色道久久综合亚洲精品冫 | 久久婷婷综合色丁香五月 | 亚洲精品激情 | 中文字幕丝袜一区二区 | 亚洲图片欧美 | 在线观看免费毛片 | 国产精品一区二区吃奶在线观看 | 无码人妻丰满熟妇区毛片 | 明星乱淫免费视频欧美 | 亚洲aⅴ在线无码播放毛片一线天 | 国产丝袜一区二区三区免费视频 | 日本不卡一区二区三区视频 | 国产婷婷色综合av蜜臀av | 成人高清| 中文字幕成人 | 欧美一区二区三区成人 | 欧美激情综合 | 在线免费观看视频黄 | 国产精品毛片久久久久久久 | xvideos亚洲网站入口 | 无码av免费毛片一区二区 | 玩丰满熟妇xxxx视频 | 色一情一乱一伦一视频免费看 | 久久不见久久见免费视频7 18禁黄久久久aaa片广濑美月 | 双性受爽到不停的喷水bl | 精品综合网 | 视频一区二区在线 | 色婷婷一区二区 | 寂寞少妇按摩spa高潮91 | av免费观看网站 | 久久久国产一区二区三区 | 青草成人免费视频 | 国产天堂在线 | 国产黄a三级三级三级老年人 | 一级特黄色毛片 | 国内精品久久久久影视老司机 | 国产女人乱人伦精品一区二区 | 久久九九网站 | 久久婷婷成人综合色 | 精品午夜福利在线观看 | 日韩久久精品一区二区 | 亚洲图片在线播放 | 国产女人在线观看 | 91久久香蕉国产日韩欧美9色 | 中文精品久久 | 日本a级黄色 | 日产久久久久久 | 亚洲色图日韩 | 99精品久久久中文字幕 | 欧美精品二区三区四区免费看视频 | 秋霞欧洲| 天干天干天啪啪夜爽爽av | 国产呻吟久久久久久久92 | 91综合色 | 久久综合九色综合网站 | 女厕厕露p撒尿八个少妇 | а√天堂8资源在线官网 | 免费asmr色诱娇喘呻吟外国 | 欧美日韩欧美日韩在线观看视频 | 黄a在线观看 | 91久久极品少妇韩国 | 少妇免费视频 | www豆豆成人网com | 精品国产乱码久久久软件使用方法 | 综合网天天 | 96精品 | 插插久久 | 黄色激情av| 亚洲国产婷婷香蕉久久久久久 | 国产精品v欧美精品v日韩精品 | 欧美激情在线播放 | 四虎国产精品一区二区 | 岛国成人在线 | 色综久久综合桃花网 | 亚洲国产成人精品女 | 福利第一页| 色偷偷人人澡人人爽人人模 | 亚洲精品色午夜无码专区日韩 | 亚洲熟妇av乱码在线观看 | 四虎影视成人永久免费观看亚洲欧美 | 91麻豆精产国品一二三产区区 | 欧美日韩成人在线视频 | 久久99精品久久久久子伦 | 国产色视频一区二区三区qq号 | wwwtianlulacom| 四虎8848精品成人免费网站 | 久久久亚洲精品石原莉奈 | 中国极品少妇xxxx做受 | 午夜视频在线免费播放 | 久久精国产 | 国产男人搡女人免费视频 | 亚洲精品av羞羞禁网站 | 久久精品国产99国产精偷 | 亚洲jlzzjizz少妇 | 中文日韩v日本国产 | 久久天天综合桃花久久 | 欧美交换配乱吟粗大 | 韩国边摸边做呻吟激情 | 中文字幕免费观看视频 | 亚洲欧美成人aⅴ大片 | 久久久久在线视频 | 激情欧美一区二区三区 | 狠狠干在线观看 | 免费观看成人羞羞视频网站观看 | 国产a久久麻豆入口 | 欧美激情一区二区三区 | 国产精品久久久久久亚洲徐婉婉 | 在线能看的av | 国产成人中文字幕 | 国产911| 亚洲人成77777在线播放网站 | 激情啪啪网站 | 奇米777第四色 | 精品视频www | 人人草视频在线 | 97婷婷大伊香蕉精品视频 | 丝袜 国产 日韩 另类 美女 | 欧美日本韩国在线 | 午夜丰满少妇性开放视频 | 大尺度无遮挡激烈床震网站 | 中国一级特黄毛片大片久久 | 蜜臀91精品国产免费观看 | 91少妇和黑人露脸 | 久久久青青草 | √新版天堂资源在线资源 | 欧美大片高清免费观看 | 三级在线国产 | 2019中文字幕在线视频 | 成人久久久精品乱码一区二区三区 | 久久先锋 | 久久中文精品无码中文字幕下载 | 国产高潮久久久久久绿帽 | 国产欧美熟妇另类久久久 | 性欧美精品高清 | 欧美日韩在线免费观看视频 | 四虎av影视 | 超碰神马 | 午夜av免费在线观看 | 九色porny丨国产首页注册 | 国产精品国产免费无码专区不卡 | 久久久久成人免费看a含羞草久色 | 99热国产在线 | 国产美女无遮挡裸色视频 | 免费男性肉肉影院 | 精品国产91久久久久久 | 中文在线а天堂中文在线新版 | 女人高潮av国产伦理剧 | 国产寡妇精品久久久久久 | 中文字幕免费在线看线人动作大片 | 中文字幕国产一区二区 | 青草草在线视频 | 天堂av最新网址 | 亚洲人视频在线观看 | 精品国产亚洲一区二区三区 | 国产妇女乱一性一交 | 天天草天天草 | 国产91九色在线播放 | 欧美人与动性行为视频 | 亚洲ⅴ国产v天堂a无码二区 | 一道本在线伊人蕉无码 | 日韩精品手机在线 | 亚洲第一女人av | 天堂网在线观看 | 欧美xxxx做受欧美 | 日韩精品一区二区三区中文 | 啪免费 | 九九热这里有精品 | 久草在线视频网站 | 波多野结衣亚洲天堂 | 郑艳丽三级 | 91免费看片网站 | 无码国产精品一区二区免费式影视 | 人妻少妇偷人精品无码 | 亚洲天堂网在线播放 | 一级黄色小视频 | 懂色av粉嫩av蜜乳av | 亚洲国产视频在线观看 | 欧美一性一乱一交一视频 | 免费黄色毛片视频 | 亚洲一区二区在线视频 | 一区二区三区四区在线视频 | 丝袜美腿一区二区三区 | ass少妇pics粉嫩bbw1 | 色婷在线| 久久久成人毛片无码 | 伊人网站在线观看 | 樱花影院电视剧免费 | 日本精品视频在线 | 一本之道高清无码视频 | 白石茉莉奈一区二区av | 天天想天天干 | 色悠久久久 | 大地资源网第二页免费观看 | 久久国产小视频 | 亚洲视频一区二区在线 | 一边吃奶一边做动态图 | asian日本若图pics | 日韩在线免费视频观看 | 四虎8848精品成人免费网站 | av男人网 | 韩国久久精品 | 久久婷婷色一区二区三区asmr | av大片在线无码免费 | 国产稀缺真实呦乱在线 | 日本三级不卡 | 91亚洲国产精品 | 国产夫妻精品 | 成年片色大黄全免费软件到 | 国产超碰在线观看 | 黄色片网址在线观看 | 五月天婷婷视频在线观看 | 人妻精品无码一区二区三区 | 亚洲xxx视频 | 日本黄色免费网址 | 成人午夜视频在线观看 | 精品一二三 | 激情综合色综合啪啪开心 | www.嫩草.com| 香蕉视频网站入口 | 99久久精品免费看国产一区二区三区 | 久久精品超碰 | 中文字幕一区二区三区乱码图片 | 成人不卡视频 | 妺妺窝人体色www在线观看 | 亚洲aaa毛片 | 国产又黄又爽又色的视频 | 99热这里只有精品3 99热这里只有精品4 | 夜夜撸av | 婷婷伊人久久大香线蕉av | 白白色免费视频 | 夜夜嗨av色一区二区不卡 | 国产夫妇肉麻对白 | 免费黄色成人 | 日本无遮羞教调屁股视频网站 | 97精品视频在线观看 | 国产一级特黄视频 | 午夜精品区 | 亚洲免费精品 | 欧美日韩免费做爰大片人 | 在线欧美色 | 中文字幕无码日韩专区 | 国产精品毛片无遮挡 | 91宅男噜噜噜66在线观看 | 9久久久| 新版天堂资源中文8在线 | 国产免费一级特黄录像 | 2019年中文字幕 | 午夜男女很黄的视频 | 亚洲专区在线播放 | 国精产品一区二区三区有限公司 | 一本大道伊人av久久综合 | 免费看成人毛片 | 在线观看三级视频 | 亚洲精品午夜久久久久久久灵蛇爱 | 欧美日韩久久精品 | 免费人成xvideoscom | 色综合九九 | 色鬼久久| 又湿又紧又大又爽a视频国产 | 美女国内精品自产拍在线播放 | 国产精品爽爽爽 | 98色婷婷在线 | 欧美婷婷久久五月精品三区 | 国产l精品国产亚洲区久久 国产sm主人调教女m视频 | 狠狠躁18三区二区一区 | 中文字幕在线观看亚洲 | 久久久久久久久久久久久久国产 | 4hu四虎永久在线观看 | 懂色av一二三三区免费 | 又黄又爽又色视频免费 | 无码尹人久久相蕉无码 | 又爽又大久久久级淫片毛片 | 国产老太婆免费交性大片 | 性开放的欧美大片 | 久久久成人免费视频 | 精品一区二区ww | 台湾绝版午夜裸体写真秀 | 蜜桃视频久久 | 成人午夜免费在线 | 国产精品美女www爽爽爽软件 | 天天综合网天天综合 | 大青草久久久蜜臀av久久 | 日韩欧美国产成人精品免费 | 国产玉足榨精视频在线观看 | 又黄又爽又刺激久久久久亚洲精品 | 极品少妇xxxx精品少妇小说 | 久久久久亚洲精品中文字幕 | 又爽又黄禁片1000视频vr | 亚洲男人天堂视频 | 欧美久操 | 成人免费视频大全 | 伊人春色影院 | 黄色网络在线观看 | 黄色一及毛片 | 欧美亚州国产 | 视频在线观看一区二区 | 91午夜少妇三级全黄 | 男人和女人高潮做爰视频 | 日韩少妇乱码一区二区三区免费 | 成人乱淫av日日摸夜夜爽 | 日韩av无码中文无码不卡电影 | 天天操bb| 高清三区 |