首頁(yè)

交互設(shè)計(jì)基礎(chǔ)定律-菲茲定律的解讀與應(yīng)用

資深UI設(shè)計(jì)者

菲茲定律是一個(gè)關(guān)系人機(jī)交互以及人體工程學(xué)活動(dòng)的數(shù)學(xué)模型,由保羅·費(fèi)茨在1954年首次提出

揭秘動(dòng)效設(shè)計(jì)的魔力:打造引人入勝的交互體驗(yàn),讓你的設(shè)計(jì)不再止步于最后一公里

資深UI設(shè)計(jì)者

隨著設(shè)計(jì)工具逐漸遷移到sketch上,其最基本的頁(yè)面點(diǎn)擊跳轉(zhuǎn)卻不能實(shí)現(xiàn),只能進(jìn)行靜態(tài)頁(yè)面展示,若設(shè)計(jì)師工作時(shí)間充足一些,或許會(huì)進(jìn)行頁(yè)面之間的流轉(zhuǎn)箭頭指示。對(duì)于那些對(duì)產(chǎn)品以及業(yè)務(wù)不是很了解的團(tuán)隊(duì)成員來(lái)說(shuō),其一直會(huì)處于懵懂狀態(tài),甚至?xí)诒姸嗟撵o態(tài)頁(yè)面中迷失,大大降低了交互稿的可讀性。

深度解析交互設(shè)計(jì):掌握核心知識(shí),打造卓越用戶(hù)體驗(yàn)

資深UI設(shè)計(jì)者

為什么要做交互設(shè)計(jì)

在使用網(wǎng)站,軟件,消費(fèi)產(chǎn)品或各種服務(wù)的時(shí)候(實(shí)際上是在同它們交互),使用過(guò)程中的感覺(jué)就是一種交互體驗(yàn)。隨著網(wǎng)絡(luò)和新技術(shù)的發(fā)展,各種新產(chǎn)品和交互方式越來(lái)越多,人們也越來(lái)越重視對(duì)交互的體驗(yàn)。當(dāng)大型計(jì)算機(jī)剛剛研制出來(lái)的時(shí)候,可能為當(dāng)初的使用者本身就是該行業(yè)的專(zhuān)家,沒(méi)有人去關(guān)注使用者的感覺(jué);相反,一切都圍繞機(jī)器的需要來(lái)組織,程序員通過(guò)打孔卡片來(lái)輸入機(jī)器語(yǔ)言,輸出結(jié)果也是機(jī)器語(yǔ)言,那個(gè)時(shí)候同計(jì)算機(jī)交互的重心是機(jī)器本身。當(dāng)計(jì)算機(jī)系統(tǒng)的用戶(hù)越來(lái)越由普通大眾組成的時(shí)候,對(duì)交互體驗(yàn)的關(guān)注也越來(lái)越迫切了。因此交互設(shè)計(jì)作為一門(mén)關(guān)注交互體驗(yàn)的新學(xué)科在二十世紀(jì)八十年代產(chǎn)生了。

AI產(chǎn)品體驗(yàn)設(shè)計(jì)拆解

ui設(shè)計(jì)分享達(dá)人

飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 
收藏
飛書(shū) AI-產(chǎn)品體驗(yàn)設(shè)計(jì)拆解
 
 


作者:肥宅的魚(yú)
鏈接:https://www.zcool.com.cn/work/ZNjU2NDg1NjA=.html
來(lái)源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢(xún)UI設(shè)計(jì)服務(wù)公司、軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司UI交互設(shè)計(jì)公司、數(shù)據(jù)可視化設(shè)計(jì)公司用戶(hù)體驗(yàn)公司、高端網(wǎng)站設(shè)計(jì)公司銀行金融軟件UI界面設(shè)計(jì)、能源及監(jiān)控軟件UI界面設(shè)計(jì)、氣象行業(yè)UI界面設(shè)計(jì)、軌道交通界面設(shè)計(jì)、地理信息系統(tǒng)GIS UI界面設(shè)計(jì)、航天軍工軟件UI界面設(shè)計(jì)、醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開(kāi)發(fā)、軟件wpf開(kāi)發(fā)、軟件vue開(kāi)發(fā)

 

向產(chǎn)品中注入人工智能的指南-總結(jié)20年的人工智能設(shè)計(jì)

ui設(shè)計(jì)分享達(dá)人

譯者推薦 | 作為現(xiàn)在熱門(mén)的 AI 交互,已經(jīng)有不少文章進(jìn)行了設(shè)計(jì)探討。而在此篇,設(shè)計(jì)師總結(jié)了過(guò)去 20 年間 AI 設(shè)計(jì)的經(jīng)驗(yàn)教訓(xùn),總結(jié)出 18 個(gè)交互設(shè)計(jì)指南,為我們提供了設(shè)計(jì)原則,希望有所裨益。

 

 

 

Photo by Franck V. on Unsplash

 

如今,許多產(chǎn)品都具備了 AI 支持的一些功能。我們每天都在移動(dòng)設(shè)備上以各種形式攜帶 AI 系統(tǒng),例如活動(dòng)跟蹤器、郵件過(guò)濾器、自動(dòng)完成和社交網(wǎng)絡(luò)訂閱廣告。像 Siri、Google Home 和 Cortana 這樣的虛擬助手幫助我們完成簡(jiǎn)單的任務(wù)。推薦系統(tǒng)會(huì)為我們建議在亞馬遜上的下一次購(gòu)買(mǎi),并指引導(dǎo)我們進(jìn)入下一個(gè)喜歡的 Netflix 系列。

 

AI 融合產(chǎn)品的性質(zhì)

 

