一個(gè)

有節(jié)操有信仰的

UI 設(shè)計(jì)師。

楊菲菲 2022

一名用戶體驗(yàn)設(shè)計(jì)師。

Hey, 我叫楊菲菲。

2021.04-2022.01 | 我云網(wǎng)絡(luò)

重點(diǎn)項(xiàng)目及成績(jī)

2019.09-2021.04 | 粒鏈網(wǎng)絡(luò)

重點(diǎn)項(xiàng)目及成績(jī)

1.【VICHAIN】官網(wǎng)改版上線一

2.【匯至通】后臺(tái)用戶體驗(yàn)好評(píng)

2018.10-2019.08 | 冰豐科技

小程序閃問(wèn)醫(yī)生獨(dú)立設(shè)計(jì)師。輸

2017.06-2018.05 | 雪雅服裝

履歷。

生于 ， 1994.12.12

2015-2017 | 閩江學(xué)院(本科) | 服裝設(shè)計(jì)與工程

已工作 年。 4

188 5967 1963 (微信同號(hào))

1183831400@qq.com

關(guān)于我。

18年只身來(lái)滬，開(kāi)始我的互聯(lián)網(wǎng)設(shè)計(jì)

熟悉多終端設(shè)計(jì)規(guī)范，擅長(zhǎng) 邏輯

識(shí)系，成為 名優(yōu)秀的復(fù)合型產(chǎn)品設(shè)

B端

絡(luò)科技 | 用戶體驗(yàn)設(shè)計(jì)師

絡(luò)科技 | 產(chǎn)品設(shè)計(jì)師

一個(gè)月后，新用戶訪問(wèn)量增長(zhǎng)了40%；

評(píng)。

技 | UI設(shè)計(jì)師

輸出UI稿及迭代、視覺(jué)運(yùn)營(yíng)設(shè)計(jì)工作。

裝 | 設(shè)計(jì)助理

計(jì)生涯，奈何待過(guò)3家公司，垮了2家，現(xiàn)希望找 家穩(wěn)定的B端企業(yè)，盡我所能為公司創(chuàng)造價(jià)值。

輯梳理和交互優(yōu)化，話少多做事。目前正在完善交互知識(shí)體系，希望通過(guò)未來(lái)的平臺(tái)建立并完善多領(lǐng)域知

設(shè)計(jì)師。

CONTENTS

內(nèi)容概況。

數(shù)據(jù)表格

2022.02

工作項(xiàng)目

wolai數(shù)據(jù)表格，為協(xié)同而生

快速設(shè)計(jì)

2021.03

UX Case Study

釘釘重設(shè)計(jì)，以員工體驗(yàn)為中心

案列研究 Redesign

afrtttbfbb

漿紙貿(mào)易

企業(yè)級(jí)平臺(tái)

2020.02

工作項(xiàng)目

漿紙貿(mào)易企業(yè)級(jí)平臺(tái)

B端產(chǎn)品設(shè)計(jì) 需求>功能 數(shù)據(jù)可視化

2020.02

實(shí)際項(xiàng)目

敬業(yè)簽筆記迭代

重構(gòu)視覺(jué)語(yǔ)言

工作項(xiàng)目

wolai數(shù)據(jù)表格，

為企業(yè)間協(xié)作

應(yīng)運(yùn)而生

背景

wolai 最初是一款筆記應(yīng)用，我們的用戶大多數(shù)是在團(tuán)隊(duì)項(xiàng)目中形成的，

，是當(dāng)前要解決的首要問(wèn)題。于是我們推出

，該功能于2021年11月正式上線。

如何

幫助團(tuán)隊(duì)高效協(xié)作 數(shù)據(jù)表格這一功

能，讓任務(wù)組織變得清晰明了

我的目標(biāo)

根據(jù)現(xiàn)有設(shè)計(jì)風(fēng)格，在有限的時(shí)間里面保證該功能的可用、易用性，考慮移動(dòng)

端的適配，并建立一套可供設(shè)計(jì)團(tuán)隊(duì)和開(kāi)發(fā)使用的組件庫(kù)。

我的角色

UX Design UI Design

項(xiàng)目周期 2021.08-2021.09

2

Weeks

5

Main pages

32+

Secondary pages

可操作的子界面、彈窗、空狀態(tài)等

工具

