背景簡(jiǎn)述，多個(gè)前端和后端協(xié)同開發(fā)一個(gè)權(quán)限管理系統(tǒng)新蟆，技術(shù)棧是java + vue + element
我的bug
bug數(shù)量19,冒煙測(cè)試：無(wú)bug觅赊，嚴(yán)重：4，一般：7琼稻，提示：8吮螺，
bug分解
4個(gè)嚴(yán)重bug
- 用戶管理、添加用戶時(shí)沒(méi)有默認(rèn)密碼
- 用戶管理-編輯用戶信息后，留在選擇的頁(yè)面鸠补。
- 用戶管理萝风、添加用戶頁(yè)面的角色框和設(shè)計(jì)不一致
- ……
7個(gè)一般bug
- 用戶管理、編輯密碼后再次點(diǎn)擊密碼框紫岩，密碼消失
- 用戶管理规惰、用戶列表中無(wú)角色用戶不能啟用
- 用戶管理、添加用戶時(shí)泉蝌，選擇角色超過(guò)一行時(shí)彈框拉長(zhǎng)歇万，不要混動(dòng)條
- 用戶管理、用戶列表只有一個(gè)用戶時(shí)勋陪，點(diǎn)擊查詢報(bào)500錯(cuò)誤
- 用戶管理贪磺、該模塊所有按鈕的hover顏色不符合設(shè)計(jì)稿
- 用戶管理、添加用戶的彈框位置不正確
- ……
8個(gè)提示bug
- 用戶管理诅愚、用戶列表不要自適應(yīng)
- 用戶管理寒锚、用戶列表在1366*768時(shí)出現(xiàn)混動(dòng)條
- 布局問(wèn)題。
- 權(quán)限設(shè)置违孝、權(quán)限管理的展開箭頭位置不正確（360瀏覽器）
- 用戶管理刹前、用戶列表的查詢按鈕點(diǎn)擊后顏色變化
- ……
能記得的bug就這么多了，從上面可以看到雌桑，bug的種類很多腮郊，有ui問(wèn)題比如沒(méi)有還原設(shè)計(jì)稿，有交互問(wèn)題筹燕，還有的是自找麻煩
具體分析部分bug產(chǎn)生原因
交互的bug
用戶管理轧飞、添加用戶時(shí)沒(méi)有默認(rèn)密碼
產(chǎn)生問(wèn)題原因：第一版產(chǎn)品稿要有默認(rèn)密碼，后來(lái)被產(chǎn)品否掉這個(gè)功能撒踪，而且通過(guò)郵件通知了開發(fā)过咬，只是原型沒(méi)改，而我看過(guò)之后忘記了這茬制妄，按照原型開發(fā)所以產(chǎn)生了bug
主要是差了一點(diǎn)細(xì)心用戶管理-編輯用戶信息后掸绞，留在選擇的頁(yè)面
產(chǎn)生問(wèn)題的原因：交互體驗(yàn)問(wèn)題，用戶管理是一個(gè)列表耕捞，在那一頁(yè)編輯后還應(yīng)該停留在操作之前的頁(yè)面而不應(yīng)該刷新跑到第一頁(yè)衔掸，
其實(shí)這可以算一個(gè)bug也可以算一個(gè)優(yōu)化，因?yàn)楫a(chǎn)品沒(méi)有明確的規(guī)定俺抽，應(yīng)該如何交互敞映，但是我個(gè)人感覺(jué)測(cè)試提出來(lái)的這個(gè)交互確實(shí)要優(yōu)于每次編輯后跑到第一頁(yè)用戶管理、用戶列表只有一個(gè)用戶時(shí)磷斧，點(diǎn)擊查詢報(bào)500錯(cuò)誤
產(chǎn)生問(wèn)題原因：修改了一個(gè)問(wèn)題而產(chǎn)生的另一個(gè)問(wèn)題振愿，更改一個(gè)問(wèn)題后沒(méi)有再次冒煙測(cè)試
ui還原的bug
用戶管理捷犹、添加用戶頁(yè)面的角色框和設(shè)計(jì)不一致
產(chǎn)生問(wèn)題的原因：不是同一個(gè)人開發(fā)的模塊，一個(gè)用的是button一個(gè)用的是el-botton
這個(gè)問(wèn)題確實(shí)是很多中小公司普遍存在的一個(gè)問(wèn)題冕末，原因是不同的開發(fā)同時(shí)開發(fā)同一個(gè)項(xiàng)目的不同模塊萍歉，而且沒(méi)有統(tǒng)一的開發(fā)標(biāo)準(zhǔn)很規(guī)范，導(dǎo)致會(huì)有1~2個(gè)像素的偏差用戶管理档桃、用戶列表不要自適應(yīng) / 用戶管理枪孩、用戶列表在1366*768時(shí)出現(xiàn)混動(dòng)條 / 布局問(wèn)題
產(chǎn)生問(wèn)題的原因：自作聰明
上面的三個(gè)bug都是ui還原的bug
都是自找的問(wèn)題，根據(jù)之前的慣性思維對(duì)表格做了適配希望在不同的屏幕上看到的bug都是一屏展現(xiàn)藻肄，而不需要滾動(dòng)條蔑舞，ui看過(guò)之后表示不需要做適配，從而導(dǎo)致了后面的兩個(gè)布局的問(wèn)題用戶管理仅炊、該模塊所有按鈕的hover顏色不符合設(shè)計(jì)稿
產(chǎn)生問(wèn)題原因：ui頻繁的更改產(chǎn)品色調(diào)斗幼，而我沒(méi)有及時(shí)調(diào)整更新規(guī)范文檔澎蛛，還有就是樣式的層級(jí)問(wèn)題element不同的類型hover顏色不一樣抚垄，所以需要有一個(gè)更高層級(jí)的東西覆蓋原來(lái)的樣式一勞永逸
兼容性問(wèn)題
- 權(quán)限設(shè)置、權(quán)限管理的展開箭頭位置不正確（360瀏覽器）
產(chǎn)生問(wèn)題原因：element自帶的bug,而我沒(méi)有測(cè)試到360瀏覽器谋逻，自我測(cè)試的問(wèn)題
插一個(gè)開發(fā)和產(chǎn)品,ui爭(zhēng)執(zhí)的一個(gè)點(diǎn)
看上圖產(chǎn)品在規(guī)劃的時(shí)候是有跳轉(zhuǎn)功能的呆馁，但是ui設(shè)計(jì)的時(shí)候是沒(méi)有這個(gè)跳轉(zhuǎn)的
開發(fā)在第一版的時(shí)候也是添加了這個(gè)跳轉(zhuǎn)功能的，但是看了ui圖之后又去掉了毁兆，測(cè)試的時(shí)候給我們提了一個(gè)bug
但是ui和開發(fā)都不認(rèn)為是自己的問(wèn)題浙滤，ui認(rèn)為這些實(shí)現(xiàn)細(xì)節(jié)需要按產(chǎn)品的來(lái)而且這個(gè)是常識(shí)性問(wèn)題，他們只是出樣式气堕。而開發(fā)認(rèn)為這屬于樣式問(wèn)題纺腊，產(chǎn)品怎么畫，開發(fā)就怎么實(shí)現(xiàn)茎芭，應(yīng)該是ui的鍋
其實(shí)這個(gè)引申出來(lái)一個(gè)問(wèn)題就是我們開發(fā)的時(shí)候細(xì)節(jié)是看產(chǎn)品還是ui設(shè)計(jì)稿揖膜，關(guān)于這一點(diǎn)是有一個(gè)很明確的答案，一切按照產(chǎn)品文檔來(lái)梅桩，至于ui沒(méi)有畫跳轉(zhuǎn)框是可以給ui提bug的壹粟，如果ui認(rèn)為這是常識(shí)性問(wèn)題，那么ui應(yīng)該把這個(gè)常識(shí)性的東西寫到ui開發(fā)規(guī)范文檔里宿百，一勞永逸趁仙。
總結(jié)
產(chǎn)品評(píng)審的時(shí)候，腦子里一定要有產(chǎn)品實(shí)現(xiàn)的交互細(xì)節(jié)垦页，不清楚的地方一定要和產(chǎn)品溝通清楚
ui評(píng)審的時(shí)候如果有必要一定要拉著ui問(wèn)一下他想要什么樣的布局雀费，好的布局在產(chǎn)品體驗(yàn)上還是很有優(yōu)勢(shì)的，而且ui在提測(cè)后也會(huì)參與ui驗(yàn)收痊焊，你的布局不一定是設(shè)計(jì)師想要的效果（極端情況下坐儿，如很小的屏幕律胀，滾動(dòng)條出現(xiàn)的位置等等），這個(gè)時(shí)候在來(lái)討論是誰(shuí)的鍋已經(jīng)不重要貌矿，因?yàn)榇蠹叶枷胍瓿梢粋€(gè)優(yōu)秀的產(chǎn)品炭菌，所以需要把這種情況扼殺在搖籃里
不要自作聰明將別的項(xiàng)目的風(fēng)格習(xí)慣帶到新的產(chǎn)品中來(lái)，如上述bug表格的屏幕適配問(wèn)題逛漫，要不然后果就是你發(fā)費(fèi)時(shí)間做出來(lái)的功能黑低，ui會(huì)否掉，并且增加一個(gè)bug酌毡。開發(fā)在ui評(píng)審會(huì)上可能不能想到所有的細(xì)節(jié)克握，開發(fā)過(guò)程中也是可以溝通的，要在模糊的問(wèn)題上做好溝通工作
不要相信什么常識(shí)性問(wèn)題枷踏，因?yàn)槊總€(gè)人對(duì)于常識(shí)性問(wèn)題的認(rèn)知不一定一樣菩暗，當(dāng)然我們要相信專業(yè)的人做專業(yè)的事情，如果ui認(rèn)為是常識(shí)性的東西旭蠕，記得要讓他更新到ui開發(fā)規(guī)范文檔里停团，避免扯皮問(wèn)題的發(fā)生
