組件詳解|日歷日期選擇器 Calendar date picker

0 評(píng)論 4073 瀏覽 23 收藏 13 分鐘

在不少產(chǎn)品的設(shè)計(jì)過(guò)程中,產(chǎn)品團(tuán)隊(duì)可能都會(huì)需要為產(chǎn)品配置日期日歷選擇功能,那么在日期選擇器的設(shè)計(jì)上,可以從哪些維度提升用戶體驗(yàn)?zāi)??這篇文章里,作者就針對(duì)日期選擇器這一組件進(jìn)行了拆解分析,一起來(lái)看。

一、適用

  1. 用戶沒有特定的目標(biāo)日期。
  2. 不久的將來(lái)或過(guò)去的日期。

二、提升日期選擇器的用戶體驗(yàn)可以考慮以下幾個(gè)關(guān)鍵點(diǎn)

1. 提供額外的關(guān)鍵決策數(shù)據(jù)

1)價(jià)格信息

預(yù)訂航班、酒店或其它涉及價(jià)格變化的服務(wù),在日期旁邊顯示每個(gè)日期的價(jià)格,有助于用戶找到最實(shí)惠的選擇。

例如,在航旅縱橫預(yù)訂航班時(shí),在日期旁邊以不同的顏色顯示價(jià)格,橙色表示該特定日期的航班票價(jià)相對(duì)更實(shí)惠。

航旅縱橫

2)號(hào)源信息

對(duì)于需要預(yù)約且預(yù)約數(shù)量有限的服務(wù),在日期旁邊顯示實(shí)時(shí)號(hào)源狀態(tài),有助于用戶了解每個(gè)日期的預(yù)約情況。

例如,在浙二醫(yī)院預(yù)約掛號(hào)時(shí),在日期旁邊以“有號(hào)”和“無(wú)號(hào)”字樣表示實(shí)時(shí)號(hào)源狀態(tài)。

浙二醫(yī)院

3)公共假日(國(guó)定假日)信息

預(yù)訂酒店、航班、度假租賃服務(wù),在日期旁邊顯示假日信息,有助于用戶識(shí)別假期,并相應(yīng)的計(jì)劃他們的活動(dòng)。

例如,在攜程旅行預(yù)訂航班、火車票時(shí),在日期旁邊顯示公共假日信息。

攜程旅行

2. 減少不必要的數(shù)據(jù)選擇和顯示

在較短的日期范圍內(nèi)選擇日期,通過(guò)縮小日期選擇器的日期范圍,幫助用戶專注于相關(guān)日期并簡(jiǎn)化選擇過(guò)程。在確定適當(dāng)?shù)娜掌诜秶鷷r(shí),需考慮業(yè)務(wù)背景和用戶行為偏好。

例1,浙二醫(yī)院所有號(hào)源提前28天開放,預(yù)約未來(lái)28天的號(hào)源時(shí),當(dāng)天16:30前,其日期選擇器僅顯示次日開始算起27天內(nèi)的日期,當(dāng)天16:30后,日期選擇器僅顯示后日開始算起27天內(nèi)的日期。

浙二醫(yī)院

不同的醫(yī)院號(hào)源提前開放時(shí)間不同,根據(jù)每個(gè)醫(yī)院號(hào)源提前開放時(shí)間確定日期范圍。

例2,高鐵票預(yù)售期是15天,鐵路12306日期選擇器僅顯示預(yù)售期相關(guān)的月份,用戶僅可選擇當(dāng)天開始算起15天內(nèi)的日期。

鐵路12306

重大節(jié)日期間,隨著鐵路運(yùn)營(yíng)商調(diào)整政策,預(yù)售期可能會(huì)發(fā)生變化。

對(duì)于較少有限數(shù)量的日期選項(xiàng),提供預(yù)定義的日期選項(xiàng)幫助用戶簡(jiǎn)化日期選擇過(guò)程,不需要提供日歷日期選擇器。

