前言

本人對(duì)該APP進(jìn)行重設(shè)計(jì)的理由如下：

1、2017這一年參與的項(xiàng)目有幾個(gè)，但還沒(méi)接手過(guò)完整的項(xiàng)目，所以就自己創(chuàng)造機(jī)會(huì)，在年前做一個(gè)重設(shè)計(jì)項(xiàng)目，來(lái)增強(qiáng)自己的產(chǎn)品設(shè)計(jì)思維等能力，在不斷的嘗試之后讓自己收獲更多。

2、該APP是當(dāng)時(shí)對(duì)番茄鐘時(shí)間管理很感興趣的時(shí)候下的，同時(shí)也下過(guò)好幾個(gè)相關(guān)APP，覺(jué)得顏值該APP算是很高的，而且功能也很全，但個(gè)人認(rèn)為還有些需改進(jìn)的地方，于是就開(kāi)始了交互UI的重構(gòu)設(shè)計(jì)。

設(shè)計(jì)背景及要求

參考現(xiàn)有Coves-番茄鐘APP的功能，對(duì)APP的UI/UE進(jìn)行合理的重新設(shè)計(jì)。

Coves-番茄鐘是基于番茄工作法結(jié)合任務(wù)管理，記錄每日活動(dòng)的app。為專注工作和學(xué)習(xí)而設(shè)計(jì)，提高工作學(xué)習(xí)效率和保持專注，進(jìn)而幫助用戶掌握記錄時(shí)間和養(yǎng)成習(xí)慣，告別拖延癥。

根據(jù)設(shè)計(jì)背景及要求，對(duì)產(chǎn)品進(jìn)行評(píng)估，用“用戶痛點(diǎn)”、“核心用戶”、“市場(chǎng)競(jìng)品”分別解決三個(gè)不同維度的問(wèn)題。

產(chǎn)品要解決的問(wèn)題是什么?

為誰(shuí)解決這些問(wèn)題？

同類產(chǎn)品有哪些？

以上列舉的是部分市場(chǎng)競(jìng)品。以上不難看出首頁(yè)直接進(jìn)入番茄鐘計(jì)時(shí)界面的APP居多，一般這種新式的產(chǎn)品功能比較簡(jiǎn)單。和Coves有點(diǎn)類似的是番茄清單，可添加多個(gè)任務(wù)，兩者的區(qū)別是番茄清單是臨時(shí)的任務(wù)，類似清單；Coves的是可重復(fù)使用的任務(wù)，類似目標(biāo)習(xí)慣。

總結(jié)：Coves-番茄鐘APP的目的是讓用戶集中精力完成事件，排除干擾，合理安排休息時(shí)間的方式，使用戶能更有效率、更健康的完成事件。

APP功能梳理

現(xiàn)有的Coves APP功能：待辦任務(wù)，番茄鐘，倒計(jì)時(shí)，時(shí)間累計(jì)，白噪音，任務(wù)時(shí)間數(shù)據(jù)分析展示，個(gè)性化設(shè)置等。能得到每日、每周和每月的統(tǒng)計(jì)結(jié)果, 用表格和圖形展示。

在功能邏輯的改進(jìn)

1、將新建任務(wù)里的時(shí)間類型選擇提出，默認(rèn)為番茄鐘。這么做的考慮有兩點(diǎn)：

* Coves是番茄工作法結(jié)合任務(wù)管理，默認(rèn)時(shí)間類型為番茄鐘符合邏輯；

* 新建的任務(wù)是重復(fù)使用的，所以需要寬泛性，減少用戶修改。由于環(huán)境不同，場(chǎng)景不同，同個(gè)任務(wù)需要三個(gè)時(shí)間類型切換，讓用戶不斷修改會(huì)顯操作麻煩。

2、將歷史中的成就移到統(tǒng)計(jì)版塊里的理由

* 成就的內(nèi)容是：使用次數(shù)，總時(shí)間，創(chuàng)建任務(wù)數(shù)量，時(shí)長(zhǎng)最長(zhǎng)、使用最多，單次最長(zhǎng)任務(wù)。這些屬于統(tǒng)計(jì)的范疇，所以放在統(tǒng)計(jì)板塊更合適。

視覺(jué)UI設(shè)計(jì)分析

首頁(yè)/任務(wù)

1.  導(dǎo)航欄處的“任務(wù)“改成了當(dāng)天日期，  可以讓用戶更合理的安排時(shí)間。

   

   
   

2. 操作指南單獨(dú)列出的考慮：手勢(shì)操作較簡(jiǎn)單，單獨(dú)列出更加直觀。

   

   
   

3. 將任務(wù)的空心圖標(biāo)換成實(shí)心圖標(biāo)：這些圖標(biāo)源于生活，延續(xù)物體原本含義，識(shí)別速度取決于色彩和形狀對(duì)視覺(jué)的吸引程度，圖標(biāo)更容易識(shí)別和區(qū)分。

   

   
   

4. 在功能上，正計(jì)時(shí)、倒計(jì)時(shí)設(shè)置放在右劃的操作上。

   

   
   

5. 交互動(dòng)效示意如下：

新建任務(wù)

1.  點(diǎn)擊和滑動(dòng)，用戶一般更傾向后者，所以顏色選擇采用滑動(dòng)形式。

   

   
   

2. 選擇圖標(biāo)的方式：采用滑動(dòng)的方式，減少用戶經(jīng)過(guò)二次點(diǎn)擊才能選擇圖標(biāo)。

   

   
   

3. 交互動(dòng)效示意如下：

4. 

統(tǒng)計(jì)頁(yè)面

1.  比例和趨勢(shì)間的切換移到與時(shí)間同行的位置，樣式在比例和趨勢(shì)的頁(yè)面形成統(tǒng)一。然后將成就圖標(biāo)放在右上角。

   

   
   

2. 比例圖示還是用傳統(tǒng)的樣式，這樣的考慮是：占比更加直觀，另外可以展示4項(xiàng)以上項(xiàng)目。

   

   
   

3. 原處的圖標(biāo)和數(shù)字間的距離太大，顯得關(guān)聯(lián)性不夠，所以適當(dāng)縮小兩者間的間距。按圖標(biāo)進(jìn)行比例占比，所以一個(gè)圖標(biāo)也會(huì)有很多不同項(xiàng)目，所以設(shè)計(jì)點(diǎn)擊圖標(biāo)或數(shù)字后展開(kāi)所含不同任務(wù)的占比。

   

   
   

4. 趨勢(shì)展示的修改是：將時(shí)間移到中間可查看各個(gè)任務(wù)所用時(shí)間。

   

5. 交互動(dòng)效示意如下：

   
   

icon圖標(biāo)

標(biāo)簽欄icon

其他icon

任務(wù)icon

頁(yè)面展示