教育APP的界面分析设计

页共23页1绪论1.1研究背景于2021年2月发表的《第47次中国互联网络发展状况统计报告》显示，截至到2020年度，中国网民数量达近10亿，其中95%为使用手机上网的人群。这也说明移动互联网的发展伴随着智能应用的变革而蓬勃发展。APP(APP是application的缩写，是智能手机的应用）在网络上如日中天；而“互联网+”，更是改变了许多产业的发展模式。教育部在2015年5月出台的《关于加强高等学校在线开放课程建设应用与管理意见》指出，《高校在线开放课程》（简称MOOC）建议高校积极构建在线开放教学体系和教学平台，加大公开开放教学建设的实施力度，开发“MOOC”学生和在线教学应用。当前，通过APPStore、各类应用商城能搜索到各类教育类APP，尽管数量很多，但是也能发现存在的问题如低效、同质化设计、内容界面设计复杂等。因此，本文基于用户体验对网络教学APP进行了深入探讨。1.2研究的目的和意义(1)充分利用学校资源，对网络教学的发展起到一定的辅助作用，提高了高校的教学水平。(2)为在线教育提供更丰富、专业的在线平台，提升全民教育质量。(3)为教育APP的设计、特别是高校教育APP的设计、开发、实践提供更具专业的参考。1.3研究现状移动互联网时代促使移动端APP数量和内容不断创新。特别是在文化创新上，APP设计者们更加重视了app独特性的设计，对用户的使用感愈发重视。《UI演进—移动设备人机交互界面设计》这本书中，作者从产品化的角度讨论了手机的交互概念设计和产品特点，并讨论了其设计的可行性和实现方法。文章认为可视化是一种让用户更直接地看到产品的媒介，是一种有意义的交流过程。文章结合实例对手机界面进行了初步的分析、研究、数据整理和评价。目前我国相关专业的毕业论文大多集中在应用程序的界面设计上，如《手机摄影软件界面设计研究》和《手机用户注意力设计》等书籍中，均是从用户的角度对移动终端用户的交互产生了影响进行研究。另一部分是研究主要是集中于界面中的特定的视觉元素。以《中国画元素在用户界面创新设计中的应用研究》为例，介绍了如何运用中国画这一视觉元素。基于符号学和设计心理学的界面图标视觉设计与应用研究，从设计、功能和情感三个方面阐述图标的设计、功能和情感，探讨图标设计的设计原则，探讨图标的发展方向设计。1.4研究方法(1)文献检索法在前期的准备工作主要是通过在知网、百度搜索等平台去阅读手机界面设计、用户体验、高校在线教育APP等相关书籍和文献资料，学习相关的基础知识，对所要解决的问题有一个较为深入的认识；(2)分析归纳法本文的中期研究主要是利用手机下载和使用大量高校网络教学APP，搜集市面上各种高校网络教学APP的界面设计特点，并对其界面的优势和缺陷进行了分析，并指出了由于视觉效果差而造成的用户体验降低的原因。(3)案例分析法本文结合具体案例，综合对比分析在教育APP界面各模块的设计和功能模块等，结合视觉层级关系等相关所学，指出在教育APP设计上的相关建议。1.5展示平台技术介绍（1）AxureRPAxureRP是一个可以满足设计师们需求，设计功能和界面可以快速的创建应用软件的线框图、流程图、原型和规格说明文档的专业快速原型设计工具，它可以支持很多人在同一时间一起工作和版本控制管理（2）HTMLHTML5中用一个新的标签＜canvas＞的定义来进行图像的处理，＜canvas＞标签提供了一个2DProgrammaticAPI可以以较低的存储代价来处理图像。用API不仅可以绘制图像，且可以做图像分析和处理。＜canvas＞只是作为HTML页面上的一个元素，如果需要对图像进行操作就必须要借助canvas的API。（3）CSSCSS（CascadingStyleSheets，层叠样式表），它是表现HTML或XML等文件样式的语言。可以用CSS，来定做、修改优化网页的显示效果，还可以产生滤镜、图像淡化、淡入淡出等渐变，而且可以完成简单的交互设计，用来提提高前端的样式美观。CSS与结构码HTML／XHTML这两个的结合，可以实现“结构码”和“表现码”的分离，减小了维护站点外观的工作难度，并且因为简化了HTML文档，从而缩短了浏览器的加载时间。（4）JavaScriptJavaScript最初用途是图标检验，现在发展成一种功能齐全的编程语言，可以处理复杂的交互与计算，拥有匿名、闭包函数甚至某类计算机程序的编写，可以同浏览器几乎所有部分完成互动设计。一般会将JavaScript与ECMAScript认为相同，但JavaScript其实要更加的丰富，除了包含ECMAScript、DOM外，还有BOM（浏览器对象模型），利用BOM能对浏览器的窗口和框架进行操作。JavaScript是一种动态类型、弱类型、基于原型的语言，所以它不拥有空间命名、引入模块、私有成员、编译执行等特征，因此在开发时必须注意使用。2教育APP设计概述2.1在线教育APP的发展概况在线教育可以说是互联网时代才产生的，有学者也称之为“在线教育”、“E-Learning”或“在线学习”，由此可见在线教育是一种统称。在线教育最早是在1999年的美国在线学习会议上提出的，是在网络电子技术的支持和实现下，通过网络、广播电视等电子媒体进行的学习和教学。在美国2000年教育部颁发《教育技术白皮书》提出“在线教育是一种以互联网为媒介的教学方式”，它以互联网为基础，利用互联网开展相关的教学活动。在线教育相比于线下教育，最大的特点在于学习的自主性、教学形式的多样化且智能化、学习资源丰富。在线教育能充分利用互联网资源，和在线应用设计的智能性，为学生用户提供更为个性化和丰富的资源。同时，在线教学不再是传统的“被动”教学方式。它要求用户具有更强的自我意识，能够随时随地完成教学任务。师生、学生与学生之间可以在互联网上进行深入的互动和交流，利用大量的信息进行教学反馈。2.2在线教育类APP的发展现状1999年以来，我国在高等职业教育中大力发展网络教育。但由于多媒体辅助教学技术水平低、成本高，尚未实现规模化发展。在互联网信息化和国外在线教学发展的带动下，我国在线教学发展迅速，技术日趋成熟。2002年，麻省理工学院为公众推出了一系列免费的在线教育项目。随着在线育资源的快速发展，人们可以在互联网上使用更多优质的教育信息。可汗学院、coursera和EDX等互联网教育公司正在崛起。在2010年后，在线教育亦或者在线辅导呈现井喷式发展。特别是在我国中小学培训APP上，因为课堂教育的改革，很多家长为了让自己的小孩在学生上能更具有竞争力，往往通过线上教育的方式安排各种培训。正是因为各类家长需求的增加，在线教育的内容设计和渠道愈发多样化。如以培训为主的新东方、中工教育、华图教育等，或传统高校北大、清华等国内学校，均成为了在线教育的主要来源。在不同的行业中，我们均可以找到优质的针对性在线教学资源。其中，职业院校和外语专业是在线教学领域规模最大的两个领域。随着在线教育的快速发展，许多教育APP进入了大众的视野。用户可以根据自己的需求选择不同的APP。2.3在线教育类APP存在的问题在线教学应用APP数量庞大，但仍存在很大的问题。例如，很多同类型APP应用内容同质化强，独立设计APP产量低；综合类应用APP虽然教学资源丰富，但综合教育内容来看与课堂教育内容无法完全整合，缺乏传统教师课堂备述的针对性。在传统教学中，学生的上课时间均被学校合理的安排，教师会针对每堂课设计教学内容。但是在线教学则以学生的主观能动性和积极性为主。目前，大多数在线教学应用提供的学习资料较长，缺乏全面的教学计划。大量长期、多视频的学习项目，降低了学习积极性，进而降低了教学质量。然而，在目前的网络教学应用中，用户可以在有限的时间内完成自己的学习，但用户的学习频率、进度都比较慢。这是因为很多在线教育企业内容生产能力低，对用户需求缺乏了解，缺乏教学实践。在线教学应用APP的界面设计是与用户交流的产物，是用户对应用的第一印象的主要来源，会影响用户对应用的理解和使用。一个优秀的应用页面会吸收用户的视线和提升好感度。简洁、高效、有核心内容的页面能让用户快速获取信息，特别是符合用户使用习惯的页面设计，能很好地引导用户进行使用，并快速了解相关功能，从而提高产品的品牌知名度。手机用户产品的关键是设计好的界面和功能组件的合理展示。但在线教学应用APP的界面设计存在识别率低、视觉层次不规则、操作体验差等问题。一些在线教学应用APP缺乏趣味性和交互性，用户体验单调。另外，用户体验慢，用户接受度差。因此，下载的在线教学应用APP不会被学生所经常使用。2.4高校在线教育APP界面设计的复杂性和重要性随着互联网的发展、智能手机的普及和人们的学习需求增加，各种在线教学软件已经通过手机这一媒介渗透到人们的日常生活中。清晰的应用界面能让使用者快速了解到该页面想要传递的信息，也能让用户了解到该页面内容与自己的需求的匹配度。手机用户产品的关键是设计好的界面，并将功能组件的合理展示。高校网络教学应用APP的界面设计与网络教学应用完全不同。既要考虑学校教学设计初衷，又要符合学校的实际形象，促进高校在线教学的应用，提高学生的粘性。由于在线教学App内容丰富、交互性强、趣味性好，需要引入不同页面之间的过渡动态效果、声音特效、界面设计元素等内容，这对高校在线教学App界面的整体设计提出了更高的要求。.特别是不同高校在教学内容设计上有其独有的教学设计，而且在面对社会对高校学生所具备的素养标准下，高校教学APP设计在内容丰富程度上更需要进行精心设计。由于其教学信息的复杂性，也决定了界面设计中面临着诸多困难。高校在线教育APP不仅要合理清晰地呈现信息层次和视觉层次，还要考虑视觉美感和流畅度。2.5基于用户体验的高校在线APP设计流程以上五种用户体验本质上是产品开发和设计，相互独立。本文结合相关所学知识以及学者们研究，认为高校在线教育APP的设计流程如下：项目沟通、需求研究与功能改造、交互设计、可用性测试、迭代测试。项目沟通，即APP设计者、产品经理、运营人员等需要通过沟通，了解各自的任务，同时反馈出高校在线教育APP设计的进度，确认项目立项。只有不断的沟通，才会让需求更加明确，推动设计进度，也能更符合使用者的习惯。需求研究与功能改造，即在设计过程中，要知道每个版块功能的目的，以及功能设计逻辑。为了更好的视线需求和功能，也需要APP方运营者通过访谈、问卷调查等方式，了解产品目标用户的使用习惯、需求、偏好等。最后对用户需求进行筛选，最终得到高校在线教学应用需要设计主要功能。在交互设计中生产线的设计是从用户角色出发进行功能设计、信息框架的构建来完成的。一般而言画一个简单的草图，以便以后修改。进行计算机仿真设计，得到较为精确的样机，可用于高校在线教育APP初步实验中。在视觉设计上，产品与用户交互更加直接，既能展示产品的主要信息，又能为用户提供更好的视觉体验。UI作为品牌传播的主要手段，在APP的设计上应继承UI设计的主色彩和设计元素。视觉设计的基本原则必须符合用户的使用习惯和心理特点，才会更容易被用户接受。可行性测试主要是对设计功能进行测试。主要是从用户角度出发，确认APP各个页面的使用体验感、功能之间切换的逻辑、功能开发的必要性等。可行性测试的目标主要是对APP进行上线优化，尽量切合用户需求，提示APP的满意度。迭代设计就是不断的改进在APP开发和使用过程中发现的问题，可以最大限度地提高在线教学软件的质量。3教育APP实例分析3.1评价标准制定内容在一系列实验中，A.侗威奥证实了“信息以视觉和听觉两种方式存储”。关于如何选择信息，美国著名传播专家施拉姆曾指出“选择的可能性=奖励的安全性/支付的金额”他指出，增加金额的支付或降低成本可以增加选择特定信息传播的可能性。基于此理论，本文认为在高校在线教育APP的设计上，也要选择设计免费教学和付费教学。当然，这两种的需求设计都需要符合用户。如果一味追求付费，会丢失基础用户群体；如果全是免费内容，内容的精细程度上会没有竞争力。这就需要对付费和免费的选择上进行考量。为了在APP上有效传递教学信息，降低教职工的能耗，需要对APP上的各种元素进行适当的调整，使其符合学生的学习习惯，便于学生接受和理解。在讨论多媒体教学的教育功能时，LK提出了利用多媒体技术进行人机交互的方法，包括文本、背景和图标。在教学应用中，文本主要起到传递教育信息的作用，文本设计的正确与否对教学应用的质量有重要影响。为了传达教育信息，我们需要充分考虑文本组合效果的大小和空白，以防止学生只关注文本的作用而忽视文本所传达的信息。教学应用的界面环境虽然不能直接将教学内容传递给学生，但是环境的设置也会对学生的教学效果产生一定的影响。如果用户在应用程序中设置的颜色过多或颜色不当，会导致学生视觉疲劳，影响他们对教学信息的理解。教育应用程序是一种教育软件，是一种教育学生的手段。界面设置应考虑学生的思维习惯、视觉习惯和使用习惯。熟悉的事物更容易吸引他们的注意力。人的视觉区域应该是视觉从左到右、从上到下，并且容易区分明亮的颜色。人的精力是有限的，连续高强度的学习会给学生带来身心疲劳。这种行为会直接影响学生对教育APP展示内容的学习和吸收。一旦违反这种行为，就会增加学生的外在认知负荷，导致学生无法专注于学习信息，从而降低学习效果。教育应用在视觉习惯、思维习惯和使用习惯的设计上不断交互，达到最佳的交流效果。本文以人机工程学原理为第一指标，视觉效果和操作人机工程学为第一指标，以视觉效果区域、内容分类、文字、图标、背景和操作方式为主要内容，通过对比、重复、逼近，分组等方法，建立了适合教学应用的界面设计评价标准，并给出了具体内容。见表3-1，并阐述了标准的具体内容。其中评价标准中各项指标的具体内容为:一级指标二级指标思维工效最佳视觉区内容分类图标位置图标样式视觉工效文字大小文字间留白背景样式背景颜色搭配操作工效操作模式3.1.1符合“最佳视觉区”的标准尼尔森在2006年进行的眼动追踪实验查看了232位用户的观察数据。结果表明，他们在不同网站和作业上的阅读路径呈“F”形。第一步是水平扫描，F字的顶部，然后垂直向下。但向下的阅读内容比第一页少得多。然后是阅读中间、进而阅读下一页。测试表明，起初用户的阅读是浏览整个页面，没有突出的动作；其次，最重要的信息应该包含在前两段中；第三，当垂直阅读最左边的信息时，用户会注意到标题、段落等重要内容。因此，设计者应根据用户的阅读习惯设计教学应用的界面，将主要信息放入用户的可视区域，即F字形。3.1.2内容分类明显的标准本文整理的内容分级评价，是将相似内容进行分类后，不同类型的表现形式是否要突出显著。根据视觉感知的注意力理论，设计页面可以通过大小和颜色的对比来吸引用户的注意力。页面内容按不同颜色的色块、不用颜色的线条进行区域的分割以作为内容的分类。在这种情况下，不同区域的颜色可以是互补的或色彩对比的，这样分类的重点更加明显，从而吸引学生的注意力。3.1.3图标位置和样式一致的标准一些实验表明，在人机交互中，感知物体和搜索物体的效果与熟悉度有关。因此，在用户界面上使用的图标和按钮应尽可能与用户自身的体验一致。即在教学软件设计中，具有相同功能的图标或按钮可以保持不变。当用户根据自己的经验使用图标或按钮时，会让学生在短时间内回忆起类似的动作以便减少他们的反应时间。3.1.4文字大小适中的标准字体大小取决于它们的表示方式。如果文本以磅为单位，则其真实大小为1/72英寸。如果用多媒体来表示文字，那么文字是用像素来表示的，因为文字的显示是由像素组成的。对于传统的文字显示方式，推荐的字体大小为4-5磅。这个数字在教学应用中也很常见。一般来说，重点是8-14磅，其他5-8磅。由于不同多媒体的屏幕像素密度不同，使用不同的多媒体形式会导致文字大小发生变化，增加了页面上字体呈现的层次感。本文采用基于数值表示的方法将文本量转换为数值尺度。例如，字体大小是图标或按键字体大小的2~3倍，图标或按键字体大小的1~5倍。3.1.5文字间有留白的标准在界面设计中，人们往往追求简洁，摒弃大量重叠的视觉元素，用简洁的方法清晰地传达视觉信息。文本是教学应用中最重要的表达形式。因此，在教学应用中，用户可以通过阅读大量的文本来学习，文本的选择将在他们的学习中发挥重要作用。文字布局过于紧凑，容易造成用户视觉疲劳。因此，文章之间应该有空格。3.1.6背景样式一致的标准教学应用需要使用大面积的背景色。当用户学习某个教学应用程序时，他们将面对所有的网页，每个网页上都有大量的内容展示。当所有网页都有不同的背景时，人们会产生错觉。因此，对于教育应用来说，背景颜色和样式应该同色系。3.1.7背景颜色适中的标准在教学应用的界面中，色彩的协调和搭配是最重要的。一般来说，一个网页应该使用三种以上的颜色，选择一种作为主色，并使用适当的颜色组合来体现教学应用的设计。颜色的搭配要注意整体的和谐与突出。简而言之，网页的颜色组合应该让用户感到舒适。此外，文本和背景之间的颜色匹配是关键。根据视觉感知理论，人们对刺激的感官反应是有限的。当使用者超过可接受的限度时，他会减少对身体的刺激，从而达到协调和平衡。因此，背景色彩选择上尝试使用互补色，并在文本和背景之间使用相反的颜色。3.1.8操作模式设置的标准使用教学应用时，用户可以手动操作各种组件，但活动空间有限，不能无限扩展。随着手机变得越来越大，用户使用手机变得越来越困难。因此，在教学APP的操作中，我们需要考虑学生的使用情况，比如单手、左掌、横屏、竖屏等等。在安卓市场、豌豆应用下载平台中，笔者选择了教育、教学进行关键词搜索，筛选出30个教学应用程序，并简要说明其功能和分类。详见表3-2。根据教育应用的服务对象，应用可以分为三类。第一类主要是学生，包括中小学生和大学生。二是注重技术培训。表3-2:教育APP介绍3.2.数据分析(1)样本数据分析根据作者提出的评价标准，本文从最佳视觉区域、内容分类、图标风格、图标位置、文字大小、文字空白、背景风格、背景颜色和操作方式九个方面进行了详细研究，结果见表3-3(教育APP界面设计评价的内容分析中，1代表符合，0代表不符合):表3-3：样本数据分析教学应用设计方面，教学应用25款，占比83.7%；其中，教学应用软件25款，占比88.3%；其中应用13个，占比74.3%，说明教学应用的设计几乎没有考虑学生的思维和体验。在教学应用界面中，相同位置的图标有14个，占比60.7%。本文根据用户需求，将30款教学应用分为儿童学习、技能学习和学生学习三类，以全面了解各类教学应用的发展现状。《小班龙》、《贝娃》童谣、《咪咕星宝》、《兔兔》童谣、爱奇艺动漫之家》6首以上童谣；技能培训APP有4本如驾考词典、驾校一次过（保证版）、普通话测试和轮换测试；学生教育应用包括作业指导、猿搜索题目、粉笔和考试、网易有道词典、阿凡达、日常练习、金山词霸、百度翻译、分词、作业、互动动作、扇贝口语、流利的英语、优化网络、中文大学MOOC、新概念英语、猿题库等。(2)儿童学习类教育APP数据分析6款儿童学习类教育APP分析结果见表3-4表3-4:儿童学习类教育APP分析三款适合孩子学习类APP，占据了50%的比例。也就是说，一半以上的童学习类APP在设计时都会注意到使用者的视觉喜好，而在界面上有两款儿童学习APP，占据了33%的比例，也就是说一多半的孩子学习APP并没有区分出具体的类别。(3)技能培训类教育APP数据分析4款技能培训类教育APP分析结果见表3-5表3-5:技能培训类教育APP分析技能培训应用中，只有背景颜色适中的比例为100%。在图标和留白上，均占比50%，就是说大部分技能培训APP都会有相同的图案；中等字体的技能培训类APP也有3款，占总数的75.0%。但是在单手和左手操作模式上，比例为0%，可见在行为习惯的使用观察上，单手和左手操作被忽略了。20款学生学习类教育APP分析结果见表3-6表3-6：学生学习类教育APP分析18款学生的教学APP在优化视觉区上使用了内容分类设计，占据了90.0%的比重，这意味着，大部分的学生在使用这些APP的时候，都会注意到用户的思考方式。综上，对30款APP的数据对比分析可以发现，它们在接口的设计上有相似之处，但也有各自的缺陷。4教育APP界面设计4.1界面布局4.1.1界面布局的常见类型交互设计会对界面设计产生一定的影响。所以在界面设计之前，通常会有一个整体的设计方案（各个部分的位置和整体的内容），但更多细节的补充，需要设计师自己去勾画创作。高校在线教学应用APP的界面布局主要集中在屏幕、文字和图像三个方面。合理的界面设计可以提高用户的易用性和美观性。在智能手机应用的界面布局中，要特别注意各种尺寸显示屏下的设计，以保证各类智能手机上显示的均匀性。目前在线教学应用的界面设计中，常见的界面布局如下：(1)列表式图4-1列表式界面在课堂演示中，经常使用清单布局将大量课程从上到下排列，有些课程以图形方式呈现，这是展示所学内容的好方法。界面的设计是自上而下的视觉过程，更有意义；网页上显示的信息通常通过颜色和排列来区分。新东方在线、有道学校、网易公开课的成绩以表格形式呈现，供用户浏览。(2)陈列馆式图4-2陈列馆式界面陈列馆式行形式灵活，可按重要性随意分配；简化版比列表形式在同一界面层次上放置了更多的内容。布局的布局通常在显示类中，与屏幕融合得很好，但由于界面内容过多，屏幕会显得杂乱无章。图4.2显示不同板块的关卡界面。借鉴陈列馆设计，可以让课程更加直观，让用户清楚地了解课程的内容和类别。(3)选项卡式布局图4-3选项卡式布局选项卡式布局的特点就是，无论身在何处，选择卡都有一个快速开关和一个按钮。对于规模较大、层次较高的高校在线教学应用，可以清晰的展示门户的位置，让用户可以在不同的门户之间跳转，操作更加方便。图4.3显示了可汗学院、网易公开课和种子评分系统，所有这些都以标签的形式出现。每一层都有导航栏，用户可以轻松切换不同的功能，降低了操作难度，缩短了操作周期。一个有序完整的在线教学应用的布局是界面之间的整体规划，而不是一个独立的实体。用户可以看到在使用过程中可以遵循视觉路线，从而可以快速轻松地执行相应的动作。以上设计仅为高校网络教学应用设计提供参考。随着高校在线教学应用的不断拓展，部分页面布局呈现出多种布局形式的结合与并存，呈现出更多的信息。4.1.2界面布局的基本原则和方法(1)跟随视觉轨迹，充分利用最佳视野。人眼的运动不是随机的。运动是由视觉运动引起的，其轨迹遵循平滑的路径。纵观整个界面，上下两部分让用户可以在比较大的区域内连续观察。由于关键信息处于最佳视图中，用户可以在短暂的停顿后快速捕获关键信息。(2)对不同用户界面上的视觉元素进行分组、分层和对齐，以实现整个界面的平面布局。手机界面的布局结构按照可视化原理将各种视觉元素分成若干组，通过统一的标准化流程提高界面的整体性。可以建立视觉边界框和背景区域以增强数据包的可见性。或者，利用“完形”原理，将各种视觉元素的排列组合成一个整体。同时，可以将相同的视觉元素组合起来，增强组合效果。在手机的接口布局中，主接口和从接口分为中继线和从中继线。需要保证主干部分的层次清晰，可以根据位置和大小在界面设计中体现出来。在不同界面的跳转设计上，需要注意区分主次页面的对应关系，保证了整个画面的流畅度。4.2图标图标反映了人们对事物的整体认识，具有很强的认知能力，而图形符号则是对事物的高级视觉表达。优秀的图形设计可以提高用户的视觉和视觉效果，与用户进行良好的交互，用图形传达信息；在应用界面上，图标设计包括：应用启动图标、界面内部图标、工具栏图标等。4.2.1启动图标及设计方法在线教育APP的启动图标会出现在每个APP商店中，就像学校的logo一样成为了APP的代表形象。优质的图标会激发你对程序的理解并促使你下载它，这就是图标UI设计的意义所在。学校在线教学应用的启动图标可参照校徽重新制作。大学标志具有一定的历史和知名度。对于学校来说，它本身就可以吸引更多用户的注意力，并获得更多的下载和应用。因此，我们可以从以下几个方面考虑适合大学生的在线教学应用的图标创新设计：(1)简单形式由于应用程序启动按钮的大小有限，需要设计简单，易于使用者识别和记忆。(2)增强色彩对比不同的手机界面如图4.5所示，由于屏幕背景不同，每个应用的启动图标会有很大差异。由于启动时环境是可变的，所以渲染效果会随着背景的变化而变化，导致图标在启动时的显示效果会受到背景颜色的影响。而仅仅设计简单的背景色或照片，展示效果并不显着，但设计过于丰富的在色彩和视觉元素丰富的照片，启动图标的识别率同样也会大大降低。因此，启动按钮的颜色不仅可以吸引用户的注意力，还可以增强与各种背景的视觉效果，让用户轻松找到它。(3)预防措施随着智能手机显示技术的不断发展，用户对界面性能的理解越来越高，对界面各个元素的品质提出了新的要求。虽然启动图标在手机屏幕上占用的空间很小，但它的设计并不好，很可能会被其他图像覆盖。因此，对启动图标的细致处理、对图案形状的多重解读、对图像呈现的精心打磨，都会让整个启动设计更加引人注目。4.2.2APP内部界面的图标设计及方法应用程序中除了启动图标外，还有很多图标，其中大部分显示为页面，也有一些是工具栏。根据网页内容的规划，在设计网页时，应注意图标之间视觉风格的一致性。图标在形状、颜色和排列上统一，使用户能够更好地记住和熟练使用界面。图4.6显示了可汗学校的移动界面和内容。可汗大学有许多教学大纲。因此在教学内容的图标设计中，通过图形化的方法，学生可以减少他们在APP页面的视觉混乱。同时，他们还可以通过简单的图文进行讲解。此外，通过简单的图形和文字的设计，用户可以轻松记住图形。在APP的使用过程中，学生可以养成习惯。图标识别不如文字清晰，但视觉直观且丰富，因此图标识别在手机界面中意义非凡。一个好的图标可以让用户从小就了解它的象征意义和功能，并形成记忆和利于使用习惯的培养。4.3色彩随着智能手机显示能力和色彩表现能力的不断提升，高校在线教学应用的色彩优化势在必行。色彩在高校网络教学应用APP中的应用，就是根据用户的特点合理规划各个界面的色彩，把握主要色彩并对相应信息进行强调和分类。4.3.1色彩的视觉感知与心理呈现对于大学生在线教学应用用户而言，设计色彩对人们心理认知的影响。用户的特点和需求决定了他们的选择。相应的配色与学校在线教学应用的定位和学校现有视觉基因的应用密切相关。“色觉效应”是指：看到各种颜色时，会有各种感觉和联想；人们在看到或记住某种颜色时，能自发地、真诚地描述这种颜色所引起的各种感受。人们很容易感受到颜色带来的心理和情绪变化。在人们的思想和情感中，不同的颜色在人们的精神和情感上具有相似性，如红色代表着兴奋、热情、热情和大胆；另一方面，绿色让人联想到自然，让人感觉清新、年轻；橙色让人感觉充满活力和年轻。在界面设计中，色彩是尽量使用相同色系。比如京东阅读（左）和常规的阅读界面（右）多为灰色，更适合应用的定位。4.3.2色彩在高校在线教育APP界面设计中的运用在一个界面中，颜色的组合在产品的最终呈现中起着重要的作用，所以要正确使用颜色，突出重要信息，并清晰地描绘出来。首先，要注意色彩之间的协调。通常，在界面中，在选择颜色时，会根据主色选择合适的颜色。在此基础上，根据不同的手机界面尺寸进行颜色划分，通过颜色对比实现不同区域之间的对比。由于屏幕尺寸的限制，显示信息存在一定的缺陷，所以在使用色块分割界面时，要注意不同颜色的色差，调整亮度、纯度、色相的颜色以获得一致美观相片。注意不同颜色之间的区别。即使是单一的界面，适当地使用对比色和互补色也会给画面带来层次感和空间感。4.4文字在高校在线教育APP的界面设计中，文字作为高校在线教育APP比不可少的视觉元素之一，几乎会出现在高校在线教育APP的各个界面。虽然文字对于人的视觉吸引力远不如图片、图形来得直观、强烈，但是文字对信息的高效、精确传达是图形、图片无法取代的；在高校在线教育APP的界面设计中有自己独特的作用。文字在高校在线教育APP的界面上，通过字体、字号大小的不同，以及字距、行距的调整使得界面内容与设计形式达到高度一致，带给用户良好的信息识别体验。4.4.1字体字体是影响文本元素的主要因素。高校在线教学应用的字体选择是基于用户对文本元素的感知和学校与生俱来的视觉基因。不同的字体匹配高校在线教学应用的风格。在移动端应用中，常用的汉字有Microsoft、Bold、ChineseBold、AppleBold、TimesNewRoman等，而英文字符则比较多样化，主要是Bold等。对于高校在线教学应用来说，字体的选择对于丰富文本内容至关重要。由于粗细结构的线性特色，不同的字体有自己独特的风格。他们的组合带来了不一样的感觉。在用户使用中，多种字体的使用可以提供多层次的信息，为用户提供舒适的视觉体验。字体可以分为两种类型：衬线字体和无衬线字体。常见的中文界面通常是白色的，而无衬线的则是黑色的。从图中可以看出，字体的结构进行了一定程度的修改，垂直和粗细有所不同。无衬线体位更加和谐，构图和线条排列没有太多变化。对于高校在线教学应用中的文本界面，无衬线图比衬线图更显眼，适合文章标题。衬线可用于某些正文文本内容。4.4.2字号在界面设计中，字体大小直接关系到界面布局和信息层次。重要信息通常以大字体显示，而可以省略的不太重要的信息以较小的文本分隔。同时，在字体大小的情况下，要根据文字的颜色进行调整，以达到更好的视觉体验。如图4.13中，三个不同的界面，虽然标题的字体和副标题的字体是相似的，但是通过调整标题字号的大小，改变副标题中字体的颜色，让标题传达的信息更加突出了。4.4.3字距和行距在对大量文本数据进行整理的过程中，文本间距的分布是由于文本间距和行间距的不同造成的，对用户的文本阅读影响很大。单词之间的间距与人们在水平移动时创建的视觉流一致。单词之间的距离越大，越容易读得越快。行距对阅读速度有很大影响。行距越大，用户的转换越精确。行距越短，阅读负担越大。由于信息所承载的信息采用了不同的字距和行距，因此易于扩展。在高校在线教学应用的界面设计中，尤其是在文字信息量较大的情况下，要注意排版和文字间距。为方便读者，将信息量过大的文本信息分成若干部分。4.4.4文字色彩在界面上，还可