例如,杭州市第一人民醫(yī)院所有號(hào)源提前7天開放,其日期選擇器僅顯示次日開始算起7天內(nèi)的日期選項(xiàng)。

杭州市第一人民醫(yī)院

3. 默認(rèn)的預(yù)填充值

1)下一個(gè)可用日期

需要預(yù)約且號(hào)源有限的服務(wù),將默認(rèn)的預(yù)填充值設(shè)置為下一個(gè)可用日期,減少不必要的交互。

例如,在杭州市第一人民醫(yī)院預(yù)約掛號(hào)時(shí),如果次日沒有號(hào)源則默認(rèn)的預(yù)填充值為下一個(gè)有號(hào)源的日期。

杭州市第一人民醫(yī)院

2)當(dāng)前日期

在待辦事項(xiàng)、任務(wù)管理、筆記應(yīng)用中創(chuàng)建需要在當(dāng)天完成的任務(wù)時(shí),將截止日期默認(rèn)設(shè)置為當(dāng)前日期。

例如,在滴答清單中創(chuàng)建當(dāng)天任務(wù)時(shí),默認(rèn)截止日期為當(dāng)前日期。

滴答清單

在記賬應(yīng)用中,用戶通常會(huì)在財(cái)務(wù)活動(dòng)發(fā)生的當(dāng)天記錄,將默認(rèn)的預(yù)填充值設(shè)置為當(dāng)前日期。

例如,在隨手記記賬時(shí),默認(rèn)的預(yù)填充值為當(dāng)前日期。

隨手記

在購(gòu)買最后一刻的優(yōu)惠時(shí),將默認(rèn)的預(yù)填充值設(shè)置為當(dāng)前日期。

例如,在美團(tuán)預(yù)訂今夜特價(jià)酒店時(shí),默認(rèn)的預(yù)填充值為當(dāng)前日期。今夜特價(jià)是酒店清理當(dāng)天尾房以減少損失,用戶則尋求最后一刻的優(yōu)惠低價(jià)入住。

3)特定日期

對(duì)于僅適用于特定日期的優(yōu)惠活動(dòng)時(shí),將默認(rèn)的預(yù)填充值設(shè)置為與活動(dòng)日期一致。

例1,在攜程旅行預(yù)訂周末低價(jià)酒店時(shí),默認(rèn)的預(yù)填充值為周末。

攜程旅行

例2,在同程旅行預(yù)訂特價(jià)機(jī)票時(shí),默認(rèn)的預(yù)填充值為特定出發(fā)日期。

4)最近使用的日期

預(yù)訂航班、火車票或酒店等服務(wù),用戶可能多次訪問預(yù)訂服務(wù)來(lái)比較價(jià)格或其它影響因素才能做出最終決定,記住用戶選擇的日期,創(chuàng)造無(wú)縫的預(yù)訂體驗(yàn)。

例如,在鐵路12306預(yù)訂火車票時(shí),首次打開應(yīng)用時(shí)默認(rèn)乘車日期為當(dāng)前日期,在關(guān)閉并重新打開應(yīng)用后默認(rèn)乘車日期為用戶上次選擇的乘車日期。

鐵路12306

5)默認(rèn)的預(yù)填充值為空

在待辦事項(xiàng)、任務(wù)管理、筆記應(yīng)用中創(chuàng)建沒有特定截止日期的任務(wù)時(shí),默認(rèn)的預(yù)填充值設(shè)置為空。

例如,在滴答清單創(chuàng)建沒有特定截止日期的任務(wù)時(shí),默認(rèn)的預(yù)填充值為空。

滴答清單

4. 本地化

1)一周的開始

在不同國(guó)家,一周的開始時(shí)間并不完全一致。

例如,國(guó)際標(biāo)準(zhǔn)ISO8601:2004將星期一指定為一周的第一天。

根據(jù)中國(guó)國(guó)家標(biāo)準(zhǔn)GB/T 7409 – 2005,我國(guó)將星期一指定為一周的第一天。該標(biāo)準(zhǔn)與國(guó)際ISO8601標(biāo)準(zhǔn)一致。

