數(shù)據(jù)可視化APP-Chartistic產(chǎn)品需求文檔

數(shù)據(jù)可視化APP——Chartistic產(chǎn)品需求文檔Chartistic是一款通過交互快速編輯數(shù)據(jù)可視化圖表的app。本文通過對(duì)“Chartistic”app進(jìn)行產(chǎn)品體驗(yàn)與分析后產(chǎn)出的PRD文檔。該文檔由幾個(gè)板塊組成：全局說明、產(chǎn)品說明、頁面詳細(xì)功能說明等。目錄一、文檔綜述1.1文檔輸出環(huán)境1.2產(chǎn)品簡(jiǎn)介1.3產(chǎn)品總結(jié)二、全局說明2.1鍵盤說明2.2按鈕說明2.3默認(rèn)設(shè)置2.4限制設(shè)定2.5頁面交互三、產(chǎn)品說明3.1產(chǎn)品操作流程3.2產(chǎn)品功能導(dǎo)圖3.3頁面流程四、頁面詳細(xì)功能說明4.1歡迎頁4.2首頁4.3圖表編輯頁4.3.1柱狀圖/折線圖/面積圖/餅圖圖表編輯頁4.3.2智能剪貼畫編輯頁4.4X軸Y軸編輯頁（柱狀圖/折線圖/面積圖/餅圖）4.5設(shè)置編輯頁4.5.1柱狀圖/折線圖/面積圖設(shè)置編輯頁4.5.2餅圖設(shè)置編輯頁4.5.3智能剪貼畫設(shè)置編輯頁4.6圖表完成頁五、總結(jié)一、文檔綜述1.1文檔輸出環(huán)境1.2產(chǎn)品簡(jiǎn)介Chartistic，一款備受好評(píng)的小眾數(shù)據(jù)可視化app。在這個(gè)到處都充斥著數(shù)據(jù)，以數(shù)據(jù)為導(dǎo)向的年代，日常辦公中隨時(shí)隨地都有可能需要對(duì)或多或少的數(shù)據(jù)進(jìn)行可視化處理來幫助分析與演示。雖然有很多的功能強(qiáng)大的工具可以創(chuàng)建圖表，但是卻沒有多少工具可以使創(chuàng)建更簡(jiǎn)單、更具有交互性。Chartistic無需登錄，打開即用，在移動(dòng)端以交互的方式編輯數(shù)據(jù)，一分鐘內(nèi)創(chuàng)建漂亮的柱狀圖、折線圖、區(qū)域圖和餅狀圖。將圖表以圖像的形式導(dǎo)出，并將其嵌入到演示文稿、電子郵件、文檔、電子表格中!交互便捷，操作簡(jiǎn)單的它已在43個(gè)國家/地區(qū)投入使用。在新加坡、泰國、菲律賓和越南，名列AppStore的年度十佳應(yīng)用榜單。上線起至今共入選AppStore精品推薦9次，下載量累計(jì)24萬次。1.3產(chǎn)品總結(jié)目標(biāo)用戶：需要對(duì)少量數(shù)據(jù)迅速進(jìn)行可視化處理的辦公人群產(chǎn)品定義：快速、簡(jiǎn)單的移動(dòng)端數(shù)據(jù)可視化工具應(yīng)用，導(dǎo)出圖表作為PPT等演示工具的補(bǔ)充。產(chǎn)品特征：無需登錄交互式編輯外觀選擇多樣性二、全局說明2.1鍵盤說明在不同頁面需要輸入編輯時(shí)，對(duì)應(yīng)的彈出鍵盤的類型，數(shù)字鍵盤只能輸入正數(shù)2.2按鈕說明圖表編輯頁面：圖表上默認(rèn)的隨機(jī)數(shù)值除外，標(biāo)題編輯按鈕、X軸編輯按鈕、Y軸編輯按鈕在未輸入值前呈現(xiàn)灰色圖表類型按鈕：當(dāng)前類型按鈕為黑色，未選擇類型為灰色X軸Y軸編輯頁面：Y軸默認(rèn)的隨機(jī)數(shù)值除外，X軸名稱編輯框、Y軸名稱編輯框、X軸的值編輯框在未輸入有效值前預(yù)填文字呈現(xiàn)灰色設(shè)置編輯頁面：圖表樣式選擇按鈕：當(dāng)前樣式按鈕為黑色，未選擇樣式為灰色2.3默認(rèn)設(shè)置新建圖表時(shí)默認(rèn)已有8組數(shù)據(jù)，Y軸數(shù)值在【0~1000】范圍內(nèi)隨機(jī)，X軸不賦值待編輯標(biāo)題默認(rèn)可見、居中對(duì)齊Y軸默認(rèn)最大值為1000，最小值為0，不顯示小數(shù)網(wǎng)格可見，行計(jì)數(shù)10，每一間隔的值100，對(duì)齊線不顯示、簡(jiǎn)單圖表不開啟邊框默認(rèn)選擇無邊框X軸標(biāo)題/Y軸標(biāo)題/X軸圖例/Y軸圖例默認(rèn)顯示背景/風(fēng)格/樣式隨機(jī)單擊增加一組數(shù)據(jù)按鈕，增加的數(shù)據(jù)Y軸數(shù)值在【最大值~最小值】范圍內(nèi)隨機(jī)，X軸不賦值待編輯2.4限制設(shè)定最多可輸入12組數(shù)據(jù)Y軸最大值可編輯范圍為1-10000，最小值編輯范圍為0-9999，最大值需要大于最小值Y軸數(shù)值的編輯需在【最大值~最小值】范圍內(nèi)首先確定的是（最大值-最小值）/行計(jì)數(shù)=每一間隔的值

