UI设计面试现场测试题及详细答案.docxVIP

UI设计面试现场测试题及详细答案

一、基础实操题（现场上机完成，限时30分钟）

题目1：简易登录页面设计（核心考察：基础布局、组件规范、视觉统一性）

需求：设计一个移动端（375*667）简易登录页面，包含以下元素：Logo（可简化绘制，无需复杂图形）、账号输入框（提示文字“请输入手机号/邮箱”）、密码输入框（提示文字“请输入密码”，带隐藏/显示密码按钮）、“登录”按钮、“忘记密码？”文字链接、“没有账号？立即注册”文字链接。

要求：1.配色简洁（主色1种+辅助色1种，禁止超过3种颜色）；2.组件对齐规范，间距合理；3.按钮hover/点击状态明确；4.输入框有聚焦/失焦状态区分。

详细答案（评分标准+设计思路）

1.布局逻辑（40分）：采用垂直居中布局，Logo居顶（距离顶部40px），输入框、按钮依次垂直排列，底部放置文字链接（距离底部30px）；所有组件水平居中，左右边距20px，组件间距统一（输入框与Logo间距30px，两个输入框间距15px，输入框与按钮间距25px，按钮与文字链接间距20px）。

2.配色规范（20分）：主色选用柔和蓝色（#3691FF，适配登录场景的信任感），辅助色选用浅灰色（#F5F7FA，作为输入框背景），文字色为深灰色（#333333，主文字）、中灰色（#666666，提示文字）、蓝色（#3691FF，链接文字）；背景色为白色（#