简介一份面向应届 UI 设计师求职场景的简历模板文档以简洁版式呈现适用于需要快速投递作品集或岗位申请的视觉设计、交互设计专业学生。内容着重展示候选人核心优势涵盖 Cinema4D、After Effects、Photoshop、Illustrator 等主流设计软件实操能力同时加入了手绘、吉他弹唱等艺术特长体现综合审美素养实习经历部分包括新媒体制作、网站搭建、短片摄制等落地项目并附有国家级奖学金和设计大赛奖项能直观勾勒出一名具备全面技能与竞赛验证的应届设计师形象。资源整体是一个 docx 文件约 18KB便于直接打开阅读或修改后使用。现有 89 人学习适合正在整理作品集或撰写求职简历的设计类毕业生借鉴参考也可帮助 HR 快速了解应届 UI 设计岗位常见经历写法与能力描述重点。1. 为什么应届UI设计师简历要以简洁为默认风格HR 筛选一份应届 UI 简历的平均时间通常不到 15 秒。我见过不少作品功底还不错的应届生把两页纸塞满了图标、技能条、进度环和五颜六色的边框结果核心信息被装饰淹没。这个标题里的“简洁”不是简单而是让内容在最短时间内被结构化读取。对于没有正式项目经验的应届生简洁本身就是一种设计能力的证明你懂得取舍信息层级知道用留白而非纹样来排版。这条路线对 UI 岗尤其适用因为你的简历本身就在被当成作品集的第一页来审视。下面从 Word 排版、作品集交付、内容取舍和可维护的模板代码四个方向把这条方案完整走一遍。2. 用 Word 排一页式简洁 UI 简历从页面设置到字体行距的参数控制很多应届生会直接用网上下载的模板但模板自带的复杂样式往往与“简洁”背道而驰。我一般会从一张空白 Word 页面开始手动控制每一个参数这样后续改动最可控。这一章给出可直接套用的参数表以及为什么这样设置。2.1 页面尺寸、页边距与一页边界的设定打开 Word 后先做三件事设页面、设边距、关闭“指定行网格”。新建空白文档依次点击“布局 → 纸张大小 → A4”然后设置页边距。对于一页式简历建议上下边距取1.4cm左右边距取1.6cm。上下边距过小会显得拥挤过大则压缩有效内容左右边距稍大可以避免文字贴近纸边。这个数值是经过多份可读性较好的简历验证过的。接着要把内容控制在一页内。除了靠内容减量还可以在“布局 → 页边距 → 自定义页边距”里把“多页”设置为“对称”但这只是对保留页面结构有意义。更实用的做法是把正文超出一页时高亮显示超出的段落通过调整字号和行距来保证刚好一页。注意不要用“缩小字体填充”这类自动缩放因为它会把正文字号压得不一致破坏层级。2.2 字体、字号与行距的推荐参数简洁风格的核心是字体种类少、字号层级清楚。中文字体推荐“微软雅黑”西文字体推荐“Segoe UI”或“Arial”。整份简历原则上只使用两种字体一种无衬线中文字体一种相近的西文字体。但 Word 里中文和西文可以分别设置所以实际不需要切换字体只需在主字体里选中文微软雅黑、西文 Arial。字号方面我用成这样一张表内容层级字体字号pt加粗颜色姓名微软雅黑22是纯黑#000000求职意向/联系方式微软雅黑9否深灰#444444模块标题教育背景、项目经验等微软雅黑12是纯黑左侧加一条 4px 竖线正文内容微软雅黑10.5否深灰#333333时间/地点等辅助信息微软雅黑9否中灰#666666行距方面全局段落行距设为“固定值 16 磅”段落间距设为“段前 2 磅、段后 2 磅”。姓名和模块标题的段前段后可以适当放宽到 6 磅。这样整体版面会保持均匀的密度不会出现某一段特别稀疏、另一段挤在一起的情况。为什么不用 12pt 正文因为应届生简历内容往往不足以支撑长篇字体偏大容易显得空10.5pt 是中文阅读最舒服的尺寸配合 16 磅行距正好形成清晰的“行栅格”。如果 HR 的屏幕分辨率偏低或对方把 PDF 放大到 150% 看9pt 的辅助信息也还是可读的。2.3 用段落边框和制表位替代大块色块很多“简洁”模板会把模块标题做成深色背景或者全宽色块。在 Word 里这样做的代价是难以精确控制对齐而且打印耗墨多。我一般改用“段落边框”做模块分隔。具体做法是把光标放在模块标题开头在“开始 → 段落 → 边框”里选择“左边框”然后打开“边框和底纹”把宽度设为 3 磅颜色设为纯黑。这样每个模块标题左侧会有一条竖线竖线左边距可以通过“段落缩进”里的“左缩进”调整为负值让竖线贴到页边距上。制表位则是处理“项目经验”这类既有岗位又有时间的信息。例如在“XX科技上海— UI 设计师实习生”这一行里把岗位写在前面时间写在右侧。做法是在段落里插入一个右对齐制表位位置在页面宽度减去左边距和右边距后的最右侧。例如 A4 纸宽 21cm左右边距各 1.6cm那么有效宽度是 17.8cm右缩进位置设为 17.8cm并在该位置添加一个“右对齐”制表位。这样只需要按一下 Tab 键时间就会自动靠右调整内容也不会跑位。行内信息的关键字可以用加粗或深色突出但不要使用文字下划线或底色。下划线会干扰中文字体的识别底色则让页面变脏。例如“负责 App 内购流程的视觉优化”这句在“视觉优化”上使用加粗即可不要整行加粗。3. 作品集与附件的交付细节文件命名、PDF 导出和链接检查简历里的“作品集”通常体现在两个位置简历本身提及的项目链接以及附件附带的 PDF 作品集。应届生最容易栽在这两步文件名随意、作品集体积过大、链接打不开。这一章围绕 docx 转 PDF 后的交付物把细节流程理一遍。3.1 文件命名的格式与常见错误先说一个几乎每天都会看见的错误新建文档.docx或未命名-1.docx。HR 下载下来后存到本地文件名如果不是姓名就得手动重命名这已经是一种减分。通用命名格式是“应聘岗位 姓名 简历”例如UI设计师-张三-简历.pdf。如果对方要求提供作品集可以命名为UI设计师-张三-作品集.pdf。文件名里不要加日期、版本号或“最终版”这类词。我见过有人发来简历最终版4好点版本-1.docx这会让 HR 怀疑你的版本管理能力。另外应届生同时投递大小公司时不要随意给简历命名加公司缩写一旦忘记改发错文件就很尴尬。保持岗位姓名文档类型是最稳妥的。在 Windows 上Word 导出 PDF 后文件名中的中文会和 PDF 内嵌字体正常交互但如果你使用 macOS默认导出 PDF 时会在文件名后追加时间戳。建议导出后手动去掉那段时间戳。macOS 的“导出为 PDF”对话框底部的“包含时间戳”选项需要提前取消勾选。3.2 PDF 导出时的三个关键选项Word 里按Ctrl P打开打印/导出面板选择“Microsoft Print to PDF”或“另存为 PDF”。但很多应届生直接点击“另存为”就完事了结果出现字体丢失或分页错误。这里给出三个必须检查的关键选项嵌入字体在“选项 → 常规”里勾选“在文件中嵌入字体”并在子选项中选择“嵌入所有字符”。如果对方在没安装微软雅黑的设备上打开你的 PDF嵌入字体可以保证版式不变形。但要注意嵌入后文件会变大 3 到 5 倍都会在 10MB 以内才是正常的若远超这个大小说明字体没嵌入成功或者误嵌了多语言字体。导出范围必须选择“全部”并确认最终 PDF 只有一页。如果内容跨了两页不要用临时缩小字号的方式输出而应该回到 Word 里做减量例如把“项目经验”压缩为 3 条去掉个人爱好等冗余信息。非打印属性Word 里的背景色、水印、批注都不会出现在 PDF 里。但如果你用了文本框或形状导出时可能会出现轻微位置偏移。所以重点内容的版式我建议尽量用段落实现避免文本框嵌套。导出后第一件事是打开 PDF 检查每一行的对齐是否和 Word 中一致。3.3 作品集压缩与展示顺序作品集 PDF 的体积控制在 5MB 以内不超过 8MB。如果原稿是设计稿截图用 Photoshop 或 Sketch 导出时选择“JPEG 高质量”再把多张图片放进一个新的 PDF。常见做法是打开Adobe Acrobat用“工具 → 优化扫描的页面”做一次压缩但如果没有 Acrobat也可以使用在线压缩工具或者交给微信发送时的“原图”功能虽然不推荐但确实能压掉大量体积。展示顺序是作品集的重中之重。应届生没有商业项目时通常会放课程作业和临摹作品。请把完成度和 UI 相关性最高的作品放在第一页不要按时间顺序排。HR 第一眼看到临摹的 Dribbble 风格图标可能会觉得你没有设计主见。我通常建议用“个人项目完整流程 → 改版练习一个页面的前后对比 → 视觉探索色彩与字体实验”的顺序。这样既展示流程能力也展示视觉多样性。3.4 在线链接与超链接的可性检查简历上可以放作品集在线链接但注意一点链接必须能直接打开且不需要对方输入任何账号密码。很多应届生把作品集放在某网盘或某在线协作平台需要对方登录后才能查看这是大忌。建议使用一台免费静态托管服务比如 GitHub Pages 或者 Netlify并确保首页就是作品集列表。这些服务都需要手动部署但一次配置后每次替换文件即可。在 Word 中插入超链接以后请用肉眼验证Ctrl 点击会打开链接但要检查链接里的 URL 是否包含http://前缀。如果只填了域名Word 有时会自动补全但导出 PDF 后可能变成相对链接导致无法点击。在 PDF 里测试链接的方法是用浏览器打开 PDF点击链接是否在新标签页正常跳转。注意不要使用短链接短链接在部分企业内网会被拦截。4. 应届生简历的内容取舍项目经验、技能树与自我评价的写法很多应届 UI 设计师写简历时担心没有项目经验会被刷掉所以会把课程大作业包装成“项目”甚至硬编一个不存在的公司名。这一章讲怎么在真实经历的前提下让内容看起来完整且有说服力。4.1 项目经验用“场景-动作-结果”句式通过作品集里已有的具体设计项目用三到四条来概括。每条项目经验都要写清楚背景、你做了什么、最后产生什么可衡量的结果。因为是应届生所以结果不一定是真实的商业数据也可以是“用户测试中任务完成率从 62% 提升到 84%”这样的过程数据。例如项目背景校内食堂订餐 App 的课程设计团队 4 人周期 6 周。所作所为独立完成信息架构和全部高保真页面统一视觉组件库。数据结果可用性测试发现结算流程掉出率降低 30%。写项目经验时不要在第一条就写“熟练掌握 PS/AI”。这条应该放到技能树模块因为项目经验应该展示你的思考过程而不是堆名词。项目经验的标题里项目名和时间是关键。时间最好写到月例如“2024.04 - 2024.06”时间格式保持一致。4.2 技能树要写熟练度和具体工具技能树不能像菜单一样把所有会用到的软件都列出来。简洁的写法是分类后给出能证明的使用年限或频率。比如“矢量绘制Figma日常主用、Illustrator熟练”“界面设计Sketch迁移中、Figma组件库搭建”“原型Figma Principle动效原型”这样。注意不要用“熟练”这个词因为它没有区分度。可以写成“常用”“掌握”“了解”。同时在技能树里不要写“热爱设计”或“追求极致”这类词语是自我评价该干的事。一个更高级的技巧是在技能树右侧用括号注明“最近 6 个月”使用过因为 HR 担心你的软件技能在学校毕业以后就生疏了。4.3 自我评价的统一问题应届生简历里自我评价是最容易变成废话合集的地方。写“学习能力强认真负责注重细节”每一句都没有信息量。如果必须写自我评价请用两句事实来支撑一句说明你为什么适合 UI 岗例如“连续三个月维护同一套组件的更新与文档”另一句给出与岗位直接相关的兴趣例如“对设计系统与设计工具效率有持续关注”。还有一个常见问题是把自我评价写成“我的目标”比如“希望加入贵公司并成为一名优秀的设计师”。这句话对 HR 没有任何决策价值反而挤占了版面。在简洁简历里自我评价可以压缩成 1 到 2 行或者在求职意向里直接写明“目标岗位UI 设计师初级”然后删掉自我评价模块。如果你不知道删了以后页面会不会太空可以用教育背景里的“主修课程”来替代。4.4 应届生常见冗余内容清单下面这些内容我建议全部删除语音/音乐/运动等个人爱好除非这些爱好和你做了什么设计直接相关比如“制作手工木器”可以证明你的形态立体感“在校考取证书”里与设计无关的英语四六级成绩单四级分数低于 500 就不写“主修课程”里列超过 6 门课程简历里出现自我介绍的大段散文。果断删除冗余后才能让够分量的信息往前排。用这条内容取舍标准去检查已经写完的简历初稿时通常能删掉一半文字。删完后如果发现一页太空不要填充无关内容而是可以通过增大项目经验行距或字号让版面自然饱满。5. 用 HTML/CSS 生成可维护的简洁简历一套能转 PDF 的模板代码Word 适合一次性制作但如果你后续需要频繁微调颜色、间距或批量生成多份岗位微调版本用代码维护会更方便。而且 HTML CSS 生成 PDF 后文本可以被选中和检索HR 用关键词搜索时可以命中你的技能词。这一章给出一个最小模板和转换方法。5.1 为什么用 HTML/CSS 生成简历因为 Word 排版总有“调不动”的时刻比如某个元素的位置死活不对或者嵌入字体失败。HTML/CSS 里所有间距都可以用数值精确控制模板改颜色只需要替换一个变量。对于有一定编程基础或曾经写过前端的设计师这个方案可以极大地提高迭代效率。更重要的是在简历中秀出一个可访问的在线 HTML 版本可以当作一个额外的小作品展示。mermaid、flowchart 等应禁止但 CSS 网格布局可以很好地支撑一页式版式。下面这个模板使用inline-block或flex来分列不会像table一样僵硬。5.2 最小 HTML 模板与 CSS 规则创建一个index.html文件复制以下代码!DOCTYPE html html langzh-CN head meta charsetUTF-8 titleUI设计师-张三-简历/title style :root { --ink: #1a1a1a; --gray: #666666; --line: #e0e0e0; --main-font: Microsoft YaHei, PingFang SC, sans-serif; } * { box-sizing: border-box; } body { width: 210mm; min-height: 297mm; margin: 0 auto; padding: 12mm 16mm 12mm 16mm; font-family: var(--main-font); font-size: 10.5pt; line-height: 1.6; color: var(--ink); } .header { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--ink); padding-bottom: 4mm; margin-bottom: 6mm; } .name { font-size: 22pt; font-weight: 700; } .contact { font-size: 9pt; color: var(--gray); white-space: nowrap; } .section-title { font-size: 12pt; font-weight: 700; border-left: 4px solid var(--ink); padding-left: 3mm; margin-top: 5mm; margin-bottom: 2mm; } .item { margin-bottom: 2.5mm; } .item-meta { display: flex; justify-content: space-between; color: var(--gray); font-size: 9pt; } ul { margin: 1mm 0 0 0; padding-left: 4mm; } media print { body { width: auto; margin: 0; } a { text-decoration: none; color: inherit; } } /style /head body div classheader span classname张 三/span span classcontact138-0000-0000 | zhangsanemail.com | zhangsan.design/span /div div classsection-title教育背景/div div classitem div classitem-metaspanXX大学 视觉传达设计 本科/spanspan2020.09 - 2024.06/span/div ulli主修课程UI设计、交互设计、设计心理学、平面设计基础/li/ul /div div classsection-title项目经验/div div classitem div classitem-metaspan校园订餐 App 课程设计/spanspan2024.03 - 2024.05/span/div ul li独立完成信息架构、界面流程和全部高保真视觉/li li搭建基础组件库统一按钮、输入框和弹窗样式/li li可用性测试中结算流程任务完成率提升 22%/li /ul /div div classitem div classitem-metaspan个人作品集网页设计/spanspan2024.01 - 2024.02/span/div ul li用 HTML/CSS 实现响应式作品集页面部署在免费静态托管/li /ul /div div classsection-title技能树/div div classitem div设计工具Figma常用、Photoshop掌握、Illustrator了解/div div协作工具Zeplin、Notion、GitHub/div /div /body /html逻辑说明这个模板把body宽度设为 210mm并按 A4 高度给最小高度这样在浏览器里看起来就是一张纸。段落行距固定在 1.6字号 10.5pt与上一章的 Word 参数保持一致。.item-meta使用 flex 布局把左侧信息和右侧时间推至两端对应 Word 里的制表位效果。.section-title的左边框就是 Word 竖线的等价物。--ink和--gray是 CSS 变量后续改颜色只动这个变量即可。页边距控制在body的padding里上、下、左、右分别是 12mm 和 16mm和 Word 排版推荐值相当。5.3 用浏览器打印为 PDF 并检查超链接打开这个 HTML 文件后按Ctrl P打开打印面板。在“目标打印机”里选择“另存为 PDF”。关键选项是“边距”选择“无”以及勾选“背景图形”这样模块标题的左边框才会保留。如果不勾选背景图形深色元素会丢失但你这里的边框属于元素本身不受背景选项影响不过仍然建议勾选。如果在打印预览中发现页面变成两页或者内容被整体缩放需要勾选“缩放”为“100%”并检查是否有page规则干扰。在 Chrome 中body的宽度 210mm 会导致每毫米有细微取整误差最保险的做法是打开“打印 → 纸张大小 → A4”然后把“比例”改为“自定义 95%”稍微缩小一点以嵌入页边打印范围。Android 或 iOS 等设备上打开 PDF 测试一下确保字体被正确替代。因为 HTML 转 PDF 时如果你使用的中文字体在本地不存在浏览器会自动替换可能造成文字宽度变化。所以导出前务必指定至少两个回退字体比如Microsoft YaHei, PingFang SC, sans-serif。微软雅黑在 Windows 自带但如果你在 macOS 上做会回退到苹方视觉效果会略有不同可见在 macOS 上导出前不要省略苹方。5.4 快速改颜色和字体的几个 CSS 变量使用这套模板时改变整体外观不需要动很多地方。在:root里调整--ink即可修改主文字和分隔线的颜色。例如把--ink改成#0f766e整套版面就成了墨绿色调但因为是合成方案需要保证所有出现--ink的地方统一变色避免某个地方硬编码了黑色。如果某处确实需要硬编码尽量用var(--ink)引用变量。要继续压缩到一页可以调整line-height的值为1.5或者把margin-bottom和padding单位从 mm 缩小。但这里的经验准则是每缩小一次margin都要在打印预览里看一遍。因为浏览器渲染和 PDF 渲染的字体度量在个别版本会不同只改 CSS 数值后不检查容易让模块间粘连。最后用 HTML/CSS 生成 PDF 后记得把 HTML 文件也放进你的项目仓库里。这并不光是为了备份更是一个小的附加分项当面试官追问“你说你会写代码”时你可以直接把这份模板的源码链接发给他这比口头描述更有说服力。本文还有配套的精品资源点击获取