首頁

小程序分銷與轉(zhuǎn)介紹攻略

藍藍設(shè)計的小編

一、小程序分銷詳解?
(一)分銷模式設(shè)置?
  1. 分銷商等級體系構(gòu)建?
  • 為了激勵分銷商積極推廣,可設(shè)置多級分銷商等級,比如初級、中級、高級分銷商。初級分銷商成功推廣一定數(shù)量商品或達到一定銷售額后可晉升為中級分銷商,中級再晉升為高級。不同等級分銷商享受不同的傭金比例,等級越高,傭金比例越高。例如,初級分銷商每成功推廣一單可獲得商品價格 5% 的傭金,中級為 8%,高級為 10%。?
  • 除了傭金比例差異,還可以賦予不同等級分銷商其他權(quán)益。高級分銷商可能享有優(yōu)先參與新品推廣、專屬客服服務(wù)等特權(quán),中級分銷商可獲得額外的推廣素材資源,初級分銷商則可通過完成特定任務(wù)快速提升等級。?
  1. 傭金計算規(guī)則制定?
  • 傭金計算基礎(chǔ)通常以商品實際成交價格為準,即扣除優(yōu)惠券、積分抵扣等優(yōu)惠后的金額。比如一件商品原價 100 元,用戶使用了 10 元優(yōu)惠券,實際支付 90 元,那么分銷商的傭金就基于這 90 元計算。?
  • 可以設(shè)置多種傭金計算方式。除了按固定比例計算,還可以采用階梯式傭金計算。例如,分銷商在一個月內(nèi)推廣銷售額達到 5000 元,傭金比例提升至 12%;達到 10000 元,傭金比例提升至 15%,以此鼓勵分銷商努力提升業(yè)績。?
  1. 分銷關(guān)系綁定邏輯?
  • 常見的分銷關(guān)系綁定方式是基于用戶首次點擊的分享鏈接或掃描的分銷二維碼。當(dāng)用戶點擊分銷商分享的鏈接進入小程序后,系統(tǒng)自動記錄該用戶與分享鏈接的分銷商之間的關(guān)聯(lián)關(guān)系,后續(xù)該用戶在小程序內(nèi)的所有購買行為,只要符合分銷規(guī)則,相應(yīng)的分銷商都能獲得傭金。?
  • 為了防止分銷關(guān)系被惡意篡改,需要有嚴格的技術(shù)保障。同時,要設(shè)置合理的分銷關(guān)系有效期,比如用戶點擊分享鏈接后的 30 天內(nèi)產(chǎn)生的購買行為都與該分銷商關(guān)聯(lián),若超過 30 天未購買,再次購買時需重新點擊分享鏈接確定分銷關(guān)系。?
(二)分銷推廣工具與渠道?
  1. 商品分享鏈接與海報制作?
  • 為分銷商提供便捷的商品分享鏈接生成工具,鏈接要簡潔且包含分銷商的唯一標識信息,方便系統(tǒng)識別和追蹤。同時,設(shè)計精美的商品分享海報,海報上突出商品的核心賣點、優(yōu)惠信息以及分銷商專屬二維碼。例如,對于一款護膚品,海報上展示產(chǎn)品的主要功效(如美白、保濕)、限時折扣(如 8 折優(yōu)惠)以及分銷商二維碼,吸引用戶掃碼購買。?
  • 海報的設(shè)計風(fēng)格要與小程序整體品牌形象一致,并且要適應(yīng)不同的社交平臺尺寸要求。在微信朋友圈分享時,海報尺寸應(yīng)符合朋友圈最佳展示效果,確保清晰美觀,提高用戶的點擊率和購買轉(zhuǎn)化率。?

  1. 社交媒體渠道推廣?
  • 鼓勵分銷商在微信、微博、抖音等社交媒體平臺進行推廣。在微信上,分銷商可以將商品分享鏈接或海報發(fā)送到朋友圈、微信群,針對不同的圈子選擇不同的推廣話術(shù)。比如在寶媽群推廣母嬰類小程序商品時,話術(shù)可以側(cè)重于產(chǎn)品對寶寶健康成長的幫助以及自身使用的真實體驗。?
  • 在微博上,利用熱門話題標簽,結(jié)合商品特點發(fā)布有趣、有價值的內(nèi)容,吸引更多潛在用戶關(guān)注。例如推廣一款健身器材小程序商品時,發(fā)布與健身相關(guān)的話題內(nèi)容,如 “如何在家高效健身”,并在文中巧妙植入商品分享鏈接。在抖音上,可以制作生動的短視頻展示商品使用過程和效果,引導(dǎo)用戶點擊視頻中的小程序鏈接購買。?
  1. 小程序內(nèi)分銷中心建設(shè)?
  • 在小程序內(nèi)搭建專門的分銷中心頁面。頁面設(shè)計要簡潔明了,易于操作。在分銷中心,分銷商可以清晰地看到自己的推廣數(shù)據(jù),如推廣訂單數(shù)量、銷售額、待結(jié)算傭金、已結(jié)算傭金等。同時,提供推廣商品的詳細列表,包括商品圖片、名稱、價格、傭金比例等信息,方便分銷商選擇推廣商品。?
  • 分銷中心還應(yīng)設(shè)置分銷商申請入口(如果有申請成為分銷商的門檻)、分銷規(guī)則說明、推廣技巧分享等板塊。推廣技巧分享板塊可以定期更新一些實用的推廣方法和案例,幫助分銷商提升推廣效果。例如分享如何撰寫吸引人的朋友圈文案、如何利用抖音短視頻進行商品推廣等案例。?
(三)分銷數(shù)據(jù)管理與分析?
  1. 關(guān)鍵數(shù)據(jù)指標監(jiān)測?
  • 商家需要重點監(jiān)測分銷商數(shù)量、分銷商活躍度、推廣訂單量、銷售額、傭金支出等關(guān)鍵數(shù)據(jù)指標。通過對分銷商數(shù)量的監(jiān)測,可以了解分銷團隊的規(guī)模增長情況;分銷商活躍度反映了分銷商參與推廣的積極性,比如查看分銷商登錄分銷中心的頻率、分享商品的次數(shù)等。?
  • 推廣訂單量和銷售額直接體現(xiàn)了分銷效果,通過分析不同時間段、不同商品的訂單量和銷售額,能夠發(fā)現(xiàn)暢銷商品和銷售低谷期,以便調(diào)整推廣策略。傭金支出數(shù)據(jù)則幫助商家控制成本,確保分銷模式的盈利性。?
  1. 數(shù)據(jù)報表生成與分析?
  • 定期生成數(shù)據(jù)報表,如日報表、周報表、月報表等。報表內(nèi)容應(yīng)包括各項關(guān)鍵數(shù)據(jù)指標的詳細數(shù)據(jù)以及變化趨勢圖表。例如,月報表中展示本月分銷商數(shù)量的增長曲線、各類商品的銷售額占比餅圖、不同等級分銷商的傭金支出柱狀圖等。?
  • 通過對數(shù)據(jù)報表的深入分析,挖掘數(shù)據(jù)背后的原因。如果發(fā)現(xiàn)某個時間段內(nèi)銷售額下降,可能是因為某類商品的市場需求變化,或者是競爭對手推出了類似的優(yōu)惠活動。根據(jù)分析結(jié)果,及時調(diào)整商品推廣策略,如加大熱門商品的推廣力度、優(yōu)化商品價格體系等。?
  1. 基于數(shù)據(jù)的優(yōu)化決策?
  • 根據(jù)數(shù)據(jù)分析結(jié)果,對分銷模式進行優(yōu)化。如果發(fā)現(xiàn)某個等級的分銷商數(shù)量過多,但業(yè)績貢獻不高,可以適當(dāng)調(diào)整該等級的傭金比例或晉升門檻,激勵分銷商努力提升業(yè)績。?
  • 對于推廣效果不佳的商品,可以考慮優(yōu)化商品詳情頁內(nèi)容、調(diào)整商品價格或推出針對性的促銷活動。同時,根據(jù)數(shù)據(jù)反饋,為分銷商提供更有針對性的推廣建議和資源支持,提高整體分銷效率。?
二、小程序轉(zhuǎn)介紹策略?
(一)轉(zhuǎn)介紹獎勵機制設(shè)計?
  1. 多樣化獎勵形式?
  • 積分獎勵:用戶成功轉(zhuǎn)介紹新用戶注冊或購買商品后,可獲得一定數(shù)量的積分。積分可以在小程序內(nèi)兌換商品、優(yōu)惠券或參與抽獎活動。例如,每成功轉(zhuǎn)介紹一位新用戶注冊獲得 50 積分,成功轉(zhuǎn)介紹一位新用戶購買商品獲得 200 積分,1000 積分可兌換一張價值 50 元的小程序通用優(yōu)惠券。?
  • 優(yōu)惠券獎勵:提供不同類型的優(yōu)惠券作為轉(zhuǎn)介紹獎勵,如滿減優(yōu)惠券、折扣優(yōu)惠券、無門檻優(yōu)惠券等。新用戶通過轉(zhuǎn)介紹鏈接注冊后,雙方都能獲得優(yōu)惠券。比如新用戶獲得一張滿 100 元減 30 元的優(yōu)惠券,轉(zhuǎn)介紹用戶獲得一張 8 折優(yōu)惠券。?
  • 現(xiàn)金紅包獎勵:對于成功轉(zhuǎn)介紹的用戶直接發(fā)放現(xiàn)金紅包,紅包金額可以根據(jù)新用戶的消費金額或行為進行設(shè)置。例如,新用戶完成首次購買且消費金額達到 100 元,轉(zhuǎn)介紹用戶可獲得 10 元現(xiàn)金紅包;消費金額達到 200 元,轉(zhuǎn)介紹用戶可獲得 20 元現(xiàn)金紅包。?
  1. 獎勵門檻與條件設(shè)定?
  • 設(shè)定合理的獎勵門檻,既要保證用戶有動力參與轉(zhuǎn)介紹,又要確保轉(zhuǎn)介紹來的新用戶具有一定的價值。例如,要求新用戶注冊后 7 天內(nèi)完成首次購買,轉(zhuǎn)介紹用戶才能獲得獎勵;或者新用戶在小程序內(nèi)的累計消費金額達到一定數(shù)額(如 500 元),轉(zhuǎn)介紹用戶可獲得額外的高額獎勵。?
  • 明確獎勵的領(lǐng)取條件和方式。在小程序內(nèi)設(shè)置清晰的轉(zhuǎn)介紹獎勵規(guī)則說明頁面,告知用戶如何參與轉(zhuǎn)介紹活動、滿足什么條件可以獲得獎勵以及如何領(lǐng)取獎勵。獎勵領(lǐng)取方式要便捷,如積分自動到賬、優(yōu)惠券直接發(fā)放到用戶賬戶、現(xiàn)金紅包通過微信轉(zhuǎn)賬或小程序內(nèi)余額提現(xiàn)等。?
  1. 獎勵活動的時效性與周期性?
  • 為了營造緊迫感,提高用戶參與轉(zhuǎn)介紹的積極性,獎勵活動可以設(shè)置時效性。例如,限時一周內(nèi)成功轉(zhuǎn)介紹可獲得雙倍積分或更高金額的優(yōu)惠券。同時,定期開展周期性的轉(zhuǎn)介紹獎勵活動,如每月推出一次 “轉(zhuǎn)介紹狂歡月” 活動,在活動期間加大獎勵力度,吸引更多用戶參與。?
  • 在活動結(jié)束后,對活動效果進行總結(jié)和分析,根據(jù)數(shù)據(jù)反饋調(diào)整下一次活動的獎勵策略和活動形式,不斷優(yōu)化轉(zhuǎn)介紹獎勵機制。?
(二)轉(zhuǎn)介紹流程優(yōu)化?
  1. 簡化分享操作步驟?
  • 在小程序內(nèi)設(shè)計簡潔直觀的轉(zhuǎn)介紹分享入口,確保用戶能夠輕松找到。例如,在商品詳情頁、個人中心等頁面設(shè)置明顯的 “分享給好友” 按鈕,點擊按鈕后,用戶可以直接選擇分享到微信好友、微信群或朋友圈。?
  • 分享操作過程要簡單快捷,減少用戶的操作成本。分享鏈接或海報要自動生成,無需用戶手動復(fù)制或編輯。同時,支持用戶自定義分享文案,提供一些預(yù)設(shè)的優(yōu)質(zhì)分享文案供用戶選擇,方便用戶根據(jù)不同的分享場景進行調(diào)整。?
  1. 清晰的引導(dǎo)與反饋機制?
  • 在用戶進行轉(zhuǎn)介紹操作過程中,提供清晰的引導(dǎo)提示。例如,當(dāng)用戶點擊 “分享給好友” 按鈕后,彈出提示框告知用戶分享成功后可獲得的獎勵以及如何查看轉(zhuǎn)介紹結(jié)果。在新用戶通過分享鏈接進入小程序后,也有相應(yīng)的提示告知新用戶這是來自好友的推薦以及注冊或購買可享受的優(yōu)惠。?
  • 建立及時的反饋機制,讓用戶能夠?qū)崟r了解轉(zhuǎn)介紹的進展情況。當(dāng)新用戶注冊成功后,轉(zhuǎn)介紹用戶能收到通知;新用戶完成首次購買后,轉(zhuǎn)介紹用戶也能第一時間得知并獲取相應(yīng)獎勵,增強用戶對轉(zhuǎn)介紹活動的參與感和滿意度。?
  1. 個性化轉(zhuǎn)介紹頁面設(shè)計?
  • 為轉(zhuǎn)介紹用戶生成個性化的轉(zhuǎn)介紹頁面,頁面上展示轉(zhuǎn)介紹用戶的專屬信息,如昵稱、頭像以及推薦語。推薦語可以由轉(zhuǎn)介紹用戶自行編輯,也可以根據(jù)用戶在小程序內(nèi)的購買行為和偏好自動生成。例如,“我在 [小程序名稱] 購買了很多優(yōu)質(zhì)商品,強烈推薦給你,快來看看吧!——[轉(zhuǎn)介紹用戶昵稱]”。?
  • 個性化轉(zhuǎn)介紹頁面的設(shè)計風(fēng)格要與小程序整體風(fēng)格一致,同時突出轉(zhuǎn)介紹的主題和獎勵信息,吸引新用戶的關(guān)注和參與。通過個性化設(shè)計,增加轉(zhuǎn)介紹頁面的可信度和吸引力,提高新用戶的轉(zhuǎn)化率。?
(三)利用用戶口碑促進轉(zhuǎn)介紹?
  1. 優(yōu)質(zhì)產(chǎn)品與服務(wù)保障?
  • 提供優(yōu)質(zhì)的產(chǎn)品或服務(wù)是建立用戶口碑的基礎(chǔ)。確保小程序內(nèi)銷售的商品質(zhì)量可靠、功能滿足用戶需求,服務(wù)周到細致。例如,對于電商小程序,商品要嚴格把控質(zhì)量關(guān),從選品到采購、質(zhì)檢都要有嚴格的流程;對于服務(wù)類小程序,如在線教育小程序,要保證教學(xué)質(zhì)量,教師專業(yè)水平高、教學(xué)方法得當(dāng)。?
  • 建立完善的售后服務(wù)體系,及時響應(yīng)和解決用戶的問題和投訴??焖偬幚碛脩舻耐藫Q貨請求、解答用戶的咨詢疑問,讓用戶感受到良好的服務(wù)體驗,從而提高用戶對小程序的滿意度和忠誠度,為轉(zhuǎn)介紹打下良好基礎(chǔ)。?
  1. 用戶評價與案例展示?
  • 在小程序內(nèi)設(shè)置用戶評價和曬單功能,鼓勵用戶分享自己的使用體驗和購買心得。展示真實的用戶評價和曬單圖片,讓潛在用戶能夠直觀地了解商品或服務(wù)的實際效果。例如,在商品詳情頁下方設(shè)置 “用戶評價” 板塊,展示用戶的文字評價、評分以及曬單圖片,好評率高的商品更容易吸引新用戶購買。?
  • 整理和展示成功的用戶案例,尤其是一些具有代表性的用戶通過使用小程序獲得顯著收益或改善生活的案例。例如,對于一款健身小程序,可以展示用戶通過使用小程序制定的健身計劃,成功減肥或增肌的前后對比照片和用戶的經(jīng)驗分享,激發(fā)其他潛在用戶的興趣和參與欲望,促使他們通過轉(zhuǎn)介紹鏈接加入小程序。?
  1. 激勵用戶主動傳播口碑?
  • 除了轉(zhuǎn)介紹獎勵機制,還可以通過其他方式激勵用戶主動傳播口碑。例如,設(shè)立 “口碑之星” 評選活動,每月從積極分享使用體驗和轉(zhuǎn)介紹新用戶的用戶中評選出 “口碑之星”,給予豐厚的獎勵,如免費的商品、高額優(yōu)惠券或定制禮品等。?
  • 對用戶的好評和分享進行及時回復(fù)和感謝,增強用戶的參與感和認同感??梢栽谟脩粼u價下方回復(fù)個性化的感謝語,對用戶提出的建議表示重視和改進,讓用戶感受到自己的意見被尊重,從而更愿意主動為小程序進行口碑傳播。?
三、小程序分銷與轉(zhuǎn)介紹相關(guān)界面設(shè)計示例?
(一)分銷中心界面設(shè)計?
  1. 整體布局?
  • 分銷中心首頁采用簡潔明了的布局,頂部設(shè)置醒目的分銷商等級標識和當(dāng)前可提現(xiàn)傭金金額。例如,以金色徽章顯示高級分銷商等級,可提現(xiàn)傭金金額以較大字體突出顯示在徽章下方,讓分銷商一眼就能看到自己的關(guān)鍵信息。?
  • 頁面中間部分劃分為幾個主要板塊,分別是推廣數(shù)據(jù)概覽、推廣商品列表、我的團隊(如果有多級分銷)、分銷規(guī)則說明。各板塊之間有明顯的分隔線,便于區(qū)分和查看。?
  1. 推廣數(shù)據(jù)概覽板塊設(shè)計?
  • 以圖表形式展示推廣訂單數(shù)量、銷售額、新增下級分銷商數(shù)量等關(guān)鍵數(shù)據(jù)。例如,使用柱狀圖展示近一周每天的推廣訂單數(shù)量變化趨勢,讓分銷商直觀地了解自己的推廣業(yè)績波動情況;用餅圖展示不同商品的銷售額占比,幫助分銷商明確重點推廣商品。?
  • 在圖表下方,列出具體的數(shù)據(jù)數(shù)值,并標注與上一周期(如上周)相比的增長或下降百分比,讓分銷商清晰地了解自己的業(yè)績變化情況。?
  1. 推廣商品列表板塊設(shè)計?
  • 商品列表按照商品圖片、商品名稱、商品價格、傭金比例、操作按鈕的順序排列。商品圖片展示要清晰,能夠吸引用戶注意力;商品名稱簡潔明了,突出商品核心特點;商品價格和傭金比例以較大字體顯示,方便分銷商查看和比較。?
  • 操作按鈕包括 “分享推廣” 和 “查看詳情”。點擊 “分享推廣” 按鈕,可直接彈出分享渠道選擇界面(如微信好友、微信群、朋友圈等),方便分銷商進行商品推廣;點擊 “查看詳情” 按鈕,可進入商品詳細信息頁面,包括商品描述、用戶評價、推廣素材下載等內(nèi)容。?
  1. 我的團隊板塊設(shè)計(多級分銷適用)?
  • 以樹形結(jié)構(gòu)展示分銷商的團隊成員關(guān)系,每個成員頭像旁邊顯示其昵稱、等級和業(yè)績數(shù)據(jù)(如推廣訂單量、銷售額)。通過點擊成員頭像,可以查看該成員的詳細推廣數(shù)據(jù)和下級成員列表。?
  • 在團隊板塊下方,設(shè)置團隊業(yè)績統(tǒng)計數(shù)據(jù),如團隊總推廣訂單量、總銷售額、團隊成員傭金支出等,讓分銷商對自己團隊的整體業(yè)績有清晰的了解。?
  1. 分銷規(guī)則說明板塊設(shè)計?
  • 以簡潔易懂的文字詳細說明分銷規(guī)則,包括分銷商等級晉升條件、傭金計算方式、結(jié)算周期、提現(xiàn)規(guī)則等內(nèi)容。對于重要的規(guī)則條款,使用加粗或不同顏色字體突出顯示,方便分銷商快速查看關(guān)鍵信息。?
  • 在規(guī)則說明下方,設(shè)置常見問題解答(FAQ)板塊,針對分銷商可能遇到的問題進行解答,如 “如何成為分銷商”“為什么我的傭金還未到賬” 等,減少分銷商的咨詢成本。?
(二)轉(zhuǎn)介紹頁面設(shè)計?
  1. 分享入口界面設(shè)計?
  • 在小程序內(nèi)多個頁面設(shè)置明顯的轉(zhuǎn)介紹分享入口,如個人中心頁面右上角設(shè)置一個帶有 “分享有禮” 字樣的圖標,商品詳情頁下方設(shè)置 “分享給好友,一起享優(yōu)惠” 按鈕。按鈕或圖標的設(shè)計風(fēng)格要與小程序整體風(fēng)格一致,同時具有較高的辨識度,吸引用戶點擊。?
  • 當(dāng)用戶點擊分享入口時,彈出一個半透明的分享選擇框,顯示分享到微信好友、微信群、朋友圈以及復(fù)制鏈接等選項。每個選項旁邊配有相應(yīng)的簡潔圖標,如微信好友圖標、微信群圖標、朋友圈圖標等,方便用戶快速選擇分享渠道。?
  1. 個性化分享頁面設(shè)計?
  • 當(dāng)用戶選擇分享到微信等平臺后,生成個性化的分享頁面。頁面頂部展示轉(zhuǎn)介紹用戶的昵稱和頭像,頭像下方顯示一句個性化推薦語,如 “我一直在用 [小程序名稱],真的很棒,推薦給你!——[轉(zhuǎn)介紹用戶昵稱]”。?
  • 頁面中間部分展示小程序的核心價值和特色,如電商小程序可以展示熱門商品圖片和優(yōu)惠信息,服務(wù)類小程序可以展示服務(wù)優(yōu)勢和用戶好評截圖。同時,突出轉(zhuǎn)介紹獎勵信息,如 “分享成功,你和好友都可獲得 50 積分和一張滿 100 減 20 優(yōu)惠券”,以吸引新用戶參與。?
  • 頁面底部設(shè)置一個醒目的 “立即加入” 按鈕,按鈕顏色與頁面整體色調(diào)形成對比,突出顯示。點擊按鈕,可直接跳轉(zhuǎn)到小程序注冊或商品購買頁面。?
  1. 轉(zhuǎn)介紹結(jié)果反饋界面設(shè)計?
  • 當(dāng)新用戶通過分享鏈接注冊或購買商品后,轉(zhuǎn)介紹用戶會收到轉(zhuǎn)介紹結(jié)果反饋通知。通知可以是小程序內(nèi)的彈窗提示,也可以是消息中心的一條消息。?
  • 彈窗提示或消息內(nèi)容顯示新用戶的注冊信息(如昵稱)或購買商品信息,以及轉(zhuǎn)介紹用戶獲得的獎勵詳情,如 “恭喜您,您成功轉(zhuǎn)介紹 [新用戶昵稱] 注冊,已獲得 50 積分,獎勵已發(fā)放至您的賬戶”。同時,提供一個 “查看我的獎勵” 按鈕,方便用戶查看自己的積分、優(yōu)惠券等獎勵情況。?

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

2025年UI/UX趨勢

杰睿

2025年,UI/UX設(shè)計領(lǐng)域正迎來一系列令人興奮的創(chuàng)新趨勢。從更具沉浸感的3D元素到人性化的分區(qū)設(shè)計,從動態(tài)排版到模糊與顆粒效果的巧妙運用,再到生物識別技術(shù)的普及和可穿戴設(shè)備的深度適配,這些趨勢不僅讓界面更加美觀,更提升了用戶體驗和情感共鳴。本文將深入探討這些前沿設(shè)計趨勢,為設(shè)計師和產(chǎn)品團隊提供靈感和方向,幫助他們打造出更具吸引力和實用性的數(shù)字產(chǎn)品。

2025 年,數(shù)字設(shè)計領(lǐng)域會有很多新機會,這都得靠創(chuàng)新來推動。設(shè)計師們現(xiàn)在越來越大膽,敢打破傳統(tǒng)套路,設(shè)計出的東西不僅要實用,還得有吸引力,能真正打動人。

比如,會有更多 3D 元素加入設(shè)計里,讓用戶感覺更真實、更沉浸;還有很多設(shè)計會把 “方便用戶” 和 “拉近人際距離” 放在首位,不再只追求技術(shù)炫酷,而是更關(guān)注用戶的實際需求和情感感受。

那么我們來看一下有哪些趨勢~

1、分區(qū)設(shè)計(便當(dāng)格):像整理抽屜一樣規(guī)劃界面

你有沒有過這樣的體驗?打開一個 APP,信息像 “亂燉” 一樣堆在一起,找半天找不到重點。

2025 年的設(shè)計師學(xué)會了 “斷舍離”

就像日式便當(dāng)盒把飯菜分成不同格子,現(xiàn)在設(shè)計師也把網(wǎng)頁或 APP 界面分成多個 “小格子”,每個格子放不同功能或內(nèi)容(比如數(shù)據(jù)、圖片、文字)。

好處:信息更清晰,用戶一眼就能看出重點,而且設(shè)計師可以靈活排列,讓頁面既整齊又好看。

比如有的網(wǎng)站用這種格子展示不同模塊,重要內(nèi)容更突出,干擾少。

分區(qū)設(shè)計技巧:格子的大小、間距、邊框都有講究!重要內(nèi)容的格子更大、邊框更粗,次要信息的格子更 “低調(diào)”,就像媽媽給你裝便當(dāng),愛吃的菜永遠擺在最顯眼的位置。

圖片網(wǎng)站鏈接:https://selestial.co/

2、3D 元素:讓界面從 “照片” 變成 “小世界”

以前網(wǎng)頁里的 3D 圖像是 “擺件”,現(xiàn)在它們會 “互動” 了!

3D 效果不是新鮮事,但現(xiàn)在更厲害:能互動、能沉浸!

比如網(wǎng)頁里的物體可以 360 度旋轉(zhuǎn),虛擬試穿衣服、查看產(chǎn)品細節(jié),甚至結(jié)合 AR/VR 讓你感覺身臨其境。

