制作IOS文本编辑界面.docx

制作IOS文本编辑界面使用形状工具配合路劲操作创建出各种形状，添加图层样式制作逼真效果。配色：界面以低饱和度、高明度的浅蓝色为背景，突出明快的页面气氛。在深色垫底上配白色文字，在浅色垫底上配黑色文字，鲜明对比突出文字，容易浏览。制作过程：形状工具制作界面状态栏——形状工具和文字工具制作界面导航栏——制作文本框和文字——制作键盘按钮步骤一：制作状态栏新建文件大小iPhone5: 640px*1136px ppi为326填充颜色绘制矩形绘制圆角矩形，半径5 px选择矩形——减去顶层对象设置图层样式——渐变叠加：#3f5c80——#506a8b 制作状态栏形状和文字，颜色为#c1cad6添加图层样式——投影信号制作方式：第一种在PS中绘制矩形，变换时移动，再执行CTRL+SHIFT+ALT+T第二种在AI中绘制两个矩形，执行混合（CTRL+ALT+B）将图层编组，命名为状态栏。步骤二：制作导航栏绘制矩形，填充渐变#587397——#becbdd在矩形底边绘制直线，粗细2px，颜色#3f5c80在矩形顶边绘制直线，粗细2px，颜色白色，不透明度35%在直线上绘制直线，粗细1px，不透明度50%在矩形底边绘制直线，粗细5px，渐变填充白色至黑色，不透明度0——100，不透明度35%步骤三：绘制按钮绘制圆角矩形，半径10px钢笔工具绘制形状，减去顶层对象，合并形状组件。设置图层样式——描边，渐变：#30363e——#375075——#375075设置图层样式——内阴影设置图层样式——渐变叠加：#41618d——#89a0be设置图层样式——投影使用文字工具输入文字，字体：HelveticaNeue，字号5.4，设置图层样式——投影输入文字，字号9，设置相同图层样式——投影。将形状编组，命名为背景，再将背景组和文字、形状图层编组，命名为导航栏。步骤四：制作文本框，圆角矩形，半径20px，填充#f7f7f7。输入文字，字符颜色#4f6392直线工具绘制文字光标，填充1d4fea；椭圆工具绘制形状，填充#aaaaaa，圆角矩形绘制X，填充白色，编组，命名为文本框。步骤五：制作键盘使用形状工具绘制圆角矩形，半径5px，填充#9098a3——#444e5c在圆角矩形顶部绘制直线形状，粗细1px，填充黑色，绘制圆角矩形，填充渐变，黑色——白色，不透明度100%——0%，图层不透明度20%使用形状工具绘制圆角矩形，半径10px，设置图层样式——内阴影。设置图层样式——渐变叠加填充颜色：#c4c6c9——白色设置图层样式——投影输入文字：Q，字体：HelveticaNeue，字号9.9，设置图层样式——投影图层编组，命名为Q 复制图层组，更改文字图层内容使用圆角矩形绘制空格，半径为10px，粘贴键盘Q的图层样式，输入文字space，文字颜色#525c69，字号7.65。粘贴键盘文字图层的图层样式。绘制圆角矩形，半径10px，粘贴键盘图层样式，更改渐变叠加效果，#515a67——#818994。使用文字工具输入文字123，粘贴文字图层样式。图层编组，命名为数字。绘制圆角矩形，半径为10px，粘贴键盘图层样式，更改渐变叠加效果，#194fdc——#4185f4。使用文字工具输入文字Go，粘贴文字图层样式。图层编组，命名为go。绘制圆角矩形，半径10px，粘贴键盘图层样式，更改渐变叠加效果，#515a67——#818994。绘制箭头，粘贴文字图层样式。图层编组，命名为箭头。图层编组，命名为键盘。