AI 融合產(chǎn)品的共同特征是,與其他系統(tǒng)不同,它們依賴(lài)于概率,因此涉及不確定性。AI 注入的產(chǎn)品本質(zhì)上是不一致的,因?yàn)樗鼈兪请S著時(shí)間的推移而學(xué)習(xí)的。它們也可能依據(jù)光線(xiàn)環(huán)境、環(huán)境噪聲、人類(lèi)口音和其他情況有不同的反應(yīng)。這種不可預(yù)測(cè)性會(huì)讓用戶(hù)感到困惑,降低他們的信任,最終可能導(dǎo)致他們放棄產(chǎn)品。

 

 

AI 交互的設(shè)計(jì)指南


為了確保良好的設(shè)計(jì),Amershi 及其同事推薦了一些人工智能交互指南。這些設(shè)計(jì)指南融合了該領(lǐng)域 20 多年的經(jīng)驗(yàn)教訓(xùn)。他們從白皮書(shū)、評(píng)論、新聞文章、社論和學(xué)術(shù)論文中收集了 168 個(gè)設(shè)計(jì)建議,并將它們合成為以下 18 個(gè)指南。

 

DG1:明確系統(tǒng)可以做什么。

幫助用戶(hù)了解 AI 系統(tǒng)的功能。例如,在處理用戶(hù)數(shù)據(jù)時(shí),對(duì)跟蹤哪些數(shù)據(jù)以及如何跟蹤數(shù)據(jù)保持透明。

 

DG2:明確系統(tǒng)能夠做得如何。

幫助用戶(hù)了解 AI 系統(tǒng)可能出錯(cuò)的頻率。

 

 

 

 

DG3:基于環(huán)境的時(shí)間服務(wù)。

AI 系統(tǒng)應(yīng)根據(jù)當(dāng)前任務(wù)和環(huán)境考慮何時(shí)采取行動(dòng)或何時(shí)中斷用戶(hù)。

 

DG4:顯示相關(guān)信息。

顯示與用戶(hù)當(dāng)前任務(wù)和環(huán)境相關(guān)的信息。

 

 

 

搜索電影標(biāo)題 “Weathering With You” 將反饋相關(guān)的放映時(shí)間和地點(diǎn)。


DG5:符合相關(guān)的社會(huì)規(guī)范。

考慮到用戶(hù)的社會(huì)和文化背景,提供期望的體驗(yàn)。例如,語(yǔ)音助手在與有孩子的家庭交談時(shí),應(yīng)該注重用語(yǔ)的健康。


DG6:減輕社會(huì)偏見(jiàn)。

防止 AI 系統(tǒng)的語(yǔ)言和行為加強(qiáng)不良的刻板印象和偏見(jiàn)。


DG7:支持高效的調(diào)用。

簡(jiǎn)化向 AI 系統(tǒng)請(qǐng)求服務(wù)的方法。

 

 

 

用戶(hù)可以直接說(shuō)喚醒詞 “Alexa” 開(kāi)始與 Amazon Echo 互動(dòng)


DG8:支持有效的忽略。

簡(jiǎn)化拒絕或忽略不需要的服務(wù)的方法。


DG9:支持有效的糾正。

簡(jiǎn)化編輯或在錯(cuò)誤中恢復(fù)的方法。例如,通過(guò)語(yǔ)音助手設(shè)置提醒后,用戶(hù)可以在手機(jī)上找到提醒并且手動(dòng)編輯它。


DG10:服務(wù)范圍有疑問(wèn)時(shí)。

當(dāng)不確定用戶(hù)的目標(biāo)時(shí),參與消除歧義或委婉地削弱 AI 系統(tǒng)的服務(wù)。

 

 

 

 

自動(dòng)填充提供可滾動(dòng)的建議,而不是自動(dòng)為用戶(hù)填寫(xiě)單詞。

 

DG11:明確系統(tǒng)為什么會(huì)這樣做。

AI 系統(tǒng)的行為表現(xiàn)應(yīng)該是透明的,向用戶(hù)表面它為什么會(huì)這樣做。

 

 

 

谷歌地圖顯示“最快路線(xiàn)”是選擇特定路徑的原因。

 

DG12:記住最近的交互。

保持短期記憶并允許用戶(hù)有效地引用它。例如,搜索引擎應(yīng)該基于先前的查詢(xún)來(lái)理解后續(xù)查詢(xún)的內(nèi)容。

 

DG13:從用戶(hù)行為中學(xué)習(xí)。

通過(guò)不斷學(xué)習(xí)用戶(hù)的行為,個(gè)性化用戶(hù)體驗(yàn)。

 

DG14:謹(jǐn)慎更新和調(diào)整。

在更新和調(diào)整 AI 系統(tǒng)的行為時(shí),不要有破壞性的更改。

 

 

 

 

當(dāng)用戶(hù)選擇歌曲時(shí),不要突然更新所有的熱門(mén)推薦。保持頂部穩(wěn)定并更新其余部分。

 

 

DG15:鼓勵(lì)細(xì)化反饋。

使用戶(hù)能夠在與 AI 系統(tǒng)定期的互動(dòng)期間提供指示其偏好的反饋。例如,如果AI 系統(tǒng)沒(méi)有將電子郵件標(biāo)記為重要的話(huà),用戶(hù)可以自己標(biāo)記。

 

DG16:傳達(dá)給用戶(hù)行為的后果。

立即更新或傳達(dá)給用戶(hù)此操作將如何影響 AI 系統(tǒng)之后的行為。

 

 

 

Instagram 通知用戶(hù)隱藏廣告的操作將幫助他們改善廣告未來(lái)的質(zhì)量。

 

DG17:提供全局控制。

允許用戶(hù)全局定制 AI 系統(tǒng)監(jiān)控的內(nèi)容及其行為方式。例如,用戶(hù)能夠打開(kāi)和關(guān)閉位置共享。

 

