一：工作中一個(gè)項(xiàng)目的工作流程：
一個(gè)項(xiàng)目從立項(xiàng)到后期產(chǎn)品上線的整個(gè)工作流程中攀隔，需要多個(gè)人員共同配合完成；
其中包含：（1）PM（產(chǎn)品經(jīng)理）栖榨，PM主要把控整個(gè)項(xiàng)目方向昆汹，完成需求文檔給到UE；
（2）UE（交互設(shè)計(jì)師）婴栽， 輸出原型圖給到UI設(shè)計(jì)師满粗；
（3）UI設(shè)計(jì)師，完成高保真視覺稿愚争，切圖映皆、標(biāo)注給到開發(fā)挤聘；
UI設(shè)計(jì)師除了界面設(shè)計(jì)之外，還要將視覺稿切圖捅彻、標(biāo)注給到開發(fā)工程師组去。在整個(gè)項(xiàng)目流程中，擔(dān)任了時(shí)覺負(fù)責(zé)人的工作步淹，統(tǒng)一規(guī)范的切圖从隆、標(biāo)注，可以保證項(xiàng)目的視覺統(tǒng)一缭裆，便于整個(gè)團(tuán)隊(duì)人員協(xié)作键闺，以及后期的產(chǎn)品迭代工作。
二：如何進(jìn)行一稿適配澈驼？
1：通常UI設(shè)計(jì)輸出1倍圖的設(shè)計(jì)稿尺寸：375x667pt辛燥；然后分別切@2x圖和@
3x圖，在1倍圖設(shè)計(jì)稿上進(jìn)行標(biāo)注缝其，給到開發(fā)交接文檔挎塌；
2：iphone7的750x1334px的尺寸，如何適配到iphoneX的750x1624px尺寸氏淑？
iphoneX的電量通知條是88px勃蜘，比iphone 7的電量條多出48px；在88px高度電量條中假残，將電量條的數(shù)據(jù)居中，如下圖：
同時(shí)iphoneX在底部多出了68px的操作欄（68px中的細(xì)框：268x10px炉擅；距底部18px辉懒；），接著上邊是98px的tab欄谍失；如下圖：
三：切圖的目的眶俩？
（1）為了適應(yīng)多種屏幕的分辨率；
（2）為了減小文件安裝包的容量快鱼，增加運(yùn)行效率颠印；
（3）提高組件的復(fù)用性；
（4）達(dá)到組件和尺寸規(guī)范的標(biāo)準(zhǔn)統(tǒng)一化抹竹；
四：切圖的命名方式：
對(duì)于規(guī)則的幾何圖形的按鈕直接把高度线罕、寬度、圓角大小標(biāo)注出來給到開發(fā)即可窃判，不用切圖钞楼；
對(duì)于有陰影的按鈕或icon等應(yīng)該怎么切呢？
對(duì)于有陰影的按鈕或icon等袄琳，可以直接切沒有陰影效果的部分询件，之后寫清楚效果燃乍，開發(fā)人員可以直接代碼寫出；或者將陰影部分也切出來宛琅；具體情況和開發(fā)溝通即可刻蟹。
方法1：按照控件格式命名：控件_類別_功能_狀態(tài)@倍率.png;
切圖時(shí)按鈕的狀態(tài)有3種：①默認(rèn)狀態(tài)：nor/def；②點(diǎn)擊狀態(tài)：pre嘿辟；③不可點(diǎn)擊狀態(tài)：dis座咆；
例如： 首頁標(biāo)簽欄默認(rèn)狀態(tài)下的圖標(biāo)：tab_icon_home_def@2x.png;
例如： 菜單頁導(dǎo)航欄點(diǎn)擊狀態(tài)下的圖標(biāo)：nav_icon_menu_pre@2x.png;
例如： 工具欄添加狀態(tài)圖標(biāo)：toolbal_icon_add@2x.png;
方法2：按照頁面切圖命名格式：頁面_類別_功能_狀態(tài)@倍率.png;
例如： 郵件頁面下的搜索圖標(biāo)：mail_icon_search_pre@2x.png;
啟動(dòng)頁切圖方法：在純色背景下，只用切圖像即可仓洼，不用切背景介陶；
啟動(dòng)頁命名：splashecreen@2x.png;
登錄頁命名：
①登錄頁背景：login_bg@2x;??
②登錄頁icon：login_logo@2x;
③登錄按鈕：login_btn_nor@2x;
④登錄按鈕選中狀態(tài)：login_btn_pre@2x;
列表頁命名：
list_功能描述_狀態(tài)描述.png;? ? 如：list_icon_bookmark@2x;
五：切圖的方法：
1：ps中切圖方法：
①：純手工切圖，需要用到ps中的畫板工具色建；
a:新建透明背景的畫板哺呜；
b:在要切圖的圖層上新建矩形，降低不透明度箕戳；然后圖層-新建基于圖層的切片某残；隱藏矩形；
c:雙擊選中切片工具陵吸，切片命名玻墅；
d:保存ctrl+alt+shift+s，選擇png_24,只想導(dǎo)出切片壮虫，可以選擇：選中的切片澳厢；
②：利用切圖插件切圖：藍(lán)湖等；
2：sketch中切圖方法：
①sketch中的sketch measure進(jìn)行切圖標(biāo)注囚似；
標(biāo)注原則：按照位置剩拢、大小、樣式分開標(biāo)注饶唤，劇中的元素可以不標(biāo)注徐伐，通欄寬度不用標(biāo)注；標(biāo)注字體大小募狂、樣式办素；
按鈕標(biāo)注方法：按鈕各種狀態(tài)都要展示出來；icon后邊有數(shù)字的祸穷，需要標(biāo)注固定圖標(biāo)間間距性穿；
熱區(qū)標(biāo)注方法：標(biāo)注熱區(qū)是切圖的熱區(qū)，不同于開發(fā)時(shí)的熱區(qū)粱哼，切圖熱區(qū)會(huì)相對(duì)小一些季二，同一層級(jí)的icon在切圖時(shí)切圖大小保持一致。