，行計(jì)數(shù)的數(shù)量需要在【0~15】。因此每一間隔的值需要在【0.07*（最大值-最小值）~（最大值-最小值）】這個(gè)范圍內(nèi)，確保最多只能有14行，考慮到（最大值-最小值）/輸入的間隔值得到的行數(shù)有可能不是整數(shù)的問題，實(shí)際顯示的行數(shù)為（最大值-最小值）/輸入的間隔值四舍五入取整后的行數(shù)最大值、最小值、行計(jì)數(shù)、每一間隔的值僅可編輯為整數(shù)2.5頁面交互彈屏?xí)r底部頁面虛化，單擊彈屏以外的虛化界面，彈層關(guān)閉，返回上一頁面；圖表編輯頁面下滑展開X軸Y軸編輯頁面，從屏幕下方上滑關(guān)閉；圖表編輯頁面左滑展開設(shè)置編輯頁面，從屏幕左側(cè)右滑關(guān)閉。三、產(chǎn)品說明3.1產(chǎn)品操作流程圖3.2產(chǎn)品功能導(dǎo)圖3.3頁面流程四、頁面詳細(xì)功能說明4.1歡迎頁頁面名稱：歡迎頁入口：打開App進(jìn)入頁面說明：打開App自動(dòng)進(jìn)入歡迎頁，停留0.5秒后自動(dòng)進(jìn)入首頁4.2首頁圖一圖二圖三圖四頁面名稱：首頁入口：歡迎頁后自動(dòng)跳入頁面說明：序號(hào)1：點(diǎn)擊出現(xiàn)其他鏈接彈層，首頁頁面置于底部并虛化（如圖三）序號(hào)2：點(diǎn)擊出現(xiàn)新建圖表類型彈層，首頁頁面置于底部并虛化（如圖二）序號(hào)3：點(diǎn)擊進(jìn)入圖表編輯頁長(zhǎng)按或者左滑出現(xiàn)復(fù)制、導(dǎo)出、刪除三個(gè)快捷處理按鈕（如圖四）序號(hào)4，5：點(diǎn)擊關(guān)閉彈屏，首頁頁面置于頂部并解除虛化序號(hào)6：點(diǎn)擊快捷處理按鈕消失，回到首頁，在首頁圖表列表第一個(gè)位置添加復(fù)制的圖表序號(hào)7：點(diǎn)擊彈屏關(guān)閉，快捷按鈕消失，回到首頁，該圖表刪除，列表中該圖表后面的圖表前移填充空缺位置4.3圖表編輯頁4.3.1柱狀圖/折線圖/面積圖/餅圖圖表編輯頁圖5圖6圖7圖8圖9頁面名稱：柱狀圖/折線圖/面積圖/餅圖圖表編輯頁入口：點(diǎn)擊圖表完成頁編輯按鈕跳轉(zhuǎn)新建圖表類型彈屏中點(diǎn)擊圖表類型對(duì)應(yīng)按鈕進(jìn)入頁面說明：主頁面：左滑展開展開設(shè)置編輯頁面，下滑展開X軸Y軸編輯頁面序號(hào)1：點(diǎn)擊返回首頁序號(hào)2：點(diǎn)擊進(jìn)入圖表完成頁面序號(hào)3：點(diǎn)擊圖表類型切換為折線圖，數(shù)值背景等設(shè)置不變，折線顏色為柱狀圖同一風(fēng)格的單個(gè)顏色（如圖6）序號(hào)4：點(diǎn)擊圖表類型切換為面積圖，數(shù)值背景等設(shè)置不變，折線與面積顏色為柱狀圖同一風(fēng)格的單個(gè)顏色，折線的顏色比面積顏色深一個(gè)色號(hào)（如圖7）序號(hào)5：點(diǎn)擊圖表類型切換為餅圖，數(shù)值背景等設(shè)置不變，配色也不變（如圖8）序號(hào)6：?jiǎn)螕舁C切換圖表顏色風(fēng)格序號(hào)7，17，18：按住上滑/下滑–修改圓點(diǎn)高度，上方或者下方的對(duì)應(yīng)數(shù)值一起修改，左側(cè)提示目前高度對(duì)應(yīng)的數(shù)值，修改值在設(shè)定的Y軸最大值與最小值之間序號(hào)8，9，10，12：輸入值之前按鈕為灰色，輸入后字體顏色由背景設(shè)置決定；點(diǎn)擊展開X軸Y軸編輯頁面序號(hào)11：點(diǎn)擊一次增加一組數(shù)據(jù)按鈕，增加的數(shù)據(jù)Y軸數(shù)值在【最大值~最小值】范圍內(nèi)隨機(jī)，X軸不賦值待編輯最多可增加至12組數(shù)據(jù)，增加至12組數(shù)據(jù)后按鈕變灰，點(diǎn)擊無反應(yīng)序號(hào)13：點(diǎn)擊后小圈即序號(hào)7變成刪除符號(hào)如圖9，單擊刪除符號(hào)刪除該組數(shù)據(jù)，當(dāng)刪除至只剩一組數(shù)據(jù)時(shí)刪除符號(hào)變回小圈，不可再刪除序號(hào)14：點(diǎn)擊隱藏上面的下拉按鈕、添加按鈕、刪除按鈕、設(shè)置按鈕，隱藏后圖表變?yōu)樽笙?，單擊后以上按鈕出現(xiàn)序號(hào)15：點(diǎn)擊展開設(shè)置編輯頁面序號(hào)16：輸入值之前按鈕為灰色，輸入后字體顏色由背景設(shè)置決定；點(diǎn)擊輸入標(biāo)題序號(hào)19：點(diǎn)擊餅圖需要修改占比的目標(biāo)扇形后出現(xiàn)兩個(gè)半圓形按鈕，按住按鈕滑動(dòng)分隔線調(diào)整目標(biāo)扇形角度，按鈕相鄰一邊的扇形同時(shí)被增大/減小角度，餅圖中間提示目前目標(biāo)扇形角度對(duì)應(yīng)的占比4.3.2智能剪貼畫編輯頁頁面名稱：智能剪貼畫編輯頁入口：點(diǎn)擊首頁圖表縮略圖跳轉(zhuǎn)新建圖表類型彈屏中點(diǎn)擊圖表類型對(duì)應(yīng)按鈕進(jìn)入頁面說明：主頁面：左滑展開展開設(shè)置編輯頁面序號(hào)1：按住上下滑動(dòng)更改有色部分的高度，左側(cè)占比數(shù)值一起更改，更改范圍為0%-100%4.4X軸Y軸編輯頁（柱狀圖/折線圖/面積圖/餅圖）頁面名稱：X軸Y軸編輯頁面入口：圖表編輯頁面下滑展開編輯X軸名稱按鈕，編輯Y軸名稱按鈕，編輯X軸按鈕，下拉按鈕點(diǎn)擊展開頁面說明：餅圖沒有編輯X軸名稱按鈕與編輯Y軸名稱按鈕序號(hào)1：點(diǎn)擊保留編輯結(jié)果，收起X軸Y軸編輯頁面，回到圖表編輯頁序號(hào)2：點(diǎn)擊屏幕下半部分或者從下半部分上滑，收起X軸Y軸編輯頁面，回到圖表編輯頁序號(hào)3：點(diǎn)擊一次增加一組數(shù)據(jù)按鈕，增加的數(shù)據(jù)Y軸數(shù)值在【最大值~最小值】范圍內(nèi)隨機(jī)，X軸不賦值待編輯最多可增加至12組數(shù)據(jù)，增加至12組數(shù)據(jù)后按鈕變灰，點(diǎn)擊無反應(yīng)序號(hào)4：初始狀態(tài)為隱藏，單擊刪除按鈕即序號(hào)5后出現(xiàn)，點(diǎn)擊刪除對(duì)應(yīng)的該組數(shù)據(jù)，點(diǎn)擊屏幕其他任意位置再次隱藏當(dāng)刪除至只剩一組數(shù)據(jù)時(shí)自動(dòng)隱藏，不可再刪除序號(hào)5：點(diǎn)擊編輯文本框與數(shù)值框之間出現(xiàn)小刪除按鈕即序號(hào)4，點(diǎn)擊刪除對(duì)應(yīng)的該組數(shù)據(jù)異常提示：Y軸編輯的數(shù)值>最大值時(shí)，彈屏【警告所輸入的值大于最大值】，輸入框內(nèi)容回到修改前的值;Y軸編輯的數(shù)值<最小值時(shí)，彈屏【警告所輸入的值小于最小值】，輸入框內(nèi)容回到修改前的值;4.5設(shè)置編輯頁頁面名稱：設(shè)置編輯頁面入口：圖表編輯頁面左滑展開圖表編輯頁面設(shè)置按鈕點(diǎn)擊展開4.5.1柱狀圖/折線圖/面積圖設(shè)置編輯頁標(biāo)題設(shè)置功能頁面說明：序號(hào)1：屏幕左側(cè)頁面點(diǎn)擊或者右滑返回圖表編輯頁值設(shè)置功能頁面說明：序號(hào)2：最大值最高可設(shè)置為10000，最大值設(shè)置的值需要大于最小值，僅可編輯為整數(shù)序號(hào)3：最小值最小可設(shè)置為0，最小值設(shè)置的值需要小于最大值，僅可編輯為整數(shù)異常提示：最大值>10000時(shí)，彈屏【無效值請(qǐng)輸入小于10000的值】，輸入框內(nèi)容回到修改前的值；最大值<=最小值時(shí)，彈屏【無效值請(qǐng)輸入大于最小值的值】，輸入框內(nèi)容回到修改前的值；最小值>=最大值時(shí)，彈屏【無效值請(qǐng)輸入小于最大值的值】，輸入框內(nèi)容回到修改前的值；網(wǎng)格設(shè)置功能頁面說明：序號(hào)4：可見性為關(guān)閉狀態(tài)時(shí)，行數(shù)與每一間隔的值無法選擇與編輯序號(hào)5：初始默認(rèn)值為10，可編輯范圍為【0~15】，僅可編輯為整數(shù)序號(hào)6：對(duì)齊條開啟狀態(tài)見圖，在圖表編輯頁面滑動(dòng)所編輯的數(shù)據(jù)對(duì)應(yīng)到Y(jié)軸上的數(shù)值（圖中的0、100、200、300等數(shù)值）時(shí)停頓一下，左側(cè)提示所對(duì)應(yīng)的數(shù)值；滑動(dòng)編輯的數(shù)值（如323、546等）不在Y軸上時(shí)，不顯示左側(cè)的數(shù)值提示序號(hào)7：簡(jiǎn)單圖表僅保留圖表主體形狀，如上圖序號(hào)8：初始默認(rèn)值為100，僅可編輯為整數(shù)，每一間隔的值需要在【0.07*（最大值-最小值）~（最大值-最小值）】這個(gè)范圍內(nèi)，考慮到（最大值-最小值）/輸入的間隔值

