第六章 界面风格的设计制作（课件）-高二《移动端UI设计》同步精品课件（电工版2022）

移动端UI设计 1 初识移动端界面设计 2 色彩在移动的界面中的应用 3 移动端界面设计要素 7 综合案例 6 界面的设计与制作 5 移动端界面图标与组件设计 目 录 4 移动端界面版式设计 6 界面风格的设计制作 6 本章将对移动端界面具备的主要风格进行具体阐述：包括有扁平化风格界面设计制作、卡通手绘风格界面制作、写实风格界面制作的设计教程，使读者更好的了解移动界面的设计与制作。 扁平化设计是一种极简主义的美术设计风格，通过简单的图形、字体和颜色的组合，来达到直观、简洁的设计目的。扁平化设计风格比较常见于传统媒体，比如杂志、公交指示牌等处。随着计算机网络技术的发展，扁平化设计风格越来越多应用于网站，移动端等人机交互界面，以迎合使用者对信息快速阅读和吸收的要求。 6.1.1 正确认识扁平化风格 要设计出好的扁平化界面，必须抛弃所有拟物风格的技巧。通过图6-1可以了解拟物化设计的主要特点，把这些特点统统扔掉，就是扁平化设计的特征。 界面风格的设计与制作 6.1 扁平化风格界面设计制作 6 扁平化设计追求的是一切极其的简洁、简单，反对使用复杂的、不明确的元素。在设计扁平化风格界面时，特别是在图标的设计时，应该遵循极简原则。复杂的、含义模糊的元素将会造成使用者的困扰，这与扁平化设计风格直观、简洁的总原则是相违背的。 扁平化设计的优点： ①降低移动设备的硬件需求，延长待机时间； ②可以更加简单直接的将信息和事物的工作方式展示出来，减少认知障碍的产生； ③随着网站和应用程序在许多平台涵盖了越来越多不同的屏幕尺寸。设计正朝着更加扁平化的设计，你可以一次保证在所有的屏幕尺寸上它会很好看。扁平化设计更简约，条理清晰，最重要的一点是，更好的适应性。 界面风格的设计与制作 6 5.1.2 移动端扁平化风格界面制作 1.界面完成图如图 2.所用知识点： 本设计主要用到了 PS 软件中的以下几个命令： 矩形工具/ 椭圆工具/ 渐变工具/ 隐藏选区 不同的界面风格 6 6.2 写实化风格界面设计制作 1.界面完成图如图 2.所用知识点： 本设计主要用到了 PS 软件中的以下几个命令： 矩形工具/ 椭圆工具/ 渐变工具/ 图案叠加/ 直接选择 不同的界面风格 6 6.3 卡通绘画风格界面设计制作 APP界面视觉设计要求设计师非常明确的传达这个APP的主旨的。所以，色彩、图案、形态、布局等的选择必须与APP的功能、情感相呼应，务必做到一脉相承，零时间传达APP的概念。 近年来手绘风格的界面设计越来越受到大众的欢迎，不单单是儿童，成人们通过手绘更能体会其中设计师想表达的含义。优秀的APP界面视觉设计是有特点的，是吸引人的，特别是在第一眼的时候。整个设计过程会是一场微妙的博弈与平衡，以达到一种魅力的素雅的耐看的境界。 如图所示，宠物饲养APP案例，旨在通过手绘卡通类界面的绘制帮助读者更好更全面的了解