Figma Notion Photoshop After Effects Xnind

難

團(tuán)隊(duì)面臨資金等方面壓力，留給此項(xiàng)

員沒(méi)有余力深入把控細(xì)節(jié)。

所以，這對(duì)我來(lái)說(shuō)是一個(gè) 的

究。項(xiàng)目開(kāi)始前，產(chǎn)品提供了的功能

。

快速設(shè)計(jì)

快速審評(píng)

點(diǎn)

項(xiàng)目的 ，項(xiàng)目人預(yù)期時(shí)間并不充裕

的項(xiàng)目，我不希望自己進(jìn)行用戶研

能腦圖和PRD文檔，召集相關(guān)人員

信息結(jié)構(gòu)

數(shù)據(jù)表格changelog

視圖類型

表頭功能區(qū)

字段功能配置

可創(chuàng)建字段類型

可改變字段類型

字段列表可拖動(dòng)排序

隱藏字段

復(fù)制字段

刪除字段

排序功能

創(chuàng)建排序條件

清除排序條件

字段列表可拖動(dòng)排序

隱藏字段

復(fù)制字段

刪除字段

分組依據(jù)功能

創(chuàng)建分組依據(jù)功能

刪除分組依據(jù)功能

分組列表可拖動(dòng)調(diào)整順序

保存分組設(shè)置按鈕

取消按鈕

篩選功能 創(chuàng)建篩選條件

清除帥選條件

排序條件列表可拖動(dòng)調(diào)整順序

保存排序條件按鈕

取消按鈕

搜索功能

添加一條記錄或者一個(gè)頁(yè)面入口

更多功能入口 表頭顏色更改功能

開(kāi)啟單元格寬度自適應(yīng)功能

現(xiàn)實(shí)最后編輯人記錄

可以算/統(tǒng)計(jì)列相關(guān)值

首行

表體

表底

甘特視圖（二期）

表格視圖

相冊(cè)視圖

列表視圖

日歷視圖（二期）

視圖功能入口

私人視圖

公共視圖

保護(hù)視圖

固定標(biāo)題字段

切換視圖類型功能

新增視圖功能

編輯視圖功能-重命名

刪除視圖功能-重命名

復(fù)制視圖功能-重命名

添加新字段類型入口

視圖列表排序功能

視圖權(quán)限設(shè)置

數(shù)據(jù)表格

各個(gè)字段內(nèi)的數(shù)據(jù)條數(shù)統(tǒng)計(jì)顯示

復(fù)制行/列

刪除行/列

拖動(dòng)行/列排序

新增行/列排序

表格寬/行寬可調(diào)整

字段自適應(yīng)寬度

單元格類配置該字段相關(guān)參數(shù)/值/選項(xiàng)

數(shù)據(jù)表格標(biāo)題 整頁(yè)表格同頁(yè)面標(biāo)題

inline數(shù)據(jù)表格無(wú)標(biāo)題

優(yōu)化和組織信息結(jié)構(gòu)，為了后面能更清晰明了的設(shè)計(jì)，此外也能

讓團(tuán)隊(duì)達(dá)成統(tǒng)一共識(shí)。

讓想法在紙上快速落地

視圖類型

延續(xù)wolai現(xiàn)有功能結(jié)構(gòu)，在編輯區(qū)輸入“/”即可創(chuàng)建內(nèi)

容，例如文本塊，待辦列表塊...數(shù)據(jù)表格作為一個(gè)高級(jí)

塊，也能被新建出來(lái)。

輸入“/”快速新建表格

新增-彈窗編輯

效果

讓任務(wù)有組織地呈現(xiàn)

自定義表格以使其按您希望的方式工作。通過(guò)變換

視圖，以及 的方式，輕松完成多維度項(xiàng)目跟

蹤。

拖拽

表格視圖頁(yè)

選擇

擇標(biāo)簽彈窗

組織任務(wù)

標(biāo)簽便捷分類

標(biāo)簽出現(xiàn)在表格頁(yè)和任務(wù)編輯頁(yè)。它有3個(gè)基礎(chǔ)

（待完成、進(jìn)行中和已完成）以幫助用戶

組織他們的任務(wù)，也可在字段設(shè)置里自定義標(biāo)簽。

默認(rèn)

標(biāo)簽類別

看

任務(wù)編輯

組織任務(wù)