現(xiàn)在手機和瀏覽器性能更強了,3D 元素加載更快,甚至能在低配設(shè)備上流暢運行,設(shè)計師可以大膽用毛茸茸的 3D 圖標、會 “呼吸” 的動態(tài)按鈕(比如按鈕按下時像真的被按下去一樣凹陷)。

好處:畫面更立體、有趣,用戶體驗像在真實世界互動,不再是死板的圖片和文字。

圖片網(wǎng)站鏈接:https://kevinhilgendorf.com/

圖片網(wǎng)站鏈接:https://labs.chaingpt.org/

3、動態(tài)排版:文字會 “講故事” 了

字體不再老老實實不動,而是會 “跳舞”:大小變化、顏色漸變、跟著用戶操作移動,甚至根據(jù)內(nèi)容情緒調(diào)整動畫(比如錯誤提示字體變紅閃爍,成功提示變綠飄動)。

好處:吸引注意力,傳遞品牌個性,比如讓標題動起來,用戶一眼就被抓住。

文字不再是 “死板的符號”,而是會 “表演” 的演員,我們可以做一些交互創(chuàng)意方面的案例假設(shè)

案例1:一個新聞網(wǎng)站的標題 “今日熱點”,當(dāng)你滾動頁面時,“熱點” 兩個字會像火苗一樣跳動,吸引你點擊;電商網(wǎng)站的 “限時折扣” 按鈕,文字會從左到右 “跑馬燈” 式滾動,仿佛在喊 “快看我!”。

案例2:社交媒體 APP 的評論區(qū),當(dāng)有人給你發(fā) “生日快樂”,“生日快樂” 這幾個字會飄出彩色 confetti(紙屑),還會放大縮??;如果收到一條提醒 “網(wǎng)絡(luò)連接失敗”,文字會變成紅色,輕微抖動,像在著急地告訴你 “出問題啦”。

案例3:未來的動態(tài)字體甚至能根據(jù)你的輸入語氣自動調(diào)整!比如你在聊天框里輸入 “氣死我了!”,發(fā)送后文字會變成紅色,扭曲變形,模擬 “憤怒” 的情緒;輸入 “哈哈哈哈哈”,文字會笑著上下彈跳,自帶喜感。

圖片網(wǎng)站鏈接:https://wodniack.dev/

圖片網(wǎng)站鏈接:https://romaingranai.xyz/

4、模糊 & 顆粒效果:給界面加一層 “溫柔濾鏡”

背景不再是純色或簡單漸變,而是加了 “濾鏡”:有的模糊像柔光,有的帶顆粒感像老照片,讓界面更有層次和溫度。

好處:不搶主內(nèi)容的風(fēng)頭,卻能增加細膩的質(zhì)感,讓用戶覺得界面更精致、有 “呼吸感”。

想象一下:你的屏幕不再是冰冷的玻璃,而是像磨砂質(zhì)感的燈罩,透著柔和的光 ——

例如:一個閱讀 APP 的背景,不是純灰色,而是帶點模糊的淺灰,像隔著一層薄霧,文字浮在上面更突出,眼睛看久了也不累;

短視頻 APP 的點贊按鈕背后,有淡淡的顆粒感,像老電影膠片,點擊時還會有輕微的 “沙沙” 聲,復(fù)古又治愈。

例如:有些網(wǎng)站的光標變成了半透明的小圓圈,移動時會在背景留下淡淡的拖影,像在雪地上踩出腳??;

購物車圖標點擊時,周圍會升起細小的顆粒,像撒了一把金粉,讓操作更有 “儀式感”。

現(xiàn)代人看膩了 “完美到反光” 的數(shù)字界面,這種帶點 “不完美” 的質(zhì)感,反而讓人感覺親切,像摸到了真實的紙張或布料。

圖片網(wǎng)站鏈接:https://breadzine.com/

5、暗色模式:從 “暗黑冷酷” 到 “深夜暖燈”

以前的暗色模式是 “純黑配白字”,刺眼又冰冷,現(xiàn)在設(shè)計師給它加了 “柔光濾鏡”:

不是純黑背景配白字那種刺眼的暗模式,而是柔和的 “低對比度暗調(diào)”:比如深灰配淺灰,帶點淡淡光影,像傍晚的光線一樣舒服。

好處:保護眼睛,減少視覺疲勞,還營造出高級、安靜的氛圍,比傳統(tǒng)暗模式更溫馨。

顏色更溫柔:比如微信的暗色模式,背景不是純黑,而是深海軍藍,文字是淺灰色,圖標帶一點淡金色光澤,晚上刷手機像在暖黃色的臺燈下看書,不刺眼還很高級。

場景化設(shè)計:一個助眠 APP 的低光模式,界面會模擬 “月光效果”,背景有淡淡的云層陰影,按鈕像夜空中的星星一樣微微閃爍,配合白噪音,讓你還沒開始冥想就先放松下來。

保護眼睛更貼心:低對比度設(shè)計減少視覺疲勞,尤其適合長時間用手機的上班族、學(xué)生黨,再也不用擔(dān)心晚上刷手機 “亮瞎眼”。

圖片網(wǎng)站鏈接:https://www.chromatique.studio/

圖片網(wǎng)站鏈接:https://dribbble.com/shots/24281290-Kenn-Food-Processor-Landing-Page

圖片網(wǎng)站鏈接:https://silverdrive.nl/

6、UX文案:界面里的 “貼心小助手”

你有沒有被 APP或網(wǎng)站 的 “謎之提示” 搞懵過?比如 “操作異常,請重試”—— 到底哪里異常?現(xiàn)在設(shè)計師開始 “說人話” 了

按鈕上的字、提示信息、錯誤提醒…… 這些細節(jié)文字越來越重要。比如 “提交” 改成 “確認發(fā)布”,錯誤提示寫 “網(wǎng)絡(luò)好像斷了,點擊重試” 而不是冷冰冰的 “錯誤 404”。

好處:讓用戶知道該做什么,減少操作困惑,就像有個小助手在旁邊輕聲指導(dǎo)。

按鈕文案更具體:以前 “提交” 按鈕,現(xiàn)在改成 “確認并發(fā)布動態(tài)”,你一下就知道點了之后會發(fā)生什么;購物車的 “結(jié)算” 按鈕變成 “去支付(含 3 件商品)”,清楚告訴你當(dāng)前購物車數(shù)量。

錯誤提示會 “安慰人”:當(dāng)你登錄密碼輸錯,不再是 “密碼錯誤”,而是 “密碼好像不對哦,是不是字母大小寫搞錯了?試試找回密碼吧~”,帶點 emoji 和親切感,讓你不煩躁。

空狀態(tài)會 “引導(dǎo)”:比如一個筆記 APP 的空白頁,不再是冷冰冰的 “暫無筆記”,而是畫著一個小臺燈,配文 “點擊新建筆記,開始記錄今天的小確幸吧~”,鼓勵你行動起來。

圖片網(wǎng)站鏈接:https://clickup.com/

圖片網(wǎng)站鏈接:https://www.headspace.com/

7、生物識別:靠 “臉” 吃飯,告別密碼焦慮

不用記復(fù)雜密碼了!指紋、人臉、語音識別越來越普及,甚至未來可能用眼動或神經(jīng)信號驗證。比如手機刷臉解鎖、支付時掃指紋,又快又安全。

好處:再也不怕忘記密碼,登錄像 “本能反應(yīng)” 一樣自然。 

你還記得自己設(shè)過多少個密碼嗎?郵箱、銀行、社交軟件……2025 年,你只需要 “露個臉”

“掃個指紋”:

生活場景:早上上班,刷臉打開公司門禁;午休用指紋支付買咖啡;晚上回家,虹膜識別解鎖手機,全程不用輸密碼。甚至連銀行 APP 轉(zhuǎn)賬,看一眼攝像頭就能確認身份,安全又快捷。

默默驗證更省心:有些 APP 會 “偷偷” 驗證你 —— 比如你常用手機的手勢是右手拇指解鎖,系統(tǒng)會記錄你的握持姿勢,當(dāng)檢測到左手拿手機且指紋不符時,自動觸發(fā)安全提醒,不用你手動操作,安全藏在細節(jié)里。

特殊場景:比如戴著手套不方便指紋解鎖?未來的可穿戴設(shè)備可能支持 “靜脈識別”,通過血管紋路確認身份,下雨天、運動時也能輕松解鎖。

圖片網(wǎng)站鏈接:https://dribbble.com/shots/23201694-Face-id

8、可穿戴設(shè)備設(shè)計:從 “戴在身上” 到 “長在身上”

智能手表不再是 “縮小版手機”,而是更懂你的 “貼身伙伴”:

智能手表、VR 眼鏡、健康手環(huán)等設(shè)備的設(shè)計越來越難:屏幕小,怎么讓用戶操作方便?

比如用手勢滑動、語音命令,甚至靠眨眼控制;還要考慮戴著舒服(輕、貼合手腕)、續(xù)航久、適應(yīng)各種場景(運動時防水,強光下看得清)。

小屏幕大講究:比如一個運動手表,跑步時屏幕自動切換成 “極簡模式”,只顯示配速、心率、里程,字體超大,你 glancing(掃一眼)就能看清;當(dāng)你停下來休息,屏幕會慢慢顯示更詳細的數(shù)據(jù),像個貼心教練。

交互方式創(chuàng)新:VR 眼鏡不再靠手柄操作,你眨眨眼就能切換菜單,點點頭就能確認;智能手環(huán)檢測到你睡眠不好,早上會震動提醒 “昨晚睡眠質(zhì)量一般,今天記得多喝水哦”,還會同步調(diào)整手機的屏幕亮度,幫你緩解疲勞。

場景化適配:比如滑雪專用智能眼鏡,強光下自動調(diào)暗鏡片,檢測到你加速滑行時,界面只顯示速度和路線,避免分心;潛水手表接觸到水時,自動鎖定屏幕防止誤觸,浮出水面后又恢復(fù)正常。

圖片網(wǎng)站鏈接:https://inspect-ar.com/en/

圖片網(wǎng)站鏈接:https://dribbble.com/shots/18628321-Fitness-Smart-Watch-UI

2025 年的設(shè)計趨勢:“以人為本”

界面不再只追求好看,還要讓用戶用得爽、有情感共鳴:分區(qū)清晰、3D 互動、動態(tài)字體吸引眼球,模糊背景和低光模式讓眼睛舒服;UX 寫作和生物識別減少操作麻煩,可穿戴設(shè)備更懂用戶的使用場景。

本文由人人都是產(chǎn)品經(jīng)理作者【南設(shè)】,原創(chuàng)/授權(quán) 發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自Unsplash,基于 CC0 協(xié)議。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

全球化UI設(shè)計:全網(wǎng)最全小語種出海產(chǎn)品設(shè)計干貨

杰睿

出海產(chǎn)品面臨著語言、文化和用戶習(xí)慣的巨大差異,這對UI設(shè)計師提出了更高的要求。本文為出海產(chǎn)品的UI設(shè)計提供了全面的干貨指南,從文字、圖標、色彩、圖案到交互手勢等多個角度,詳細拆解了設(shè)計師在面對小語種和不同文化背景時需要注意的關(guān)鍵點。

隨著TikTok的海外關(guān)注度和影響力逐漸擴展、小紅書在海外友人的媒體圈炙手可熱,國內(nèi)的互聯(lián)網(wǎng)市場逐漸趨于飽和,互聯(lián)網(wǎng)產(chǎn)品紛紛向東南亞、非洲、拉丁美洲、歐洲擴展商業(yè)版圖,這也為UI設(shè)計師創(chuàng)造了新的機遇。

對于出海產(chǎn)品而言,UI設(shè)計師需要有基礎(chǔ)的語言文化了解,在此基礎(chǔ)上去進行設(shè)計才能真正滿足海外用戶的需求,本文主要從UI的文字、圖標、色彩等幾個角度來拆解設(shè)計師在設(shè)計海外項目時需要注意的關(guān)鍵點,避免因為文化習(xí)俗差異而影響產(chǎn)品的易用性。

目錄:

1.小語種文字:超長文本的處理規(guī)則、鏡像語言、小語種適配檢視技巧

2.圖標:需要鏡像的典型圖標、不需要鏡像的典型圖標、圖標特例

3.顏色

4.圖案:禁忌圖標、禁忌手勢、禁忌物品、禁忌動物

5.交互手勢

一、小語種文字

① 超長文本的處理規(guī)則

當(dāng)在某些語種下出現(xiàn)界面用語超長顯示不完整的情況,應(yīng)按照如下優(yōu)先級進行處理:

(1)精簡界面用語

在保證可理解的前提下,考慮對該語言的翻譯進一步精簡,采用其他較短的近義詞或者精簡表達,如“save number”在界面用語超長時應(yīng)精簡為“save”。

(2)動態(tài)布局

當(dāng)控件周圍沒有其他控件沖突時,控件可根據(jù)界面用語長度動態(tài)擴展,如按鈕。

(3)縮小文字

將文本逐級縮小,建議最小縮小到18sp/dp。

??并列的層級關(guān)系,文本超長時所有文字需要同時縮小字號

(4)多行顯示

在設(shè)計中文時,提前考慮預(yù)留小語種換行空間,??按音節(jié)換行。

(5)跑馬燈

避免同意界面使用過多的跑馬燈,1-3個為宜。過多的跑馬燈會分散用戶注意力,界面顯示混亂。跑馬燈占用系統(tǒng)資源,影響性能,過多的跑馬燈可能會導(dǎo)致卡頓。

(6)打點截斷

顯示不下到文字截斷顯示并在末尾增加“…”

截斷的使用場景:

A.用戶自定義內(nèi)容,如文件名,相冊名

B.某處顯示空間有限,但可以在本層級/上一層級/下一層級查看到全量內(nèi)容。

② 鏡像語言

阿拉伯、波斯語、烏爾都語、希伯來語等語言的書寫都是從右向左書寫,和當(dāng)今世界主流語言(如英語)從左向右書寫的方向相反。

受文字書寫方向的影響,阿拉伯語言的用戶對于左右邏輯的認知和英文等LTR (left to right)完全相反,比如習(xí)慣將右側(cè)作為開始,左側(cè)作為結(jié)束。

為了支持RTL語言和用戶習(xí)慣特點,在UI設(shè)計中,需要在文本,界面布局,手勢操作和動畫,圖標等交互元素中滿足RTL的特殊要求。

③ 小語種適配檢視技巧

(1)字串顯示——檢視語言:西班牙語(拉丁美洲)

(2)大字體顯示——檢視語言:西班牙語(拉丁美洲)

二、圖標

① 需要鏡像的典型圖標

(1)后退,前進

(2)顯示前進方向的圖標,如:騎車 發(fā)送 進度條。

▲ 阿拉伯語-顯示前進方向

(3)右側(cè)具有滑塊的音量圖標應(yīng)當(dāng)鏡像,滑塊應(yīng)從右向左顯示,如:音量調(diào)節(jié)。

▲ 阿拉伯語-音量調(diào)節(jié)

(4)表達含有文本含義的圖標,如:對話框、書寫、備忘錄。

▲ 阿拉伯語-文本含義圖標

② 不需要鏡像的典型圖標

(1)雖然時間的線性表示在RTL中被鏡像,但圓形時間方向不是。對于RTL需要,時鐘仍然是順時針轉(zhuǎn)動,時鐘圖標或帶有箭頭指向順時針圖標的刷新圖標不應(yīng)該鏡像。

▲ 阿拉伯語-帶有時間含義的圖標

(2)國際標準的圖標不需要鏡像,如藍牙。

(3)擬物圖標不需要鏡像,如SIM卡。

 (4) 斜線不需要鏡像 ,如靜音圖標。

▲ 阿拉伯語-特殊免鏡像圖標

③ 圖標特例

(1)亮度圖標需要鏡像:英文習(xí)慣認為左邊暗,右邊亮;阿拉伯語習(xí)慣認為左亮,右邊暗。

(2)阿拉伯語有自己的問號?

(3)阿拉伯語am.pm的位置要移動到時間左側(cè)

三、色彩

1.中東市場:綠色為主、火紅與黃色慎用。綠色象征吉祥,但敘利亞視黃色為不祥之兆,伊朗不喜愛藍色。

2.非洲市場:禁忌多樣。黑色普遍被認為不祥,紅色在乍得、尼日利亞等國也不受歡迎。

3.歐洲市場:白色神圣,黃色慎用。

四、圖案

禁忌手勢

禁忌物品

禁忌動物

五、交互式手勢

RTL語言中,帶左右滑動方向的圖片或者是左右滑動展開功能選項,應(yīng)遵循與英文界面相反的鏡像規(guī)則。

漢語-左滑刪除

以上就是從小語種文字、圖標、顏色、圖案、交互手勢等方面總結(jié)的出海產(chǎn)品設(shè)計干貨,希望能讓你有所收獲~

本文由人人都是產(chǎn)品經(jīng)理作者【Clippp】,原創(chuàng)/授權(quán) 發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自Unsplash,基于 CC0 協(xié)議。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

干貨!6 條提升用戶體驗的小貼士

杰睿

用戶體驗是一個老生常談的話題。在進行 UI & UX 設(shè)計時,我們經(jīng)常會忽略一些細節(jié),雖然我們并沒有覺得有什么問題,但往往會極大地影響用戶的體驗,從而影響整個產(chǎn)品。作者在本文中提出了 6 條提升用戶體驗的微技巧,一起來學(xué)習(xí)吧!

在設(shè)計高效、易讀和漂亮的 UI 界面時,只需要小的改動就能讓你的設(shè)計眼前一亮。在這篇文章中,我為你帶來了另一些容易付諸實踐的 UI 和 UX 微技巧。這些技巧只需很小的改動就可以幫助你提升用戶體驗。讓我們開始吧!

一、通過色彩讓設(shè)計更一致

如果你有一個設(shè)計項目,可以讓你在顏色選擇方面有比較多的自由,不要總是傾向于用彩虹般的顏色來進行設(shè)計。

如果你走的是彩虹路線,你很快就會發(fā)現(xiàn)很多內(nèi)容看起來都不匹配。簡單地使用一個基礎(chǔ)色,然后將該顏色的色調(diào)和明暗進行變化并應(yīng)用,可以令你的設(shè)計更加協(xié)調(diào)和一致,并且看起來更專業(yè),而不需要那些閃亮的彩虹和需要色彩理論學(xué)位。

干貨!6 條提升用戶體驗的小貼士

二、突出選中目標吸引用戶注意

UI 可以是干凈的、極簡的和直截了當(dāng)?shù)模@毋庸置疑。但不能以犧牲用戶體驗為代價。對于像選項菜單這樣簡單的東西,要確保用戶只需快速瀏覽一下,就能夠找到選擇的項目。

你不需要在這里追究更多細節(jié)。簡潔的粗體就足夠讓用戶輕松的分辨出他們選中的目標,而且他們的輸入已經(jīng)得到反饋。

干貨!6 條提升用戶體驗的小貼士

三、加深輕字重文字 提升可讀性

當(dāng)涉及到長篇文字內(nèi)容時,你可能會傾向于使用灰色的中間色調(diào),這可能沒什么問題。但如果你同時使用更輕字重的字體,就會發(fā)現(xiàn)這影響了這段內(nèi)容在任何尺寸屏幕上的可讀性。

不要讓用戶因為這種原因退出頁面??梢酝ㄟ^將文字的顏色加深來簡單地解決這個問題,讓每個人都更加易讀。對于較輕字重的字體,只需將其顏色加深幾個級別,就能顯著的改善其可讀性。

干貨!6 條提升用戶體驗的小貼士

四、明確元素優(yōu)先級

你希望用戶的眼睛每次都能快速、有效地注意到頁面上最重要的元素,并將認知的努力降到最低。通過使用視覺層級原則,如字體大小、字重、顏色和布局,僅舉幾例,你可以通過這些技巧輕松地把最重要的元素放在突出位置。遵循這些原則有助于改善用戶的體驗,并有助于引導(dǎo)用戶以更直接、準確地方式使用產(chǎn)品。

干貨!6 條提升用戶體驗的小貼士

五、不要讓用戶猜測

在用戶進行操作之前,特別是點擊某些 CTA 按鈕之前,要確保他們不會被蒙在鼓里,知道接下來會發(fā)生什么。在執(zhí)行操作之前,始終讓用戶清楚地了解他們在點擊突出顯示的 CTA 按鈕時可以期待些什么。改善每一步的用戶體驗,不要讓他們在旅程中任何一個觸點產(chǎn)生疑問。

干貨!6 條提升用戶體驗的小貼士

六、為CTA按鈕單獨設(shè)定一種顏色

CTA 按鈕在頁面中哪怕不是最重要的部分,也是最重要的之一,讓它在頁面中突出出來!

不要讓用戶將它與頁面上其他類型的元素(例如通知或標簽)混淆。它需要很容易地被分辨出來,而這可以通過簡單地為 CTA 設(shè)置單獨一種顏色就做到。當(dāng)然,你可以在尺寸、形狀等方面做更多的細節(jié),但只要為你的 CTA 保留一種顏色,僅此一點就可以減少大部分問題。

我希望通過這幾條簡短的小貼士,你能意識到對你的設(shè)計進行小的調(diào)整也能帶來完全不一樣的用戶體驗。

譯者:吳鵬飛;授權(quán)獲?。簠蛆i飛;審核指導(dǎo):王翎旭;

本文由@三分設(shè) 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自 Unsplash,基于 CC0 協(xié)議。

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

杰睿

毫無疑問,表格之于B端產(chǎn)品而言是及其重要的一部分,那么,如何系統(tǒng)掌握B端產(chǎn)品中的表格設(shè)計呢?本文作者從表格設(shè)計規(guī)范與交互邏輯兩個角度提出了15點建議,干貨滿滿,希望對你有幫助。

表格作為B端產(chǎn)品中重要的界面組成部分,承載著內(nèi)容展示、數(shù)據(jù)記錄等多重任務(wù)。每家產(chǎn)品的表格看起來構(gòu)成差不多,但在交互細節(jié)上仍然有很多好的地方值得我們仔細思考。

本次通過整理10條B端表格設(shè)計規(guī)范+5條B端表格交互邏輯,系統(tǒng)掌握B端產(chǎn)品中的表格設(shè)計~

一、B端表格規(guī)范整理

1. 對齊,高效的信息獲取方式

表格內(nèi)的信息通過對齊,會更加規(guī)范易理解,給用戶視覺上的統(tǒng)一感,且視線流動順暢,能夠讓人快速捕捉到所要的內(nèi)容。

  • 文本信息左對齊,因為現(xiàn)代人的閱讀方式習(xí)慣從左到右,符合正常心智;
  • 數(shù)據(jù)信息右對齊,方便數(shù)字大小的直觀對比;
  • 內(nèi)容寬度固定居中對齊,更好的信息呈現(xiàn)及表格空間的節(jié)??;
  • 表頭與信息內(nèi)容對齊方式一致,一致性以達到簡化,降低視覺噪音。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

2. 表格列數(shù)與固定列

默認展示的列數(shù)為3-8列,如果需要展示更多列數(shù),則需要優(yōu)先固定展示重要列,其余的列的內(nèi)容會以滾動條滑動而展示出來。

有操作時需固定,操作項不固定時無法快速定位會降低操作效率;重要信息固定,有利于快速獲取重要的內(nèi)容。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

3. 表格列表的寬度

寬度的尺寸大小自適應(yīng),但需要根據(jù)文字的重要性顯示,重要文字內(nèi)容優(yōu)先完整顯示。(如果由于屏幕小表格會出現(xiàn)省略,就要考慮多一個瀏覽器自帶的title提示。)

注:當(dāng)?shù)谝涣惺切蛱柣蚨噙x項時,列寬不需要太寬,這樣視覺不會顯得空洞。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

4. 表頭每列標題文字字數(shù)

字符不要多,如果文字太多,就需要做文字信息精簡化。同樣,對于專業(yè)術(shù)語或用戶不常見的名詞應(yīng)給予一定的幫助說明。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

5. 長文本處理

表格內(nèi)容較多且有長文本時,長文本縮略展示;表格內(nèi)容較少時有長文本,長文本換行展示。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

6. 空白數(shù)據(jù)填充「-」,避免留白產(chǎn)生疑慮

表格中經(jīng)常會出現(xiàn)空數(shù)據(jù)或無數(shù)據(jù)的情況,留白處理會給用戶造成一定的困惑和誤解,是系統(tǒng)沒有加載出來嗎?明智的做法,使用「-」填充顯示。圖片為空時使用圖片占位符。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

7. 操作列的統(tǒng)一

同一項目中的操作列命名應(yīng)該保持統(tǒng)一,例如:常規(guī)增、刪、改、查命名為新增、刪除、編輯、詳情。

操作項超過三個時,將操作低頻折疊收起,可以幫助頁面突出更加重要的信息,減輕空間壓力,減少干擾。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

8. 數(shù)據(jù)升降樣式

給數(shù)據(jù)做升降區(qū)分可以快速判斷數(shù)據(jù)的趨勢,國內(nèi)數(shù)據(jù)升圖標默認為紅色,降的為綠色。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

9. 表格全局操作和批量操作

全局操作為無需選擇數(shù)據(jù)內(nèi)容即可進行的操作,常見的有新增、導(dǎo)入、篩選。

批量操作就是對表格的多行數(shù)據(jù)同時操作,常見的有導(dǎo)出、刪除。

全局和批量都不屬于單個對象因此需要放在表格外,操作具體的位置排放根據(jù)操作的重要程度一次從左到右遞減。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

10. 斑馬線

條紋顏色:標題背景色透明度60%左右;(條紋顏色視覺上應(yīng)該比標題欄弱一點)鼠標hover顏色:主題色透明度10%。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

二、B端表格交互整理

1. 固定表頭,一目了然

當(dāng)閱讀豐富且繁多的表格時,由于屏幕有限,用戶不得不拖動橫向或縱向滾動條來閱讀信息。

固定表頭,能夠讓用戶明白當(dāng)前單元格內(nèi)信息的屬性而不至于不知道該信息的意思。固定表頭也是一種界面友好性的體現(xiàn)。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

2. 排序,讓信息有序起來

可以讓無序信息內(nèi)容進行有序排列,排序分為升序和降序,一般用在數(shù)據(jù)、時間、數(shù)量上。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

3. 調(diào)整列寬度,查看完整數(shù)據(jù)

允許調(diào)整列的寬度來查看更加完整的縮略數(shù)據(jù)。被截斷的數(shù)據(jù),默認支持鼠標懸停時瀏覽器自帶title顯示完整數(shù)據(jù)。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

