UI设计师面试题及参考答案.docxVIP

UI设计师面试题及参考答案

一、基础理解类

问：你觉得UI设计和UX设计最核心的区别是什么？实际工作中怎么平衡两者？

答：UI是“看得见的设计”，比如界面的颜色、按钮样式、排版；UX是“看不见的体验”，比如用户点进页面后找功能顺不顺畅、操作完有没有成就感。比如之前做电商详情页，UI上要把“加入购物车”按钮做得醒目（用橙色+粗边框），但UX上得考虑按钮放哪——一开始放底部中间，后来发现用户滑动时手容易碰到边缘，改成底部偏右20px，后续点击转化率涨了15%。平衡的话，我会先跟产品确认用户核心目标，再用UI落地，最后走查时重点看“好看”会不会影响“好用”。

问：设计规范对团队来说有什么用？你之前怎么参与或维护设计规范的？

答：最大用是减少重复工作+保证界面统一。比如之前团队用Figma做组件库，我负责维护按钮组件——一开始只有默认/选中两种状态，后来开发反馈“禁用状态要区分‘临时禁用’和‘永久禁用’”，我就加了浅灰（临时）和深灰（永久）两种，还补了hover效果说明，之后新同事做页面直接拖组件，不用再问“这个按钮禁用该用什么色”。另外规范里还会写“字体用思源黑体，标题32px粗体，正文16px常规”，避免有人随便用其他字体导致界面乱。

问：为什么移动端设计常用44px作为按钮最小点击区域？你有没有遇到过需要调整的情况？

答：因为成年人指尖平均宽度是8-10mm，换算成像素（按常规375px屏的dpi）差不多44px，太小了容易点错。但不是绝对的，比如做老年版APP时，我把按钮调到56px，还加了10px的点击热区（视觉上还是56px，实际可点击范围更大）；反过来做极简风格的工具APP，有些次要按钮（比如“收起”）会缩到36px，但会确保周围没有其他按钮，避免误触。

二、设计实操类

问：你常用的设计工具是什么？比如Figma，说一个你觉得最提升效率的功能或插件？

答：主要用Figma，最常用的是“组件变体”和插件“Iconify”。比如做表单时，输入框有“默认/聚焦/错误”三种状态，用变体把这些状态绑在一起，改颜色时不用三个框分别改，改一个变体主色就行；Iconify能直接搜Material、FontAwesome的图标，不用自己切，之前做设置页，要10个不同的功能图标，直接搜关键词拖进来，还能调颜色和大小，比自己找图标库快很多。

问：做响应式设计时，你怎么确定适配的断点？举个你做过的例子？

答：我一般参考主流设备尺寸+产品目标用户的设备占比。比如之前做企业官网，后台数据显示用户里70%用1920px电脑，20%用1366px，10%用平板，所以断点设了三个：1200px（电脑小屏）、768px（平板竖屏）、375px（手机）。比如首页的banner，1920px时是“大图+左文右图”，到768px就改成“图在上，文在下”，375px时把文字精简，图片裁掉边缘只留核心内容，避免文字叠在图上看不清。

问：设计图标时，你怎么保证风格统一？如果遇到“线性图标和填充图标混用”的需求怎么办？

答：统一风格主要看三个点：线条粗细（比如全用2px描边）、圆角大小（比如所有图标圆角2px）、细节处理（比如“箭头”统一朝右45度）。之前做社交APP的底部导航，“首页”“消息”用线性，“我的”用填充，产品说要突出“我的”页面，我就做了调整：填充图标的颜色比线性深20%，尺寸大2px，同时保证所有图标的视觉重心在一条线上，不会看起来歪歪的；另外把线性图标的描边调粗一点，和填充图标的视觉重量差不多，避免一个重一个轻。

三、协作与流程类

问：和产品经理意见不一致时，比如产品想加一个功能按钮，你觉得影响界面简洁，怎么处理？

答：先别急着反驳，先问产品“这个按钮是要解决用户什么问题”。比如之前产品想在商品列表页加“收藏”按钮，我觉得页面已经有“加入购物车”，再加会乱。后来聊了才知道，用户反馈“想先存着下次买”，但“收藏”和“加购”功能有点重。我就提了个方案：把“收藏”做成悬浮按钮，hover时才显示，平时隐藏，还找了同类APP的案例给产品看，说这样既满足需求又不占空间，最后产品同意了，上线后数据显示“收藏”点击量还不错，界面也没乱。

问：给开发交付设计稿时，你会包含哪些内容？怎么确保开发还原度高？

答：交付的东西主要有：Figma链接（标好所有组件的颜色值、间距、字体）、标注文档（用Zeplin导，标清楚按钮点击区域、弹窗动画时长）、切图（按开发要的尺寸，比如@2x/@3x，png/webp格式）。还原度方