得到的行數(shù)有可能不是整數(shù)的問題，實(shí)際顯示的行數(shù)為（最大值-最小值）/輸入的間隔值四舍五入取整后的行數(shù)異常提示：輸入的每一間隔的值不在【0.07*（最大值-最小值）~（最大值-最小值）】這個(gè)范圍內(nèi)時(shí)，彈屏【警報(bào)請(qǐng)輸入0.07*（最大值-最小值）到（最大值-最小值）之間的值】，輸入框內(nèi)容回到修改前的值;輸入的行計(jì)數(shù)不在【0~15】范圍內(nèi)時(shí)，彈屏【警報(bào)請(qǐng)輸入小于15的值】，輸入框內(nèi)容回到修改前的值;邊框設(shè)置功能圖例設(shè)置功能背景設(shè)置功能頁面說明：

序號(hào)10：主題文字注釋序號(hào)11：四種主題單選，設(shè)計(jì)出圖標(biāo)作為按鈕外觀，下方會(huì)出現(xiàn)對(duì)應(yīng)文字注釋，所選擇的背景按鈕外層加一圈黑色示意圖表樣式設(shè)置功能頁面說明：序號(hào)9：柱狀圖/折線圖/面積圖樣式說明如圖4.5.2餅圖設(shè)置編輯頁標(biāo)題設(shè)置功能頁面說明：序號(hào)1：屏幕左側(cè)頁面點(diǎn)擊或者右滑返回圖表編輯頁表格設(shè)置功能頁面說明：豎向表僅可選擇左對(duì)齊或者右對(duì)齊，橫向表可選擇左對(duì)齊/右對(duì)齊/居中。值設(shè)置功能背景設(shè)置功能（同4.5.1柱狀圖/折線圖/面積圖）圖表樣式設(shè)置功能頁面說明：餅圖樣式說明如圖4.5.3智能剪貼畫設(shè)置編輯頁圖像搜索功能頁面說明：序號(hào)1：僅可輸入英文名稱搜索，無編輯內(nèi)容時(shí)文本框內(nèi)容為Search，字體淺灰色，輸入內(nèi)容后字體變?yōu)楹谏惓Ｌ崾荆寒?dāng)移動(dòng)端無網(wǎng)絡(luò)時(shí)，搜索框下方“在線搜索圖像”更改為“連接中斷”，搜索框點(diǎn)擊無反應(yīng)標(biāo)題設(shè)置功能值設(shè)置功能背景設(shè)置功能（同4.5.1柱狀圖/折線圖/面積圖）圖表樣式設(shè)置功能頁面說明：智能剪貼畫樣式說明如圖4.6圖表完成頁頁面名稱：圖表完成頁入口：點(diǎn)擊首頁圖表縮略圖跳轉(zhuǎn)圖表編輯頁點(diǎn)擊完成按鈕跳轉(zhuǎn)頁面說明：序號(hào)1：點(diǎn)擊返回首頁序號(hào)2：點(diǎn)擊進(jìn)入圖表編輯頁面序號(hào)3：點(diǎn)擊導(dǎo)出保存到本地或者分享五、總結(jié)以上便是我本次倒推撰寫的Chartistic的產(chǎn)品需求文檔，格式參考倒推“潮汐”APP的產(chǎn)品需求文檔。這款A(yù)pp是一款很實(shí)用的手機(jī)應(yīng)用，交互很有特色，因?yàn)檫^于追求操作的簡(jiǎn)