《UI设计-AIGC驱动赋能界面完美设计》课件 2.1 相关知识

01项目二设计与制作“校缘通”App项目——

产品需求分析2.1相关知识2.2任务实施2.3技能提升UI设计——AIGC驱动赋能界面完美设计022.1相关知识2.1.1

项目定位项目定位，是明确项目在市场中的核心站位，界定项目的目标用户、目标市场与核心市场需求。通过精准的项目定位，能够确立项目的发展规模、核心方向与整体战略，为项目落地实施提供清晰的行动指引和决策依据。市场中的各类App，均面向单一或多元的用户群体，而想要针对性地开展产品研发与设计，关键就在于为项目制定目标清晰、指向明确的定位。进行项目定位时，需重点考量以下几方面内容（见图2-1）：（1）目标用户，明确项目的目标用户是谁，了解他们的需求和特点，以便在产品设计和市场推广中更好地满足用户的需求。（2）市场需求，确定项目所针对的市场需求，了解当前市场上存在的机会和竞争态势，以便在项目实施过程中能够找到合适的市场空间。（3）产品定位，确定项目产品的特点、优势和定位，以便能够与竞争对手区分开来，并满足用户的独特需求。（4）品牌形象，建立项目的品牌形象和价值观，以便在市场中有一个清晰、独特的形象，提高用户对项目的认知和忠诚度。（5）发展方向，确定项目的发展方向和目标，包括产品线扩展、市场扩张、技术创新等，以便在项目实施过程中能够持续发展和成长。图2-2项目背景1.1关于UI设计2.1相关知识2.1相关知识2.1.2项目背景随着智能手机的普及与移动互联网的高速发展，移动应用程序已成为人们日常生活和工作中不可或缺的组成部分。在此背景下，众多组织纷纷启动App开发项目，以满足用户在移动终端上的多元化需求。对于各类项目而言，项目背景主要界定项目的起源、核心目的与核心驱动因素，需清晰明确地阐述项目拟解决的核心问题或拟把握的市场机会：说明问题的本质特征与影响程度，或是分析机会的核心优势与市场竞争态势；明确项目的整体目标，以及项目成功落地后能带来的价值与效益，这类效益可体现在经济效益、市场份额提升、技术领先性打造、用户满意度提高以及社会价值创造等多个维度；同时阐述推动项目落地的各类驱动因素，包括市场需求、行业机会、企业战略布局、政策法规要求、客户实际需求等，并阐释该项目对于组织发展或市场布局的核心重要性。清晰地认知项目背景与驱动因素，对项目团队及各利益相关者而言至关重要，这有助于更深刻地理解项目的目标与核心意义，为项目的整体规划与关键决策提供坚实依据。2.1相关知识项目背景的核心内容通常包含以下方面（见图2-2）：（1）研究市场和竞争，了解项目所在的市场环境和竞争情况。通过市场调研、竞争分析和趋势研究等方法，获取相关数据和洞察，以支持项目背景的描述。了解市场需求和机会，以确保项目的合理性和可行性。（2）描述问题或机会，提供项目产生的具体问题或机会的描述。这可以是一个现实的痛点、市场空缺或改进机会等。描述问题或机会时要清晰、明确，并与目标受众相关。（3）支持数据和证据，使用可靠的数据和证据支持项目背景的描述。这可以是市场调研数据、用户反馈、行业报告等。数据和证据可以增加项目描述的可信度和说服力。（4）引用行业趋势和研究，引用相关行业的趋势、预测和研究成果，支持项目背景描述。这可以包括新兴技术的发展、用户行为的变化、市场趋势等，以显示项目的时机和潜在价值。图2-2

