1.驗(yàn)收目標(biāo)
減少上線稿件與設(shè)計(jì)稿之間前端還原的落差
2.結(jié)果對(duì)比
- 安卓端由于排期問題 還存在部分內(nèi)容沒有來得及更改。MD原生組件規(guī)范導(dǎo)致狀態(tài)欄只能采用原來的藍(lán)色末秃,不能跟設(shè)計(jì)稿統(tǒng)一概页,視覺分裂感較強(qiáng)
- iOS端由于驗(yàn)收和修改的時(shí)間較為充裕,上線之后與設(shè)計(jì)稿幾乎無出入练慕,但是驗(yàn)收過程占用時(shí)間和精力較多惰匙,且部分設(shè)計(jì)稿效果無法100%還原
- h5還原得比較好,驗(yàn)收也沒有占用多少時(shí)間
3.原因分析
-
時(shí)間緊張
排期時(shí)未注明【投標(biāo)頁】為重設(shè)計(jì)頁面铃将,導(dǎo)致前端算錯(cuò)了檔期项鬼,工作較緊急
-
框架原因
設(shè)計(jì)稿使用的是375pt寬度的尺寸,而安卓和iOS開發(fā)使用的是360和320的尺寸劲阎,導(dǎo)致部分情況下前端容易造成誤操作(比如用375的設(shè)計(jì)稿下的字體大小直接輸入到320尺寸的開發(fā)框架中)
-
溝通不到位
設(shè)計(jì)的時(shí)候?qū)η岸丝蚣芾斫獠坏轿换婷耍O(shè)計(jì)了不能完全還原的卡片投影形式,而前端工具做不到像設(shè)計(jì)工具那樣呈現(xiàn)組件悯仙,導(dǎo)致卡片組件需要重新設(shè)計(jì)和尺寸上的溝通龄毡,浪費(fèi)了一些時(shí)間;
前端遇到問題并沒有主動(dòng)找設(shè)計(jì)師去溝通,導(dǎo)致問題只能在驗(yàn)收中被發(fā)現(xiàn);
將設(shè)計(jì)稿上傳至藍(lán)湖后锡垄,并沒有跟前端進(jìn)行設(shè)計(jì)思路的說明沦零,前端拿到設(shè)計(jì)稿就開始還原,過程中缺少必要的溝通货岭,這也是思維模式的區(qū)別路操,設(shè)計(jì)師和前端開發(fā)者工作類型不同序攘,使用的工具不同,思考的模式必然存在著差異性
4. 總結(jié)規(guī)律
- 如果是頁面改版的話寻拂,交付設(shè)計(jì)稿時(shí)要標(biāo)記出改動(dòng)的部分,方便前端估算用時(shí)和排期
- 交付設(shè)計(jì)稿之后丈牢,在旁邊附加上一個(gè)簡單的設(shè)計(jì)規(guī)范祭钉,注明通用組件的尺寸和要注意的地方,減少因?yàn)闇贤ú坏轿粚?dǎo)致的設(shè)計(jì)稿偏差
- 驗(yàn)收時(shí)多跟開發(fā)交流己沛,不能僅局限在釘釘?shù)慕涣魃匣藕耍颠€驗(yàn)收結(jié)果時(shí)可以坐到前端旁邊,這樣可以及時(shí)又效率的了解前端還原設(shè)計(jì)稿的方式以及他們的還原思路申尼,避免一些無法落地的設(shè)計(jì)(本次已實(shí)行垮卓,驗(yàn)證了有效性)
- 對(duì)齊規(guī)則和間距直接標(biāo)注在設(shè)計(jì)稿上,提高還原效率
- 如果是重要/大規(guī)模改動(dòng)的設(shè)計(jì)稿师幕,在前端著手還原之前粟按,可以開一個(gè)簡短的設(shè)計(jì)稿講解會(huì)議,這樣更有效率霹粥,前端的疑惑可以直接提出直接解答灭将,不需要同一個(gè)問題回答三遍給三方前端
- to 上條補(bǔ)充:也可以把前端小哥哥小姐姐拉進(jìn)同一個(gè)群 有什么問題群里問群里回答,這樣也能減少對(duì)接三方的耗時(shí)