4. 水平滾動,固定首尾列

呈現(xiàn)大型數(shù)據(jù)集時,水平滾動是不可避免的,通過橫向滾動查看其它數(shù)據(jù)。將首列進行固定(若包含勾選操作,則一起固定),以便用戶將數(shù)據(jù)與對象進行對應(yīng)。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

5. 分頁固定

若表格是分頁處理的,分頁會放在上部、下部或上下部均有,分頁固定省去了用戶需要翻到頂部或底部進行操作的麻煩。

15個關(guān)鍵點,掌握B端表格設(shè)計規(guī)范+交互邏輯

作者:譚檀檀

本文由 @Clippp 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載

題圖來自 Pixabay,基于 CC0 協(xié)議

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

帕累托原則 | 設(shè)計師需要知道的設(shè)計原則!

杰睿

前人留下的一些設(shè)計原則能夠幫助我們更好地進行頁面以及產(chǎn)品的設(shè)計,讓用戶有更好的體驗。本文對帕累托法則進行了介紹,希望能幫助大家在以后的設(shè)計中更好的理解與運用。

威廉·斯特倫克(William Strunk)說過:“優(yōu)秀的設(shè)計師有時會無視設(shè)計法則,但當(dāng)他們這樣做的時候,通常會有一些補償性的措施,除非你確定你能做得那么好,否則最好還是遵守這些法則”,所以設(shè)計師需要對一些通用性的法則有所理解,做好相應(yīng)的知識儲備,以便在需要時從中找尋相通的規(guī)律和事務(wù)的本源。

設(shè)計常常是以一種美觀且富有規(guī)律的形態(tài)出現(xiàn),不論大家是何種姿態(tài)、什么樣的知識背景,一旦踏入設(shè)計領(lǐng)域之后就會忍不住的去尋求設(shè)計法則,探索期背后的設(shè)計規(guī)律,因此經(jīng)過長期沉淀,一些大佬和前輩們留下了大量的通用設(shè)計法則。

今天,筆者就說說帕累托法則,希望能幫助大家在以后的設(shè)計中更好的理解與運用。

一、認識帕累托法則

1. 帕累托法則的背景

19世紀末,意大利經(jīng)濟學(xué)家和工程師維爾弗雷多·帕累托(Vilfredo Pareto)發(fā)現(xiàn),自家花園中80%的豌豆產(chǎn)自于20%的豌豆莢,在隨后研究土地所有權(quán)和財富不平等的問題中,再次發(fā)現(xiàn)意大利 80%的土地屬于 20%的人。

20世紀初,由管理學(xué)家約瑟夫·朱蘭(Joseph Juran)將其命名為帕累托法則,即80%的結(jié)果是20%的原因造成的,并且號召關(guān)注「重要的少數(shù)」而不是在「瑣碎的多數(shù)」當(dāng)中投注精力。后續(xù)在經(jīng)濟學(xué)中得出結(jié)論(80%的財富掌握在20%的人手里)更加證實了帕累托法則的觀點。

2. 正確理解80與20

帕累托法則有很多不同的叫法,如帕列托法則、關(guān)鍵少數(shù)法則、二八法則、巴萊特定律、最省力的法則、不平衡原則等,后續(xù)筆者將其稱為「80/20法則」。

其實,80/20法則是一個較為抽象的概念,可以理解為:大部分的效果由少數(shù)幾項關(guān)鍵的因素來決定。在實際的場景中,“大部分”不是精確的80%,“幾項關(guān)鍵因素”也不是固定的20%,數(shù)據(jù)會有所浮動,可能是70%+30%或者90%+10%,但不管這些數(shù)字如何波動,其背后蘊含的規(guī)律(集中的投入將產(chǎn)出大于預(yù)期的結(jié)果)是不變的,并且生活中存在的許多不平衡現(xiàn)象,都與這個規(guī)律相當(dāng)接近。

3. 可適用范圍

80/20法則并不受人為直接控職,更多時后是自然而然的形成,其適用領(lǐng)域非常廣泛。早期大多數(shù)用于社會、經(jīng)濟、管理以及工程等領(lǐng)域,而在80年代末就已經(jīng)有設(shè)計師將其設(shè)計領(lǐng)域,在各行各業(yè)中,已經(jīng)有大量的案例證明了 80/20原則:

  • 人類80%的科學(xué)發(fā)明,來自于20%的人口
  • 社會上20%的人占有80%的財富
  • 城市80%的交通,集中在20%的道路上
  • 20%的客戶為公司貢獻了80%的收入
  • 公司80%的收益來源于20%的產(chǎn)品
  • 20%的網(wǎng)站獲取了 80%的網(wǎng)絡(luò)流量
  • 20%的常見軟件錯誤導(dǎo)致了80%的系統(tǒng)崩潰
  • ……

4. 設(shè)計領(lǐng)域中的運用

70年代中期出現(xiàn)圖形化界面,而到80年代末,80/20法則就已經(jīng)被設(shè)計師引用在設(shè)計規(guī)范當(dāng)中,后續(xù)經(jīng)過不斷的發(fā)展及優(yōu)化,現(xiàn)已深入設(shè)計中的方方面面,PM用來處理KPI、UX用來劃分權(quán)重、UI用來決策版面布局等。

界面設(shè)計中該如何應(yīng)用80/20法則,這就需要設(shè)計師時刻注意如何讓用戶更快找到目標、如何更順暢的完成任務(wù)以及如何擁有更愉悅的心理感受。例如80%的用戶只會用到20%的功能,那么設(shè)計師就應(yīng)該將80%的時間、精力集中在這20%的功能上,不斷迎合用戶需求以及使用體驗。

二、產(chǎn)品如何應(yīng)對80與20

1. 關(guān)鍵性的20%

80/20法則能夠幫助我們提供決策思路、梳理設(shè)計方向,通過前面的了解,我們應(yīng)該清楚了產(chǎn)品80%的用戶只會用到20%的功能,而80%的收益也恰恰來自于20%的付費用戶,甚至低于20%。

雖然一直呼吁盡量滿足所有用戶,但產(chǎn)品團隊的重心始終要圍繞著20%來進行,從產(chǎn)品到設(shè)計、再到開發(fā)測試,都能以此為方向制定問題的解決方案。

2. 非關(guān)鍵性的80%

任何一款產(chǎn)品都不能忽略主次,每隔一段時間就要重新評估功能價值,以備后續(xù)的更新迭代,針對非關(guān)鍵性的80%切勿耗費過多的精力,以免喧賓奪主,不僅得到不好的反饋、還會帶來不必要的損失,吃力不討好。

對于已經(jīng)過期的核心(曾經(jīng)20%)功能,需要及時降低權(quán)重以及精力的消耗,不然即便是掌聲一片、也可能無法變現(xiàn)。

3. 僅關(guān)注 20%有風(fēng)險

用20%的部分創(chuàng)造80%的價值,并不意味著只關(guān)注20%的關(guān)鍵性指標、其它的就可以被忽略,這樣做表面上看是挺誘人,但會讓其他很多指標停滯,呈現(xiàn)出產(chǎn)品過度優(yōu)化的情況,造成短時間內(nèi)隱藏的負面影響。

團隊?wèi)?yīng)該要有眾覽全局的眼光,考慮到各指標間的相互影響,可視情況而定將時間和精力合理分配,如90%+10%、80%+20%、70%+30%等,只要是將大部分用在關(guān)鍵性指標上即可。

三、在UI設(shè)計中的運用

在UI設(shè)計中,我們會將主要精力花費在20%的頁面設(shè)計上,例如APP底部標簽欄的幾大主頁或其它重要的一/二級頁面,會花費更多的心思去構(gòu)思不一樣的布局、表現(xiàn)手法,將設(shè)計功底凸顯出來。而剩下80%的頁面就相對機械化,會使用一些常規(guī)樣式以及復(fù)用的方式像搭積木一樣快速完成,成本之低、效率之高毋庸置疑。

同一個頁面的設(shè)計方式也是如此,設(shè)計師將大量心思放在首屏及位置靠上的功能上,待超過一屏后下滑時,設(shè)計也會逐漸輕量、組件化,這有助于節(jié)省產(chǎn)品、設(shè)計、開發(fā)更多的時間。

1. 排版布局(F型)

用戶瀏覽屏幕時,眼球移動的順序通常都是從左到右、從上到下(基于網(wǎng)頁瀏覽眼動測試),這種移動軌跡很像字母「F」,這也讓F型布局成為網(wǎng)頁設(shè)計中效率最高的方式之一,所以設(shè)計師通常會將重要的信息放在左上角或左側(cè),不重要的信息放在右側(cè)。

如下面這張眼動測試圖,F(xiàn)型布局也正好詮釋了80/20法則合理性與可行性,在頁面中20%的關(guān)鍵區(qū)域,吸引了用戶80%的注意力。

2. 功能入口設(shè)計

很多產(chǎn)品因為業(yè)務(wù)功能的龐大,一股腦的將信息全部展示出來,看起來十分臃腫,用戶不能快速找到自己想要的信內(nèi)容,就會失去信心。

優(yōu)酷APP首頁將熱門頻道和點擊頻率較高的頻道顯示在頂部導(dǎo)航中,如精選、電視劇、電影、最新院線等,而其他更多的分類則隱藏在頻道選項卡中,將少量(≈20%)重要的內(nèi)容放在明顯的位置,目的就是為了讓大部分用戶更快觸達,提高了產(chǎn)品的易用性。

3. 選項列表設(shè)計

在一些選項列表中,由于選項數(shù)量的龐大,會給用戶增加使用難度。

例如,使用美團購買火車票在選擇地址時,面對超長的地址列表,逐個查看或通過字母篩選,都要花費一定的時間和操作成本,即便可以通過碼字搜索來完成,但因為自行輸入有很多的不可控性,能讓用戶選擇的就不要讓其輸入。

對于地址列表,除開自動定位和搜索歷史,運用80/20法則就能很好的解決這一問題,系統(tǒng)將約20%高頻選擇的熱門城市作為單獨的模塊放在全部列表之前,提高了大部分用戶的搜索效率。

4.  極簡風(fēng)格設(shè)計

極簡風(fēng)格的界面設(shè)計跟80/20法則在精神上保持著高度的一致,剔除多余、無用的元素,而保留的每一個元素都是有目的、有針對性的,也是絕對必要的存在。在極簡主義設(shè)計中,視覺上簡單干凈,大部分都是通過通過留白來襯托關(guān)鍵性元素的存在,讓用戶更加聚焦于主要功能/信息。

四、與其他法則的糾葛

1. 與奧卡姆剃刀的結(jié)合

奧卡姆剃刀指出「如無必要,勿增實體」,需知頁面中每多一個元素都會增加視覺“噪聲”,意味著用戶需要花費額外的時間和理解成本,對用戶體驗的影響是很大的。那么問題來了,當(dāng)產(chǎn)品需要增加一項需求量小但確實存在的功能,該怎么處理?

這時我們可以將奧卡姆剃刀原則作為最終的評判標準,是否需要增加上述所說的功能,就要看看能否很好的控制團隊開發(fā)成本和用戶體驗成本。

其實在80/20法則中,很多小眾但確實存在的功能需求基本很難抵消所造成的用戶體驗損失,所以即便實現(xiàn)了這個需求,也很難分配出20%的精力去維護與迭代,甚至“俺耳盜鈴”般的將其遺忘,但這個視覺“噪聲”一直存在,如果事先能分析出這種結(jié)果,這個需求根本不需要增加。

2. 與長尾模型的對抗

在2004年長尾模型才被提出來的時候,很多人認為這是在顛覆80/20法則,它們的曲線長得很像,但結(jié)論完全相反,那條長長的“尾巴”(非關(guān)鍵的80%)所占據(jù)的長度幾乎與頭部的(關(guān)鍵的20%)高度相當(dāng),這說明收益雖低,但這么多數(shù)量的累積,依然值得重點關(guān)注。

所以有很多企業(yè)在采集差異化戰(zhàn)略時運用了長尾理論,例如小米搭建的全品類商城用的是長尾理論。

乍一聽好像很有道理,難道80/20法則被推翻了嗎?事實并非如此,長尾理論的成立必須要滿足兩個條件,第一是尾巴真的足夠長(小眾需求確實非常多),第二長尾巴能被用戶發(fā)現(xiàn)(龐大的用戶量),這兩個條件缺一不可。例如京東、淘寶、微信、支付寶等,其前提都是建立在大規(guī)模、且海量的用戶資源之上,不管多么隱蔽、多小的動能,總能擁有一些不錯的曝光度,所以才能發(fā)揮長尾模型的作用。

說道這里,大家應(yīng)該就明白了,那些中小型的產(chǎn)品對長尾模型大多是望塵莫及,所以在你的產(chǎn)品規(guī)模、用戶量沒有達到一定的級別之前,就不要妄捧長尾模型,用好80/20法則就好。

五、結(jié)語

80/20法則在實際工作中是一個相對普遍的定律,它能讓我們靈活思考設(shè)計問題,更好的為用戶服務(wù),雖然80/20法則也存在一定的爭議,但還是適用于覺絕大多數(shù)的場景,在關(guān)鍵時候使用,能幫助我們準確的找到問題點,在有限的時間和精力下快速作出優(yōu)化決策并、關(guān)注核心功能,最終達成目標。

專欄作家

大漠飛鷹;公眾號:能量眼球,人人都是產(chǎn)品經(jīng)理專欄作家。致力于產(chǎn)品需求的驅(qū)動、產(chǎn)品體驗的挖掘,利用設(shè)計的手段為受眾用戶帶來更好的體驗,即好看、好用。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自 Unsplash,基于 CC0 協(xié)議。

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

組件詳解|氣泡卡片Popover 和 文字氣泡Tooltips,用法有什么區(qū)別?

杰睿

都是交互反饋和提示組件,大家可能會疑惑:文字氣泡 Tooltips 和氣泡卡片 Popover 的區(qū)別是什么,兩者之間的應(yīng)用場景如何?本文對兩者的差異進行總結(jié),希望對你有所幫助。

同樣都是交互反饋及提示組件,你可能會疑惑:文字氣泡 Tooltips 和氣泡卡片 Popover 有什么區(qū)別?分別有哪些特定的使用場景?

本文就來詳細分析下這兩個組件的區(qū)別和聯(lián)系,幫助你做好應(yīng)用。

一、氣泡卡片  Popover

氣泡卡片(Popover)是當(dāng)用戶點擊 / 鼠標移入元素時,就會彈出氣泡式的卡片浮層。當(dāng)對于某個元素有更多的解釋性描述和相關(guān)操作時,這些內(nèi)容可以收納到元素的氣泡卡片中,根據(jù)用戶的操作行為進行展現(xiàn)。

其用法特征是:

1. 用戶可以在浮層卡片上進行相關(guān)操作,也即氣泡卡片可以并需要承載更復(fù)雜的內(nèi)容和交互功能。

2. 卡片中可以包括的內(nèi)容有:文字說明,圖片內(nèi)容,操作按鈕,相關(guān)鏈接等等。

3. 組件功能側(cè)重于:承載信息和操作。即收納并在需要的時候展示與該元素內(nèi)容相關(guān)的信息和操作。這些信息的特征通常是:

  • 并不緊急但比較重要的解釋內(nèi)容;
  • 有一部分的用戶需要隨時閱讀的內(nèi)容;
  • 在點擊關(guān)鍵操作后給用戶確認“是否繼續(xù)進行”的提示(Ant Design 也單獨把這個功能拿出來做成做了一個組件:Popconfirm 氣泡確認框,如下圖)。

二、文字氣泡  Tooltips

文字氣泡(Tooltips)是相對簡單的文字提示氣泡框。用戶使用鼠標移入元素后顯示提示,移出后提示消失。

其用法特征是:

1. 文字氣泡通常不承載復(fù)雜的信息和操作,僅提供一段文案解釋,也即用戶在文字氣泡中不能做除閱讀外的其它操作。

2. 該組件功能側(cè)重于:解釋說明。即對局部內(nèi)容或元素進行文字性的解釋說明。通常來說該氣泡是對其載體本身的解釋,比如:

  • 一個特殊的功能按鈕;
  • 專有名詞、難懂詞匯;
  • 看不出具體目的地的操作鏈接
  • 特殊的 icon 等。

三、使用建議

1. 關(guān)于使用場景

  • 氣泡卡片 Popover:常用于承載信息和操作。承載的內(nèi)容和形式更為多樣。
  • 文字氣泡 Tooltips:常用于解釋說明。僅承載簡單的文案信息。

2. 關(guān)于組件樣式

有同學(xué)看過 Ant Design 組件庫提供的組件樣例,會覺得氣泡卡片 Popover 是白色背景,而文字氣泡 Tooltips 是半透明黑色背景。

其實這兩個組件的背景顏色上的差異并不是重點,因為這兩個組件都可以使用其他顏色(比如帶有透明度的品牌色)做背景底色。顏色并不具備唯一標準。AntD 就提供了多種顏色的文字氣泡樣式:

3. 關(guān)于理解規(guī)范

也許你已經(jīng)發(fā)現(xiàn),即使我們將一個組件的使用規(guī)范和應(yīng)用場景解釋得再全面,在使用時也總會出現(xiàn)一些特殊的業(yè)務(wù)需求和應(yīng)用場景無法嚴格按照規(guī)范來執(zhí)行。

面對復(fù)雜多樣的業(yè)務(wù)需求,我們更應(yīng)該學(xué)會:在理解業(yè)務(wù)需求的基礎(chǔ)上,合理調(diào)整組件的使用方式和樣式。

組件的規(guī)范對設(shè)計師來說并不應(yīng)該是限制或約束,而是一種能夠幫助我們快速實現(xiàn)產(chǎn)品設(shè)計一致性,保證基礎(chǔ)體驗的快速方式。

專欄作家

元堯,人人都是產(chǎn)品經(jīng)理專欄作家。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自 Unsplash,基于 CC0 協(xié)議。

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

交互細節(jié)——管理模式下是否需要確認按鈕?

杰睿

關(guān)于“管理模式下是否需要確認按鈕”這一問題,作者結(jié)合自己最近的一次設(shè)計方案復(fù)盤,從三個維度展開分析,希望對你有所啟發(fā)。

背景

需求:在課程章節(jié)頁面,老師希望可以對章節(jié)、單元編輯名稱和調(diào)整順序。

設(shè)計問題:

  1. 操作功能入口放在哪里?
  2. 是實時保存同步,還是點擊確認按鈕保存同步?
  3. 樹結(jié)構(gòu)下的排序如何設(shè)計?

一、操作功能入口放在哪里?

最開始想到的就是放在章節(jié)單元后,增加更多 icon,用戶點擊更多進行章節(jié)單元的編輯刪除,拖拽直接調(diào)整排序??墒沁@種設(shè)計方式讓章節(jié)看起來復(fù)雜很多,而且老師使用頻率很低,一般只有在學(xué)期剛開始,備課時設(shè)置,后期幾乎不再會進行調(diào)整。

為了降低頁面復(fù)雜度,我把編輯排序放在統(tǒng)一入口,點擊后,再進行操作。我給這個入口命名為管理。點擊管理,進入到管理模式,調(diào)整章節(jié)、單元的名稱和層級結(jié)構(gòu)。

二、是實時保存同步,還是點擊確認按鈕保存同步?

1. 實時保存

實時保存就是用戶的每一步操作都會立即生效。比如一些標題的編輯,鼠標hover上去會展示輸入框,光標消失即保存成功。或者知乎編輯文章時,也會告訴你保存中。

實時保存相較于確認保存少一步操作路徑,每一步操作立即生效同步更新,相對來說效率較高。由于人們總是會忘記收尾工作,實時保存也避免了讓用戶承擔(dān)忘記點擊確認按鈕而使數(shù)據(jù)丟失的風(fēng)險。

實時保存也有缺點,比如當(dāng)用戶想要反悔撤銷的話,就會比較困難。一般會根據(jù)具體需求搭配撤銷按鈕、歷史版本等方式,給用戶一個反悔撤銷的機會。

2. 確認按鈕保存

用戶進行的一系列操作,都不會立即生效,而需點擊確認(保存等)按鈕后,所有操作才會生效。比如飛書管理后臺對于會議室預(yù)約規(guī)則的設(shè)置。默認是查看模式,修改字段進入編輯模式,展示取消、保存按鈕,點擊保存更新修改,取消則回到編輯前的狀態(tài)。

這種方式的好處是,減少用戶修改過程的心理壓力。用戶在修改過程中可以隨意調(diào)整,內(nèi)容不會被同步,修改好后點擊確認按鈕統(tǒng)一保存,內(nèi)容同步。

為什么用戶在編輯時會有心理壓力?重點就在于同步給誰,以及同步的內(nèi)容是什么。

3. 用戶

內(nèi)容修改后只同步給自己。

例如微信標簽管理,進入管理模式后,對于標簽的排序,刪除都實時保存更新,沒有確認按鈕。標簽修改后的結(jié)果只會同步給自己,而自己在管理標簽的過程已經(jīng)知道了修改結(jié)果,如果增加確認按鈕倒顯得較為繁瑣。

內(nèi)容修改后會同步給其他用戶。

例如飛書管理后臺對于會議室預(yù)約規(guī)則的設(shè)置,設(shè)置結(jié)果會影響其他用戶預(yù)約會議室,比如能不能約、幾點能約,所以同步設(shè)置結(jié)果就必須要謹慎一些。而多一步確認(保存)按鈕可以幫用戶再次確認自己的操作行為,讓同步結(jié)果更謹慎。

以上可以總結(jié)為,如果內(nèi)容修改后只同步給自己,則實時保持更便捷。如果內(nèi)容修改后會同步給其他用戶,則需考慮增加確認按鈕讓操作行為更謹慎。具體還需考慮內(nèi)容本身。

4. 內(nèi)容

如果內(nèi)容對其他用戶影響不大,也可以使用實時更新。

比如飛書管理后臺對于會議室名稱的修改,修改后,光標移開即保存成功。會議室名稱對于用戶來說只有信息的傳遞,沒有功能上的制約,甚至也不影響用戶行為目標??梢运伎枷拢?dāng)用戶想約會議室時,什么會影響用戶決策?比如位置-用戶會考慮距離是否合適、或者狀態(tài)-是否當(dāng)前被占用等,但會議室名稱幾乎不會影響用戶預(yù)約決策。所以內(nèi)容對用戶影響較小,使用實時更新。

編輯者對于內(nèi)容的重視程度。

比如知乎內(nèi)容發(fā)布后,二次編輯,需點擊保存更新才會同步給其他人。創(chuàng)作者寫文章耗費了自己的時間成本,好的內(nèi)容可以幫創(chuàng)作者帶來流量和價值感,所以創(chuàng)作者會更重視文章內(nèi)容的完整性。而實時同步編輯過程所展示的內(nèi)容是不完整的,會影響讀者閱讀內(nèi)容的感受。所以點擊保存更新,統(tǒng)一同步內(nèi)容可以避免這些問題的發(fā)生。

三、我的方案

回到自己的產(chǎn)品上,老師對于章節(jié)的管理操作會同步給學(xué)生,調(diào)整結(jié)果會影響學(xué)生查看章節(jié)結(jié)構(gòu)。作為學(xué)生,主要任務(wù)是完成章節(jié)或者單元下的學(xué)習(xí)活動。所以調(diào)整的內(nèi)容并不影響學(xué)生完成學(xué)習(xí)任務(wù),按照我們所總結(jié)的規(guī)則,內(nèi)容對于同步者影響不大,可以使用實時更新。

再來看編輯者對于內(nèi)容的重視程度。老師會在學(xué)期前開始備課,管理層級結(jié)構(gòu)屬于備課環(huán)節(jié),教學(xué)內(nèi)容一般都是固定的,所以后期調(diào)整層級結(jié)構(gòu)的頻率很低。操作行為低頻且優(yōu)先級不高,內(nèi)容固定,對于老師來說,重視程度一般。所以也可采用實時更新。

由于老師編輯章節(jié)或單元已有保存按鈕,如果管理模式還存在保存操作的話,對于編輯功能來說需 2 次保存才算是真的保存,理解成本過高。選擇實時保存方式更合適。

根據(jù)以上 3 點,我的方案選擇實時保存,實時更新。

最后

以上是我對于工作內(nèi)容中關(guān)于管理模式的復(fù)盤思考,最終設(shè)計方案的產(chǎn)出還是需要結(jié)合自己產(chǎn)品的業(yè)務(wù),在體驗和功能的權(quán)衡之下做出最合理的設(shè)計。

關(guān)于第三部分排序放在下次在寫….

本文由 @阿青 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

題圖來自Unsplash,基于CC0協(xié)議。

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

杰睿

編輯導(dǎo)語:在做UI設(shè)計時,定義并統(tǒng)一顏色規(guī)范對產(chǎn)品設(shè)計和團隊整體推進具有重要作用,本篇文章通過一個國外大廠真實的顏色組件升級案例為我們分享了統(tǒng)一顏色規(guī)范的好方法,一起來看。

Hi,我是彩云。咱們平時在做UI組件庫的時候,會遇到一個問題,定義了很多顏色但在團隊合作的時候,卻依然還是會根據(jù)每個設(shè)計師自己的喜好來配色,很難將顏色規(guī)范很好的統(tǒng)一起來。這其中有一個很嚴重的問題就是對于顏色的命名和管理不夠清晰,那么今天這篇文章通過一個國外大廠真實的顏色組件升級案例,希望能幫你解決這個難題。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

我們花了幾個月的時間改進了設(shè)計系統(tǒng) Cobalt 中顏色的處理方式。顏色是 UI 的基本元素:它們構(gòu)成視覺語言,幫助定義品牌,并被開發(fā)和設(shè)計師每天用在產(chǎn)品設(shè)計中。

但如果我們在使用顏色上沒有明確的指導(dǎo)原則,如顏色被團隊中的設(shè)計師按喜好使用時,將會導(dǎo)致產(chǎn)品看起來非?;靵y。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

我們APP中的不一致例子

接下來我會告訴你,我們是如何做好顏色規(guī)范以及在整個項目中面臨的挑戰(zhàn),正如你將看到的,這個項目并不像看上去那么簡單:

如何通過 Getaround 在設(shè)計和技術(shù)方面管理顏色概述這個系統(tǒng)的局限性,并說明我們?nèi)绾胃倪M它什么是語義顏色我們是如何實現(xiàn)它的,以及它帶來的優(yōu)勢!

一、我們之前在Getaround中如何管理顏色?

