數(shù)據(jù)產(chǎn)品PRD設(shè)計(jì)經(jīng)典四原則
編輯導(dǎo)讀:大多數(shù)人對(duì)數(shù)據(jù)產(chǎn)品的印象停留在功能,先能用、解決問題再說,好用、易用是更高層級(jí)的需求。但是,產(chǎn)品PRD的美感上升了,產(chǎn)品上線效果也會(huì)更好一些,畢竟數(shù)據(jù)產(chǎn)品的美觀度不會(huì)超過產(chǎn)品經(jīng)理的美感。本文作者提出了數(shù)據(jù)產(chǎn)品PRD設(shè)計(jì)經(jīng)典四原則,與你分享。
企業(yè)內(nèi)部的數(shù)據(jù)產(chǎn)品主要服務(wù)于內(nèi)部的產(chǎn)品、運(yùn)營同學(xué),對(duì)內(nèi)的B端的產(chǎn)品原則一般是功能先行,先能用、解決問題再說,好用、易用是更高層級(jí)的需求。因此,多數(shù)數(shù)據(jù)產(chǎn)品是不配備UI、UE等設(shè)計(jì)師資源的,作為追求極致、追求美感的數(shù)據(jù)產(chǎn)品經(jīng)理人,掌握一些基本的設(shè)計(jì)原則,產(chǎn)品PRD的美感上升了,產(chǎn)品上線效果也會(huì)更好一些。畢竟數(shù)據(jù)產(chǎn)品的美觀度不會(huì)超過產(chǎn)品經(jīng)理的美感。
直接說提升個(gè)人的審美能力太過于抽象,難以執(zhí)行落地,掌握一些設(shè)計(jì)理論則可以實(shí)際產(chǎn)品設(shè)計(jì)過程中,提供具體的方法指引。設(shè)計(jì)理論中,最經(jīng)典的莫過于親密性原則、對(duì)齊原則、重復(fù)性原則、對(duì)比原則,雖然老但歷久彌新。
一、親密性原則
親密性:將相關(guān)的內(nèi)容或元素組織在一起,讓用戶可以更加直觀地發(fā)現(xiàn)元素之間的關(guān)系。
左邊的圖片中,這兩個(gè)人走在大街上,我們是沒法直接判斷兩人之間的關(guān)系的,可能就是擦肩而過、匆匆相逢的陌生人。但是右側(cè)圖片將兩者的距離拉近了,我們就有更高的自信做出判斷:這兩個(gè)人可能是母子或者其他親屬關(guān)系。
例如在做數(shù)據(jù)可視化報(bào)表頁面設(shè)計(jì)時(shí),指標(biāo)卡片作為每一個(gè)相對(duì)獨(dú)立的區(qū)域,將一個(gè)指標(biāo)的數(shù)值、同比、環(huán)比、均值、趨勢(shì)縮略圖等信息聚合到同一個(gè)卡片區(qū)域內(nèi),訪問這個(gè)頁面的用戶就可以在這一個(gè)區(qū)域內(nèi),獲取指標(biāo)的相關(guān)信息,相反,如果所有指標(biāo)全部全部在同一空間內(nèi),閱讀者就需要自己做視覺上的拆分。
二、對(duì)齊原則
對(duì)齊:任何元素都不能在頁面上隨意擺放。每個(gè)元素應(yīng)當(dāng)與頁面上的另外一個(gè)元素存在某種視覺聯(lián)系,寫PPT時(shí)要關(guān)注文字對(duì)齊、圖片對(duì)齊等,對(duì)齊可以讓頁面的秩序感更強(qiáng),而不是雜亂無章。
這個(gè)名片中,左側(cè)的版本姓名、地址、電話、職位等信息被安放在名片的各個(gè)位置,閱讀者看到這些內(nèi)容的時(shí)候,要去自己理解、轉(zhuǎn)化,而右側(cè)的版本通過對(duì)齊的方式,頁面更加簡潔、信息的次序感也更明顯。
數(shù)據(jù)產(chǎn)品會(huì)有非常多的條件篩選或者表格的字段內(nèi)容,以表格為例,不同的對(duì)齊方式效果也有較大差異。例如名稱類的文字描述,字段長度會(huì)各不相同,居中對(duì)齊或右對(duì)齊看起來會(huì)雜亂,而左對(duì)齊則更整潔。對(duì)于指標(biāo)數(shù)值類,用右對(duì)齊的方式則可以更加清楚的對(duì)比數(shù)值直接的差異,比如是三位還是兩位數(shù)值一目了然。
三、重復(fù)性原則
重復(fù)原則:頁面顏色、字體、圖形、形狀、材質(zhì)、空間關(guān)系等重復(fù)出現(xiàn),從而增強(qiáng)條理性,加強(qiáng)統(tǒng)一性,使頁面更富有層次感、邏輯性,有規(guī)律的重復(fù)可以產(chǎn)生節(jié)奏感和韻律美,加深印象。
上圖中,一級(jí)標(biāo)題采用相同的字體和顏色,每個(gè)段落采用一致的項(xiàng)目符號(hào),閱讀者看到后會(huì)更加直觀的了解哪些是段落標(biāo)題,哪些是具體的內(nèi)容項(xiàng)目。數(shù)據(jù)產(chǎn)品設(shè)計(jì)過程,要重點(diǎn)關(guān)注一致性原則,比如相同的組件的文案描述,比如對(duì)于操作彈窗,前面頁面叫確定,后面頁面叫保存,新的概念引出增加額外的理解成本。
四、對(duì)比原則
對(duì)比:頁面上的不同元素之間通過對(duì)比來突出差異,吸引用戶。對(duì)比不僅可以用來吸引眼球,還可以用來組織信息、清晰層級(jí)、在頁面上指引讀者,并且制造焦點(diǎn)
上圖左側(cè)所有文字顏色、大小都非常相近,很難區(qū)分出標(biāo)題、段落及正文之間的關(guān)系,而右側(cè)方案中,文字大標(biāo)題通過字體顏色以及背景、段落采用加黑加粗的方式,突出不同內(nèi)容之間的差異,可以起到更加直觀、清晰的層級(jí)關(guān)系。
數(shù)據(jù)產(chǎn)品設(shè)計(jì)中,針對(duì)用戶交互說明的異常提醒、必填字段與非必填字段的差異,不同操作按鈕之間的對(duì)比等等,都可以利用對(duì)比原則來進(jìn)行凸顯差異。例如,取消和確定是兩種不同的操作,采用相同或相近的顏色時(shí),用戶需要反應(yīng)時(shí)間,而采用明顯的對(duì)比色,則可以非??焖俚拇_定兩者之間的差異。
五、總結(jié)
這四個(gè)原則看似非常簡單,甚至有些同學(xué)會(huì)感覺“這些道理我也都懂呀”。但如果能夠融會(huì)貫通,在數(shù)據(jù)產(chǎn)品設(shè)計(jì)中時(shí)刻遵守這些原則,量變引起質(zhì)變,從而帶來產(chǎn)品PRD設(shè)計(jì)美感的整體提升,不僅如此,工作總結(jié)匯報(bào)、項(xiàng)目復(fù)盤PPT也可以應(yīng)用起來。
#專欄作家#
數(shù)據(jù)干飯人,微信號(hào)公眾號(hào):數(shù)據(jù)干飯人,人人都是產(chǎn)品經(jīng)理專欄作家。專注數(shù)據(jù)中臺(tái)產(chǎn)品領(lǐng)域,覆蓋開發(fā)套件,數(shù)據(jù)資產(chǎn)與數(shù)據(jù)治理,BI與數(shù)據(jù)可視化,精準(zhǔn)營銷平臺(tái)等數(shù)據(jù)產(chǎn)品。擅長大數(shù)據(jù)解決方案規(guī)劃與產(chǎn)品方案設(shè)計(jì)。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理,未經(jīng)作者許可,禁止轉(zhuǎn)載。
題圖來自Unsplash,基于CC0協(xié)議
這是設(shè)計(jì)相關(guān)知識(shí),跟PRD不搭架啊
是不是可以給人人提個(gè)需求,發(fā)布的內(nèi)容審核一下下呢?哈哈哈~
就這?!
《寫給大家看的設(shè)計(jì)書》
聽君一席話,如聽一席話
感覺和prd關(guān)系不大, 比較像排版四原則的介紹之類的
自信點(diǎn),把感覺去掉
+1