PS-工具类记账App界面设计

1.打开【PS】新建画布，命名【厉害记账明细】【750×1334像素】添加【参考线】【状态栏40像素】【导航栏88像素】【标签栏98像素】左右距离【30像素】选择【矩形工具】绘制状态栏，填充【#ffda44】导入【状态栏图标】添加文字【厉害记账】颜色【#333】字符【36点】效果如图所示。

2.导入【账本种类图标】【Ctrl+T】修改大小【50×50像素】导入【更多图标】【Ctrl+T】缩小，导入【日历图标】选择【矩形工具】绘制矩形【100×100像素】添加【参考线】选择【矩形1】【ctrl+T】调整高度，添加文字【2018年】【07】字符【48像素】距离2018【5–10像素】效果如图所示。

3.导入【向下图标】【Ctrl+T】调整大小，添加【渐变叠加】右键【栅格化图层】填充颜色【#333】【Alt+Delete】选择【矩形工具】绘制矩形【2×80像素】距离【向下图标】15像素，选择【2018】【Alt键】复制，修改文字【收入(元)】【Alt键】复制，修改文字【支出(元)】【Alt键】复制，修改文字【结余(元)】【Alt键】复制，修改文字【700】字符【30点】效果如图所示。

4.【Alt键】复制，修改文字【1200】，【Alt键】复制，修改文字【–1200】选择所有图层【Ctrl+G】编组命名【第一部分】添加文字【22日? 星期日】距离状态栏30像素，【Alt键】复制，修改文字【支出:1200】选择【选区工具】绘制【高度30】添加【参考线】效果如图所示。

5.选择【矩形工具】绘制矩形【794×1像素】填充【#ddd】选择所有图层【Ctrl+G】编组命名【第二部分】选择【椭圆工具】绘制椭圆【64×64像素】填充【#eee】距离上方参考线【20像素】导入【口红图标】【Ctrl+T】调整大小，添加文字【09:24】距离口红图标【10像素】字体颜色【#999】【Alt键】复制，修改文字【化妆品】【Alt键复制】修改文字【–500】具体如图所示。

6.选择【矩形3】【Alt键】复制，【Ctrl+T】修改宽度与9对齐，复制化妆品组，5个，选择【化妆品】分别修改文字【礼物】【出行】【医疗】【学习】【礼物】选择【09:24】修改文字【10:00】【10:05】【11:00】【13:00】，金额【–500】改为【–50】【–50】【–100】【–350】【–150】更换图标为【礼物图标】【出行图标】【医疗图标】【学习图标】【礼物图标】选择所有图层【Ctrl+G】编组命名【第三部分明细】效果如图所示。

7.选择【矩形工具】【148×97像素】填充【灰色】【Alt键】复制4个，选择5个矩形【Ctrl+T】调整宽度，新建图层，选择【矩形工具】绘制标签栏，填充【白色】选择【矩形5】添加【参考线】选择【椭圆工具】【130×130像素】填充【白色】【Ctrl+T】调整位置，选择【椭圆2】【矩形5】【Ctrl+E】合并图层，具体如图所示。