DG18:通知用戶(hù)有關(guān)更改的信息。

當(dāng) AI 系統(tǒng)添加或更新其功能時(shí)應(yīng)該告知用戶(hù)。例如,AI系統(tǒng)可以提供針對(duì)新功能的應(yīng)用教程。

 

這些指南來(lái)自 Amershi 等人在 CHI 2019 年發(fā)表的人工智能交互指南。

 



作者:三分設(shè)
鏈接:https://www.zcool.com.cn/article/ZMTQyOTc1Mg==.html
來(lái)源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

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

WechatIMG27.jpg

關(guān)鍵詞:UI咨詢(xún)、UI設(shè)計(jì)服務(wù)公司、軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司、UI交互設(shè)計(jì)公司數(shù)據(jù)可視化設(shè)計(jì)公司、用戶(hù)體驗(yàn)公司、高端網(wǎng)站設(shè)計(jì)公司銀行金融軟件UI界面設(shè)計(jì)、能源及監(jiān)控軟件UI界面設(shè)計(jì)、氣象行業(yè)UI界面設(shè)計(jì)、軌道交通界面設(shè)計(jì)、地理信息系統(tǒng)GIS UI界面設(shè)計(jì)航天軍工軟件UI界面設(shè)計(jì)、醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開(kāi)發(fā)、軟件wpf開(kāi)發(fā)、軟件vue開(kāi)發(fā)

 

交互設(shè)計(jì)自我發(fā)展三部曲——“器、勢(shì)、人”

資深UI設(shè)計(jì)者

交互設(shè)計(jì)師(或稱(chēng)UI設(shè)計(jì)師)發(fā)展的三部曲——器、勢(shì)、人,這三部曲基本會(huì)貫穿你的職業(yè)生涯。本文專(zhuān)門(mén)為交互新人和轉(zhuǎn)行者指明學(xué)習(xí)方向。

淺談簡(jiǎn)約交互設(shè)計(jì)四策略

資深UI設(shè)計(jì)者

今天小編來(lái)帶大家了解一下如何讓產(chǎn)品能更加簡(jiǎn)單易用的四個(gè)設(shè)計(jì)策略:合理刪除、分層組織、適時(shí)隱藏和巧妙轉(zhuǎn)移;

交互原型細(xì)節(jié)提升之路

資深UI設(shè)計(jì)者

之前發(fā)布了幾篇關(guān)于組件如何構(gòu)建的文章,大家對(duì)組件的整體構(gòu)建步驟有了一定的了解,整體的大框架上都較為熟悉。本次分享主要切入點(diǎn)是如何運(yùn)用設(shè)計(jì)規(guī)范以及前端基礎(chǔ)知識(shí)來(lái)輔助,進(jìn)行原型交互細(xì)節(jié)提升,希望本次分享能夠帶給大家?guī)椭?/p>

路由圖標(biāo)情感化設(shè)計(jì)

前端達(dá)人

情感化路由路標(biāo)設(shè)計(jì),傳遞寄遞溫暖

 

 

作為面客的戰(zhàn)略級(jí)重點(diǎn)渠道,客戶(hù)端的查單詳情功能日均使用量達(dá)千萬(wàn)級(jí)別。隨著公司業(yè)務(wù)的不斷增長(zhǎng),查單訴求也隨之增加。

 

 

 

結(jié)合功能體驗(yàn)、業(yè)務(wù)需求等方面的調(diào)研與了解,得出以上地圖路由可解決的四個(gè)主要痛點(diǎn)。通過(guò)軌跡稀釋與動(dòng)態(tài)采樣、底層數(shù)據(jù)歸集、生動(dòng)化視效、元素動(dòng)態(tài)運(yùn)營(yíng)等手段,提升快遞路由信息在地圖上傳達(dá)的透明度與豐富性,方便用戶(hù)自助查詢(xún)快遞位置等內(nèi)容,管理客戶(hù)預(yù)期,同時(shí)加強(qiáng)用戶(hù)對(duì)功能忠誠(chéng)度、將客戶(hù)留存在順豐的平臺(tái)上。

 

 

 

確認(rèn)按照信息精度強(qiáng)化、情感共鳴設(shè)計(jì)、渠道視效優(yōu)化三個(gè)目標(biāo)方向來(lái)推動(dòng)需求的實(shí)現(xiàn),同步梳理需求優(yōu)先級(jí)、管理需求迭代,敏捷滿(mǎn)足功能訴求。

 

 

信息精度強(qiáng)化

1. 通過(guò)梳理線(xiàn)下現(xiàn)有收轉(zhuǎn)運(yùn)派等全流程操作場(chǎng)景,針對(duì)性處理、展示對(duì)應(yīng)運(yùn)輸工具元素,突顯順豐多樣場(chǎng)景、多式聯(lián)運(yùn)的運(yùn)輸優(yōu)勢(shì)。

 

 

2. 拉通多關(guān)聯(lián)系統(tǒng)順利完成數(shù)據(jù)流轉(zhuǎn),納入包括順豐小哥/順豐大哥/同城騎士上報(bào)的快遞員位置、陸運(yùn)系統(tǒng)等上報(bào)的貨車(chē)位置,輔以里程數(shù)等高精度信息完成展示。

 

圖標(biāo)應(yīng)用延展

 

 

新年圖標(biāo)

 