1. 在設(shè)計方面

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

和許多設(shè)計團隊一樣,我們使用 Figma 作為我們的主要設(shè)計工具。我們的顏色被放在“基礎(chǔ)”庫中,可以在其中找到我們在產(chǎn)品中使用的所有常見樣式,例如字體樣式、顏色、圖標等。這個庫提供了我們每天使用的專用系統(tǒng)庫(iOS、Android、Web、電子郵件)。顏色名稱過去是基于它們的外觀。例如:紫色顏色是我們的主要顏色,而石墨色是基本文本的常規(guī)顏色。

2. 在技術(shù)方面

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

在我們的APP中,曾經(jīng)會用相同的系統(tǒng)來管理顏色。此外,還有一些語義顏色,但僅限于 iOS,開發(fā)用的也不多。

二、我們在舊系統(tǒng)中面臨的限制

在使用這個系統(tǒng)時,團隊反復(fù)面臨同樣的問題:如何確保從一位設(shè)計師到另一位設(shè)計師以相同的方式使用顏色?如果沒有適當(dāng)?shù)闹笇?dǎo)原則,我們?nèi)绾未_保開發(fā)很好的還原?如果明天我們必須用全新的配色方案來改造我們的品牌,要怎么快速統(tǒng)一?讓我們試著找出我們是如何陷入這種境地的?

1. 沒有明確的顏色使用規(guī)范

所有設(shè)計師都使用相同的色板,但自 2019 年 Getaround 品牌重塑以來,除了引入不一致之外,沒有明確關(guān)于如何使用它們的規(guī)范,所以設(shè)計師在選擇顏色時迷失了方向。然后他們將開始建立自己的參考資料,每個設(shè)計師都有不同的配色想法。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

例如:設(shè)計師應(yīng)該在所有這些灰色陰影中為次級文本選擇哪種灰色?顏色命名在這里不是很有幫助

2. 舊品牌的設(shè)計包袱

以前品牌的一些舊顏色仍在使用(按鈕上的藍色陰影,標題……)。到現(xiàn)在也沒有真正的行動計劃來迭代它們。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

舊驅(qū)動器品牌

三、我們對新系統(tǒng)的設(shè)想

在 2021 年初,我們有機會為我們的 iOS 和 Android APP來制定長期的 UI 規(guī)劃。我們問自己“5年后我們的APP會是什么樣的?”。我們會回顧, Getaround 品牌是如何成為我們視覺方法中心的。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

以上是我們品牌和設(shè)計團隊在 2020 年完成的全面工作的一小部分致力于設(shè)計系統(tǒng)的 Cobalt 團隊借此機會重新考慮了顏色系統(tǒng)。然而,為了使這一目標成為現(xiàn)實,我們面臨著一些挑戰(zhàn):

1. 制定指導(dǎo)原則

我們?nèi)绾未_保每個設(shè)計師都可以依賴易于理解和使用色彩系統(tǒng)?擁有一個簡單系統(tǒng)將加快使用速度。

2. 顏色能通過可用性標準

我們?nèi)绾未_保從一開始就設(shè)計出易于使用的顏色?

3. 易于維護并符合未來趨勢

我們?nèi)绾尾拍苁瓜到y(tǒng)易于維護并符合現(xiàn)在和未來的行業(yè)標準(例如:暗模式)

四、我們新的顏色系統(tǒng):語義顏色

在我們的探索階段,在 Figma 的共享環(huán)境中工作促使我們保存和記錄我們所做的設(shè)計決策。就像我們應(yīng)該如何命名我們的強調(diào)色:(主要?強調(diào)?)我們還測試了APP界面在黑暗模式下的外觀,以及如何正確支持這一點。我們應(yīng)該創(chuàng)建一個單獨的調(diào)色板還是為每個組件都創(chuàng)建一個深色版本?

我們開始與開發(fā)討論這個問題,以了解他們有什么解決方案來處理這些問題。語義顏色的概念很快就被開發(fā)人員提出來,因為他們知道并且很好地使用了這個概念。但對于設(shè)計師來說,又要如何準確理解呢?

1. 什么是語義顏色?

語義指的是根據(jù)顏色的使用方式而不是色調(diào)來命名顏色的方法。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

例如,你可以將顏色命名為“成功”或“積極”,因為它指的是含義,而不是“綠色”或“翡翠綠”。甚至可以根據(jù)顏色在屏幕上的應(yīng)用方式來命名顏色,例如背景顏色、按鈕背景顏色、文本顏色、圖標顏色等……

2. 從基于外觀的配色方案到基于語義的配色方案

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

語義顏色并不新鮮,越來越多的產(chǎn)品開始采用這種方式來定義顏色。我們可以從下面一些大廠的顏色規(guī)范來學(xué)習(xí)google

  • https://material.io/design/color/the-color-system.html#color-theme-creationApple
  • https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/colorShopify
  • https://polaris.shopify.com/design/colors#navigationAsana
  • https://polaris.shopify.com/design/colors#navigation