輕松添加任務(wù)

在看板視圖頁(yè)里，右上角“新增”按鈕可以直接

，表格里的“+”可新建任務(wù)卡片，這些功能幫助

用戶輕松組織他們的任務(wù)。

新建

任務(wù)

看板視圖頁(yè)

輯彈窗頁(yè)

共24人

P1

P2

多種視圖，構(gòu)建你想要的工作流程

建立多種視圖，方便根據(jù)數(shù)據(jù)業(yè)務(wù)結(jié)構(gòu)承載展示，滿足用戶對(duì)不

同類型數(shù)據(jù)的展示需求。

用戶測(cè)試

我們都需要建議

我向兩名代表用戶展示并測(cè)試了原型，以了解該應(yīng)用程序的用戶友好

程度。參與者說(shuō)，他們很欣賞這個(gè)原型。隨后，我們做了一些小的改

動(dòng)，然后就進(jìn)入了用戶界面階段。

設(shè)計(jì)系統(tǒng)

一個(gè)人走的更快，一群人走的更遠(yuǎn)

閑暇之余，逐步完善組建庫(kù)的建立。幫助產(chǎn)品和設(shè)計(jì)甚至開(kāi)發(fā)有一套一致的可

通用的規(guī)范體系， 原型制作和開(kāi)發(fā)中的 ，也使產(chǎn)品在未來(lái)迭代中變得

更容易。

減少 沖突

最終

“數(shù)據(jù)表格上線后，我們獲

更多合作機(jī)會(huì)

我們獲得了更多的客戶咨詢與

聯(lián)系，得到了更多的合作機(jī)會(huì)

以及商業(yè)收益。

獲得了更多客戶的咨詢。”

內(nèi)部員工

團(tuán)隊(duì)內(nèi)部協(xié)同

公司內(nèi)部替代了原有的協(xié)同平

臺(tái)...將工作任務(wù)和公司其他資

料遷移到自己的 wolai 平臺(tái)。

如何適應(yīng)不斷變化的需求

新的時(shí)間表、資源問(wèn)題和重新劃分優(yōu)先級(jí)

緊迫的期限內(nèi)

意味著項(xiàng)目的范圍在不斷變

化，我必須適應(yīng)這些變化，并且仍然在 及時(shí)交付最好的設(shè)

計(jì)。

我收獲的

此項(xiàng)目比預(yù)期時(shí)間晚完成，不斷變化的優(yōu)先級(jí)和不斷變化更正細(xì)節(jié)需求，推遲

了該功能的推出。盡管如此，我還是從這個(gè)項(xiàng)目中學(xué)到了一些與產(chǎn)品和業(yè)務(wù)流

程相關(guān)和交互細(xì)節(jié)的重要收獲。

始終為良好的用戶體驗(yàn)而戰(zhàn)

我必須在 下工作，但仍然為我認(rèn)為對(duì)擁有良好用戶

體驗(yàn)至關(guān)重要的東西而奮斗。

非常嚴(yán)格的技術(shù)限制

以社畜

重設(shè)計(jì) 釘

體驗(yàn)為中心

釘釘PC端

背景。

交互設(shè)計(jì) 視覺(jué)設(shè)計(jì)

角色

釘釘PC端客戶端

形式要素

2021年02月 - 2021年03月

周期

釘釘軟件功能與體驗(yàn)以 聞名。而企業(yè) 和 體驗(yàn)天然 。疫

情之際釘釘通過(guò)線上網(wǎng)課等一系列操作成功出圈。

迎合管理者 管理者 員工 存在沖突

工作之余，我決定“ ”為目標(biāo)，做釘釘

Redesign。

以員工為中心，更易學(xué)習(xí)，減輕企業(yè)級(jí)的權(quán)重

用戶調(diào)研

一個(gè)普社畜平常的一周。

周一，小王洗漱完畢去上班。到了公司，早會(huì)之后小王打開(kāi)電腦客戶端

釘釘把本周工作安排和行程記錄到日歷和待辦之中。開(kāi)始一天的工作。

周四，小王和開(kāi)發(fā)線上溝通了之前的設(shè)計(jì)稿。發(fā)送了改版的方案。

周二，上午小王和產(chǎn)品進(jìn)行了語(yǔ)音通