造型:以新年元素老虎,兔子延展,直觀的反映新年氣息,瑞獅迎新。飛機(jī)掛上中國(guó)結(jié)和小兔子開(kāi)飛機(jī)突出新春的喜慶氛圍。小哥派件圖標(biāo)給小哥戴上瑞獅/兔子帽子,增加年味,寓意小哥給大家送福了。
色彩:俯視插畫(huà)風(fēng)格配合高飽和色彩,活潑氛圍加上新春元素體現(xiàn)趣味性。
執(zhí)行難點(diǎn):由于圖標(biāo)尺寸很小,需要顧及圖標(biāo)的精美豐富程度,但也不能畫(huà)得過(guò)于復(fù)雜繁瑣,在精簡(jiǎn)與精美的中間做一個(gè)良好的平衡。

 

傳統(tǒng)節(jié)日?qǐng)D標(biāo)

 

造型:由于勞動(dòng)節(jié)是個(gè)嚴(yán)肅的節(jié)日,需要高舉勞動(dòng)的旗幟, 不分貧富貴賤,愿大家努力齊進(jìn)取。所以在貨車(chē)和飛機(jī)后面飄著鮮艷的紅旗,上面標(biāo)著“勞動(dòng)光榮”字樣。小哥派件圖標(biāo)后面帶著一個(gè)麥穗滿(mǎn)滿(mǎn)的袋子,寓意共同努力就會(huì)得到豐收的成果。端午是“飛龍?jiān)谔?rdquo;吉祥日,龍和龍舟文化始終貫穿在端午節(jié)的傳承歷史中,所以我們以龍舟為載具,用卡通的形式簡(jiǎn)化龍舟繁雜的造型,讓用戶(hù)一看就能產(chǎn)生共鳴。另外飛機(jī)及小哥的圖像中就加上粽子,清晰明了傳達(dá)出端午送安康的信息。
色彩:勞動(dòng)節(jié)俯視插畫(huà)風(fēng)格配合溫暖的色彩,突出勞動(dòng)節(jié)的光榮與奮斗的熱情。端午節(jié)以黃綠色為

 

 

 

藍(lán)藍(lán)設(shè)計(jì)(bouu.cn )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)桌面端界面設(shè)計(jì)、APP界面設(shè)計(jì)圖標(biāo)定制、用戶(hù)體驗(yàn)設(shè)計(jì)交互設(shè)計(jì)UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。

關(guān)鍵詞:UI咨詢(xún)、UI設(shè)計(jì)服務(wù)公司軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、用戶(hù)體驗(yàn)公司、高端網(wǎng)站設(shè)計(jì)公司

銀行金融軟件UI界面設(shè)計(jì)能源及監(jiān)控軟件UI界面設(shè)計(jì)氣象行業(yè)UI界面設(shè)計(jì)、軌道交通界面設(shè)計(jì)地理信息系統(tǒng)GIS UI界面設(shè)計(jì)、航天軍工軟件UI界面設(shè)計(jì)、醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)、企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開(kāi)發(fā)、軟件wpf開(kāi)發(fā)、軟件vue開(kāi)發(fā)



作者:SFUP_DESIGN
鏈接:https://www.zcool.com.cn/article/ZMTU3ODQ1Mg==.html
來(lái)源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

折疊屏設(shè)計(jì)規(guī)范

前端達(dá)人

持續(xù)更新中……

Part 1:折疊屏手機(jī)設(shè)計(jì)概述

 

折疊屏手機(jī)形態(tài) ,主要是以下3種:

 

1、展開(kāi)態(tài):折疊屏設(shè)備完全展開(kāi)后的形態(tài)。有更大的屏幕尺寸,可充分顯示應(yīng)用內(nèi)容。

2、折疊態(tài):折疊屏設(shè)備折疊后的形態(tài)。折疊后屏幕尺寸變小。

3、支架態(tài):折疊屏設(shè)備處于完全展開(kāi)和折疊的中間狀態(tài),可平穩(wěn)放置。

 

 

Part 2:UI設(shè)計(jì)規(guī)范

 

一、設(shè)計(jì)尺寸

 

1、展開(kāi)態(tài): 8英寸 2480x2200px 約8:7.1

2、折疊態(tài): 正面屏 6.6英寸 2480x1148px 約19.5:9

3、折疊態(tài): 背面屏 6.38英寸 2480x892px 約25:9

 

 

二、字號(hào)規(guī)范

字體

字號(hào)大小和粗細(xì)決定了信息的層級(jí)和主次關(guān)系。在設(shè)備上我們使用以下字號(hào)的合集為不同的控件及排版場(chǎng)景創(chuàng)造了清晰易讀、層次分明的閱讀體驗(yàn)。

 

 

 

 

展開(kāi)態(tài)圖標(biāo)和字體大小不應(yīng)發(fā)生明顯變化,在保證可讀性的基礎(chǔ)上,建議保持跟折疊態(tài)一樣的大小。若一定要發(fā)生大小變化,則最大不要超過(guò)1.2倍。為確保有較好的可讀性,展開(kāi)態(tài)單屏文本長(zhǎng)度不超過(guò)40字,推薦36字左右。

 

 

 

三、圓角規(guī)范

 

1、通用原角場(chǎng)景:從系統(tǒng)層面建立參數(shù)化圓角,目前支持 5 種通用圓角大小。分別是:4vp、8vp、12vp、 16vp、 24vp。

 

 

 

2、控件圓角場(chǎng)景:不同控件會(huì)有不同的圓角大小,因此單獨(dú)定義了圓角場(chǎng)景。

 

 

Part 3:UX設(shè)計(jì)規(guī)范

一、頁(yè)面布局

 

