(本网讯李军燕）一、课程基本信息

课程名称：UI设计

课程类别：专业必修课

学 分：3

总 学 时：48（其中：授课学时：16 实践学时：32）

考核方式：考试

授课对象：22级视觉传达设计1-2班/24级视觉传达设计（专升本）1-2班

授课教师：李军燕、李逸蕾、马欣

二、课程介绍

本课程主要教学内容包括UI设计的理论、发展、流程以及相关设计原则、设计规范与设计实践。课程通过分析UI设计产品的有效性与使用率以及用户的情感体验与主观满意度，使学生建立起完善的UI设计产品的任务流程与信息流程，培养学生梳理界面交互逻辑，提升产品视觉体验，以及快速构建交互原型的能力，对学生在信息与交互设计领域从事研究及实践具有十分重要的意义。

该课程侧重从设计艺术学的方面让学生了解UI设计的规范与原则，学会从软件人机交互、操作逻辑、界面美观的整体设计角度出发进行UI设计。学生在修读该课程前应完成数字媒体艺术概论、设计概论、交互设计等前期基础知识课程的学习。

三、教学设计思路

《UI设计》课程结合华为、阿里系、腾讯系等具有中国特色的行业代表性本土公司和机构的自主研发案例分析，提高学生对本土设计文化的认同感和民族自豪感，强化学生的思想引领和爱国教育。课程项目以5-6人为组完成，培养学生之间的团队意识，树立正确的世界观、人生观和价值观，以及作为新时代青年的家国情怀和使命担当，形成“以用户为中心”的设计理念和“以人为本”的价值观。

四、教学目标

五、教学成果

1.作品名称：“纸语”软件界面设计

班级：2022级视觉传达设计1班

创作人员：林思琪、涂欢欢、袁思媛、田雨昕

设计说明：纸语是一款以情绪疗愈为核心的日记App围绕“把今天折进未来”理念，为年轻女性打造情感疗愈空间。界面采用低饱和暖色调与柔和卡片式布局，结合纸张肌理与折纸动效，营造轻盈舒适的书写体验。核心功能“情绪镜像”通过AI解析日记生成动态心情图谱，并智能匹配“疗愈箴言”安抚情绪，独创“自我对话”支持为日记添加“时光胶囊式评论”，实现跨时空的内心对话。整体设计通过感性叙事与细腻交互，让每一次记录成为温暖自我的治愈仪式。

[插入视频-“纸语”软件界面设计]

教师评语（李军燕）：该组学生在在界面设计上，展现出创意与情感共鸣。利用纸张元素，使用户在记录日常的同时，也能感受到时间的沉淀与情感的积累。在“情绪镜像”功能中，通过AI技术的运用，实现了用户情绪的可视化表达，这种创新的设计思路不仅增强了用户的参与感，也极大地提升了产品的疗愈价值。在视觉设计上，营造出温馨又舒适的记录空间，让用户能够真诚地面对自己的内心世界，注重情感表达与用户体验。

2.作品名称：“绿驿”软件界面设计

班级：2022级视觉传达设计2班

创作人员：张莉、曹缤予、卓佳琪

设计说明：绿驿APP是一款基于菜鸟驿站服务生态迭代升级的智能物流工具，专注于为用户提供“更简洁、更环保、更有温度”的包裹管理体验。我们以“减少冗余广告、优化界面交豆”为核心，融入“绿色回收”公益行动。

[插入视频-“绿驿”软件界面设计]

教师评语（李逸蕾）：“绿驿”软件界面设计以绿色为主色调，巧妙呼应了环保主题，视觉上给人以清新、自然之感，与软件作为智能物流工具且融入“绿色回收”公益行动的定位高度契合。图标设计简洁且表意清晰，极大提升了用户操作的直观性。部分页面信息层次不够清晰，信息呈现缺乏条理，这可能会导致用户在使用过程中产生困惑，增加操作成本。

3.作品名称:“巢绘”软件界面设计

班级:2024级视觉传达设计（专升本）1班

创作人员:谢嘉怡、黄嘉敏、吕孟凡、黄煜、刘莹艳

设计说明:巢绘是一款以“科技+艺术”为核心，围绕“小白也可以当设计师”理念，打造集专业性与艺术性于一体的设计工具平台。以蜜蜂的形象为IP，取其“高效协作、勤劳创作”的象征意义，结合“巢”的空间概念，界面采用低饱和的紫黄对比色，营造科技感和简约的布局，构建“理性工具+感性表达”的视觉语言，降低用户时间成本，AI助手“创作 bee”，从功能推荐到操作引导，实现“智能助理+创意伙伴”的双重定位。整体设计通过形成“蜜蜂筑巢”的品牌叙事，感受创意孵化的过程。

[插入视频-“巢绘”软件界面设计]

教师评语(马欣):该组学生，能够围绕“科技与艺术”的核心定位构建较为完整的设计体系。在功能设计上，采用毛玻璃图标，符合年轻审美趋势，新手引导流程与防误触机制体现了对用户体验的细致考量。在视觉设计上，紫黄主色调的对比应用既体现科技感又传递创作活力，蜜蜂IP形象的宇航员头罩与太空服饰设计，融合专业属性与年轻化审美，IP符号的系统性应用强化了品牌辨识度。

4.作品名称:“云朵阅读”软件界面设计

班级:2024级视觉传达设计（专升本）1班

创作人员:李钧苇、梁雪儿、叶晓萍、王芳华、黄婉婷

设计说明:本次设计以晋江文学城为基础，迭代打造出云朵阅读的UI界面。设计全程遵循移动端设计规范，从线框图构思到高保真界面呈现，设计闪屏、引导页面等。同时完成图标、导航栏设计，还开展了软件交互展现，力求优化用户阅读体验。

[插入视频-“云朵阅读”软件界面设计]

教师评语(马欣):该组学生在云朵阅读界面设计中能够围绕阅读的核心定位构建较为完整的功能体系。在功能设计上，注重优化阅读体验，减少不必要的阅读干扰，对分类筛选等功能的完善，让用户对作品的选择更为清晰。在视觉设计上，云朵主题的蓝黄主色调的对比应用，为用户带来温馨恬静的阅读体验，图标设计、组件设计较为完善统一。

5.作品名称：“HOLD”软件界面设计

班级：2024级视觉传达设计（专升本）2班

创作人员：罗炜怡、黎靖玙、叶浩玲、谢晓倩、袁雍婷

设计说明：为了年轻女性、学生党、追求灵活健身的大众群体，他们的碎片化健身需求，我们的HOLD，是一个一站式智能健身与健康管理平台，它可以AI制定计划、低门槛体验，拥有海量课程和动作实时纠错技术，而不像“训记”软件，我们的产品“泛健身+强社交”降低运动门槛、多元内容满足“自律与趣味”的平衡需求。

[插入视频-“HOLD”软件界面设计]

教师评语（李军燕）：该生图标设计体现品牌特色，符合用户审美，便于用户浏览和操作。

整体界面布局清晰，色彩搭配和谐，突出健身主题。特别是AI制定计划功能，能够根据用户的具体情况智能推荐合适的健身计划，大大提升用户的满意度和粘性。海量课程和动作实时纠错技术的融入，满足不同用户群体的多元化需求。

6.作品名称：“搭哒”软件界面设计

班级：2024级视觉传达设计（专升本）2班

创作人员：杜雨萱、雷可颐、张芷芸、丘嘉仪、刘佳玲、郑怡

设计说明：对于爱社交的年轻人、旅行爱好者，他们想找到志同道合的搭子去旅行，这个

“搭哒”软件是一个有趣的旅行社交平台，它可以为用户匹配精准的旅行搭子，做安全的保障机制，筛选符合不同圈层人群的专属旅行。不同于“十六番”软件，它能匹配搭伴，和驴友一起创建行程。

[插入视频-“搭哒”软件界面设计 ]

教师评语（李军燕）：该组学生在视觉设计上注重品牌理念的传递与产品形象的展示，色彩搭配和谐，既突出了旅行社交的主题，又营造出了轻松愉悦的氛围。整体设计上，既具有功能性，又不失美观性。在用户体验设计上，设计简洁的操作流程，以此清晰传达信息，使用户在使用过程中能够快速上手，减少操作难度。

7.作品名称：“书适圈”软件界面设计

班级：2023级视觉传达设计（专升本）2班

创作人员：陈哲曦、黄韵琪、王渼恬、李晴、梁希敏

设计说明：针对通勤途中使用移动设备阅读的职场人士以及夜间学习的学生群体，他们期望能够免费享受高质量的阅读体验，但频繁遭遇的弹窗广告和内容注水现象往往令人却步。“书适圈”软件，通过AI技术对全网流行内容进行深度扫描，精准理解用户的阅读偏好，快速推荐精彩章节。此外，产品实现热门IP的同步连载更新，即使是小众题材也能够获得个性化的推荐服务，并获得更加纯粹的阅读体验。

[插入视频-“书适圈”软件界面设计]

教师评语（李军燕）：该组学生在阅读类软件设计上，通过引入AI技术，实现对用户阅读偏好的精准捕捉，提升了内容推荐的效率与准确性。界面设计上，注重简洁与直观，确保用户在使用过程中能够轻松找到所需功能，享受流畅的阅读体验。此外，该组学生还充分考虑了不同用户的阅读习惯，设计相关阅读设置，进一步提升产品的用户体验。

六、教学场景与结课观摩活动

《UI设计》结课观摩活动

七、教学总结

《UI设计》课程融合“巴特勒学习模式”理论的立体化课程，充分发挥混合式教学的多样性教学课程特点，综合运用线下理论课程教学与线上直播录播结合的混合教学模式，课程以专案项目学习为主要教学方式，以真实专案项目体验为教学主线，按照教学课程内容安排具体专案项目任务。学生在完成专案项目时，遵循知识点中的相应设计原理，并根据相对应的专案项目进行一定的知识延伸，将文字化的知识理论转换成图像化的专案设计，学生在实践操作中检验理论知识点，在创新实践中动脑动手，充分调动积极性，激活兴奋点，在学与做中感受UI设计的魅力，在教学实践的细节中锤炼学生应对市场需求的专业技术能力。

排版 | 刘恩瑜

撰稿 | 李军燕

初审 | 周昊

复审 | 王海宾

终审 | 袁希佳、梁金锋