一邊喝開(kāi)發(fā)溝通設(shè)計(jì)細(xì)節(jié)

為了更加貼近事實(shí)，我觀察和訪談了身邊數(shù)個(gè)普通員工的一周的經(jīng)歷，總結(jié)出

以下場(chǎng)景和路徑。

通話，商討需求細(xì)節(jié)。下午一邊畫(huà)圖

周五，小王將新需求的設(shè)計(jì)稿發(fā)給了產(chǎn)品，溝通細(xì)節(jié)。并獲得了新的需

求。下班前小王開(kāi)始撰寫(xiě)本周的周報(bào)并發(fā)送給主管。晚飯后，小王

被“DING”的一聲打破了周末來(lái)臨的歡愉，從釘盤(pán)中找到文件，改稿，

發(fā)送。結(jié)束了平常的一周。

周三，產(chǎn)品將需求發(fā)送給了小王和大家。召開(kāi)了線上的需求評(píng)審會(huì)。

周一

周二

周三

周四

周五

問(wèn)題定義

優(yōu)化目標(biāo)—— 和 。 消息 文檔

通過(guò)以上調(diào)研提煉出，PC客戶端員工日常任務(wù)主要以消息溝通和交接物為主，

員工80%時(shí)間只使用這兩個(gè)功能。

問(wèn)題分析

窮舉問(wèn)題和擬定解決方案。

Problem Space severity(1-5)

好友消息太多，找不到10月份聊天的某位同事。

文檔結(jié)構(gòu)過(guò)于混亂和復(fù)雜，找目標(biāo)文檔相當(dāng)費(fèi)時(shí)

通話頁(yè)信息含量太多，偶爾不小心給領(lǐng)導(dǎo)發(fā)送了點(diǎn)贊表情包。

想更醒目的知道今天的工作行程和本周安排。

不能很快的查找最近其他好友的聊天記錄。

傻傻分不清消息通知和好友頭像。

由于資源限制，我選擇了在線可用性測(cè)試，以查看在消息溝通和使用文檔辦公

時(shí)的遇到的困擾。

時(shí)。

Solution Space

增加曬選入口，更好的管瘤消息。

重新組織文檔信息結(jié)構(gòu)，視圖上改變。

重新組織通話頁(yè)的功能，不同功能板塊加以區(qū)分。

增加dashboard。

增加最近好友的列表。

好友和消息通知視覺(jué)上區(qū)分，能更好的識(shí)別好友和消息通知。

解決方案

為溝通 ——消息頁(yè)。 降噪

在線版

改版

解決方案-消息頁(yè)

優(yōu)化視覺(jué)層，用戶可以輕松的選擇好友發(fā)送消息，不被

通知所干擾。

明了的好友選擇。

在線版 改版

在線版

改版

解決方案-消息頁(yè)

根據(jù)場(chǎng)景目標(biāo)與消息溝通和交接物為主的主要功能常

駐，轉(zhuǎn)移和隱藏員工低頻功能。

同時(shí)根據(jù)功能類型為功能分組，降低認(rèn)知成本。

簡(jiǎn)單的消息溝通。

搜索

前一周

前一周

全部

今天

前一

更早

開(kāi)始

解決方案-消息頁(yè)

增加消息篩選入口，以天為單位綜合查找信息。

單獨(dú)顯示當(dāng)天的消息，或者設(shè)置查看某一段時(shí)間范圍內(nèi)

的消息。

篩選上周五所有人的

消息。

索

UIDX 17:09

[文件]2019年銀行用戶…

王彬 17:07

好的

張靜晨 昨天

Hi，我通過(guò)你的好友請(qǐng)…

張光晨 04-20

好的 我們溝通一下再回復(fù)

待辦助手

智能日?qǐng)?bào) 1

昨天

普詩(shī)詩(shī) 04-22

章魚(yú)哥 已讀了你的DING

全員群：碧桂園 昨天

請(qǐng)問(wèn)一下這個(gè)日歷組件…

周

周

部

天

一周

早

始日期 截止日期

在線版

解決方案-消息頁(yè)

方便的記錄查詢。

改版

搜索組建左側(cè)，增加好友列表切換入口。減少任務(wù)目標(biāo)的操作次數(shù)，從而優(yōu)化任務(wù)

路徑。

解決方案-消息頁(yè)

被浪費(fèi)的空間。

在線版