折疊屏展開(kāi)態(tài)下屏幕尺寸變大,有利于更高效的信息展示或更沉浸的內(nèi)容瀏覽。要充分利用折疊屏的大屏幕優(yōu)勢(shì),需要進(jìn)行寬屏的頁(yè)面布局適配。態(tài)布局:針對(duì)設(shè)備寬度變化而進(jìn)行界面版面重排的一種布局方式。動(dòng)態(tài)布局可以細(xì)分為“自適應(yīng)動(dòng)態(tài)布局”和“響應(yīng)式動(dòng)態(tài)布局”兩類(lèi)。基于柵格系統(tǒng)考慮動(dòng)態(tài)布局時(shí),可參考:柵格系統(tǒng)。

 

1、自適應(yīng)動(dòng)態(tài)布局:隨著屏幕設(shè)備規(guī)格的變化,界面中所呈現(xiàn)的信息量有增加,但信息架構(gòu)不變。常見(jiàn)的自適應(yīng)動(dòng)態(tài)布局的表現(xiàn)形式為:相對(duì)拉伸、相對(duì)縮放、延伸布局等。

 

 

2、響應(yīng)式動(dòng)態(tài)布局:隨著設(shè)備屏幕規(guī)格的變化,頁(yè)面內(nèi)的信息架構(gòu)會(huì)發(fā)生變化。常見(jiàn)的響應(yīng)式動(dòng)態(tài)布局的變形形式為:挪移布局、重復(fù)布局、瀑布布局等。

 

 

 

一、頁(yè)面布局布局&交互創(chuàng)新

結(jié)合六種動(dòng)態(tài)布局規(guī)則,三種雙頁(yè)面交互架構(gòu)規(guī)則以及多窗交互規(guī)則,在折疊屏上可以進(jìn)行多種布局樣式和交互的創(chuàng)新設(shè)計(jì),以下為一些參考范式。包括:分欄布局 、挪移布局 、重復(fù)布局 、瀑布流&宮格布局 、臨時(shí)雙窗

 

分欄布局

分欄是一種層級(jí)關(guān)系的左右分窗口布局,旨在在寬屏設(shè)備上有較好的顯示效果,幫助用戶(hù)更高效地處理任務(wù)。文件管理、聯(lián)系人、設(shè)置、備忘錄等應(yīng)用非常適合在展開(kāi)態(tài)分欄布局。備忘錄的分欄布局示例,如下圖:

挪移布局

折疊屏設(shè)備,從折疊到展開(kāi),可以通過(guò)挪移布局進(jìn)行布局的變化,提升閱讀舒適度和瀏覽效率。

以下為4種常見(jiàn)的挪移布局用法。

范式1:不同頁(yè)面的內(nèi)容整合到同一頁(yè)的挪移布局。

邊看邊評(píng)

閱讀時(shí),在展開(kāi)態(tài)同時(shí)顯示文章詳情和評(píng)論列表,滿(mǎn)足一邊閱讀文章一邊看評(píng)論的訴求。閱讀新聞時(shí)新聞詳情頁(yè)和評(píng)論頁(yè)合一的示例,如下圖:

 

圖片較多的閱讀場(chǎng)景,同樣適用于“邊看邊評(píng)”體驗(yàn)。本場(chǎng)景下建議默認(rèn)保持大圖顯示,點(diǎn)擊“評(píng)論”按鈕后,再觸發(fā)頁(yè)面布局的變化,同時(shí)顯示圖片和評(píng)論。用戶(hù)主動(dòng)觸發(fā)“邊看邊評(píng)”后,下一次訪(fǎng)問(wèn)該頁(yè)面,需要保持上一次的布局效果。查看圖片時(shí)邊看邊評(píng)的示例,如下圖:

范式2:同一頁(yè)面的上下結(jié)構(gòu)內(nèi)容,變成左右結(jié)構(gòu)的挪移布局。

雜志排版

本范式常用于閱讀場(chǎng)景的圖片和文本之間的挪移布局。不僅能解決圖片過(guò)大的問(wèn)題,還能通過(guò)雜志化布局帶來(lái)更好的視覺(jué)效果。同一頁(yè)面的新聞,從上下圖文變成左右圖文的挪移布局示例,如下圖:

 

范式3:有層級(jí)結(jié)構(gòu)的圖文內(nèi)容,變成左右結(jié)構(gòu)的挪移布局。首頁(yè)的圖文內(nèi)容,從層疊變成左右圖文的挪移布局示例,如下圖:

 

 

范式4:通過(guò)挪移布局,在展開(kāi)態(tài)上減少次要信息對(duì)核心信息的干擾。看視頻時(shí),彈幕和操作按鈕挪移布局到周邊空閑區(qū)域的示例,如下圖:

 

多人視頻通話(huà)時(shí),參會(huì)人信息從底部挪移到展開(kāi)態(tài)的側(cè)邊,減少對(duì)視頻通話(huà)畫(huà)面遮擋的示例,如下圖:

 

重復(fù)布局

折疊屏設(shè)備,從折疊到展開(kāi),頁(yè)面內(nèi)的列表、卡片等均可通過(guò)重復(fù)布局,橫向展示更多信息,提升頁(yè)面的瀏覽效率,同時(shí)避免信息過(guò)疏。列表在展開(kāi)態(tài)重復(fù)布局的示例,如下圖:

從折疊態(tài)到展開(kāi)態(tài),使用重復(fù)布局時(shí),通常內(nèi)容按照從左到右的Z字形排布。如下圖:

 

瀑布流&宮格布局

瀑布流布局適用于卡片式結(jié)構(gòu)。折疊態(tài)的單列卡片,到展開(kāi)態(tài)顯示雙列卡片,不同高度的卡片形成錯(cuò)落有致的瀑布流布局??梢杂行嵘?yè)面的瀏覽效率和可視化效果。新聞首頁(yè)卡片瀑布流布局示例,如下圖:

 

 

瀑布流布局和卡片的重復(fù)布局比較相似,內(nèi)容也按照從左到右的Z字形排布,卡片的高度可以不同。視頻卡片從折疊到展開(kāi)態(tài)的瀑布流布局示例,如下圖:

 

 