项目背景2.1相关知识2.1.3用户需求需求分析是指在App开发时，开发人员评估和理解客户的需求，以确定应该开发哪些功能和特性。在应用App开发中，需求分析是非常重要的一步，因为这将确定所开发的App是否真正符合用户的需求。马斯洛需求理论是由美国心理学家亚伯拉罕·马斯洛提出的一种心理学理论，它描述了人类的需求可以按照一定的层次结构来满足（见图2-3）。现有市场上App的使用率高是因为它们提供了各种各样的功能和便利性，能够满足用户在社交、通信、购物、娱乐等方面的需求，如社交媒体类的App有抖音、小红书等，即时通讯类的App有微信、QQ等，在线购物类的App有淘宝、京东等。用户需求指的是用户对某个产品或服务的具体要求或期望。它反映了用户在使用产品或服务过程中所需要满足的功能、性能、体验、价格、支持等方面的需求。用户需求可以包括实际的需求（用户明确表达的需求）和潜在的需求（用户可能需要但并未明确表达的需求）。例如，用户饿了要吃饭，吃饭就是用户的基本需求。结合该需求，我们可以帮助用户找到他愿意吃的食物，也可以向他推荐他可能喜欢吃的食物，接下来还可以帮助他把好吃的食物推荐给好友，这样就挖掘出了用户的深层次需求。图2-3马斯洛需求层级2.1相关知识2.1.3用户需求了解用户需求对于企业和开发者非常重要，因为它直接关系到产品或服务的成功与否。通过深入了解用户需求，企业和开发者可以更好地设计和改进产品或服务，提供更好的用户体验，增加用户满意度并满足市场需求。确定用户需求的方法可以包括市场调研、用户反馈、用户访谈、用户行为分析等。通过与用户的密切互动和持续的沟通，企业和开发者可以不断了解并满足用户的需求，从而提升产品或服务的竞争力。具体方法如下：（1）市场调研，通过市场调研来了解目标用户的需求和偏好。可以通过问卷调查、用户访谈、焦点小组讨论等方法获取用户的反馈和意见。（2）用户反馈，积极收集和分析用户的反馈意见和建议。可以通过用户支持渠道、社交媒体互动、用户评价和评论等途径了解用户的需求和问题。（3）用户访谈，与用户进行深入的面对面访谈，了解他们的使用场景、需求和期望。通过直接交流可以更好地洞察用户需求的细节。（4）用户行为分析，借助数据分析工具和技术，对用户在应用或网站上的行为进行跟踪和分析。通过用户的点击、浏览、搜索等行为数据，可以揭示出用户的喜好和需求。（5）竞品分析，对竞争对手的产品或服务进行详细的分析，了解用户可能具备的需求和竞争优势。通过比较竞品的功能、用户体验和市场反应，可以更好地把握用户需求的特点。（6）创新和用户体验研究，积极进行用户体验研究，包括用户行为的观察、用户测试、原型设计等方法，以获取用户的反馈和洞察用户的真实需求。2.1相关知识2.1.4用户画像用户画像是通过收集和分析用户的个人特征、行为习惯、喜好及需求等信息，将用户划分为不同的群体，以便更好地了解和满足他们的需求。用户画像帮助我们深入了解目标用户的背景、兴趣、行为习惯和偏好，从而针对性地设计产品、提供服务并制定相关的市场策略。建立用户画像卡片一般包括以下内容：（1）用户基本信息，包括用户的年龄、性别、地理位置等基本人口统计数据，这些数据可以帮助理解用户的背景和特征。（2）用户兴趣和喜好，包括描述用户的兴趣爱好、消费习惯、偏好等。例如，喜欢的电影类型、购物偏好、喜欢的旅游方式等，这些信息可以指导产品或服务的个性化定位。（3）用户行为特征，包括描述用户在产品或服务中的行为和使用习惯。例如，使用频率、停留时间、访问路径等。这些信息有助于了解用户如何与产品进行交互和使用。（4）使用设备和平台，包括用户在哪些设备上使用产品或服务，使用的操作系统和平台等。这些信息可以影响产品的技术要求和适配策略。（5）用户期望和满意度，包括用户对产品或服务的期望和满意度的评价。这些评价可以帮助发现改进的机会和痛点。用户画像可以手绘，也可以用计算机制作，如图2-4所示。一个产品通常会有3种类型的用户，即目标用户、潜在用户和一般用户。我们可以建立3～6个用户画像来代表所有的用户群体。图2-4用户画像2.1相关知识2.1.4用户画像构建清晰的用户画像，能够让开发者深度洞悉目标用户的核心需求、使用偏好与行为习惯，进而为其提供更具针对性的产品与服务。同时，用户画像还能为产品设计与市场营销工作提供高价值的决策指引，帮助开发者精准锚定目标用户群体，打造贴合用户真实需求的产品与服务体系。此外，依托对用户偏好和行为习惯的精准把握，还能针对性优化产品的界面设计、功能布局与交互逻辑，为用户带来更优质的使用体验。2.1.5竞品分析竞品分析是指对与自己产品或服务在同一市场领域中的竞争对手进行综合性的研究和评估。通过竞品分析，可以深入了解竞争对手的优势、劣势、战略和市场表现，以指导自己产品的优化和市场定位。在做竞品分析时，一般选择3～5个竞品。这些竞品可以来自直接竞争对手（市场目标方向一致、产品功能和用户需求相似，例如，腾讯视频的直接竞品就是爱奇艺、优酷、芒果TV、哔哩哔哩等），也可以来自间接竞争对手（不同行业不同模式，但解决的也是同一个需求的产品，例如，腾讯视频的间接竞品是抖音、快手、小红书一类的短视频类产品），还可以来自可借鉴的产品（可能经营模式相同，但是解决的是不同的问题，例如酒店行业，可借鉴海底捞的服务模式，将服务体系设计得更舒服、更让用户满意）。2.1相关知识2.1.5竞品分析竞品分析通常包含以下几方面内容：（1）产品特点与功能：对竞争对手的产品或服务展开详细拆解，分析其核心特点、功能模块、性能表现等维度，对比不同产品的优劣势，挖掘自身产品的差异化突破点。（2）市场布局与渠道：研究竞争对手的市场份额占比及渠道分布特征，明晰其市场影响力与覆盖范围，以此评估自身产品的市场定位与潜在挑战。（3）品牌形象与声誉：分析竞争对手的品牌塑造及市场口碑，包括其在目标市场的品牌认知度、用户口碑及行业评价等，对标自身品牌形象，制定品牌竞争力提升策略。（4）用户反馈与服务：收集竞争对手产品的用户反馈、使用评价及客户服务体系建设情况，提炼竞品的优势与短板，为自身产品的优化升级、服务体系完善提供参考依据。通过竞品分析，可以更好地理解市场的竞争环境，找到自身产品的优势和改进空间，并制定相应的策略来提升自身产品的竞争力。竞品分析是一个持续的过程，需要不断关注市场变化和竞争对手的动态，以保持自身的竞争优势，如表2-1所示。表2-1竞品分析表2.1相关知识2.1.6情绪板建立App界面设计情绪板是一种核心设计方法，核心目标是通过界面视觉元素与交互形式的设计，让用户在使用App的过程中产生预期的特定情绪体验。该设计方法以用户的情感需求为出发点，通过对色彩、图标、排版、动画及交互等设计要素的精准选择与组合，打造能触发用户情绪感知、实现情感共鸣的界面设计方案。在App界面设计情绪板的打造中，需充分运用色彩心理学原理，结合设计目标选择适配情绪表达的色调与配色方案，以此引导用户产生对应的情绪反馈。例如，选用温暖系色调传递温馨、舒适的感受，或是以明亮活泼的色彩营造兴奋、充满活力的体验，如图2-5所示。色彩心理学是情绪板设计的核心理论基础。不同色相传递不同情感：红色—热情、力量、紧迫感；橙色—活力、温暖、创意；黄色—乐观、警示、愉悦；绿色—自然、健康、成长；蓝色—信任、专业、平静；紫色—神秘、高贵、创意。图2-5不同色相的含义2.1相关知识2.1.6情绪板建立对于App界面设计的情绪板，可以考虑以下几个方面的设计要素，以传达不同的情绪和用户体验：（1）颜色在情绪表达中起着重要的作用。不同颜色的色相、饱和度、明度可以传递不同的视觉感受，例如，一个品牌所使用的大面积的主色象征着这个品牌所针对的消费人群及消费定位。（2）使用适合情绪的图标和图像能够直接引起用户的情感共鸣。例如，使用笑脸或欢快的动物形象可以传达愉悦和快乐的情绪，而采用抽象或现代化的图像则可以传达先进和创新的情绪。（3）字体也能够在视觉上传达情绪。例如，圆润且活泼的字体可传达友好和活跃的情绪，而精细线条和现代感的字体则可传达专业和优雅的情绪。对App开展情绪板分析，能帮助设计团队更精准地把握用户的情绪偏好与情感需求，进而打造贴合用户期待的体验设计，同时为产品在市场竞争中构筑差异化优势提供支撑。较为常用的情绪板分析方法，如图2-6所示。图2-6常用的情绪板表现方法2.1相关知识2.1.7产品结构图产品结构图通常用来展示一个产品的信息架构和导航层次，以帮助设计师和开发人员理解和规划用户界面的组织结构，主要分为任务流程图和产品结构图。1.任务流程图任务流程图用于描述某一任务或工作流程中，各操作步骤的执行顺序与逻辑关联，核心聚焦于任务的推进过程及任务间的相互依赖关系，如图2-7所示。该流程图有统一的图形表达规范：圆角矩形—表示流程的“开始”与“结束”菱形—代表问题判断、审核、审批、评审等判定环节平行四边形—表示信息的“输入”与“输出”箭头—指示工作流的推进方向通过使用这些符号和连接线，清晰地展现任务执行流程、操作步骤和条件决策。任务流程图可以帮助团队成员理解工作流程，识别瓶颈和优化潜力，并确保任务按照预期的顺序和规范执行。图2-7任务流程图2.1相关知识2.1.7产品结构图2.产品结构图产品结构图是一种图形化工具，用于描述产品中各个组件或模块之间的层次结构和关系，如图2-8所示。它提供了产品的整体架构视图，帮助设计师、开发人员和利益相关者更好地理解产品的组织和功能。通过产品结构图，设计团队可以更清晰地查看和沟通产品的各个组件之间的关系，帮助他们规划功能和设计用户体验。同时，产品结构图也可以作为开发团队的参考，帮助他们理解需求和模块的划分。产品结构图与任务流程图的区别：任务流程图—聚焦“任务怎么做”，关注执行顺序与逻辑判断产品结构图—聚焦“产品有什么”，关注信息架构与功能层次两者相辅相成，任务流程图解决“流程”问题，产品结构图解决“结构”问题，共同构成产品设计的完整蓝图。图2-8产品结构图2.1相关知识2.1.8原型图绘制原型图是交互设计中的一种工具，用于以可视化的方式呈现产品的界面和交互效果。绘制原型图的过程可以帮助设计师和团队更清楚地定义和验证产品的功能和用户体验。原型图的绘制分为低保真原型图和高保真原型图。1.低保真原型图低保真原型图是一种较为简化和粗略的原型图，用于快速草稿和初步验证设计概念。与高保真原型图相比，低保真原型图主要侧重于功能流程、布局和基本交互，通常不包含具体的视觉设计和细节，如图2-9所示。常见的低保真原型的绘制方式有手绘（图2-10）和使用计算机绘制（图2-9）两种。计算机绘制低保真原型图可以使用Sketch、Axure、Photoshop、Illustrator、墨刀等软件。线框图可以准确拆分页面，以及每个页面的功能模块及展示信息，确定每个页面元素的界面布局。低保真原型阶段不需要考虑界面元素的配色以及各功能的交互跳转及动画效果。其目的是在早期阶段迅速验证设计概念和功能流程。图2-9Axure绘制低保真原型图2-10手绘低保真原型2.1相关知识2.1.8原型图绘制2.高保真原型图高保真原型图是一种更为精确和细致的原型图，通过使用更接近最终产品的视觉设计和交互效果，以更真实的方式呈现整个产品的用户体验。与低保真原型图相比，高保真原型图更注重视觉设计、细节和交互效果的真实性，如图2-11所示。在低保真原型的基础上，可以使用Sketch、AdobeXD、Figma等来创建高保真原型。这些工具提供了丰富的设计资源和功能，可以灵活地进行布局、视觉设计和交互效果的设置。根据产品的品牌和设计准则，为界面添加具体的视觉设计，包括颜色、字体、图标等。考虑不同设备和屏幕尺寸下的响应式设计，使用真实的内容填充界面，包括文字、图片、数据等。这样可以更好地模拟用户在实际使用中的体验。高保真原型图通常用于最后的产品设计阶段，帮助设计师、开发人员和利益相关者更准确地理解和评估产品的外观、功能和用户体验，并作为最终产品开发的参考。图2-11高保真原型（马瑞遥作品）2.1相关知识2.1.9规范