顯然,這種顏色系統(tǒng)有很多優(yōu)點。因此,現(xiàn)在讓我解釋一下我們?nèi)绾卧趯嵺`中將這個概念應(yīng)用到我們的產(chǎn)品中。

3. 深入研究語義顏色

我們的新顏色系統(tǒng)由兩部分組成:

  • 基礎(chǔ)色板
  • 語義顏色

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

基礎(chǔ)調(diào)

我們與品牌團隊密切合作,他們定義了一個全新的品牌,我們在工作時會圍繞這個品牌考慮。該品牌的每種顏色都采用多種色調(diào)進行調(diào)整,以創(chuàng)造更大的靈活性,一次構(gòu)建成為基礎(chǔ)調(diào)色板。它代表可以在產(chǎn)品中顯示的所有可能顏色。團隊可能不會全部使用它們,但他們會選擇在產(chǎn)品中效果最好的那些。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

基礎(chǔ)調(diào)色板

4. 語義顏色

語義顏色建立在用作參考的基礎(chǔ)調(diào)色板之上。正如我之前解釋的,命名不再是指顏色的“外觀”(洋紅色、棕色、綠色……),而是指UI 元素它們被應(yīng)用于(文本、圖標、按鈕、背景……)以及該元素的狀態(tài)(活動、非活動、成功……)。請參閱此處的命名法和一些示例:

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

語義顏色結(jié)構(gòu)和示例這意味著來自基礎(chǔ)調(diào)色板的顏色可以用于多種語義顏色:

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

這就是我們根據(jù)這個新原則重新調(diào)整顏色命名的方式:

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

我們通過設(shè)計師和開發(fā)進行了內(nèi)部用戶測試,以確定命名語義顏色的最佳方式。我們嘗試了很多不同的命名方法,發(fā)現(xiàn)過于詳細的命名系統(tǒng)對于我們的團隊和產(chǎn)品的規(guī)模來說維護和使用太復(fù)雜了。我們決定做一些簡單的維護,同時在命名方面有足夠的延展性。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

五、語義顏色的好處

1. 語義色彩嵌入設(shè)計原則

語義顏色側(cè)重于顏色的用途。它消除了設(shè)計師和開發(fā)對使用什么顏色的盲目猜測,因為視覺語言直接傳達了設(shè)計決策。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

例如:在這里,顏色命名使設(shè)計師更容易做出正確的選擇。在我們的原則中, *Accent* state 用于交互元素。

2. 解鎖黑暗模式

語義顏色可以適應(yīng)不同的主題。語義顏色的名稱始終相同,但它的外觀可能會根據(jù)所選模式而改變。例如,語義顏色“主背景”可以指淺模式下的“白色”和深色模式下的“黑色 500”。根據(jù)用戶選擇的模式,將自動顯示正確的顏色。這對我們的設(shè)計系統(tǒng)來說是一個真正的游戲規(guī)則改變者,因為它將使它更加面向未來。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

明暗模式下的語義顏色 Primary.Background

3. 語義顏色高效靈活

如果我們將來要更新顏色,使用語義顏色也會變得更容易。假設(shè)我們想要將我們的主色更改為藍色。我們只需要將基礎(chǔ)調(diào)色板中的“紫色”更新為“藍色”。與該顏色相關(guān)的所有語義顏色也將神奇地更新。另一種情況可能是更新特定 UI 元素的顏色,例如按鈕,而無需觸摸使用紫色顏色的其他元素。

在這種情況下,我們只需要更新 ButtonBackground.Primary 顏色,非常簡單。如果沒有該系統(tǒng),更新顏色將需要經(jīng)過大量 QA 以確保將更改應(yīng)用到任何地方。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

4. 顏色組合指南

這個系統(tǒng)似乎很容易使用,但設(shè)計師仍然有一些問題:

  • 我什么時候可以使用正常文字顏色?
  • 我什么時候可以使用次級文本顏色?
  • 我什么時候可以使用可交互顏色?

為了幫助設(shè)計師選擇顏色,我們創(chuàng)建了一個交互式指南,列出了所有可能的顏色組合。我們在 figma 原型中創(chuàng)建了這個指導(dǎo)原則,每次更改設(shè)計系統(tǒng)顏色時都會更新該規(guī)范。它突出了允許的語義顏色組合,以最大限度地保持一致性。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

點擊可以查看大圖Figma 中內(nèi)置的語義色彩交互指南

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

5. 結(jié)果

采用這種新的顏色系統(tǒng)產(chǎn)生了一些變化:

1)我們從“Foundation”庫中提取顏色,并將它們分為深色和淺色模式。這一舉措使我們能夠使用 Figma 開關(guān)功能輕松地將設(shè)計文件從? Light 切換到 ? Dark 模式。這也使庫更輕且更易于維護。

如何更好的統(tǒng)一顏色規(guī)范?這個方法正在成為新趨勢!

2)語義顏色已在我們的 iOS 和 Android 應(yīng)用程序上成功實現(xiàn),我們現(xiàn)在正在努力在我們網(wǎng)絡(luò)平臺上使用相同的系統(tǒng)。我們很快就會有一個集中的配色方案來處理所有系統(tǒng)上的顏色。

總結(jié)

總結(jié)下今天學(xué)到的內(nèi)容:

  1. 發(fā)現(xiàn)并準確描述團隊在使用顏色時遇到的問題
  2. 如何從提出設(shè)想,到以新的方式來定義顏色
  3. 如何通過語義化顏色來使得大家更方便的使用顏色,我們也可以在自己的組件庫中多使用語義化的顏色來進行命名管理,這樣團隊協(xié)作才會更加高效。

(授權(quán)截圖)

 

作者:Fabien Gavinet,譯者:彩云Sky

原文鏈接:https://medium.com/getaround-eu/colors-that-make-sense-505d0f3509c1

本文由 @彩云Sky 翻譯發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自Unsplash,基于CC0協(xié)議。

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

應(yīng)用圖標 | 全面解析,助力設(shè)計出更優(yōu)質(zhì)的應(yīng)用圖標!

杰睿

編輯導(dǎo)語:各大APP的圖標都各有特點,圖標的設(shè)計也是一門學(xué)問。在這篇文章中,作者全面解析了各類APP圖標設(shè)計背后的用意,一起學(xué)習(xí)一下吧。

如果說一個人的臉面、衣著打扮是給陌生人的第一印象,那么APP的應(yīng)用圖標風(fēng)格與氣質(zhì)就是留給新用戶的第一印象,關(guān)系著用戶是否對這個APP感興趣、是否會打開應(yīng)用介紹、是否會點擊下載按鈕起著決定性的作用。

一個好的應(yīng)用圖標有著無限可能,無形中對用戶產(chǎn)生強大的吸引力,并有一種想要了解的沖動,況且圖形本身就能讓人充分發(fā)揮想象力,這就是為什么不管在哪個應(yīng)用市場第一眼看到的是應(yīng)用圖標,而非應(yīng)用名稱。

在一部手機就能解決很多問題的互聯(lián)網(wǎng)時代,相信每個人都有下載幾十上百個APP,琳瑯滿目的列表,應(yīng)用圖標是否能在第一時間抓住用戶眼球(目標明確或鐵粉除外)非常重要,一個視覺傳達清晰且有吸引力的圖標能提升用戶點擊率,即便用戶只使用過一次,相對來說,印象也會更深刻。

本文根據(jù)筆者對大量應(yīng)用圖標的分析、結(jié)合設(shè)計準則進行總結(jié),希望能幫助大家在設(shè)計過程中規(guī)避掉一些常見的問題,歡迎一起探討、取長補短、共同進步。

分享目錄

  1. 四大設(shè)計原則
  2. 色彩的表現(xiàn)形式
  3. 主體圖形分類
  4. 背景圖案及元素
  5. 主體圖形的表現(xiàn)手法
  6. 應(yīng)用圖標設(shè)計流程
  7. 總結(jié)

一、四大設(shè)計原則

應(yīng)用圖標代表產(chǎn)品的外在形象,設(shè)計的精美與否決定著用戶的第一印象,是否產(chǎn)生打開的欲望跟當(dāng)前圖標的視覺所傳達的內(nèi)涵有最直接的關(guān)系。應(yīng)用圖標雖然不同于設(shè)計LOGO,表現(xiàn)方式也千變?nèi)f化,但必定有自身的設(shè)計準則要去遵守,利用設(shè)計的手段將視覺傳播的價值最大化。

1. 可識別性

首先,應(yīng)用圖標需要盡量簡約。過于復(fù)雜的圖標會增加用戶的理解成本、甚至誤導(dǎo)用戶,但如果過于追求簡約,缺乏細節(jié)、個性化以及必要的隱喻信息,也會因過于單調(diào),造成表意不明確等問題。

簡約并非簡單,設(shè)計師需要通過專業(yè)的知識進行合理的簡化,以提升應(yīng)用圖標的設(shè)計品質(zhì),方便用戶在不同場景中都能清晰的辨認。其次,需表意明確、易于理解。

應(yīng)用圖標代表的是產(chǎn)品的行業(yè)屬性、功能作用或與眾不同的優(yōu)勢,要讓用戶第一眼就能識別出所代表的含義,貼近用戶的心理預(yù)期。

簡約易識別是應(yīng)用圖標必備的基礎(chǔ)屬性之一,這也是為什么大部分產(chǎn)品都將logo作為應(yīng)用圖標主視覺的原因,因為logo設(shè)計考慮到了方方面面以及后續(xù)延展的問題,即便有些logo較為復(fù)雜,也會通過提取局部元素、吉祥物、主體色等方式來強化應(yīng)用圖標屬性,給用戶形成獨特的記憶,以提升應(yīng)用的下載量和使用率。

2. 關(guān)聯(lián)性

應(yīng)用圖標應(yīng)該與產(chǎn)品的屬性、品牌有極強的關(guān)聯(lián)性,通過品牌延展賦予產(chǎn)品更強的生命力,讓用戶從接觸應(yīng)用圖標的第一眼開始、再到后面的使用,整個過程始終都能保持清晰且統(tǒng)一的品牌認知,通過和諧統(tǒng)一的視覺效果,帶來更好的用戶體驗。

應(yīng)用圖標需要與品牌之間必須保持高度的一致,著重從以下幾點體現(xiàn):

1)LOGO

毫無疑問,用品牌logo作為主體圖形是最佳選擇,結(jié)合品牌色搭配使用,能將產(chǎn)品核心理念、品牌形象的傳播效果達到極致,在APP應(yīng)用市場中,大家會發(fā)現(xiàn)大多數(shù)產(chǎn)品都在使用logo作為應(yīng)用圖標的主視覺圖形。

2)品牌色

品牌色即主體色,將貫穿APP所有頁面的元素組件。眾所周知,每種顏色都有其特定的含義,能傳遞給用戶不同的心理感受。用主體色作為應(yīng)用圖標的背景色,可以烘托出產(chǎn)品的情感氛圍,并與進入應(yīng)用后的主體色遙相呼應(yīng),以最小的視覺跳躍性將前后關(guān)聯(lián),強化用戶對產(chǎn)品的記憶感知。

3)IP/吉祥物

吉祥物屬于品牌logo延展的一部分, 也是產(chǎn)品的靈魂。當(dāng)logo較為復(fù)雜時,因移動設(shè)備應(yīng)用圖標位置空間有限,logo細節(jié)無法在短時間被用戶捕捉,不宜展示時,使用IP/吉祥物或其局部元素代替也是不錯的選擇。

4)產(chǎn)品名稱

如果說logo是產(chǎn)品的臉面,通過暗示和隱喻給用戶無限遐想并讓用戶記住它的樣子,那么名稱的出現(xiàn)就相當(dāng)于產(chǎn)品主動進行了自我介紹,并讓用戶知道如何稱呼它。

將產(chǎn)品名稱作為應(yīng)用圖標需謹慎使用:首先,文字傳達的信息量有限:其次,用戶對于圖形的理解效率要優(yōu)于文字;再者,應(yīng)用圖標都會有對應(yīng)的產(chǎn)品名稱展示(應(yīng)用市場在右、桌面在下方),多少有些信息重復(fù)。

所以大家見到的應(yīng)用圖標主體是產(chǎn)品名稱的不外乎兩種情況,一種是產(chǎn)品本身將名稱設(shè)計成字體logo,例如美團、懶飯;另一種是將產(chǎn)品名稱作為logo的輔助信息提示,例如繽紛生活。

以上是應(yīng)用圖標與品牌屬性關(guān)聯(lián)最常見的四種方式,在設(shè)計中可靈活搭配,使用兩種及以上的方式組合,能將品牌傳播的途徑發(fā)揮到最大值。

3. 差異化

筆者上小學(xué)時,曾經(jīng)在一次彩鉛繪畫作業(yè)中得到了老師的真心夸贊,但內(nèi)心卻備受打擊。老師對著我畫的桃子說“這西紅柿畫的太像了”。

舉這個例子似乎并不恰當(dāng),但結(jié)果是驚人的相似,筆者想要陳述的一個觀點是,不要讓你辛苦做出的設(shè)計成為別人的嫁衣,讓用戶誤以為這是其他企業(yè)的“某某某…”產(chǎn)品。

目前,應(yīng)用市場中的APP數(shù)量巨大,且還處于增長的趨勢,同行業(yè)的圖標設(shè)計同質(zhì)化相當(dāng)嚴重。想要讓自身產(chǎn)品應(yīng)用圖標脫穎而出,就有必要在設(shè)計之前做好競品分析,借鑒競品的優(yōu)點,在突出自身產(chǎn)品核心特征、屬性的基礎(chǔ)上,還要用不同的表現(xiàn)手法突出其差異性,給用戶留下獨特的印象,避免同質(zhì)化。

4. 可用性

應(yīng)用圖標在設(shè)計完成之后(測試小組)、上線后(用戶反饋)進行可用性測試,主要針對圖標對用戶的吸引力、識別度等問題作進一步優(yōu)化,以確保圖標在不同場景中都能被用戶清晰識別并提升印象。

雖然可用性測試存在設(shè)計之后,但這一環(huán)節(jié)至關(guān)重要,它決定著產(chǎn)品的下載量以及使用率。

二、圖標顏色的表現(xiàn)形式

1. 單色圖標

單色圖標通常以品牌色作為背景色、logo以反白的形式呈現(xiàn),既能突出品牌色、還能用于烘托主體圖形,不過這種方式僅適合色值單一的logo,多色值可能會與背景色產(chǎn)生融合或色彩反差太大影響視覺傳達效果。另外,如果logo視覺重量較大,也可使用白色背景+原品牌色logo,這樣會更直觀。

單色應(yīng)用圖標雖然色彩比較單一、表現(xiàn)形式也受到局限,但視覺清晰、簡潔且識別性強,如果能運用其他設(shè)計手法豐富圖標細節(jié)就再好不過了。

2. 多色圖標

多色圖標使用了兩種及以上的顏色,更多是直接使原多色彩的logo圖形+白色背景,無需任何加工,控制好尺寸規(guī)范就行。如果是運營推廣所需,如春節(jié)、618、雙11等活動,會對應(yīng)用圖標加以其他色彩烘托、點綴元素或標簽等,色彩就會更多,但一般都具有時效性,活動過期即圖標復(fù)原。

多色圖標的細節(jié)、層次更加豐富,設(shè)計時確保各色彩搭配協(xié)調(diào),一旦因色彩過多造成視覺混亂,就得不償失了。

3. 漸變圖標

無論是單色還是多色,添加漸變會讓應(yīng)用圖標更加細膩、耐看。漸變的表現(xiàn)手法應(yīng)用廣泛,簡單的漸變能讓圖標細節(jié)豐富,同時也具備空間感和微立體感。

設(shè)計漸變色圖標需注意圖形銜接處的對比度,花里胡哨的漸變色會拉低品質(zhì)感,要確保色彩的和諧,讓圖標視覺清晰且容易識別。

4. 顏色疊加

單色、多色或是漸變都可通過調(diào)整不透明度、圖層疊加的方式來豐富應(yīng)用圖標細節(jié),相比純粹的漸變,立體感和空間感更強。使用顏色疊加需注意色彩對比及明暗關(guān)系,否則會衍生出臟亂的顏色。

5. 色環(huán)的運用

環(huán)形構(gòu)圖為主,由多個元素復(fù)制并以統(tǒng)一的中心點、旋轉(zhuǎn)角度,旋轉(zhuǎn)衍生出一個主體圖形。這種應(yīng)用圖標的設(shè)計構(gòu)圖飽滿、色彩豐富,能給用戶傳遞出輕松愉快的視覺體驗。

需要注意的是,由于顏色較多,至少在三種顏色及以上,否則無法構(gòu)成色環(huán)類的主體圖形(錯覺)。如果沒有超強的配色功底,最好按照色環(huán)的順序依次取色,即便沒有太大的優(yōu)勢,但至少不會出錯。

三、主體圖形的分類

一個好的應(yīng)用圖標應(yīng)該是多元素、多信息結(jié)合運用,才能達到更好的效果。雖然大部分主體圖形使用了logo,但并不影響設(shè)計師們對其進行拆解,提取局部元素、色彩、名稱等信息進行二次創(chuàng)作,從原則上來說,是一次線上logo的設(shè)計。

應(yīng)用圖標種類繁多,切不可盲目跟風(fēng),需經(jīng)過認真的分析、研究,找到最適合自身產(chǎn)品的才是最重要的,且每種類型并非獨立,在條件允許的情況下還能跨類型靈活搭配、相互組合。

1. 中文字體

1)單中文字體

僅次于圖形logo的表現(xiàn)方式,通常會在產(chǎn)品名稱中提取一個具有代表性的文字對筆畫、結(jié)構(gòu)等進行再設(shè)計。基于國人文化的優(yōu)勢以及對漢字的敏感度,既能降低用戶對應(yīng)用圖標的認知成本、還能根據(jù)產(chǎn)品特性設(shè)計出差異化的視覺效果。

不過因為文字筆畫的原因,單個文字提取難度較大,避免信息傳遞有誤或影響識別度,建議選擇筆畫較少且具有特性/代表性的文字,若達不到條件,最好選擇其他表現(xiàn)方式。

2)多中文字體

使用兩個及以上漢字,大多直接將產(chǎn)品名稱用在圖當(dāng)中,對用戶來說更容易記憶,有利于品牌推廣。相比單字體,設(shè)計感會受到一定的局限,不宜做過于夸張的表現(xiàn)方式,因文字較多,設(shè)計時一定要注意文字的協(xié)調(diào)與可讀性。

多文字圖標建議將字數(shù)控制在2~6個范圍內(nèi),3字以內(nèi)一行顯示,超過3字即兩行顯示且最多不超過兩行,否則會影響圖標的識別效果。

3)中文、圖形組合

適當(dāng)添加帶有產(chǎn)品特性的輔助圖形,用引導(dǎo)或指向性的方式對文字進行強調(diào),圖標細節(jié)會更豐富,可以突出產(chǎn)品想要傳達的信息、以及不同的氣質(zhì),還能增加圖標的形式感和趣味性。注意添加的圖形不要過于復(fù)雜,不然會讓信息混亂,適得其反。

4)中文圖形化

根據(jù)單個字體筆畫的特點進行巧妙的變形或延展,會讓你的應(yīng)用圖標更具設(shè)計感、品質(zhì)好。這種方式對設(shè)計功底的要求較高,需要確保字體的識別度,切勿霸王硬上弓,如果是為了設(shè)計而設(shè)計,就違背的信息傳播的初衷。

5)中文、IP形象組合

由產(chǎn)品名稱和IP形象組合而成,這種方式能通過品牌IP不同的視覺形象帶給用戶情感化的體驗,讓產(chǎn)品更具親和力,拉近與用戶之間的關(guān)系。例如,IP的喜、怒、哀、樂表情變化分別對應(yīng)用戶不同的心理感受,以加深用戶對產(chǎn)品的印象及品牌認知。

2. 英文字體

1)單英文字體

單英文字體通常是提取產(chǎn)品名稱拼音首字母或英文首字母進行創(chuàng)意設(shè)計,跟中文字體相比,基于字母本身線條的簡潔及流暢性,再結(jié)合產(chǎn)品特點,很容易設(shè)計出兼具美感、高識別度的應(yīng)用圖標。

需要明確一點,不管如何創(chuàng)意,也僅局限于在26個英文字母中選擇,如果想設(shè)計出差異化的應(yīng)用圖標,對設(shè)計師來說,是一個很大的挑戰(zhàn)。

2)多英文字體

跟多中文不同,中文產(chǎn)品名稱在移動端基本不會超出6個字,而全拼音或英文名則多達十幾位甚至更多,為了用戶能更好容易識別、記憶,依然是提取不同拼音或單詞的首字母(中文全稱)進行設(shè)計。

多英文的應(yīng)用圖標很很容易形成獨有的產(chǎn)品簡稱,更利于用戶記憶,但字母一定不要過多,如果無法刪減,那就只突出特定的2~4個字母。

3)其他類型

字母與圖形、IP形象組合以及字母圖形化,其表現(xiàn)方式、設(shè)計原則與中文字體圖標類似,這里不做過多闡述。

3. 數(shù)字符號

1)數(shù)字設(shè)計

人們對于數(shù)字來說是非常敏感的,不存在文化差異或認知誤區(qū),基于數(shù)字便于記憶且容易識別的特點,將數(shù)字圖形化后應(yīng)用到圖標當(dāng)中,會讓產(chǎn)品具有親和力,有利于品牌傳播。單純的數(shù)字過于簡單,需增加一些細節(jié),豐富圖標層次,讓其具備獨特的記憶點,不然會顯得單調(diào)。

2)符號設(shè)計

每個符號都有特定的含義,因此,在選擇符號作為應(yīng)用圖標之前,首先需要了解清楚該符號是否能體現(xiàn)出產(chǎn)品屬性以及想要表達的意思,例如“¥”適合攢錢、理財相關(guān)的應(yīng)用,而“+-×÷”則適合用于計算器或數(shù)學(xué)相關(guān)的應(yīng)用;其次,符號跟數(shù)字一樣,都比較簡單,需經(jīng)過二次創(chuàng)作后才會使用。

4. 扁平化圖形

1)線性圖形

線性風(fēng)格的應(yīng)用圖標能給人一種簡潔輕快的感覺,設(shè)計師通過提取產(chǎn)品的品牌信息、功能服務(wù)等進行創(chuàng)意設(shè)計,將得到的關(guān)鍵詞以一條或多條線段組成高度抽象的圖形來達到信息傳播的目的。

通常以反白的形式出現(xiàn),背景可以是單色、漸變色或加以輔助圖形點綴。

線性圖形非常適合文藝類簡約風(fēng)格的應(yīng)用,通過不同的線條帶給用戶不同的心理感受,例如直線代表大方、專業(yè)、正直;斜線代表張力、速度;曲線代表流暢、飄逸及柔軟等。

設(shè)計時,切記圖形不能過于復(fù)雜,否則會影響其辨識度,增加用戶的認知成本,也不利于品牌推廣。

2)面性圖形

也可稱之為剪影圖形,根據(jù)產(chǎn)品屬性,將日常生活中被大眾所熟知的動物、植物、食品、工具、玩具…等事物進行簡化,通過刻畫事物的造型輪廓來形成獨立的剪影圖形。

高識別度的剪影圖形會讓整體看起來非常醒目,提高信息傳播的效率,只要控制好造型,即便把圖標縮到很小也能清晰辨認。

因現(xiàn)實世界中事務(wù)的復(fù)雜性,被提煉出的圖形如果細節(jié)過多會顯的復(fù)雜且不夠干練、細節(jié)過少則難以辨認,所以需要對圖形進行創(chuàng)意加工,最終以確保應(yīng)用圖標的功能和美感兼具。

3)幾何圖形

幾何圖形在應(yīng)用圖標中使用的很廣泛,可以是線性或面性,表現(xiàn)形式也非常豐富,利用幾何圖形通過單獨、組合、布爾運算等方式形成簡單且個性化的創(chuàng)意圖形,帶給用戶簡約、現(xiàn)代、空間、熱鬧等不同的心理感受。

幾何圖形構(gòu)圖簡潔,設(shè)計形式豐富多樣,想設(shè)計出具備設(shè)計感和差異化的應(yīng)用圖標,很考驗設(shè)計師的創(chuàng)意能力。

5. 卡通形象

對純色剪影圖形增加太多細節(jié),無疑是將其“大卸八塊”,變成一堆零件,但通過多色、漸變、圖層樣式等表現(xiàn)手法設(shè)計成卡通形象,就完全不一樣了。

卡通形象能體現(xiàn)出產(chǎn)品的生命力、親和力,以及直觀且易于理解和記憶的特質(zhì),對品牌形象的塑造、傳播起到了很好作用。

在畫卡通形象時,需要注意產(chǎn)品主用戶群體的年齡段,切勿一開始就把活潑可愛作為卡通形象的代名詞,避免絕對低齡化的表達,同時需要設(shè)計師有一定的繪畫功底。

6. 擬人化

利用人體的局部元素,如眼睛、嘴巴、手足、頭部等,再結(jié)合常見的表情動作進行圖形化設(shè)計,相當(dāng)于給原本冷冰冰的圖形賦予了生命力,傳達出不一樣的情感,而且用戶原本就對人體元素敏感度更高,更容易打動用戶并形成較強的記憶。

擬人化的應(yīng)用圖標會顯得親民,便于拉近與用戶之間的關(guān)系,適度在抽象的圖形上加入情感化(動作/表情)表達,能生動、形象的體現(xiàn)出產(chǎn)品獨有的特性。

如果想要較強的視覺沖擊力,建議元素不要過多,最好是對某個單一的元素作放大或特寫處理,讓用戶看到更多的細節(jié),也可用夸張、比喻、襯托等表現(xiàn)手法強化特點。

7. 擬物化

擬物化圖標使用的比較少,它更偏向于某種行業(yè)類型,例如工具、游戲類型的應(yīng)用,通過超接近于現(xiàn)實世界中的物體造型,基本不需要用戶思考,一眼就能理解,但也正因為這種特性,信息量的傳播受到很大局限,僅適合單一且大眾化的信息傳達。

在如今,想同時融入行業(yè)、屬性、品牌等多元化內(nèi)容的信息化時代,顯然不太實用了。

四、背景圖案及元素

1. 圖形背景

應(yīng)用圖標背景通常以單色、漸變色居多,除此之外,還可以添加與主體圖形相呼應(yīng)的輔助圖形背景,以豐富圖標的視覺層次。圖形背景一定是為襯托或突出主體圖形的輔助存在,切勿過分表達,以免喧賓奪主。

2. 炫彩背景

當(dāng)主體圖形的結(jié)構(gòu)、色彩不是很復(fù)雜,且產(chǎn)品面對的是年輕化用戶群體時,可通過色彩拼接、晶格化或多種鮮明的色彩漸變等方式設(shè)計出炫彩效果,色彩表現(xiàn)豐富的應(yīng)用圖標,能帶給用戶更強的視覺沖擊力。色彩可多但不可亂,需要把控好色彩之間的對比關(guān)系。

3. 運營標簽

常見于在特定的節(jié)日中,例如618、雙11、雙12及傳統(tǒng)節(jié)日等,產(chǎn)品會存在促銷、打折活動,為了更早的讓用戶知道,會在應(yīng)用圖標的某個區(qū)域以標簽的方式出現(xiàn),起到引導(dǎo)用戶的作用。

不過這種表現(xiàn)方式具有時效性,活動截止即圖標樣式復(fù)原。

4. 節(jié)日氛圍

通過配色或節(jié)日相關(guān)的元素點綴,營造出一種感同身受的節(jié)日氛圍。例如:春節(jié)期間,部分應(yīng)用圖標背景會調(diào)整為紅色,并使用燈籠、煙花、文案等元素點綴,制造出普天同慶、與用戶同樂的喜慶感,或者在高考期間鼓勵學(xué)生,少了套路、多了真誠,給用戶留下較深的印象。

五、主體圖形的表現(xiàn)手法

1. 對比

通過元素的大小、長短、虛實、稀疏、方向以及不同的色彩、明暗關(guān)系等方式進行對比,形成強烈的反差效果,同時兼具張力和美感,這也是應(yīng)用圖標設(shè)計中很常見的技法表現(xiàn)之一。

2. 對稱

對稱在自然界中隨處可見,在互聯(lián)網(wǎng)設(shè)計中也是如此,應(yīng)用圖標中的主體圖形以對稱的方式呈現(xiàn),能給用戶平衡、和諧的感覺,也讓圖標更具有觀賞性。

3. 分割

將應(yīng)用圖標中的主體圖形分割,賦予不同的顏色、樣式等,明確層級劃分,可提升圖標的美感。例如:將色塊分割成不同的比例、形狀,就能組合成一個完整的熊貓圖形(百度搜“熊貓剪影”圖片)。

如果適合使用0.168黃金比例分割就再好不過了,這是被公認為最具美感的比例。

4. 重復(fù)

將相同或相近的圖形以某種規(guī)律連續(xù)性的排列,相比單調(diào)的圖形,會更加飽滿。重復(fù)性的表現(xiàn)手法以大小、色彩、位置、形狀等作為出發(fā)點進行有序的排列,最終形成一種規(guī)律、整齊的節(jié)奏和藝術(shù)感。

需要注意的是基礎(chǔ)圖形不能過于復(fù)雜,一定是有規(guī)律的重復(fù),否則會讓圖形變的混亂,無法形成整體。

5. 重疊

在保證識別度清晰的前提下,將兩個或以上的元素相互重疊、交叉在一起,能形成前后左右的層級關(guān)系,制造空間感,同時也能將多個圖形關(guān)聯(lián)在一起,避免圖標元素零散或單調(diào),讓整體性更強,豐富用戶視覺感知。

6. 正負形

正負形也是常見的表現(xiàn)手法之一,利用正圖為底,通過減去底層挖空的方式突出(錯覺)負形,將產(chǎn)品特征、屬性及服務(wù)多途徑的傳達給用戶,可謂是“一石二鳥”。

正負形圖標能將信息傳播最大化,且設(shè)計感十足,好的正負形圖標能給用戶形成獨特的記憶點,但設(shè)計時需要注意正、負銜接的順暢度,否則無法清晰的傳播信息。

六、應(yīng)用圖標設(shè)計流程

1. 發(fā)散思維、尋找隱喻

通過產(chǎn)品屬性、功能或特點進行思維發(fā)散,例如:夏天,我們會想到空調(diào)、海灘、冰淇淋、比基尼、裙子(女性)、夜空等一系列相關(guān)聯(lián)的事和物,搜集起來并做好整理歸類,確定大致的設(shè)計方向。

2. 分析競品、避免同質(zhì)化

確定了大致的設(shè)計方向,就去找同行業(yè)、同類型或相似的應(yīng)用圖標分析其形狀、配色、組合類型等,取長補短,這也是避免同質(zhì)化非常重要的一個環(huán)節(jié),幫助自己在后續(xù)設(shè)計出具備差異化的應(yīng)用圖標做鋪墊。

3. 提取關(guān)鍵詞

可以從產(chǎn)品名稱或功能屬性方面找出產(chǎn)品最想傳達的核心信息,并提煉出關(guān)鍵詞。切記,關(guān)鍵詞不可脫離帶水、表意不明確,一定要夠精煉、能表達出核心內(nèi)容。關(guān)鍵詞在精不在多,如果太多,需要通過層層遞進,篩選出“一主三輔”,要知道這關(guān)系著后續(xù)應(yīng)用圖標傳達信息的精準度。

4. 圖標繪制

將上一步得到的關(guān)鍵詞轉(zhuǎn)化成抽象圖形,進行視覺化提煉,這時應(yīng)用圖標的雛形已經(jīng)形成,再結(jié)合前面所提到的圖形分類、表現(xiàn)手法以及注意事項等,進入圖標繪制流程。關(guān)于圖標設(shè)計規(guī)范及原則,在之前的《圖標篇 | 圖標設(shè)計必備的基礎(chǔ)知識!》文章中有詳細說明,這里不做闡述。

5. 細節(jié)處理

基本圖形繪制完成后,通過添加點綴、輔助圖形、背景處理等方式豐富圖標細節(jié),進行精細化處理,使其更精致,具備高識別度及品質(zhì)感。

6. 適用性測試

分別通過移動端應(yīng)用商店列表、應(yīng)用詳情、設(shè)置中應(yīng)用列表、桌面以及WEB商店等,對不同位置的大小、不同的桌面背景進行虛擬測試,以確保在不同場景中都能被用戶高度識別,如果這些問題等著被用戶發(fā)現(xiàn),很可能給產(chǎn)品帶來不利的影響。

7. 輸出切圖

需要對iOS和Android系統(tǒng)各輸出一套圖標,iOS只需一個1024px的切圖便能適配所有,且無需設(shè)定圓角。Android則需要多套切圖規(guī)范,如512px、198px、144px、96px、72px、48px,圓角半徑以512px為基準設(shè)定為90px(參考值)。

這些固定的尺寸規(guī)范并不在技術(shù)能力范疇,如果實在不清楚,需要用時就“百度一下”一大把,或直接找開發(fā)人員拿尺寸都不是難事。

七、總結(jié)

首先,筆者要感謝耐心看到這里的小伙伴,希望總結(jié)的內(nèi)容能幫到大家,在前期設(shè)計中作為資料參考,避免出現(xiàn)常見的問題,防止進入誤區(qū)。

其次,要想設(shè)計出優(yōu)秀的應(yīng)用圖標僅看上述內(nèi)容是遠遠不夠的,少不了平時的多看、多練、多思考,需日積月累,逐漸提升自己的視覺審美、造型提煉、執(zhí)行效率等多方面設(shè)計能力。

應(yīng)用圖標的總結(jié)分享就到這里了,對你有幫助的話就給筆者點個贊吧,如果有不同意見,歡迎在評論區(qū)交流或指正,以便查漏補缺,共同進步。

#專欄作家#

大漠飛鷹;公眾號:能量眼球,人人都是產(chǎn)品經(jīng)理專欄作家。致力于產(chǎn)品需求的驅(qū)動、產(chǎn)品體驗的挖掘,利用設(shè)計的手段為受眾用戶帶來更好的體驗,即好看、好用。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)許可,禁止轉(zhuǎn)載

題圖來自Unsplash,基于 CC0 協(xié)議

蘭亭妙微(www.alimai.net )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan

日歷

鏈接

個人資料

藍藍設(shè)計的小編 http://www.alimai.net

存檔

国产三级在线视频观看| 99热这里只有精品88| 人妻精品久久久久中文字幕| 久久婷婷大香萑太香蕉AV人| 最近更新中文字幕2019视频| 91在线网站| 中文字幕精品无码亚洲字幕| 久久五月丁香合缴情网| 国产女教师AV网站| 992TV在线无码视频| 亚洲AV秘 一区二区三区| 国产 国语对白 露脸正在播放 | 亚洲国产精品无码久久久午夜| 日韩AV怎么免费进去观看| 陌生性接触国产AV片| 亚洲成老女AV人在线视| 婷婷激情丁香| www色婷婷| 亚洲三集毛片| 国产无遮挡裸体免费直播| 日韩亚洲国产激情一区| 又黄又硬又爽视频| 琪琪秋霞午夜av影视在线| 12周岁女全身裸在线播放| 性黑人欧美大战| 免费午夜无码18禁无码影院| 午夜福利潮喷喷水| 自拍欧美日韩亚洲动漫| 不戴套双飞女房客闺蜜| 亚洲制服无码一区二区三区| 在线观看午夜网站母乳| 亚洲色熟女图| 小屁孩和大人啪啪网站视频| 绑起被各种性器折磨的漫画| 狠狠综合久久狠狠88亚洲| 在线影院免费观看黄色视频| 波多野结衣av无码电影在线观看 | 久青青在线观看视频国产| 人妻精品丝袜一区二区无码AV| 国语乱码中文字幕| 亚洲情a成黄在线观看| 一个人看的免费观看视频www无码| 国产李泌AV在线播放| 一本二本黄色网站| 好爽…又高潮了十分钟试看| 国产一区二区三区妓女| 男人无码视频在线观看| 国产а天堂在线| 欧美激情乱人伦| 日本亚洲欧洲免费无线码| 国产欧美日本综合一区| 老妇女av在在免费线观看| 亚洲嫩模Av在线| 日韩成人高清二区三区| 人禽交 欧美 网站| 秋霞理论在一l级少妇人喷水| 亚洲人成在线播放a偷伦| 18禁永久免费污网站| 超碰97人人做人人爱亚洲| 国产精品无码天堂2021| 欧美精品一区二区三区在线| 国产按头口爆吞精在线视频 | 一个人免费观看视频www欧美| 97人人模人人喊直播| 狠狠做五月深爱婷婷天天综合| 婷婷四月开心色房播播| 男女啪激烈高潮喷水动态图| 成人又黄又爽又色的视频| 亚洲中文字幕AⅤ无码| 国产高清国内精品福利| 亚洲线路一国产线路| av片 手机在线| 印度幻女free性zozo交| 国产98在线 | 欧美| 一区二区三区四区视频影院| 国产偷国产偷高清精品| 永久在线视卡须免费观看| 黑色丝袜美美女被躁翻了视频 | 一本到国产在线精品国内| av免费轮上不卡| 中文字幕,日韩欧美一区二区| 日韩视频 中文字幕 视频一区| 国产熟女高潮精品视频| 亚洲se激情在线观看| av香港经典三级级 在线观看| 麻豆久久久国内精品| 人人天天夜夜曰曰狠狠狠肉感| 国产丝袜视频| 越猛烈欧美xx00动态图| 日本成人字幕在线不卡| 古代一级aⅴ无码毛片| 宝贝你居然没有穿奶罩| 亚洲综合无码AV一区二区| 一级线看片免费人| 日韩综合另类| 国产精品爆乳在线播放第一人称| 户外露出刺激一区| 精品人妻少妇一级毛片| 调教黄色视频| 久久99精品国产二区| 又大又粗又爽的少妇毛片| 一级特黄aa大片国产| 亚洲中文字幕无码mv| 精品偷拍各种美女嘘嘘| 欧美成人福利视频| 久久麻豆精亚洲AV品国产| 亚洲av无码成人黄网站在线观看| 国产成人无码综合亚洲日韩| y11111少妇无码电影| JK高中女白丝呻吟自慰在线观看| 特级女人毛片| 1;美亚洲第一极品精品无码| 久久精品无码日韩国产不卡| 麻豆精品无码| 超碰人人柔人人捏人人| 国产偷窥熟女高潮| 久久国产这里只有精品| 久久厕所偷窥视频| 成人免费观看视频| 久色网站| 九七电影院理论片在线观看| 丰满爆乳无码一区二区三区| 亚洲av午夜福利精品一区| 国产成人精品永久免费视频| 中文字幕人妻有码在线| av巴士啪啪| 性爱无码高清| 亚洲最大tⅴ无码免费电影| 国产成人精品A视频一区| 国产在线精品欧美日韩电影| JapaneseHD熟女熟妇伦| 日本一区二区啪啪视频| 久久人妻久久玩| 白浆喷水美女网站| 日韩在线不卡视频| 韩国三级成人不卡在线观看| 富二代精品短视频在线| 少妇高潮惨叫喷水正在播放| 午夜福利国产小电影| 亚洲中文字幕在线一区二区三区| 精品国产VA久久久久久久| 永久免费av无码不卡在线观看| 熟女色综合| 久久精品中文字幕有码| 无码人妻久久久一区二区三区免费| 成人国产精品日本在线| 亚洲综合久久久久久888| 国产临盆孕妇孕交中出视频| 97久久超碰极品视觉| JAPANESEHD国产在线| av天堂永久在线网址| 手机看片AV永久免费| 国产自国产自愉自愉免费24区| 免费啪啪无码中文字幕| 丰满人妻无码束缚啪啪专区| 国产成人a免费| 超碰尤物点击进入| 嗯好大好爽好舒服视频| 红杏AV在线无码| 最新无码专区超级碰碰碰| 尤物午夜在线| 2020天天弄亚洲系列中文字幕制服| 大学生男女真的曰批视频| 欧美处破摘花精品| 人妻丝袜av中文系列先锋影音| 91麻豆精品国产自产在线观动漫| 亚洲成aⅴ人在线观看| 亚洲一级在线播放a| 成人国产激情久久精品| A级毛片,黄,免费观看m| 9999久久久久黄色网站| 222aaa免费无码| 在线成 人av影院| 日本工口里番h彩色无遮挡全彩| 亚洲精品嫩草研究院永久网址| 久久久无码精品国产一区| 亚洲无码免费在线播放app | 影音先锋综合网资源站| 新妺妺窝人体色www_聚色窝| 欧洲女人牲交性开放视频| 韩日AV天堂| 亚洲精品无码专区GiF| 欧美极品少妇性运交| 一本大道东京热无码不卡Av毛片| 老师掀开短裙让我挺进| 亚洲欧美日本中文字不卡| 一本一道久久久无码毛片A∨| 亚洲AV永久中文无码精品综合| av无码免费岛国一区二区| 日韩一区二区三区无码影院| 俺也去俺也来五月丁香| 法国大白屁股ass| 大又大粗又爽又黄少妇毛片免费在线观看 | 精品国自产拍天天更新| 国产 成 人 小说 视频| 亚洲日韩一中文字幕| 伊人久久一道本| 国产女主播在线观看| 国产高清窝窝视频免费观看| 丰满少妇爽死你视频| 制服丝袜人妻中文字幕在线| 啦啦啦老逼视频| 亚洲愉拍自拍另类天堂| 中文字幕人成| 光棍影院福利在线精| 亚洲鲁丝片AV无码多人| 精品999视频| 亚洲自偷自拍另类二区| 欧洲vpsw一级女片| 5b肉蒲团之性战奶水国语 | 久久综合久久自在自线精品| 可以在线看的h网站| 无遮挡一进一出视频| 91中文字幕| 国产精品99一区二区三区| 国产成人美女裸体片免费看| 亚洲AV中文字字幕乱| 被男人插到抽搐视频在线| 出差被夫の上司持久侵犯在线观看| 巨臀中文字幕一区二区| 又污又黄又刺激的网站| 18禁美女黄色网站| 成年专区曰批免费网| 亚洲第一极品精品无码| 美女自慰免费网站| 国产在线流白浆视频| 国产XXXX做受| 少妇无码露出自慰15P| 国产m片在线| 亚洲日韩国产欧美| 九九热精品国产| 国产亚洲欧洲日韩在线| 十八禁在线永久免费观看| 污污污高潮在线观看| 久久国产亚洲精品麻豆| 久久久国产精品无码| 超碰人人97在线| 日韩久av| 年轻漂亮的人妻被公侵犯bd免费版 | 国产精品无码素人福利免费| 亚洲欧美一区男男| 足 交 视屏在线观看| 在线视 欧美亚洲日本| 丰满的少妇人妻2| 国产精品富婆与黑人视频 | 500少妇系列视频| 亚洲gif动态无码专区| YYYY111111少妇光屁股影院| 日韩精品无码不卡无码| 2022AV国产黄色网站| 中文亚洲av片在线观看不卡| AV动漫在观看| 天堂在线最新版www亚洲| 禁止18点击进入在线观看尤物| 婷婷五月综合激情| 免费 无码 国产在线观看观| 少妇极品熟妇人妻100| 在线观看片免费观看不卡| 五月天亚洲成女图区| 999精品国产高清一区二区| 高清国产一区二区| 亚洲天堂在线播放| 成本人动漫视频在线观看| 亚洲国产日韩a在线播放| 久久综合久久综合久久综合| 丰滿少妇被猛烈进入高清播放| h在线免费| 欧美日韩x8x8视频| 国产美女白浆免费视频| 92午夜福利视频动态图| 中文有码vs无码人妻麻豆| av人妻在线一区二区| 十分钟在线视频免费看| 久久婷婷五月麻豆国产| 特级午夜福利| 久久国产精品迪丽热巴观音坐| 国产成人欧美综合在线影院| 白嫩饥渴少妇全身推油| 四虎国产精品成人免费久久| 国内精品自线在拍2020| 国产美女 喷出水来| 大依香蕉性爱| 国产高潮美女| 萌白酱国产一区| 18岁在线免费黄色视频| 无码的性视频动态图| 日韩av电影天堂| 粉嫩一级免费毛卡片| www又黄又爽又刺激的黄色视频在线观看网站 | 天堂无码大芭蕉伊人| 夜夜夜免费网站观看| 久久黄色视频高清| 亚洲视频欧美| 白丝美女被强插网站入口| 黑人粗长五月天在线观看| 日本三级片网站| 亚洲国产成人最新精品| 国产高潮在线看| 亚洲一区二区三区视频| 啪啪无码| 一级特黄大片在线观看| 18以下勿进色禁网站视频| 亚洲VA在线∨A天堂VA欧美V...| 无码人妻熟妇AV又粗又大| 麻豆中文字幕av| 中文字幕无线码一区二区| 色综合99久久久无码国产精品 | 电视剧 第一页,欧美换爱交换 | 私拍国产精品视频| 18以下禁免费永久| av毛片午夜专区| 黑人巨超大videos中国人| 99久久久国产精品无码性| 国产亚洲精品美女久久久| 18禁色诱爆乳网站| 久久国产自揄拍3| 777在线免费视频| 少妇夜夜春夜夜爽试| 人妻中文字幕不卡精品| 欧美成人一区二区三区| A毛片免费视频| 亚洲AV永久无码5G| BBwWBBWW高潮| 美女高潮无遮挡免费视频| 久久美女网| 亚洲v国产v天堂a无码二区| 调教娇喘在线观看| www久久十八禁| 中文字幕人成乱码熟女免费| japanese教师中文字幕| 国产黑色丝袜在线观看| 日日摸日日碰日日狠狠| 国产美女高潮无套久久 | 精品国产闺蜜在线拍国语| 久久精品国产清自在天天线| 麻豆91久久婷婷五月| 色综合91久久精品中文字幕| 日本XXXX色视频在| 啊嗯干我在线观看| 免费看男人j放进女人屁股里| 午夜在线视频国产| 久久综合婷婷丁香五月中文字幕| 潮喷娇喘网站在线观看| 亚洲不卡AV电影在线观看| 色多多在线高清视频| 五十路熟妇乱子日本伦视频| 99视频精品全部免费免费观| 国自产偷精品不卡在线| 国产片你懂的在线观看| 一本无码久本草在线中文字幕dv| 美女的胸又黄又www的网站| 久久无码一区| 日本三级电影一区二区| 久久精品一区二区三区| 男人的天堂va在线无码| 色狠狠色噜噜AV一区| 好紧夹得好爽太舒服了视频| 一级特黄超爽在线| 亚洲成年美女一二三区免费看| 亚洲已满18点击进入在线| 免费无码又爽又刺激高潮的视频,| 欧洲美妇乱人伦视频网站| 美女羞羞喷液视频免费1000 | 麻豆AⅤ无码不卡| 亚洲AV制服丝袜日韩高清| 日本三级在线播放线观看免| 国产精品va一级二级三级| av老司机午夜福利片费废观看| 欧美日本日韩aⅴ在线视频| 国产精品亚洲а∨天堂2021| 亚洲高清国产香港拍精品| 777国产偷窥盗摄精品品在线| 欧美亚洲国产一区二区三区 | 亚洲精品99久久久久中文字幕| 欧美传媒视频在线| 国产美女作爱视频免费| 在线看日本十八禁免费网站| 国产一区视频在线妲己| 亚洲无码自拍偷拍| 成年男女免费视频网站不卡| 中文字幕丝袜一区二区| 黄频视频大全免费的国内| 国产成人毛片亚洲精品不卡 | 亚洲图欧洲图自拍另类高清| 国产成年无码久久久久免费| 激情影院深夜福利| 艾草成人无码一区二区片| 极品粉嫩午夜福利在线播放| 亚洲综合在线777米奇| 一区无码在线| 国产97成人亚洲综合在线| 亚洲av无码专区电影在线观看| 18禁男女污污污午夜网站免费| 亚洲欧美日韩在线观看A三区| 国产超短裙jk丝袜在线| 在线无码免费a| 尤物视频色综合| 日韩伦人妻| 成 人 桃 色 网| 婷婷综合缴情亚洲狠狠图片| 美女裸体黄18禁免费网站| 国产又色又爽又刺激视频| 精品韩国AV无码一区二区三区| 好深好爽使劲我还要| 国产亚洲成年网址在线观看 | 裸体女一级毛片| 国产精品一区在线xxxx| 91精品欧美综合在线| 高潮娇喘在线| 国产婷婷一区二区三区| 国产精品香蕉在线的人| 亚洲有吗无码A| 午夜丝袜鲁丝| 国产真人无遮挡免费视频| 日日摸夜夜添夜夜添爽| 国模啪啪一区二区三区| 亚洲狠狠婷婷综合久久久久图片| 嗯啊不要痛一区二区| 国产,亚洲,欧美,日韩每日更新| 2021av网站在线播放| 国产精品第25页| 性xxxx欧美老妇胖老太肥肥| 亚洲一区二区无码| 久久婷婷五月综合中文字幕| 丰满少妇一区二区视频| 无码高潮少妇毛多水多水| 狠狠cao影院| 人妻办公室被强奷| 亚洲AⅤ永久无码精品AA| 亚洲性爱区免费视频一区| 国产精品性爱| 久久只精品99品免费尤物| 制服丝袜无码在线第一页| 老熟女六十路一区| 成年女人天堂香蕉网| 人妻无码在线视频| 国产麻豆一精品一AV一免费软件 | xxxxx综合网| 亚洲一区免费视频| 国产羞羞视频,一区二区| 亚洲视频你懂的| 亚洲道一本中文字幕| 亚洲欧美国产青草青青| 99国产精品久久99久久久| 亚洲午夜无码视频| 亚洲国产成人久久精品app| XA无码免费播放| 日韩精品无码中文字幕电影| 尤物视频网在线| 亚洲午夜福利在线播放器| 凸偷窥妇科tube高清最新视频| 污污污高潮在线观看| 久久无码人妻影院| 18禁美女裸体无遮挡的网站| 无码人妻一区二区三区免费费| 在线免费看一级α| 日韩男女高清| 亚洲区精品中文字幕| 白丝美女裸体A级视频| 亚洲成av人片天堂网无码】| 好诱人的搜子好爽免费视频| 精品国际久久久久999| 波多野结衣紧身裙系列AV| 无码一区二区久久免费| 亚欧性爱无码AⅤ无码| 夜夜爽天天躁夜夜躁狠狠| 1区3区在线| 真实播放国产乱子伦视频| jk制服白丝喷水短裙出水视频| 亚洲美女在线国产| 999国产精品999久久久久久| h无码人成动漫免费看| h 国产精品 视频| 黑人巨茎大战欧美白妇| 亚洲中文无码永久免| 69天堂人无码视频| 高潮久久久久久| 国产女同在线视频| 又黄又大又硬又爽的免费视频| 免费播放h二区三区| 色天堂AV无码| 在线观看AV蜜芽| 噜噜色,噜噜啦,噜噜网| 日本三级欧美三级人妇视频黑白配| 被操高潮喷水不断在线观看| 国产高清不卡一二三区| 中文字幕a∨波多野结衣| 国产浪潮A∨在线| 2019最新国产不卡a国内2018| 国产欧美va欧美va香蕉在线| 浪潮av无码| 亚洲欧美偷拍另类A∨| 精精国产xxxx视频在线| 国产精品99久久久久久宅男| 一本一本久久av| 国产肉丝袜在线视频一区| 午夜精品久久久久久| 中文字幕久久青青| A一级黄色网站| 亚洲va综合va国产产va中| 最污丝袜美女在线观看| 色888视频在线观看| 丰满人妻连续中出中文字幕在线| 久久免费看黄a级毛片| 欧美激色第一页| 国产欧美国产网曝综合网| gv天堂gv无码男同在线| 真人男女猛烈裸交动态图| 亚洲永久网站在线观看AV| 伊人久久大香| 级毛片无码a∨| 午夜性刺激在线看免费| 亚洲国产日韩欧美一区二区三区| 亚洲精品欧美国产台湾swag | 亚洲欧美日韩中文在线制服| 超碰日本爆乳中文字幕| 人妻少妇久久中文字幕456| 狼友av永久网站免费观看| 亚洲爱婷婷色69堂| 多水的粉嫩小穴视频| 日韩AV十八禁在线观看| 手机在线最新日韩av| 饥渴少妇深夜喷水视频| 久久综合久久综合久久综合久久综合| 亚洲国产精品久久卡一| 中文字幕好多水| 久久福利真人抽搐一进一出| 国产乱子伦精品免费视频| 男人吃奶动态图| 大香伊蕉日本一区二区| 99热这里只/这里有精品 | 好大,好紧,好深,真爽免费视频| 狠狠做五月深爱婷婷天天综合| 无码吃奶揉捏奶头高潮视频| 绝对真实偷窥女子会所私密av| 纯爱无遮挡h肉动漫在线播放| 国产日黄色网站| 一区二区三区黄片| 日日麻批永久免费视频播放| 国内精品免费久久久久电影院| 国产美女丝袜高潮白浆网站| 美女啪啪一区二区三区| 你懂的网站在线看| 久久婷婷久久一区二区三区| 福利啪啪综合导航| 亚洲熟女偷拍| 国内无遮码无码| 伊人婷婷综合在线| 韩国人体vps国产在线视频| 亚洲人成综合在线播放| 白丝超短裙自慰网站| AV永久天堂| 国产AV日韩A∨亚洲AV电影| 国产无码天堂| 欧美拍拍拍拍| 特一级熟女毛片免费观看| 国产成人久久久久精品| 成 人 A V免费视频| 岛国精品一区免费视频在线| 色综合伊人尤物| baoyu135国产精品tv免费| 吞精囗交口爆视频| 亚洲午夜看片无码| MM1313亚洲精品韩国日本| 白丝喷水视频| 超碰在线观看波多野结衣| 国产精品V欧美精品∨日韩| 婷婷色激情综合| 白裙仙子玉臀迎合 玉液 呻吟视频 | 国产精品六区| 美女被操出白浆视频| 亚洲男人的天堂 aⅴ无码| 饥渴人妻被快递员玩弄视频| 久久久久久久性潮| 在线岛国AV无码一区二区三区| 国产薄丝脚交视频在线观看| 高清色性中文字幕网站| 91精品国产一区二区三区免费| ilovecao超碰| 国产67194一区二区四区| 嘿咻嘿咻高潮免费观看网站| 大学生无套视频在线播放| 国产高潮流白浆免费视频| 40岁成熟女人牲交片20分钟| Free性亚洲| 国产精品原创视频| 国产深田咏美一区二区| 久久精品精品撒尿网| 影音先锋无码韩国| 永久网址18勿进| 日韩aⅴ免费一区二区| 国产一精品一av一免费爽爽| 国产免费的野战视频| 亚洲手机在线观看| 国产午夜精品自拍| 日韩国产综合精选| 成a人片在线无码免费| AV色综合久久天堂AV色综合在| 日韩激情在线| 拉开腿揉捏花蒂hAV视频| 欧美性爱在线播放| 2022免费无码视频| 特级xxxxx欧美| 免费精品无码一级毛片| 国内女子自慰喷潮片免费观看| 国产午夜福利红片| 一本到无码AV专区无码| 曰本女人牲交视频免费| 国产下药迷倒白嫩美女网站BD| 又大又爽少妇毛片| 福利片免费 亚洲| 在线观看av片永久免费| 国产极品久久久久极品re| 全亚洲最大的AV网站| 四虎国产精品永久在线动漫| 华人亚洲欧美整片其他第一页| 2021人妻中文字幕乱码在线| 办公室爽到喷水456在线观看| AV影音先锋男人网| 成Av在线免费观看| 国产午夜美女精品一二区毛片| 2020国产成人久久精选| 精品一区二区视频免费观看| 久久亚洲日产国码av| 日爽尤物视频| 婷婷色香五月综合缴缴情香蕉| 黄色一级视频| 女上男下激烈在线观看免费| 成年视频xxxxx在线网| 别揉我奶头av~嗯~啊| 中文字幕亚洲理论手机在线观看| 国产高清在线精品一本大道| 尤物人妻中文字幕| 欧美毛多水多日本一区二区| 一级毛片免费完整视频体验区| 呦泬泬精品导航| 精品国产色色色| 重口另类网站av| 又黄又刺激又舒服又粗的流氓视频在线看 | 亚洲综合 国产精品 光棍影院| 日本高清不卡在线| 国产大白屁股流白浆AV| 曰韩免费无码AV一区二区| 日韩免费一二区| 色偷偷亚洲第一成人综合网址| 毛片无码高清视频网站| 胸大美女又黄的网站| 西西444www大胆无码视频| 插 娇小 乳 视频| 午夜视频 无码| 97超频精品视频在线观看蜜芽 | 夜夜爽一级毛片| 婷婷激情网址| 亚洲精品高清国产不卡在线| 久久久久久精品影院| 久久艹国产| 尤物高清无码在线观看| 大陆出口高潮福利视频| 女性自慰网站免费看ww| A级综合网| 亚洲av日韩av天堂影片精品| 又黄又爽的网站视频免费| 亚洲视频国产| 91麻豆精品国产自产在线观看动漫 | 久久高清欧美一区| 波多野结衣av高清一区| 他的舌头弄得我欲仙欲死| 2018手机在线A免费无码| 欧美人成在线播放网站免费| 按摩院AV无码| 天天躁夜夜躁狠狠综合2020| 欧美精品人妻aⅴ在线观视频| 亚洲国产日本韩国欧美mv| jk制服自慰喷水| 无遮挡色色动态图| 国产成人户外露出视频在线| H 番肉动漫视频大全在线观看| 亚洲AV无码不卡| 高H肉肉视频免费网站| av免费无码一区二区三区| 粗又长好猛好爽视频免费| 国产精品秘 999在线| 大臿蕉香蕉大视频在线| 夜夜添夜夜添夜夜摸夜夜摸| 强行挺进朋友漂亮的娇妻| 超碰欧美人人爽| 亚洲影院欧美| 97久久国产亚洲精品超碰热| 夜夜高潮天天爽欧美| 亚洲成av人无码免费观看| 成 人 十八禁网 在线观看| 国产精品不卡一区| 337p西西人体大胆辦开下部| 亚洲人成无码网站十八禁| 白浆喷水网站导航| 无码aaa| 丁香五香天堂网| 亚洲午夜影视无码| 色色888| 日韩人妻无码制服丝袜视频| 国产青草视频在线观看| 亚洲午夜18以下勿入网站| av无码免费看一区| 99视频在线观看免费的| 亚洲精品国产日韩| 欧美日韩国产免费一区二区三区| 2022高清无码在线观看| mm1314午夜福利视频5分钟| 完全着衣爆乳立川在线观看| 337P人体粉嫩胞免费高清视频| 午夜福利视频1| 久久99精品久久久久久清纯直播| 白嫩在线观看| 2020国产成人精品影视| 中文字幕日韩欧美一区二区三区| 第一午夜无码影院| 玩丰满女领导对白露脸视频| 国产香线蕉手机视频在线观看| 久久国产亚洲精品麻豆| 国产女主播一二三区| 久久精品AⅤ无码中文字字幕蜜桃| h在线观看亚洲电影在线观看| 国产一区二区在线|播放| 综合网址亚洲| vip影院国产成人精品午夜福利| 白嫩大屁股Av正在播放| 两女互摸自慰喷水爽哭直播| 日日摸夜夜添夜夜添2021| 久久亚洲欧美国产精品| 潮喷大喷水系列无码久久精品| HD女人奶水授乳milk漫画| av在线网站中| 国产免费人成在线视频| 污污丝袜自慰免费网站| JAPANESE睡觉侵犯| av华人精品在线| 真实播放国产乱子伦视频| av在线播放入口1| 午夜福利男女XX00视频免费区 | 一区二区精品理论电影| 亚洲熟妇在线| 亚洲色大成网站www永久| 最新国产黄色网站| 美女少妇黄片| 久久精品国产99精品国偷| 国产精品热门Jizz| 国产精品视频亚洲无码| 国产免费观看黄AV片明星| 无码少妇精品一区二区三区| 被暴力强行玩弄到高潮视频| 国产成a人片在线观看视频下载 | 亚洲成熟女二三区| 超黄无码在线观看| 国产黑色丝袜在线脚交| 亚洲人成网站在线播放动漫| 国产AA黄色视频| 亚洲最大看欧美片网站地址| 久久黄色高清视频| 国产乱码精品一区二区| 免费A∨中文高清乱码专区软件| av天堂 手机在线| 日批无码视频| 被窝窝女人爽爽爽影院| 无码中文字幕DⅤD免费放| 日日日插插插| 亚洲午夜福利片在线| 本站提供a毛片毛片看免费| 欧美nu精品一区二区三区四区| 亚洲自慰无码区| 精品国产不卡二区| 久久夜色精品国产噜噜| 久久久久亚洲AV无码专| 好紧好湿好爽好硬视频| 99久久 免费看 国产一区| 国产精品原创视频| 国产在线观看18岁| 古代一级α片| 草莓酱JK自慰喷水白丝| 爱H亚洲视频免费| 综合伦情亚洲欧美| 97人妻碰碰碰久久久久| 精选国产日本韩国三级| 伊人刺激在线蕉| 无码AV在线一区二区| 久久是精品| 国产关晓彤AV在线播放| 朋友的丰满人妻hd| 2022av在线视频| 综合久久久久久综合久| 国产成人美女裸体片免费看| 无码人妻一区二区三区免费n鬼沢| 不卡无毒影院| 中文无码日韩欧毛| 一区二区午夜福利试看| 国产国产午夜精华| 亚洲无码激情视频在线观看| 在线免费一区| 日本第一页一浮力影院| 国产精品性爱网站| 91超碰青春尤物在线| 新番里H肉3D动漫| 精品日本久久久久久久久久| 97人妻碰免费视频| 国产午夜精品理论片在线| 亚洲se网| 狼友综合网| 3D动漫精品啪啪一区二区免费 | 性BBBB欧美| 中文字幕aⅴ第一页在线| 91久久精品无码一区二区| 亚洲色大成网站www男同| 久久99国产精品二区抖音| 伊人五月精品视频| 亚洲第一二区Av| 国产又色又爽又黄的视频在线 | aⅴ免费一区二区三区| 真人啪啪喷水高潮呻吟无遮挡 | av试看免费| 亚州欧洲日本无在线码免费| 国产大屁股视频免费区| 中文乱码一区| 又大又硬又粗又爽又黄视频| 337P粉嫩日本欧洲精品| 国产视频3| 中国AAAA一级淫片| 亚洲av五月天| 中国高清在线看尤物| 久久精品一区二区三区| 国产色A在线观看| 加勒比在线无码一区| 韩国精品大片免费观看| 中国人体一区二区| 欧美熟妇色xxxx欧美老妇多毛在线观看视频| 亚洲熟女乱色一区二区三区丝袜| 人人做人人爽人人爱| 国产JJZZ| 亚洲AV秘 一区二区三区| assbbwbbwbbwbbwbw精品| 无遮挡外国黄片在线免费播放| 国产成人精品无码区| AV 无码 高潮 在线网站| 丰满老师喷水| 无码一区二区三区| 国产伦子一区二区三区| 成年女人喷潮视频免费观看| 久久久影院| 成片免费观看视频在线| 无码熟妇人妻AV在线影片真实| 在线视频一区二区| 成年视频xxxxx在线网| 白丝裤袜校服露自慰喷水网站| 国产精品又黄又爽又色无遮挡网站 | 日本熟妇肥臀在线| 永久免费aⅴ无码网站在线观看| 免费A∨中文高清乱码专区软件| 午夜男女刺激爽爽影院| 色婷婷综合久久久中文字幕| 97人人模人人爽人人喊0| 啊啊啊嗯啊好大嗯啊好爽| 光棍影院亚洲福利| 麻豆中文字幕av| 中文字幕在线无码不卡视频| 在线h观看| 动漫精品一区二区3d在线观看| 2022av网页在线观看| 一二三区免费视频| 女人张开腿让男人桶个爽| 国产aⅴ一区最新精品| 大胸美女吃奶被爽死的视频| 2022av在线视频| 亚洲女同性同志熟女| 97夜夜澡人人爽人人喊A| 国产成人美女AV| 农村少妇野外一级毛片在线| 亚洲精品电影网在线观看| 亚洲人成网站www| baoyutv777尤物18禁| av天堂手机在线网站| 亚洲国产精品高清久久久| 草莓视频在线免费观看| 国产性生活久久| AV无码免费永久网站| 人妻少妇被猛烈进入中文字幕| 午夜国产一区二区三区| 国产关晓彤AV在线播放| 黑森林尤物精品∧v导航 | 亚洲免费色色天堂| 50老熟女导航| 亚洲依依成综合网| 刺激黄片在线免费观看| 国产偷窥熟女精品视频| 国产精品麻豆一区二区三区v视界 国产精品久久精品福利网站 | 青青国产精品| 丁字裤摩擦到高潮视频白丝| 天天爱天天做天天爽2021| 久久久999国产精品| 亚洲αv毛片| 丰满**美女一级毛片| 国产xxxxx在线观看免费| 丁字裤摩擦到高潮欧美极品| 本站提供a毛片毛片看免费| 91人前露出精品国产| 五十路少妇xxxx| 国产精品中文原创AV麻豆| 亚洲精品揄拍自拍首页一| 婷婷俺也去俺也去官网| 亚洲精品美女久久久久久久| 国产精品久久久久精品A级| 久久不良视频| 欧美人与物videos另类| 国产黑色丝袜视频在线看网红| 特级黄片精品| 大胆超碰在线观看| 亚洲日韩国产欧美一区二区三区| 久草www| 国产在线视频不| 老熟女啪网| 亚洲第一在线视频| 99久久婷婷国产综合精品| 成熟女人牲交片20分钟| 国产微拍精品一区| 精品明星系列无码专区| mm1313亚洲精品国产| YY11111妇女影院| 国产国语脏话对白免费视频| 亚洲AⅤ樱花无码| 亚洲精品呦女| 亚洲性爱无码av| 国产校花处被破的视频| 中文字幕第一页在线视频观看| 无码毛片网址| 被男人吃奶很爽的视频| 日本中文字幕亚洲乱码 | 中文字幕亚洲综合色| 最新亚洲AV日韩AV一区二区三 | 国产日韩久久久精品| 好大好爽456在线观看| 在线观看欧美一级爆乳| 人禽无码视频在线观看| 激情综合婷婷丁香五月尤物| 久久成人影院精品777| 一个人免费视频www在线观看| 国产精品美女被遭强扒开双腿| 中国破外女出血毛片免费| gogowww人体大胆裸体视频| 国产高清视频在线| 欧美换爱乱理伦1000部电影| 国产在线观看XXXXX| 2019久久久精品| 中文字幕无码精品三级在线电影 | 亚洲无码3丨| A级完在线看完整版| 女被男啪到哭视频免费观看| 久久国产精品亚洲一区二区| 亚洲人成精品久久久久| 无码窝在线看18| 国产免费无码视频在线中出美儿| 成人免费视频一区二区三区| 色999欧美日韩| ZZIJZZIJ亚洲日本少妇J| 久久精品国产精品亚洲毛片 | 婷婷开心色四房播播久久一本人| 2019最新国产不卡a国内2018| 水蜜桃国产精品欧美日韩一区不卡| 2021av在线高清| 国产精品视频一区二区三区无码| 边做奶子边喷视频在线观看| 欧洲免费无线码在线观看土| 久久免费99精品久久久久久| 亚洲成av不卡| 亚洲中文字幕无码重口变态| 亚洲日本中文字幕无| 中文字幕日韩欧美一区二区三区| 日本韩国中文在线字慕| 99久久久无码国产精品性| 成熟女人牲交片免费观看视频| 不戴套插女人视频在线观看动漫版 | 一本不卡视频在线久| 国产伦精品一区二区三区高清| 97性无码区免费| 澳门av无码网站入口| 第一福利导航视频| а√天堂网www午夜在线亚洲| 国产口爆吞精在线视频| 无码熟妇人妻AV在线影片免费| 制服丝袜人妻系列无码| 亚洲 欧美 中文 日韩aⅴ| 亚洲色先锋影音| 国产午夜福利红片| 中文字幕人妻第一区| 亚洲大尺度无码无码专区| 嗯啊无码视频在线观看免费| 开心五月综合激情综合五月| 好紧我太爽了视频免费国产| 久久久亚洲欧洲日产国码二区| 波多野结衣av高清中文无码| 亚洲欧洲日产国码无码av专区| 成年在线观看| 成人永久免费高清视频在线观看 | 无遮挡在线观看视频国产欧洲| 被窝亚洲| 亚洲国产99精品国自产拍| 91超碰在线观看| 2022AV网站在线播放| 久久99久久99精品免观看| 亚洲欧洲视频一二三区| 亚洲国产成人AV网站| 麻豆91久久婷婷五月| 老司机精品视频在线观看6| 国产又长又粗达到性高潮的视频| 日本野外强奷在线播放VA | 91亚洲国产日韩在线人成| 好硬好大好热好爽视频| 国产精品久久久久AAAA| 国产农村妇女野外牲交视频| 一本大道精品视频在线| 丁香婷婷激情亚洲| 最新国产午夜福利| 亚洲人成无码网站www| 草婷综合激情| 国产大全小草影院视频免费播放下载| 伊人狠狠色丁香婷婷综合动态图| 日韩手机免费看黄片| 国产女人高潮叫床视频| yy1111111少妇影院看| 狠狠久久综合| 刺激无遮挡av| 黑人巨大 在线视频| 高潮视频在线快速观看国家快速| 欧美高清亚洲欧美一区h| 18禁h片免费网站| 国产精品一二三四区免费入口| 亚洲高清精品50路| 丰满熟女高潮毛茸茸欧洲| 男人无码视频在线观看| 免费av一区二区三区在线| 国产高清自偷自在线观看| 国产亚洲人成网站在线观看不卡| 91大神视频在线播放| 主播视频高清无码在线观看| 国产推油288会所在线播放| 久久白白色综合| 亚洲综合自偷自拍另类| 精品久久久久久久无码人妻热| 一本久道综合在线无码人妻| 一级淫片在线观看| 午夜视频在线观看| 亚洲综合色婷婷在线观看| 妓女网 网站| 国产女人高潮抽搐喷水嗷嗷叫| 自拍偷区亚洲综合照片| 亚洲国产精品99久久无色无码 | 国色天香在线观看免费完整版| 亚洲综合色丁香婷婷六月图片| 妓女一区二区三区| 波多野结衣区三区| 99热这里只有精品6国产免费 | 欧美熟妇自慰| 琪琪777午夜理论片在线观看播放 国产清纯白嫩大学生正在播放 | 2012中文字幕一页视频| 丝袜精品 欧美 亚洲 自拍| 国产日韩精品欧美一区喷水| 韩日无码不卡| 日本里番acg★里番免费| 亚洲国产美国国产综合一区| 大又大粗又爽又黄少妇毛片带字| 动漫美女丝袜高潮白浆| 日韩 精品 综合 丝袜 制服| 国产精品无码无需播放器| 免费欧美A级黄片刺激| 在线 性爱 公司| 又爽又大又紧的免费视频| 人妻无码久久久久久久久久久| 天天天天做夜夜夜夜做无码| 乌克兰9一14处XXXXX| 天天摸天天添天天爱| 直接在网站上看黄色视频的网站| 水滴真实偷拍高潮视频| 17女下面流水不遮视频| 久久人妻av中文字幕| 国模无码视频| 777米奇网站| 337P粉嫩日本欧洲精品| jizz无码视频| 成人AV大片免费看的网站| 老司机深夜性爱一区二区三区| 精品免费人伦一区二区三区蜜桃| 中文字幕免费无码专区一区| 午夜影院啊啊免费| 国产在线大陆aV| 在线观看欧美一级爆乳| A∨中字片在线观看| 波多野结衣一区二区三区在线观看| 久久国内免费视频| 东京热 精品| 在线a亚洲老鸭窝天堂| 亚洲国产AⅤ久久综合| 免费播放婬乱男女婬视频国产| 丁香九月激情综合| 美女网站视频免美女久久| 亚洲女人的天堂在线观看| 国产AV妓女影院| 在线www观看视频| 国产AV巨作原创无码| 黑人毛片视频网站| 2020国产精品熟女天天更新| 看黄免费视频h| 亚洲少妇人妻无码视频| 国产亚洲嫩草研究院久久| 夜夜香夜夜摸夜夜添视频| 中文字幕在线亚洲精品| 人妻系列无码专区无码中出| 日本动漫十八禁黄无遮挡吸乳| 久久久精品视频| 亚洲加勒比高清无码在线观看| youwu视频网站在线播放| 在线观看国产丝袜控网站| 97超碰青草国产| 俄罗斯女女13破苞视频| 8x永久华人成年免费| AV免费在线区| 韩国无码无遮挡在线观看| 呦泑女视频网站| 日韩精品电影一区亚洲高清| 国产精品久久久久久无码五月| 最近更新中文字幕第1_| 日韩欧美国产精品第一页不卡| 久久精品专区免费东京热| 男男无遮挡H肉真人在线观看| 第一页在线播放| 泰国无码在线观看网址| 国产极品粉嫩| 2018年高清精品国产三级A∨在线 中文无码丫丫私人影院视频 | 亚洲熟女网站| 久久乐国产精品| 国产激情一区二区三区小说| 黄 色 成 年 人 网 站免费| 澳门永久免费AV无码入口| 精品久久午夜福利| 亚洲免费精品aⅴ国产| 亚洲一区二区三区中文字幕无码| 亚洲欧美日韩国产YW一区| 欧美孕妇xxxx做受欧美88| 精品无码久久久九九九AV| 久久精品成人免费观看三| 亚洲天堂一区二区三区四区| 加勒比东热激情无码专区| 小p孩和成年女人啪啪| 女人潮抽搐动态图gif后λ式| 一级无码国产精品毛片| 人妻丰满熟妇VS无码区| 精品麻豆AV影院| 亚洲AV无码久久精品狠狠爱浪潮| 亚洲无码夜夜操| 久久精品中文字幕一区| 热re99久久精品国产66热6| 高潮毛片免费观看| 久久精品国产亚洲尢物| 无码 免费 国产在线观看91| 水蜜桃成视频人在线看| 影音先锋日韩在线高清AV资源| 一级毛片在线播放| 24小时在线播放免费直播高清 | 欧洲亚洲视频免费| fc2个人撮影在线播放| 海量AV不卡高清| 加勒比av人妻无码中文字幕| wwwx爽死了视频国产| 国产精品一级毛片久久久| 超碰少妇人妻| 亚洲大成色www永久| 午夜AⅤ在线观看免费完整| 人妻东京热| 国产小屁孩草大人| 密臀av在线播放| 无码少妇一区二区浪潮av| 国产山东48熟女嗷嗷叫白浆| 99国产精品久久99久久久| 白丝制服开裆粉嫩自慰| AV在线嫩模| 人妻熟妇无码在线| A∨天堂永久资源网| 玖玖资源站亚洲最大的网站| 18禁喷水白浆高潮| 日本女优天堂mv网站| 国产精品白丝喷水| 国产欧美另类久久久精品91| 久久少妇免费精品| 2022最新国产高清不卡无码视频| 中文在线亚洲在| 他狠狠的操我免费视频| av免费一区二区三区最新| 亚洲AⅤ天堂宅男| 又黄又紧又爽视频| 国产亚洲AV片在线观看播放| 国产午夜不卡一级二级| 最新国产乳头打孔视频欧美| 孕妇怀孕高潮喷视频| 91精品欧美产品免费观看| 二区三区高H| 最最新av在线| 2021A片免费在线观看| 免费一区二区视频| JAPAN极品邻居人妻VIDE... | 国产大屁股熟女视频免费看| 特级女人毛片| 无遮挡免费AV| 自慰喷水免费看| 亚洲av无码不卡一区二区三区| 亚洲天堂一区| 国产精品日本亚洲77| 一级无码奶水| 欧美les视频XXXX在线观看| 中文字幕久无码免费久久| 久久一色本道亚洲| 十八禁网站在线国产| 18禁黄无遮挡网站免费| 国产精品香蕉自产拍在线观看| 亚洲福利无码av四季| 99久久狠狠综合| AV毛片网| AV淘宝国产首页在线观看| 国产高潮流白浆免费视频| 少妇爆乳无码专区网| 伊人久久青青视频五月天激情| 69国产高清无码视频| 国产三区欧美日韩| 亚洲熟妇无码AV在线播放| 另类 专区 综合 中文| 午夜成年人网站| 另类av| 精品国产精品一区二区| 亚洲av永久永久在线私人影院| 在线视频色www| 无码毛片一区二区三区视频免费播放| 996热精品视频在线观看| av大片在线无码永久免费网址| 嘿咻视频欧美| 久久亚洲AⅤ成人精品无码| 成在人线av无码免费高潮水老板| 日本中文字幕精品一区二区三区 | 99精品高清视频一区二区| 成人国产一区| 极品午夜福利视频| wwwasss免费视频| 一本二本三本无码| 国产ts高潮痉挛| 一进一出高清无码视频| 国产午夜福利在线观看红色一片| 着衣爆乳揉みま痴汉中文字幕| 男人j进入女人j内部免费网站| 中文字幕人妻丝袜2页| 在线观看韩国AV高清| 丰满少妇被猛烈进入无码| 亚洲国产成人AⅤ片| 少妇无码21p| 色妞网| jk白丝超短裙自慰喷白浆| 亚洲国产精品久久电影欧美| 亚洲精品99久久久久中文字幕| 你懂的在线视频网站观看| 日韩精品成人亚洲专区在线电影| 国产福利免费高清在线| 密臀av在线播放| 国产女同高潮在线观看| 日韩中文字幕在线视频| 精品动漫第一页在线观看| 中文字幕乱码一区二区三区免费| 伊人久久天堂| 91大神在线观看蜜芽尤物| 成人国产精品一区二区免费看| 性爱综合网狠狠| 久久aⅴ不卡网站| 日本在线sm虐视频网站| av在线中| 双腿打开放在刑架受辱女视频| 欧美人与动牲交zooz| 久久SE精品一区二区| 无码av中文一区二区三区| 丝袜香蕉首页| 美女裸体未18禁网站| 台湾AV国片精品女同性| 日本人妻vs黑人嗷嗷叫视频 | 欧美日韩在线观看国产一区| 国产成人无码免费| 永久在线观看免费视频| 精品少妇人妻av无码久久| 香蕉AV一区二区| 日本工口里番h彩色无遮挡全彩| 国产在线打屁股调教网站| 十八禁动漫av免费网站| 久久性爱视频| 精品无码一区二区三区水蜜桃| 在线播放国产女同闺蜜| 粉嫩虎白女流水自慰洗澡| mm1313亚洲精品国产| 永久免费观看的黄网站| 亚洲欧洲中文日韩乱码AV| 色窝窝av| 影音先锋熟女少妇资源网| 教室啪啪高挑长腿正在播放| 成本人片在线观看视频| 国产精品一区二区含羞草| 视频区国产亚洲欧美| 国产成人裸体在线高清免费直播| AV在线网页大全| 又粗又大好爽要死了动图| ww视频在线观看免费播放| 日韩无码尤物视频| 久碰香蕉线视频在线观看视频| 尤物禁番动漫视频在线观看| 中文线码中文高清播放中| 中国XXXX性自由视频| 在线视频一区二区| 成人三级视频在线观看不卡 | 性生大片免费观看网站yy| 思思久思思| 国产a∨在在免费观看| 无码国产福利av私拍| www2222国产青草| 欧美成人在线视频| 最新成a人免费视频在线观看 | 亚洲国产精品张柏芝| 亚洲日韩图片专区小说专区| AV一天堂色| 99久久久无码国产精品性| 午夜精品同性女女| 边吃奶边摸下面很爽视频| 午夜三级a三级三点在线观看| 人妻 色综合网站| 久久久久精品黑人与日本人| 天堂网av在线| 自拍自偷第三页| 亚洲中文字幕无码mv| 欧美综合在线视频| 国产精品永久视频免费| 黄频视频大全免费的国产| 又黄又大又硬好爽好疼好深视频 | 少妇性饥渴XXⅩXXHD| 免费观看一级女人自慰| 国产久热这里只有精品视频 | 波多野无码AV中文专区| 又大又粗好爽视频| 久久久久久国产福利网站| 国产美女AV中文一道本| 18成熟女人牲交片视频| 国产农村aa一级性生活大片| 亚洲无码免费一区二区三区| 少妇精品有码视频在线| 国产嘘嘘在线播放| 精品无码久久久久久久久成人| 2019中文字字幕国产100页| 亚洲中文久久精品无码| 老太脱裤子让老头玩xxxxx| 中国一级特黄真人毛片| 成人午夜看黄在线尤物成人| 国产成人精品久久免费| 午夜青草欧美图片| 国产性爱影院| 亚洲AV无码专区亚洲猫咪| 亚洲婷婷九月| 亚洲同性男男gv无码在线网站| 美女午夜福利在线观看| av在线免费久| baoyu免费观看国产无卡| 熟女av五十路俱乐部网站| 九九福利电影| 国产免费AV电影在线第一页| 亚洲人成精品久久久久| 亚洲日本中文字幕乱码在线电影| 波多野结衣av东京热无码专区| 国产日韩欧美在线精品| 下载哪些视频可以看视频吃胸的视频| 国产精品爱啪在线线免费观看| 床震未满十八禁止观看视频| 天天摸夜夜添狠狠添高潮出免费 | 久久精品国产亚洲| 最新偷窥福利720视频| 传媒在线无码| 亚洲国产美女精品久久久久 | 色888视频在线观看| 最新国产狂喷潮在线观看中文| 亚洲无码视频看| 啊啊啊啊啊喷了高潮了疼视频在线观看| 一区二区三区亚洲视频| 色一情乱一伦| 国产女主播娇喘呻吟在线播放| 国产精品igao 视频| 国内精品久久久网| 日日操夜夜添| 国产韩国精品一区二区三区| 日韩中文无码av超清| XXXX中国在线观看免费| 性夜影院爽黄e爽在线| 亚洲91综合在线| 波多野结衣办公精品亚洲| 午夜影院无码视频| 69久久免费| 制服肉丝袜中文字幕| 久久久免费观看视频| 69久久天堂精品| 亚洲精品无码AV在线播放| 嗯…啊 摸 湿 内裤 动视频| 亚洲av永久无码精品放毛片| 久久久久精品免费观看| 在线 中文 天堂| 波多野结衣无码中文字幕| 美女的胸又黄又www网站| 黄色视频一区| 国内国外精品一区二区| XXXXXBBBBB性受| 一本大道东京热无码不卡Av毛片| 久久亚洲2019中文字幕| 国产福利第一导航| 国产一级片大全免费在线播放| 中文字幕丝袜第1页| 俺也去免费公开视频| a在线观看福利| 国产无遮挡又爽又刺激视频| 免费不卡人妻无码中出| 99精品国产在热久久| 女高中生自慰免费观看www| 国产女主播一区二区二| 久久超级碰碰免费视频| а∨天堂在线中文免费不卡 | 亚洲人妻无码一区二区三区| 国内高清久久久久久| 亚洲免费av电影一区二区三区| 夜夜爽免费视频观看| 国产饥渴孕妇在线播放| 成年女人毛片免费视频喷潮| 成年视频XXXXX在线app| 最新加勒比隔壁人妻| 亚洲欧美在线综合色影视| aⅴ淘宝国产在线播放| 宅男无码专区无码| 久久国产精品第一页| 曰的好深好爽免费视频| 精品久久久久久无码人妻| 视频精品在线| 69堂人成无码免费视频| 国产一区二区三区丶四区| 把JK制服美女高潮视频| 加勒比 AV 人妻| 亚洲人成电影在线天堂色在线观看 | 亚洲精品国产精品乱码不卡√| 无码av一区二区三区无码| 国产丝袜精品网站色| 亚洲免费理论| 91久久久久精品无码一区二区| 超级香蕉97视频在线观看| 无遮挡免费H视频| 在线看你懂的亚洲| 丰满少妇一区二区三区| 国产性爱群交中文版视频在线观看| 国产免费AV片在线无码免费看| 亚洲男人的天堂2022| 欧美亚洲色欲色一欲www软件| 最新国产美女口暴深喉| 99综合久久综合| 重口另类网站av| 熟女无套高潮内谢吼叫| 新激情五月天| 中文无码久久精品| 久久亚洲影院香蕉| 国产精品欧美一二三区四区| 色偷拍 自怕 亚洲 10p| 国产主播粉嫩白浆到高潮| 国产色系视频在线观看| 中文成人无码精品久久久| 爽极品色极品影院在线| 一个人看的免费高清www视频在线观看国产| 中文字幕一区二区人妻出轨| 喷潮视频| 中年熟妇久久| 欧美成人你懂的| 国产精品视频欧美激情专区| 东京热无码国产精品| 日本精品久久久久中文字幕2| 久久综合97丁香色香蕉| av尤物免费在线观看| 无码天天喷水天天爽| 美女AV网址| 亚洲欧洲国无码| 2019中文字幕在线视频| 日本成a人片在线播放| 国内人妻熟妇射| 国产厕所精品| jiZZ日本护士视在线观看| 人妻盗撮中文字幕| 97人妻人人做人碰人人爽| BBBBBXXXXX欧美| 国产精品午夜爆乳美女视频| 久久久久久精品免费无码无| ww国产AV,com| 国产国产成年年人免费| 韩国久久av| 久夜人成网站免费看| 精品福利私拍| 东京热国产精品无码专区免费| 中国一级特黄刺激刺激爽| 国产2018大屁股福利| h无码成年动漫在线观看不卡| 国产精品cosplay在线观看| 国产又粗又大在线观看 | 欧美日韩一区二区三区视频在线| 国产午夜精品百合| 2022国产高清无码免费在线观看a| 中文字幕aⅴ一区,二区| 综合五月激情69堂| 人妻少妇精品视中文字幕国语| 色综合久久88中文字幕| 欧美性开放bbxxx| 白丝袜内自慰喷水| 精品欧美一区二区3d动漫| 又大又长粗又爽又黄少妇毛片| 色AV福利| 国产综合色产在线精品| 中国护士一级毛片片| 被公牛日到了高潮| 91普通话国产对白在线| 亚洲男男同人啪啪拍网站| 亚洲熟女WWW一区二区三区| 国产精品久久自在自线不| 手机播放av网站| 丰满人妻口爆吞精在线| 国产又粗又大又硬免费视频| 亚洲精品污| 黄色网站无毒不卡| 亚洲国产精品激情在线观看| 国产欧美va天堂在线观看视频| 2022Av天堂在线无码| 国产一二三在线成人| 日日夜夜爽| 一区二区免费视频| 超碰97人人免费| 深夜在线视频观看免费视频禁18| 99热这里只有精品最新地址获取| 亚洲av 国| 国产尤物视频在线观看| 色AV永久地址| 久久99国产这有精品| 亚洲一级精品毛片| 人人澡人人添人人捏| 白浆高潮抽搐视频| 人妖一级毛片在线观看| 亚洲AV永久无码一区二区不卡| 亚 洲 成 人 网 站在线观看| 国产色秀视频在线播放| 3D无码Av禁| 久久久久久无码午夜精品| 欧美h久免费女| 香港经典a毛片免费观看变态| 最新日韩中文字幕免费在线观看| 国产迪丽热巴AV在线放免费| 亚洲人成网站77777在线观看| 69视频在线免费播放| 亚洲爆乳无码视频在线| 女生手淫网站在线观看| 伊人久久久艹| 色yeye香蕉凹凸视频在线观| 在线看一级无码毛片| 黑道暴力强奷在线播放| 自拍男人下插进入女人下部视频| 亚洲无码免费黄色网址| 中文字幕热久久久久久久| 国产出租屋洗澡在线观看| 亚洲国产精品日韩专区AV| 亚洲成av动漫| 亚洲ⅤA制服丝袜一区二区三区 | 久久精品国产亚洲片| 午夜激情福利网| baoyu777尤物视频| 人妻尝试又大又粗久久| 欧美巨大xxxx做受中文字幕| 深夜福利小视频国产| 2022男人在线资源| 亚州黄网站| 欧美人妻久久中文字幕一区二区| 在线观看日韩在线双飞| 2022在线视频一区| 成熟妇女自慰黄区免费看| 囯产精品无码成人久久久3p| 国内少妇自拍区视频免费九九| 成人国产一区二区精品| 日韩av无码av免费av不卡| 亚洲黄色亚洲网站在线浏览| 久久精品精品撒尿网| А√ 天堂资源| 艳妇的浪水呻吟| 久久久久久无码AV成人影院| 久久一本热色99国产| 久久精品国产中国久久| 久久99久久99精品免视看| 亚洲中文字幕无线无码| 日本一二三区视频| 90后极品粉嫩小泬20p| 26uuu欧美视频在线观看| 美女裸体18禁网站| 国产精品久久久久精品三级涩 | 亚洲日韩在线精品每日更新| 污黄污十八禁| 影音先锋综合网资源站| 国产午夜无码片在线观看| 亚洲女人国产香蕉久久精品| 欧美国产日韩久久mv| 亚洲色,天堂网。| 大尺度av无码污污污福利网站| 精品国产青草久久久久福利 | 波多野VA无码中文字幕电影| 97精品人妻系列无码人妻| h视频免费看在线h| 在车里疯狂的吃我奶| 18禁美女裸体爆胸网站| 97人妻起碰免费公开| 久久国产经典视频| AV春色天堂| 在线午夜免费网址| 黑色丝袜无码中中文字幕| 欧美日韩亚洲综合一区二区三区 | 国产精品Ⅴ无码大片在线看 | 2022无码在线免费视频| 国产午夜亚洲精品不卡| 杨幂国产福利在线观看免费| 澳门久久精品欧美| 亚洲日韩欧美另类sm| julia无码中文字在线播放| 精品无码日韩国产不卡aⅴ| 国内精品久久久久久久电影视| 国产偷窥熟女高潮| 亚洲成av人片在线观高清| 韩国日本三级在线观看| 骚女人在线视频网址| 最污丝袜美女在线观看| 黑人又大又爽个够免费视频| japanese老熟妇乱子伦视频中文免费在线观看| 青草国产精品久久久久久| 国产小仙女一区二区| 国产欧美另类精品久久久| 西西人体大胆4444WWW| 日韩加勒比av手机在线| 国产精品久久久久久久齐齐| 天天摸天天爱天天大爽| 又黑又粗免费看一级视频| 一级特黄aa大片国产| 男女啪啪真实无遮挡免费| 老司机午夜福利av无码特黄a| 久久精品国产精品亚洲精品| 经典国产乱子伦精品| AV香港经典三级级在线观看| 91性尤物| 厕所偷窥自拍无码专区| 亚洲成a人片在线观看中| 国产免费AV在线线观看| 国产网红主播精品一区| 午夜在线免费观看A福利| 又黄又大又粗免费一级毛片| 校花自慰嗯啊喷水在线| 亚洲AV无码一区二a| 巨胸喷奶水视频色| 国产1区1区3区4区产品乱码不卡| 国产91线观看| 女人18毛片a级毛片| 成年美女啪啪拍网站下载| 成年人黄国产| 国产真实乱对白精彩| 国产精品免费视频网站| 岛国视频一区| 啦啦啦免费黄色视频| 一级毛片特黄视频免费观看| 精品久久久久久久久中文字幕 | 在线观看国产技师| 色天堂AV无码| 中文字幕午夜AV福利片| 一区二区不卡免费视频| 高清一区二区三区免费视频| 日本少妇爽妇网| 曰批全过程免费视频观看蜜芽| 黄色视频一区| 2021最新黄色网站在线看| 国产精品中文原创AV麻豆| 国产亚洲色内内电影网站| CHINESE青年大学生GAY| 中文字幕亚洲资源| y1111111少妇影院无码| 20女人成熟牲交片| 亚洲无码激情视频在线观看 | 99久久综合| 久久永久免费人妻精品下载| 特级Av毛片免费观看| 国产在线观看一区| 日本后进式动态在线视频| 三级特黄60分钟在线观看| xxxx在线做受视频| 狂野欧美精品AⅤ| 国产av天堂| 亚洲无码在线11p| 自拍亚洲欧美另类动漫| 中文字幕 H文| 性色AV网站在线观看| 3D动漫精品啪| 69 精品在线视频| 国产成人AⅤ| 亚洲不卡中文字幕无码| 精品无码美妇视频网站| 丁香婷婷激情综合激情| 亚洲免费流水| 免费人成视频x8x8入口AA| 97超频精品视频在线观看蜜芽| 亚洲欧洲日产国码小说| 无码Gv永久免费网站| A级黄毛片| 肥熟女视频一区二区三区国产| 又爽又黄又无遮掩的免费网站| 支持手机在线播放免费人成视频| xxxx国产激情视频| 亚洲国产V高清在线观看| 亚洲精品国产AⅤ综合第一页| 婷婷五月综合缴情在线视频| 亚洲国产成人久久精品app| 亚洲AV无码综合一区二区在线| 十八禁啪啦拍无遮拦视频| 调教済み変态jk扩张调教し| 国产美女福利网站视频爬爬爬| 国产色大成网站| wWW国产浪潮aV| 黑人又粗又长特黄一级AA毛片| 国产旡码高清一区二区三区| 欧美,日韩aⅴ| 极品少妇中文字幕| 99久视频一区视频二区视频上去| 亚洲毛茸茸bbxx| 在线观看亚洲AV日韩AV| 狠狠综合久久久久综合网浪潮| 爆乳放荡的女教师bd| 国产成人精品亚洲77美女| 99久久久无码国产精品免费手机| 久久人妻av中文字幕| 亚洲日韩欧美一区二区三区| 把少妇搞到高潮视频| 国产亚洲人成网站观看| 少妇太爽了在线观看免费视频| 多男一女一级伦奷片免费观看| 免费裸裸体大胸美女网站| 综合色图| 又大又粗又长又爽的少妇毛片| 国产精品一级18一级毛片| 亚洲欧美激情在线| 亚欧美无遮挡HD高清在线视频| 十八禁在线永久免费观看| 日韩欧美国产自由二区| 亚洲动漫国产制服丝袜| 国产亚洲精品岁国产精| 全彩漫画口工18禁无遮h| 好爽受不了了要高潮了av | 国产欧美尤物蜜芽在线| 亚洲熟妇AV午夜无码不卡| 九九福利电影| 精品国产最大调教网站| www胸美女网黄| 不戴套双飞女房客闺蜜 | 精品无码久久久久国产手机版| 99久久国产综合精品无码9| 午夜天堂中文字幕| 十八禁真人免费视频| 天堂网www在线最新版| 欧美成a人片在线观看网站| 18欧美乱大交| 99久久免费精品国产男女高 | 高潮无遮挡猛烈动态图国产片| 992a成v精品视频| 亚洲精品污| 疯狂做受XXXX免费| 亚洲A极无码毛片| 中文字幕第一页无码久久网| AV在线无码| 人妻少妇三级| 成年女人免费观看大片| 精品乱人伦| 国内精品视频一区二区| 丰满岳下面水好多| 野外少妇被弄到喷水在线观看| 性欧美乱妇come| 50妺妺窝人体色www图片| 亚洲日韩中文字幕在线播放| 久久综合九色综合欧美9v777| 又黑又长黑人欧美一级| 18禁黄无码免费网站高潮| 亚洲综合一区无码精品glf| 制服无码专区| 亚洲精品偷拍区偷拍无码| 二级毛片免费完版| caoporon国产超碰公开| 深夜福利日韩| 久久国产经典视频| 在线免费观看国产污污污视频| 极品视觉一区伊人| 亚洲校园丝袜欧美校园丝袜| 338q西西人体大胆瓣开下部| 亚洲视频国产| 免费很黄很色裸露视频| 制服丝袜中文字幕在线| yyyy11111少妇喷水影院| 被强的丰满人妻电影| 真实国产乱子伦对白视频不卡| 国产高清在线观看视频www| 亚洲av午夜福利网址| 91免费 无码 日韩| 日韩美女午夜高清一级视频| 日韩女优电影在线中文字幕| 西西顶级大胆免费视频| 97骚碰视频| 亚洲少妇久久| 桃色国产| 成年美女黄网站色大片免费看 | 久久国产精品高清一区二区三区 | 欧洲精品亚洲精品日韩专区| 成年黄色小视频网站| 嗯轻点在线观看免费网站| ViDeOS18娇小中国| 欧美freesix黑人又粗又大| 11女女色综合网| 中文字幕在线永久资源| 狠狠操一区| 久久国产三区| 性AV片在线| 亚洲老王AV综合在线观看| 日韩av无码一区二区三区不卡| 人妻丝袜av先锋影音先| 无码人妻丝袜| 97人妻无码一区| 久久久亚洲精品无码| 大胸美女午夜毛片一级45| 亚洲无码色性视频| 一二区毛片| 亚洲图片另类图片激情动图| yy111111少妇影院在线电影| 久久久久久久久高潮无码| 婷婷激情字目| 国产免国产免费| aⅴ视频| 国产人与zoxxxx另类| 久久久综合视频| 国产精品久久久| 2019天天拍拍天天爽视频| 羞羞的视频午夜福利网| 五月天在线视频亚洲| 国产无遮挡又黄又爽不要VIP的网站 | 国产精品蜜芽AV| 精品啪视频香蕉| 国产 成 人 亚洲欧洲| 亚洲最大网站无码| 一级有乳奶水毛片免费| 在线观看黄网站点击进入| 女性裸体啪啪白丝无遮挡免费| 黄色视频观看| 桶女人裸体夜夜爽快| swag蜜芽无码国产| 边啃奶头边躁狠狠躁免费视频| 一级女18水多毛片| 正在播放短裙丝袜美女自慰| 九七超碰| 不卡了AV无码| 亚洲最大无码AⅤ在线观看| CHINESE熟妇与小伙子MA| 欧美成人插女人视屏看看| 别揉我奶头~嗯~啊~免费网站| 东京热无码人妻一区二区AV| 一级毛片水真多女人| 91啪啪视频一区二区| AVav天堂网在线| 又大又黄网站| 影音先锋男人资源网无码| 亚洲伊人色欲综合网无码中文| 一区 无码 中出| 白丝尤物小仙女丝祙自慰喷水| 在线观看无码专区| 在线精品自偷自拍无码琪琪| 超碰大肚子熟女| 国产精品视频亚洲无码| 91超碰国产免费电影| 白丝超短裙jk自慰| 午夜色无码大片在线观看免费 | 么公的好大好硬好深好爽视频| 单身妇女乱子伦BBw讲述| 亚洲五码影院| 91极品尤物在线观看播放| 无遮挡的很黄很刺激的视频| 亚洲免费精品aⅴ国产| 黑人巨粗巨大巨长视频| 机机干在线视频播放精品| 又大又硬爽个够免费视频| 国产高潮在线观看| AV在线免费观看网站国产 | 高清不码二区三区| 成都4片p完整版视频久久精品| 18岁禁喷白浆| 99久久综合狠狠综合久久直播| 欧美3d怪物H动漫播放| 日本无吗无卡v免费清高清| 凹凸导航 午夜福利| 97夜夜澡人人双人人人喊| 久久国产亚洲精品美女| 免费喷乳视频| 国产一区二区自拍| 大肥屁股白浆一区二区| 精品久久白浆少妇| 色综合啪啪| 亚洲精品系列| 亚洲不卡无码高清视频| 国产呦系列视频网站在线观看| 亚洲第一AV网址| 亚洲成A人V欧美综合天堂麻豆| 吃奶摸下激烈床震GIF| 办公室秘书爆乳在线观看| av手机在线观看| 精品熟女少妇av免费久久| 亚洲色黄色播放操逼| 孕妇无码专区在线观看| 97se色综合一区二区二区| 2020午夜理论一级在线| 看片A免费观看视频| 2021水滴真实偷拍高潮视频,| 成年男女免费视频在线观看不卡| 99亚洲影院| 性xx×中国妇女国语版| 一级香蕉人体视频| 韩精品一区二区三区中文不卡| 精品视频2020在线视频| 国产大全香蕉精品在线网址| 97精品高清一区二区三区| 亚洲资源在线播放| 片永久免费看无码不卡| 国产又黄又爽又刺激的免费网址| 成年免费无码动漫AV片在线观看| 超碰caoporon已满18进入| 黄色网址手机国内免费在线观看 | 免费a级伦费影视在线观看| 亚洲国产精品久久久久久| 亚洲欧美日韩愉拍自拍美利坚| 夜色福利夜AV| 国产精品福利网址视频| 国产小视频在线观看免费| 狠狠躁天天躁夜夜躁婷婷| 日本三级片网站| 欧美综合国产精品久久丁香| 无码精品一区二区三区超碰| 亚洲孕妇无码视频免费播放| 伊人无码在线观看| 美女不遮不挡18禁裸体看尿口| 尤物视频无毒不卡| 最好看的2019中文字幕视频| 在线免费看国产污| 免费xvideoa在线视频入口| 杨幂Av一区二区三区| 亚洲国产日韩a在线播放| 国产新婚夫妻在线| 日韩在线视频一区二区三| 中文字幕亚洲综合久久2| 国产午夜亚洲精品国产成人最大| 最新国产成人在线| 亚洲无码500| 妓女影库妓女网在线视频| 四虎在线播放无码| 白浆大学生| 中文字幕在线中文乱码不卡24| 又爽又刺激的视频网站| 色呦呦在线免费视屏| 欧美日韩一区二区综合| 国产美女尿口流白浆视频无遮挡| 精品一区二区三区视频在线观看免| 久久美女免费视频| 亚洲欧美又粗又长久久久| 18禁www网站| www.91超碰| 秋霞在线观看无码av片| 深田咏美一区二区三区AV高清| 做床爱无遮挡免费视频在线观看| 久久电影国产亚洲欧美精品| 夜夜天天噜狠狠爱2019| 有码高清中文字幕| 欧美性爱国产| 日韩中文字幕不卡网站| 18禁美女裸体无遮挡的网站| 性按摩xxxx在线观看| 午夜一级AV大片| 国产二区不卡自拍| 18出禁止看的免费污视频| 中国老妇女毛茸茸bbwbabes| 国产欧美亚洲精品第三页| 三级同性短视频在线观看| 疯狂做受xxxx国产| 女性自慰网站免费看ww| 在线中文无码av每天更新一区二区| 欧美成人AⅤ视频| 国产性色αv视频免费| 国产美女视频cao| 国产思思99re99在线观看| 波多野结衣一二区在线观看| 可以直接免费观看Av你董| 亚洲永久无码7777kkk| MM1313亚洲国产精品无码试| 超碰在线怎么不能看了| 中文字幕无码专区人妻系列| 16处破外女出血视频在线观看| yw193尤物高清在线| 久热香蕉在线视频| 亚洲h精品动漫在线观看| 午夜视频免费入口| 九九99九九99国产熟女视频| 亚洲色欲综合天堂亚洲| 小屁孩与成年女人啪啪动漫| 无遮挡很爽很黄的网站| XXXX高潮国产| AV色国产色拍| 嘿咻嘿咻免费区在线观看不卡| 久久久久久精品免费视频| 女女在线观看一区| 白丝JK美女被操的出水呻吟死在线看 | 国产成人亚洲综合无码品善网| 亚洲高清无码一区二区在线观看下载| 一级黄色网站在线免费看| 激情丁香色婷婷中文| 大胆中国少妇毛茸茸| 我与么公激情性完整视频| ⅤA在线中文字幕| 日韩专区在线| 欧美成a网| 国产精品第一区揄拍无码| 超频97在线人妻免费视频| GV片在线看午夜福利| 成人Α片免费视频在线观看| 漂亮少妇按摩被中出中文字幕| 黑丝袜在线观看| 又大又粗毛片| 18女人精品毛片| 女高中生自慰免费观看| 理论片福利片在线观看欧美| 性啪体验区免费观看色哟哟| 国产精品换脸国产Av| 国产午夜精品一区二区不卡 | 黄色网站入口在线看| 亚洲杨幂中文字幕| 亚洲最大激情中文字幕| 国产亚洲日韩在线一区二区三区| 亚洲欧美乱综合图片区小说区| 亚洲少妇人妻无码视频| av免费网站在线观看| 护士白浆免费视频| 亚洲欧美一区三上悠亚| 熟女性高潮视频网站| 中文一级国产特级毛片视频| 免费人妻不卡中文字幕| 荷兰小妓女高潮bbw| 国产2018大屁股福利| 波多野结衣电影一区二区| 又黄又潮娇喘的免费视频| 久久99国产精品一区| 亚洲视頻4438| 大香煮蕉中文无码视频| 两性又黄又免费的网站午夜| 亚洲精品嫩草研究院| 很黄,很污的殴美视频| 中文字幕久久青青| 亚洲重口啪啪一区| 麻豆av无码精品一区二区| 成在线人永久免费视频播放品赏网| 欧美胖老妇老专区| 精品久久99| 99精品国产免费久久| 制服丝袜 国产 无码| baoyutv777尤物18禁| 在线视频婷婷69堂| 女女百合在线网站| 99久久一香蕉国产线看观看| 亚洲国产初高中生女av| 无码在线观看AAA| 久久精品国产亚洲天堂| 手机AV片在线| 嗯啊午夜福利| 亚洲丝袜在线观看| 亚洲精品一级片a| 国自精品37页视频| 95久久综合狠狠综合久久| 亚洲另类激情综合偷自拍图片| 国产精品无码AV无码囯产| lusipian无码| 免费自慰专用网站| JapaneseXXXX乱子另类| 另类老熟女hd| 中国一级毛片免费看| 18禁动漫美女下身湿| 亚洲中文无码亚洲人网站的| 啊灬啊灬用力…啊快视频| 日韩视频 中文字幕 视频一区 | 91超碰青草福利久久| 妓女影院一区二区三区| 99精品视频60欧美| 亚洲高清国产拍精品闺蜜合租| 亚洲欧美综合图区官网| 亚洲性无码AⅤ在线| 九九九色视频在线观看wwwwww| 波多野结衣三级在线| 一级香蕉人体视频| 精品国产亚洲av麻豆| 亚洲精品无码乱码成人| 中国一级少妇免费毛片| AV 丝袜天堂网| 图片区小说区激情区偷拍区| 黄频动漫在线观看十八禁| AVtt天堂网无码手机版| 综合久久综合久久2021| 欧美亚洲另类色多多视频| 九九视频在线观看精品66| 国产高清免费无码不卡视频| 精品无码一区二区三区av| 性夜影院爽黄e爽在线| 美女胸又www又黄的网站免费 | 18禁美女黄网| 亚洲人欧洲国产综合| 春宵福利导航91| 99re热视频精品首页| 在线看片av h| 国产性色AV免费在线观看| 亚洲Av有码| 福利私拍国产写真| 国产丰满老熟女重口对白| 美女黄片一区| AV手机在线地址| 黑森林精品导航在线看| 国产真人无遮挡免费视频| 欧洲无码毛片免费在线观看| 丰满少妇高潮惨叫正在播放| 手机在线观看Av网| 久久99国产一区二区三区| 777无码视频天天拍夜夜躁| 亚洲饱惰视频| 亚洲宅男精品一区在线观看| 黄视频免费在线观看| 亚洲av动漫av无码天堂网| 天天躁日日躁狠狠躁| 777米奇影院狠狠爱| 国产女做a精品免费视频| 国产精品无码一二区不卡免费| 百合av一区二区三区| 亚洲欧美不卡高清在线观看| 麻豆五月婷婷| 久久综合社区| 少妇人妻无码首页| 呦男呦女八区| 巨大巨粗巨长 黑人长吊| 久久久久久中文字幕有精品| 无码又色的视频| 亚洲欧美综合另类自拍| 亚洲日韩日本欧美精品网| 人妻仑乱A级毛片免费看| 性无码| 你懂的在线观看网站| 护士毛茸茸的性| 91超碰在线精品| 免费永久观看美女裸体网动漫| 岳的又大又紧水又多| 五月丁香婷婷综合激情| 国产精品久久久久7777按摩| 亚洲精品国产成人AV| 中文字幕极速一区二区| 国产翘臀后进| 久久精品国产亚洲高清| 免费av在线| 国产欧美另类精品久久久| 国内少妇自拍区视频免费九九| 777米奇视頻| 日日摸夜夜歪歪| 伊 在线 色| 一区二区三区免费观看| 97久久超碰国产亚洲人最新| 尤物在线观看不卡| 波多野结衣AV一区二区三区| 亚洲春色在线观看| 亚洲成av人片动漫网| 92精品国产自产在线观看4| 高潮在线喷| 精品成在人线av无码免费看| 无码av一区| 处破女视频免费观看亚洲| 亚洲色欧美在线影院| 久久亚洲AV无码ⅤS国产AV| 无码少妇一级AV| 污黄污十八禁| 668看片网尤物视频| 亚洲成av人片天堂网九九| 国产性AV观看| 国产黑色丝袜在线看网红| 国内外无码视频| 18禁美女裸体爆胸网站| 4438xx亚洲最大五色丁香| 曰本女人真人性高朝床叫视频| 又大又粗的免费黄色视频| 丁香五月缴情在线中文视频| 熟女少妇综合网| 亚洲色婷婷六月亚洲婷婷6月| 2020国产成人最新视频不卡| 我把护士日出水了视频90分钟 | 亚洲精品午夜无码专区| A∨天堂2020Av天堂| 国产精品亚洲一区二区三区在线播放| 32cao超碰com草棚| 精品国产SM最大网站蜜芽| 中出视频中文字幕| 久久综合社区| 免费操逼视频| 太深了太大了太粗了免费视频| 久久亚洲AV成人无码一二三区| 欧美大尺度又长又粗真做禁片| 亚洲五月综合激情在线观看 | 国产爽的冒白浆的视频| 大波妺AV影视| 欧美成人a视频免费专区| 国产美女一级特黄毛片| 操B小视频国产| 国产无遮挡裸体免费视频网站| 人妻丰满熟妇αⅴ无码区| 2020国产欧洲精品网站| 亚洲超清精品AV在线| 一本大道东京热无码不卡Av毛片| 两个人免费完整在线观看直播| 精品久久久国产中文字幕| 久久强奷乱码老熟女网站| 国产精品国产三级国产av′| 香港aa三级久久三级| 亚洲欧美日韩国产综合高清| 无遮挡外国黄片在线免费播放 | 永久免费观看美女赤裸的网站| 很嫩很紧直喷白浆在线| 性无码国产一区在线观看| 久久R级免费视频| 丁香婷婷色五月激情综合深爱| 国产精品无码VA日韩欧| 亚洲中文字幕av无码区| 国产精品一区二区国产主播| 亚洲成av人片在线观看无| 黄色网站在线看已满18岁。| 777狠狠| 国产成人刺激视频在线观看| 在线播放人妻资源| 全部露出来毛走秀福利视频| 九九热视频这里只有精品| 日本熟妇色一本在线观看| yw尤物国产在线观看| 亚洲日本中文字幕在线四区| 一区二区三区色网| 97天天躁日日躁狠狠97躁| 国产白浆美女免费观看| 毛片在线嗯啊| 又黄又爽又硬有刺激免费视频| 国产精品一区二区久久| 亚洲不卡av中文在线| 永久婷婷六月在线视频| 香港经典三级AⅤ在线看 | 997 久久 国产| 亚洲AⅤ中文无码字幕色| 在线无码九区| 国产精品亚洲精品日韩已满| 日韩AV人妻无码| 一区二区三区四区视频影院| 任你爽不一样的精品久久| 国产亚洲AV无码一区二区二三区| 国产精品播放一区二区三区| 久久人人爽人人爽人人片dvd | 亚洲成A∨人片软件| 亚洲一本到无码av中文字幕| 黑人大荫蒂高潮视频| 999zyz玖玖资源站免费在线观看| 午夜理论片在线观看免费丶| 嗯啊高h视频在线| 午夜福利高潮美女| 一本啊道国产无码| 337P西西人体扒开下部| 亚洲日本VA中文字幕在线| 粗爆毛片| 在线观看日韩欧美| 欧美日韩国产综合视频在线看| 18禁的网站免费进入| 97影院在线理论| 亚洲AV中文无码乱人伦在线观看| 2020最新中文字幕无码| 亚洲成a人片在线观看高清| 欧美国产伦久久久久久久| 好湿好紧好痛的A级视频| 日本午夜久久久久久| 亚洲av永久无码精品成人 | 国产日韩久久久精品影院首页| 一本到高清视频dvd| 成 人 h在线播放| heyzo中文字幕无码| 中文字幕亚洲一区一区| 亚洲已满18点击进入在线看片| 美女裸体永久免费视频网站| 2020最新国产在线中文不卡| 亚洲一区二区精品视频| 极品美女在线高潮喷潮| 凸偷窥妇科tube高清最新视频| 无码中文字幕免费一区二区三区| 户外野战三级在线观看| 老汉色老汉首页a亚洲尤尤色| 4站国产成人精品| 正在播放国产AV| 上司的丰满人妻中文字幕| 国产成人午夜福利免费无码r| 国产打屁股免费区网站| 精品国产AV一二三区无码| 成a人片在线播放| 亚洲精品1024| 4kav免费在线播放| 抱姝妺A网免费| 欧美一区二区三区婷婷月色| 无码毛片一区二区三区视频| 国产在线视频费| 制服丝袜国产AV无码| 99e热在这里有精品22| 91精品国产综合久久消防器材| 精品无码AV福利网| 欧美三级真做在线观看| 在线香蕉一区二区三区| 激情影院深夜福利| 久久久亚洲精品免费网站| 东北婷婷五月性| 精品一久久香蕉国产线看观看| 国产经典免费视频在线观看| 亚洲日韩久久久久| 国产自产在线| 国产精品有码无码av在线播放| 青青草原不卡免费在线观看| 色一情一乱一伦一区二区三欧美| 国产精品思思五月婷高清在线| 极品丰满60多老妇人| a级毛片高清免费视频| 亚洲综合小说另类图片五月天 | 毛片av网站| 亚洲一区二区三区日本久久九| 久久精品亚洲乱码伦伦中文| 国语精品91自产拍在线观看18| 久久精品国产2020| 香蕉视频在线色男人| 凹厕所xxxxbbbb偷拍视频| 视频二区中文无码| 亚洲国产手机在线电影网| 黑人按着韩国妞xx视频在线看 | 亚洲第一AV毛片| 欧美人体视频一区二区| 最大胆裸体人体牲交日韩| 悠悠久久综合亚洲精品伊人| 精品无码国产自产拍在线观看蜜| 被啪的受不了 在线播放| 99在线观看视频这里只有精品| 亚洲无码在线中文字幕| 美女张开腿扒开逼给男人操高潮视频免费看 | 男破女处身过程视频国产| 你懂的在线综合| 亚洲国产精品第三页| 亚洲一区在线免费| 中国a一片免费播放| 97精品久久天干天天| 2022国产无码免费入口| 在线播放你懂的网站网址| 性色AV无码一区二区三区人妻| 又爽又刺激高潮免费视频| 亚洲色在线v中文字幕电影网 | 国产国人免费AV福利| av天堂手机| 漂亮少妇按摩被中出| 亚洲国产精品无码中文字小说| 被窝影院午夜看片爽爽| 国产亚洲AV| 黑粗硬大欧美在线视频免费| 又大又粗进出白浆直流视频在线 | 伊人久久无码中文字幕| hppts视频在线www色| 人妻丰满熟妇αⅴ无码区| 亚洲老妇毛茸茸| 国产精品色吧国产精品| 自慰高潮在线观看| 日本美女无遮挡tv| 亚洲熟妇20p| 被窝影院午夜看片爽爽在线收看| 无码av免费永久免费永久专区| 久久系列国产精品喷水| 天堂免费一区二区三区| 午夜福利国产成人无码| 国内精品福利视频喷| av天堂永久在线| 国产亚洲精品美女久久久久久| 精品亚洲成在人线av无码| 18极品美女福利在线观看| 欧美日韩成人在线视频| 菲菲学院亚洲欧美激情片| 亚洲就去吻婷婷永久网| 黑人大猛啪啪| 尤物视频在线免费观看H| 综合社区亚洲熟妇p| 日本大综合色| XXXXBBBB欧美| 尤物AV永久免费观看| 国产亚洲精久久久久久无码苍井空| 久久久久久久精品免费RDE| 久久伊人精品福利国视频| 中文字幕人妻第一区| 国产剧情精品aⅴ| 精品久久无码一区| 免费xxxxx大片在线观看网站 | 亚洲人精品| 亚洲成色不卡在线观看| 国产拍自产免费高清| av无码特黄一级| 高清国产羞羞视频| 亚洲国产精品久久久久蜜桃| 精品国产乱码一区二区三区99| 制服丝袜亚洲中文综合| 久久久精品人妻一区二区三区四| 综合激情丁香久久狠狠男同| 色偷拍 自怕 亚洲 10p| 超碰在线免费91| 亚洲美女色网| 毛片一级精油按摩无码| 看全色黄大色黄女片| 尹人大香蕉综合视频| 综合国产在线观看女不卡| 正在播放被弄出白浆喷水了 | 看全色黄大色黄女片| 国产各种高潮合集在线| 大码无码丰满乳在线| avtt天堂网人妻系列| 国产久爱视频在线| 日本高清视频网站WWW| 成人国产乱对白在线观看| 亚洲自偷自拍另类在线观看| 永久免费观看的毛片手机视频| 国产欧美另类久久久精品不卡 | 97偷自拍亚洲综合| 亚洲日本VA中文字幕久久| 中文字幕v亚洲日本在线电影| av中文字幕在线| 又黄又硬又爽视频好看| 少妇出水11P| 无码国产福利av私拍| 国产成在线人免费视频| 国产一级一级毛片永久| 影音先锋男人看片AV在线| 97人妻视频妓女网| 亚洲日本道五十路久久综合| 女人与善牲交special| 麻豆久久久久精品| 亚洲AⅤ无码日韩AV无码网站| 美女不带套日出白浆免费视频| 在线秒播av波多野结衣| 狼人色国产在线视频爱雨网| av嫩模在线免费观看| 呦男呦女精品视频| 一区二区三区3D动漫无码精品| 日本湿乳视频| AV无码制服丝袜国产不用下载| 14呦女精品| 永久免费观看的毛片| 亚州精品影院| 亚洲男人无码天堂| 天天狠天天透天天爽| 性交AV在线网址| 亲子乱子伦xxxx视频| 亚洲精品无码久久千人斩探花| 男女进出抽搐高潮动态图| 被窝影院午夜看片无码下载| 里番acg※同人本子h| 亚洲色素无码专区| 668看片网尤物视频| A级黄毛片| yy111111少妇影院免费观看光屁股| 在线免费看黄片大全| 丁香五月激情综合激情综合激情| 97超碰免费人妻| 起起碰起碰欧美在线观看| H纯肉无码视频在线观看| 2022AV天堂免费在线观看| 亚洲中文久久精品无码2021 | 亚洲国产小u女在线| 黄色毛片在线| 老汉A∨在线视频| 一区三区三区不卡| 久久99免费视频录像| 99草在线观看| AV性色在线观看| 国产极品喷水视频| yw193尤物国产在线观看| 久久精品中文字幕无码绿巨人 | 日韩有码在线不卡视频| 国产在线精品涩涩涩涩| 成年女18毛片日日操夜夜操视频| 久播影院无码中文字幕| 成都午夜私人影院中文字幕| 出差和岳梅开二度| 久久久久久久性潮| 精品无码人妻一区二区三区不卡| 18禁免费在线看| 国产午夜福利片无码| 国产精品欧美一区二区三区 | 俄罗斯性bbbbbxxxxx| 在线岛国爱片免费无码AV| 一区二区三区在线观看亚洲电影| 妓女网妓女影院妓女网| 亚洲中文字幕一区精品自拍| 熟妇无码人妻| 好湿好痛好紧的A级视频| 国产精品无码在线观看,| 亚洲一区二区三区波多野结衣| 国产一区在线观看视频| 美女裸体网站18禁| 日韩久久av电影| 伊人久久大香线蕉综合精品| 亚洲mm喷水| 精品亚洲一区二区三区在线观看| 亚洲精品无码午夜福利理论片| AAA免费无码| 国产在线观看8区| 亚洲成a人片在线观看app| 亚洲欧美一区二区三区在线| 又粗爱硬的黄色网站| 亚洲国产精品一区二区三区在线观看| gif午夜影院| 2018生活片性色生活片| 国产过膝袜剧情在线播放| 无码一级午夜福利精品| AV美女免费网站| 91精品国产尤物免费| 2022AV天堂高清视频在线| 中文字幕丝袜无码一区二区| 大学生白嫩白浆一区| 亚洲大成影院| 久久久久久久精品女人毛片| 中文字幕视频在线播放有码无码 | 中国一级毛片| 性色AⅤ免费视频| 成 人 av动漫 第一页| 国产麻豆freesexvideos中国| 淫日视频免费看| 日日射天天射| 亚洲mv国产mv在线mv综合试看| 午夜一级福利在线| 亚洲中出视频| 国产好爽…又高潮了毛片| 久久国产黑丝袜视频| 大又粗又爽又黄少妇毛片| 福利视频综合| 老妇高潮内谢吼叫| 午夜精品一区二区三区免费视频| 扒开腿揉捏花蒂h动态图| 40岁成熟女人牲交片20分钟一| 小天堂AV| 久久精品日韩av无码| 3D动漫H网站在线观看| 凹凸福利导航视频| 天天躁狠狠躁狠狠躁性色AV| 中出片 在线播放| 亚洲夜夜狠狠色| 亚洲色多多视频一区二区| 97在线视频人妻无码一区| 高潮熟女正在播放| 2021最新精品国自产拍视频| 久久96热在精品国产高清| jk制服美女高潮流白浆| 最近中文字幕强奸| 尤物193国产在线精品| 三级无码视频| 国在线精品一区二区| 丰满亚洲大尺度无码无码专线| 国产大屁股喷水视频在线观看| 国产麻豆freesexvideos中国| 一区二区三区亚洲视频| 国产黑色在线| 伊人久在线视频| 婷婷综合激情网| 日韩人妻无码制服丝袜视频| 亚洲中文字幕日产乱码高清| 久久久亚洲欧洲日产国码aⅴ| 亚洲熟女天堂av| 亚洲天天做天天去天天添| 亚洲免费一二三区不卡视频| 高清拍拍拍无挡国产精品| 片永久免费看无码不卡| 轻点不要好大视频| 日本成熟妇人高潮aⅴ| 国产精品三区不卡| aⅴ亚洲国产小电影| 日本少妇一二区| 日日摸夜夜添无码无码AV| jk制服白丝超短裙自慰喷水| 中文字幕高潮波多野结衣| 久久精品AⅤ无码中文字字幕不卡| А√天堂在线最新无码专区在线视频| 国产在线jyzzjyzz免费| 欧美一区二区午夜福利在线yw| 中文字幕久久综合久久88| 日本动漫爆乳H动漫无遮挡3D| FREE性欧美媓妇VIDEO| 一区二区三区高清| 色天堂AV无码| yw193尤物在线| 一区二区三区视频| 日本精品啪啪一区二区三区| ΑV一卡二卡三卡免费| 精品在线99国内精品女| 12周岁女全身裸啪啪自慰网站 | 白浆h在线| 亚洲男人的天堂一区二区| 人妻在线无码一区二区三区| a国产在线观看| 91在线网址尤物| 国产交换配乱婬视频偷| 国产精品三级| 92午夜福利100在线少妇| 18禁无遮拦网站| 东北白嫩少妇不戴套| 亚洲日韩中文在线精品第一| 777狠狠| 日本久久久久亚洲中字幕| 午夜无码福利片| 国产精品露脸午夜福利| 精品国产成人a在线| 波多野结衣高清线手机在线首页 | 乱子伦av无码中文字幕| 伊人五月丁香综合aⅴ| 国产国产人免费视频成69大陆| 18禁 看片网站| 变态另类国产精品一区| 真实国产乱子伦对白视苹不卡| 人妻有码不卡| 99久久αv免费视观看| 强奷漂亮饱满的少妇| 国产在线不卡精品网站| 国产精品偷伦免费观看的| 久久精品aⅴ老熟女| 日韩无码八区| 国产第九页| 中文少妇| 成人无码区免费a∨视频| 狼天天狼天天香蕉综合网| VIDEOS18娇小粉嫩极品高| 女性自慰网站免费观看| 国产精品久久久久免费观看| 亚洲毛片一区| 国产精品久久二区二区| 国产精品视频色拍拍| 97色在色视频播放香蕉| 国产美女a做受大片观看| 一本大道香蕉中文视频| 性爱av在线| 国产精品第131页| 伊人久久综合电影网站| 精品国产一区二区三区无码蜜桃 | 伊人精品久久久大香线蕉| 亚洲中文精品无码| 久久国国产免费999| 超频在线免费观看视频| 中文字幕无码不卡一区| 我被两个男人玩出了白浆小视频| 流白浆h视频| 大爆乳双腿张开自慰喷水| 黑人巨超大videos华人| 午夜福利激情在线| jk制服黑色丝袜喷水视频国产| 爱情岛论坛亚洲禁18污| 无码人妻热线精品视频| 中文字幕一区二区人妻出轨| www.色香蕉| 亚洲av无码专区亚洲av桃花桃| 亚洲国产成人精品无码区在线播放| xxxx在线观看免费网站| 色欲综合视频天天天综合网站| 国产精品日日摸夜夜添夜夜添1| 99久久99视频这里只有精品| 337p中国人体啪啪| 99久久久无码国产精品免费| 2021AV最新高清在线播放| 日本xxxx色视频在线观看免费| 亚洲乱色伦图片区小说| 中文字幕乱码在线电影| 亚洲不卡无码视频| 亚洲伊人久久综合成人| 尤物国产193在线| 午夜福利亚洲无码| 日本公厕所撒尿高清视频| 成年动漫H视频无尽视频免费| 国产 在线视频无码| 国产色视频一区| 不卡一区二区视频日本在线观看 | 久操麻豆| 无码avav无码中文字幕| 黄色网站在线免费看入口| 高潮视频在线快速观看国家快速| 奶头好大摸着好爽免费视频| 日韩精品小视频| 黑人太粗太深了太硬受不了了| 伊人网在线视频| 亚洲VA欧美VA人人爽色欲| 色婷婷中文字幕| 电车美人强奷系列在线播放| 精品国产18禁久久久久久久| 美女窝人体色www网站| 亚洲中美观看在线| 2021国产最新在线视频一区| 国产黑色丝袜在线观看片| 国产精品私拍视频| 亚洲第一黄色视频| 国产精品成人免费视频一区| 亚洲国产片论片在线播放| 在线观看一级爆乳| 国产污视频网站在线观看| 90后极品粉嫩小泬20p在线播放| 国产成人黄色网站视频|