二、交互架構(gòu)

在大屏幕設(shè)備上,雙頁(yè)面同時(shí)顯示,為用戶(hù)創(chuàng)造了新的操作體驗(yàn)。當(dāng)應(yīng)用中的兩個(gè)頁(yè)面間有關(guān)聯(lián)關(guān)系時(shí),可以考慮采用組合頁(yè)面的方式,根據(jù)不同的場(chǎng)景訴求,選擇合適的頁(yè)面組合關(guān)系。組合頁(yè)面有三種:層級(jí)關(guān)系 、主從關(guān)系、并列關(guān)系。

 

1、層級(jí)關(guān)系
層級(jí)關(guān)系有多層級(jí)和單一層級(jí)兩種。層級(jí)關(guān)系的雙窗口,即為通常說(shuō)的分欄。

 

2、多層級(jí)分欄
多層級(jí)關(guān)系有完整的多層結(jié)構(gòu),例如復(fù)雜的系統(tǒng)設(shè)置菜單,海量?jī)?nèi)容(例如綜合電商的商品,視頻、圖片或音樂(lè)的媒體資源,新聞網(wǎng)站的海量新聞)的門(mén)戶(hù)及多級(jí)分類(lèi)子頁(yè)面。
此類(lèi)型的交互特點(diǎn)為:


(1)第一級(jí)的基礎(chǔ)分類(lèi)通常以列表形式呈現(xiàn)。


(2)末級(jí)列表頁(yè)面中的元素為最小內(nèi)容元素,例如單個(gè)商品、單個(gè)媒體素材、單條新聞等。

 

有多個(gè)層級(jí)遞進(jìn)關(guān)系的場(chǎng)景示例,如下圖:

 

單一層級(jí)分欄

單一層級(jí)結(jié)構(gòu)一般以“列表+詳情”形式呈現(xiàn),列表中的每個(gè)元素都是末端元素,元素中沒(méi)有二級(jí)分類(lèi)列表。例如郵件、信息、備忘錄等內(nèi)容型元素的列表。

此類(lèi)型的交互特點(diǎn)為:

(1)列表中只存在單獨(dú)的元素,沒(méi)有子列表,左右兩側(cè)內(nèi)容屬性固定,較少用戶(hù)迷失。

(2)點(diǎn)擊左側(cè)中某一個(gè)條目,右側(cè)打開(kāi)對(duì)應(yīng)的詳情內(nèi)容。

(3)用戶(hù)可以借助在左側(cè)列表中點(diǎn)擊任意一個(gè)條目,在右側(cè)快速打開(kāi)對(duì)應(yīng)的詳情內(nèi)容,實(shí)現(xiàn)內(nèi)容快速切換。

 

主從關(guān)系

在主從關(guān)系類(lèi)型中,一側(cè)主導(dǎo)頁(yè)面為沉浸式場(chǎng)景;輔助頁(yè)面在另一側(cè),呈現(xiàn)評(píng)論、互動(dòng)討論、參考信息等相關(guān)內(nèi)容。可根據(jù)沉浸內(nèi)容情況分為左右或上下的組合頁(yè)面結(jié)構(gòu)。

此類(lèi)型的交互邏輯特點(diǎn):

(1)兩部分之間相互獨(dú)立,且有明顯的主從關(guān)系。

(2)輔助側(cè)依賴(lài)主導(dǎo)側(cè)存在,如果主導(dǎo)側(cè)關(guān)閉或切換,輔助側(cè)頁(yè)面不能單獨(dú)存在,需同步關(guān)閉或切換。

(3)主導(dǎo)側(cè)的內(nèi)容呈現(xiàn),沒(méi)有受到打擾和中斷,持續(xù)保持最佳的沉浸狀態(tài)。

(4)輔助側(cè)的內(nèi)容用戶(hù)可以進(jìn)行滾動(dòng)瀏覽,適合于信息流數(shù)據(jù),用戶(hù)可參與互動(dòng)。

 

主從關(guān)系的信息架構(gòu)樣式主要有如下幾種,應(yīng)用可根據(jù)具體場(chǎng)景進(jìn)行選擇:

 

懸浮面板

從屬信息默認(rèn)以懸浮面板的形式顯示,通過(guò)特定按鈕或特定手勢(shì)交互觸發(fā),一般用于作為主要信息的篩選項(xiàng)或更多菜單項(xiàng),不影響主要信息的展示。短視頻應(yīng)用使用懸浮面板的示例,如下圖:

 

 

導(dǎo)航應(yīng)用懸浮面板的示例(折疊屏展開(kāi)后,懸浮面板不拉伸,不遮擋底部主要信息),如下圖

 

 

側(cè)邊欄

從屬信息默認(rèn)以邊欄形式顯示,通過(guò)界面比例和視覺(jué)效果表現(xiàn)從屬關(guān)系,不影響主要信息的展示,同時(shí)能快速瀏覽或操作從屬信息。短視頻應(yīng)用使用側(cè)邊欄的示例,如下圖:

 

并列關(guān)系

在并列關(guān)系中,界面中的兩側(cè)內(nèi)容處于同等重要的地位。兩側(cè)的內(nèi)容可以是同類(lèi)型的內(nèi)容,也可以是不同類(lèi)型的內(nèi)容。

例如購(gòu)物應(yīng)用中,下單前對(duì)兩個(gè)相似商品的情況進(jìn)行詳細(xì)的對(duì)比就是相同類(lèi)型內(nèi)容的頁(yè)面并列;購(gòu)物應(yīng)用中一側(cè)窗口顯示商品,另外一側(cè)顯示和商家的對(duì)話(huà)界面,就是不同類(lèi)型內(nèi)容的頁(yè)面并列。