雖然美國(guó)沒有具體的標(biāo)準(zhǔn)指定,但美國(guó)政府維護(hù)的設(shè)計(jì)系統(tǒng)U.S. Web Design System在日期選擇器中將星期日作為一周的第一天。

伊朗將周六指定為一周的第一天。(伊朗讀寫順序從右往左)

為什么我國(guó)國(guó)家標(biāo)準(zhǔn)將星期一指定為一周的第一天,但日歷將星期日列為一周的第一天?求解。

2)星期

一周七天的命名與天體和神聯(lián)系起源于古巴比倫。

古羅馬采用并改編了七天周制度,以羅馬神話中的神來(lái)命名一周中的日子。西方語(yǔ)言中星期的表達(dá)大多源于拉丁語(yǔ),拉丁語(yǔ)是古羅馬的語(yǔ)言,拉丁語(yǔ)的情況可以分為基督教崛起前和崛起后(體現(xiàn)了古羅馬帝國(guó)對(duì)基督教立場(chǎng)從抵制、迫害向包容、接受的演變)。

英語(yǔ)繼承了基督教崛起前拉丁語(yǔ)的表達(dá),但用北歐神話中的神取代了星期二至星期五相關(guān)的羅馬神話中的神。

西班牙語(yǔ)、法語(yǔ)、意大利語(yǔ)中一周七天的命名源自于基督教崛起后的拉丁語(yǔ)的表達(dá)。

日本、韓國(guó)、朝鮮使用七曜紀(jì)日。

星期命名

星期最小縮寫名稱

3)公共假日(國(guó)定假日)、周末和工作周

大多數(shù)國(guó)家工作周為星期一至星期五,周末為星期六和星期日。

例如,周五日落至周六日落是猶太安息日,以色列的周末為周五至周六。一些穆斯林占多數(shù)的國(guó)家,周五是穆斯林的主麻日,一般會(huì)將周五和相鄰的一天定為周末。

一些國(guó)家周末可能只有一天。

例如,印度尼西亞勞工法允許兩種不同的工作時(shí)間制度:5天和6天工作制。

伊朗勞動(dòng)法規(guī)定周五為周休日。

不同國(guó)家的公共假日不同。

因此,在日期選擇器清晰標(biāo)記公共假日、周末時(shí)必須考慮不同的國(guó)家和地區(qū)慣例。

3)歷法

大多數(shù)國(guó)家都使用公歷作為官方民用歷。

一些國(guó)家使用不同的歷法作為官方民用歷。

例如,伊朗出于不同目的使用三套歷法(伊朗歷、伊斯蘭歷、公歷),伊朗歷是伊朗的民用歷,伊斯蘭歷用于確定伊斯蘭節(jié)日,公歷僅用于國(guó)際目的。

作為國(guó)際旅行提供商alibaba.ir支持伊朗歷、公歷,伊斯蘭節(jié)日在伊朗歷中清晰標(biāo)記。

4)讀寫順序

阿拉伯語(yǔ)國(guó)家、波斯語(yǔ)國(guó)家、希伯來(lái)語(yǔ)國(guó)家、烏爾都語(yǔ)國(guó)家讀寫順序從右往左。

例如,伊朗歷中每周從星期六開始并在星期五結(jié)束。在伊朗航空預(yù)訂航班時(shí),日期選擇器中日期從右往左排列。

5)日期格式

在不同的國(guó)家,日期格式并不完全一致。

例如,美國(guó)日期格式:mm/dd/yyyy(月/日/年)

中國(guó)日期格式:yyyy-mm-dd(年/月/日)

英國(guó)日期格式:dd/mm/yyyy(日/月/年)

感謝閱讀,以上就是本次分享的全部?jī)?nèi)容,希望你能從這篇文章中有所收獲。

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

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

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

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 目前還沒評(píng)論,等你發(fā)揮!