并列關(guān)系方便用戶(hù)對(duì)兩個(gè)商品的信息進(jìn)行更詳細(xì)的比對(duì)或進(jìn)行更高效的交互操作。 在這種組合頁(yè)面下,左右兩頁(yè)面間無(wú)主次和從屬關(guān)系,頁(yè)面分割比例應(yīng)為1:1

 

 

多窗口交互


折疊屏展開(kāi)態(tài)、平板、電腦等大屏幕設(shè)備,具有多任務(wù)并行和效率型任務(wù)處理的先天優(yōu)勢(shì)。
系統(tǒng)提供了懸浮窗、分屏、平行視界三種多窗口交互,為用戶(hù)在大屏幕設(shè)備上的多任務(wù)并行、便捷的臨時(shí)任務(wù)處理提供更佳的使用體驗(yàn)。多窗口類(lèi),如下圖:

多窗口的應(yīng)用

多任務(wù)并行
通過(guò)分屏可實(shí)現(xiàn)多任務(wù)并行。有左右分屏和上下分屏兩種方式。針對(duì)短視頻、IM對(duì)話(huà)、購(gòu)物等內(nèi)容,左右分屏體驗(yàn)更佳;針對(duì)長(zhǎng)視頻、游戲、會(huì)議等內(nèi)容,上下分屏體驗(yàn)更佳。通過(guò)分屏進(jìn)行任務(wù)并行的示例,如下圖:

 

臨時(shí)任務(wù)處理

通過(guò)懸浮窗可實(shí)現(xiàn)便捷的臨時(shí)任務(wù)處理。

三方應(yīng)用根據(jù)業(yè)務(wù)需求,列舉需要調(diào)用窗口的場(chǎng)景,對(duì)系統(tǒng)提出調(diào)用窗口顯示的請(qǐng)求,系統(tǒng)提供將特定頁(yè)面窗口化顯示的能力。例如,臨時(shí)查看附件、撥打電話(huà)、查看地圖、IM對(duì)話(huà)、登錄等場(chǎng)景,都非常適合使用應(yīng)用內(nèi)懸浮窗。應(yīng)用內(nèi)懸浮窗查看附件的示例,如下圖:

 

 

跨窗口拖拽

形成分屏或打開(kāi)懸浮窗后,從某個(gè)窗口內(nèi)拖拽內(nèi)容到另一個(gè)窗口,即為跨窗口拖拽??绱翱谕献D片的示例,如下圖:

 

 

 

 

 

二、體驗(yàn)設(shè)計(jì)點(diǎn)

 

折疊屏相對(duì)于普通手機(jī)有個(gè)明顯的特點(diǎn):可隨時(shí)折疊展開(kāi)、展開(kāi)后屏幕變大。折疊屏UX設(shè)計(jì)中需考慮如下體驗(yàn)訴求:

 

1、體驗(yàn)連續(xù)

 

屏幕可隨時(shí)折疊展開(kāi),在體驗(yàn)上要保證用戶(hù)體驗(yàn)的連續(xù)性,應(yīng)用需要遵從屏幕顯示的兼容和應(yīng)用狀態(tài)的連續(xù)。屏幕兼容:由于屏幕尺寸發(fā)生變化,應(yīng)用應(yīng)采用適當(dāng)?shù)氖侄螌?duì)屏幕上內(nèi)容布局進(jìn)行優(yōu)化調(diào)整。

應(yīng)用連續(xù):應(yīng)用在折疊與展開(kāi)狀態(tài)切換的過(guò)程中保持正常運(yùn)行。

 

2、體驗(yàn)增值

 

屏幕變大后,用戶(hù)體驗(yàn)在某些方面有增值。

更多內(nèi)容:大尺寸屏幕可顯示更多內(nèi)容,提高顯示和操作的效率。

更加沉浸:大尺寸屏幕可顯示更清晰的細(xì)節(jié),適合圖片瀏覽、視頻欣賞、游戲等應(yīng)用和場(chǎng)景。

多任務(wù)并行:多個(gè)窗口可同時(shí)在大尺寸屏幕內(nèi)展示,為用戶(hù)多任務(wù)并行提供了直觀高效的方式。

 

 

三、基礎(chǔ)體驗(yàn)要求

 

1、基礎(chǔ)要求


(1)保證布局良好
(2)窗口內(nèi)布局的特殊處理
(3)保證應(yīng)用任務(wù)的連續(xù)性
(5)音頻沖突處理
(6)多窗口體驗(yàn)融合

 

2、保證布局良好


應(yīng)用內(nèi)的元素布局應(yīng)進(jìn)行響應(yīng)式設(shè)計(jì),保證應(yīng)用界面在全屏、懸浮窗、分屏不同窗口模式間進(jìn)行切換時(shí)、在設(shè)備橫豎屏旋轉(zhuǎn)時(shí)、調(diào)整系統(tǒng)字號(hào)、調(diào)整系統(tǒng)顯示模式后,依然保持可用、良好的布局,不出現(xiàn)應(yīng)用元素?zé)o法顯示的問(wèn)題。

 

3、窗口內(nèi)布局的特殊處理


分屏窗口內(nèi),在應(yīng)用界面頂部會(huì)顯示分屏拖拽橫條,且隱藏系統(tǒng)狀態(tài)欄。應(yīng)用界面中需要增加一個(gè)狀態(tài)欄高度,來(lái)避免出現(xiàn)分屏拖拽橫條和應(yīng)用頂部的功能熱區(qū)重疊,導(dǎo)致應(yīng)用功能無(wú)法操作的問(wèn)題。懸浮窗窗口內(nèi),懸浮窗的操作橫條是在應(yīng)用界面外顯示的,因此應(yīng)用不需要留出狀態(tài)欄高度,避免在窗口內(nèi)出現(xiàn)空白區(qū)域。

 

4、保證應(yīng)用任務(wù)的連續(xù)性


當(dāng)應(yīng)用以分屏、懸浮窗顯示時(shí),需要保證應(yīng)用不被特殊情況所打斷進(jìn)程。例如應(yīng)用在不同窗口模式間切換時(shí)、在設(shè)備橫豎屏旋轉(zhuǎn)時(shí)、調(diào)整系統(tǒng)字號(hào)、調(diào)整系統(tǒng)顯示模式后,應(yīng)用不會(huì)發(fā)生重啟、閃退等問(wèn)題。且切換之前的任務(wù)和相關(guān)狀態(tài)得以保存和延續(xù),或者能夠快速恢復(fù),給用戶(hù)提供連續(xù)的體驗(yàn)。

 

5、保證多個(gè)任務(wù)同時(shí)正常使用


例如用戶(hù)正在玩游戲或看視頻,同時(shí)在使用其他應(yīng)用。只要游戲或視頻應(yīng)用還在前臺(tái)顯示,依然要保證能正常運(yùn)行,不會(huì)因?yàn)橛脩?hù)正在使用的是另一個(gè)應(yīng)用,而導(dǎo)致游戲暫?;蛞曨l暫停。

 

6、音頻沖突處理


當(dāng)應(yīng)用正在播放視頻或播放音樂(lè)時(shí),新打開(kāi)一個(gè)窗口應(yīng)用,并觸發(fā)了新的音頻任務(wù),原應(yīng)用對(duì)音頻的處理要符合用戶(hù)預(yù)期,例如臨時(shí)暫停音視頻的播放或降低音量,以便于用戶(hù)聽(tīng)到新的音頻。

 

7、多窗口體驗(yàn)融合


可通過(guò)長(zhǎng)按頂部橫條并拖拽的交互,實(shí)現(xiàn)分屏和懸浮窗之間的互換。實(shí)現(xiàn)多窗口體驗(yàn)融合。

 

 

四、多窗口交互

 

1、方式介紹

 

懸浮窗用于在已有的任務(wù)基礎(chǔ)上,臨時(shí)處理另一個(gè)任務(wù),或短時(shí)間多任務(wù)并行使用的場(chǎng)景。 支持同時(shí)使用多個(gè)懸浮窗。手機(jī)、折疊屏折疊狀態(tài)下,一屏幕內(nèi)最多展開(kāi)一個(gè)懸浮窗;平板或 折疊屏展開(kāi)狀態(tài)下,一屏幕內(nèi)最多展開(kāi)兩個(gè)懸浮窗。其他懸浮窗自動(dòng)最小化為懸浮球疊加顯 示。懸浮窗適用于玩游戲看視頻等沉浸式場(chǎng)景下臨時(shí)回復(fù)消息;購(gòu)物時(shí)臨時(shí)使用計(jì)算器計(jì)算等。

 

1.1 觸發(fā)方式

(1)通過(guò)一步小窗的手勢(shì)操作快速讓?xiě)?yīng)用從全屏到懸浮窗。本交互適用于所有支持智慧多窗的應(yīng)用。

 

 

 

(2)智慧多窗應(yīng)用欄觸發(fā):從屏幕邊緣向內(nèi)滑并懸停,拖出應(yīng)用欄,點(diǎn)擊應(yīng)用圖標(biāo),打開(kāi)該應(yīng)用的懸浮窗。本交互適用于所有支持智慧多窗的應(yīng)用。

 

 

 

 

 

 

(3)橫幅通知觸發(fā):沉浸式場(chǎng)景來(lái)通知,點(diǎn)擊通知,懸浮窗展示。本方式有效解決了查看通知的跨應(yīng)用跳轉(zhuǎn)痛點(diǎn)。

 

 

 

 

藍(lán)藍(lán)設(shè)計(jì)(bouu.cn )是一家專(zhuān)注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計(jì)、B端界面設(shè)計(jì)、桌面端界面設(shè)計(jì)APP界面設(shè)計(jì)、圖標(biāo)定制用戶(hù)體驗(yàn)設(shè)計(jì)、交互設(shè)計(jì)、UI咨詢(xún)、高端網(wǎng)站設(shè)計(jì)、平面設(shè)計(jì),以及相關(guān)的軟件開(kāi)發(fā)服務(wù),咨詢(xún)電話(huà):01063334945。

關(guān)鍵詞:UI咨詢(xún)、UI設(shè)計(jì)服務(wù)公司、軟件界面設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、數(shù)據(jù)可視化設(shè)計(jì)公司用戶(hù)體驗(yàn)公司、高端網(wǎng)站設(shè)計(jì)公司

銀行金融軟件UI界面設(shè)計(jì)能源及監(jiān)控軟件UI界面設(shè)計(jì)、氣象行業(yè)UI界面設(shè)計(jì)軌道交通界面設(shè)計(jì)、地理信息系統(tǒng)GIS UI界面設(shè)計(jì)航天軍工軟件UI界面設(shè)計(jì)、醫(yī)療行業(yè)軟件UI界面設(shè)計(jì)、教育行業(yè)軟件UI界面設(shè)計(jì)企業(yè)信息化UI界面設(shè)計(jì)、軟件qt開(kāi)發(fā)、軟件wpf開(kāi)發(fā)軟件vue開(kāi)發(fā)

 

 



作者:忻蕓
鏈接:https://www.zcool.com.cn/article/ZMTU3MjM5Ng==.html
來(lái)源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。

日歷

鏈接

個(gè)人資料

存檔