移动产品设计基础(1)

合集下载

移动应用设计入门指南

移动应用设计入门指南

移动应用设计入门指南第一章:移动应用设计基础知识移动应用设计是指为移动设备开发的应用程序的设计和开发过程。

在这一章节中,我们将介绍移动应用设计的基础知识。

1.1 移动应用设计概述移动应用设计是一门复杂的学科,涉及用户界面设计、用户体验设计、信息架构等多个方面。

设计师需要考虑移动设备的特性,如屏幕大小、触控操作等,以及用户的需求和行为习惯。

1.2 移动应用设计原则在设计移动应用时,有一些原则需要遵循。

例如,简化界面,保持一致性,注重可用性和可访问性,以及遵循最佳实践等。

这些原则能够提高用户体验并增加应用的成功度。

1.3 移动应用设计工具设计师可以使用各种工具来辅助移动应用设计,如Adobe XD、Sketch、Figma等。

这些工具能够帮助设计师创建界面原型、进行用户测试和协作设计等。

第二章:用户界面设计用户界面设计是移动应用设计中的关键部分,它决定了用户与应用的互动方式和用户体验。

2.1 用户界面元素用户界面有许多元素,包括按钮、文本框、下拉菜单等。

设计师需要深入了解这些元素的特性和使用场景,并合理地组织它们以提供直观和简洁的界面。

2.2 界面布局良好的界面布局可以提高用户的操作效率和满意度。

设计师应该合理安排界面元素的位置和大小,以及设计导航结构,使用户能够快速找到所需功能。

2.3 视觉设计视觉设计对于吸引用户和提升用户体验至关重要。

设计师需要选择适合应用风格的颜色、字体和图标,以及创建各种视觉效果,如过渡动画和响应式设计等。

第三章:用户体验设计用户体验设计是为了提供令人愉悦和满意的用户体验而进行的设计过程。

3.1 用户研究在进行用户体验设计之前,设计师应该对目标用户进行研究,了解他们的需求、偏好和行为模式。

这能够帮助设计师更好地满足用户的期望和需求。

3.2 交互设计交互设计是决定用户如何与应用进行交互的过程。

设计师需要设计可用性强的交互方式,如简单明了的导航、友好的反馈和智能的搜索等。

3.3 用户测试用户测试是评估应用设计的有效方法。

移动应用界面设计入门

移动应用界面设计入门

移动应用界面设计入门第一章:移动应用界面设计的基本概念移动应用界面设计是指为移动设备开发的应用程序设计页面的过程。

在移动应用界面设计中,设计师需要考虑用户体验、界面布局和交互方式等因素,以创建出能够吸引用户并具有易用性的界面设计。

第二章:移动应用界面设计的原则2.1 简约性原则移动应用界面设计应该尽量避免过度复杂和冗余的设计元素,以简约的方式呈现信息,提供清晰、直接的用户体验。

2.2 一致性原则界面元素的样式、布局和交互行为应该保持一致,以便用户能够轻松理解和预测应用程序的功能和操作方式。

2.3 可视性原则界面设计应该注重可视性,使用合适的颜色、字体和图标等元素,以优化用户界面的可视效果,提高用户的识别和理解能力。

2.4 易用性原则移动应用界面设计应该注重易用性,设计师应考虑用户的使用习惯和行为,提供简便直接的操作方式,减少用户的学习成本和操作疑惑。

2.5 反馈与回应原则移动应用界面设计应该及时向用户提供操作的反馈和回应,如按钮的点击效果、页面转场动画等,以增强用户的参与感和满意度。

第三章:移动应用界面设计的工具与技术3.1 设计工具常用的移动应用界面设计工具有Sketch、Adobe XD、Figma等,这些工具提供了丰富的设计元素、交互模板和原型制作功能,方便设计师进行界面设计。

3.2 响应式设计响应式设计将应用界面设计为适应不同屏幕尺寸和方向的布局,使得用户能够在各种设备上获得一致的体验。

3.3 视觉设计视觉设计通过合适的颜色、字体、图标和图片等元素来传达信息和情感,提高用户对界面的可视性和吸引力。

3.4 用户测试用户测试是指邀请用户参与界面设计的评估和验证过程,可以通过用户反馈和观察来不断改进界面的设计和交互方式。

第四章:常见的移动应用界面设计模式4.1 标签式导航标签式导航是将主要功能划分为不同的标签页,让用户能够快速定位和切换不同的功能模块。

4.2 卡片式布局卡片式布局是将不同的信息和功能以类似卡片的形式呈现,增强可视性和信息组织的效果。

移动产品设计

移动产品设计

6、PCB:
TEST PORT
BUZZER
LCD与金属外框一体,显得很结实。
7、ANT:
ANT
TEST PORT COVER
这是一款内置天线的手机,上图天线为一块薄铜片与塑 料壳热融在一起,再通过弹片与PCB连接。
二、人与物的关系
1、功能
手机随着通讯科技的发展进入人们的生活,如今几 乎已经成为一件必不可少的个人物品,这归根结底是 由现代人对远距离移动通讯、以及娱乐等工作、生活 需求所决定的。 已经出现的手机的功能有:语音通话、文字信息、 健康管理、游戏、网络、电视、拍照、录音等。
5、KEY PAD:
这款手机的KEY PAD最据特色,字键同时也作为方向键(2、4 、6、8)大大增加了可操作性。KEY PAD与 METAL DOME、PCB 板成为一体,箭头所指10个PIN再通过导电橡胶(是否为导电 橡胶还值得研究)与主PCB板上相对应的PIN相连接。
这一块板安装在KEY PAD 与PCB板之间。红色箭头所指就是上 面提到的导电橡胶。蓝色箭头所指为MIC,不过VIBRATER也与 它集成在一起。
2、外形 手机的外形根据结构的形式可以分为直板机、 折叠机两大类。 外形的差异使之成为不同细分消费者群体选 择手机的关键性因素。 决定手机外形的因素有:机型、颜色、天线、 屏幕、按键等。
3、人机 手机是一种典型的个人物品,又具有较高的 技术含量,其使用操作的人机效能可以分为软 件和硬件两个方面。 硬件的人机效能与手机的尺寸、形状、屏幕 的大小、按键大小排布、响铃性质、携带方式 有关。 软件的人机效能主要决定于手机的菜单设计, 图标的识别性、命令的归类、输入法的设计等。
4、 Dome 按下去后,它下面的电路导通,表示该按键被按下。 材料:有两种,Mylar dome和metal dome,前者是聚 酯薄膜,后者是金属薄片。Mylar dome 便宜一些。 连接:直接用粘胶粘在PCB上。

移动应用设计知识点

移动应用设计知识点

移动应用设计知识点移动应用设计是指在移动设备上开发和设计应用程序的过程。

随着智能手机和平板电脑的普及,移动应用设计变得越来越重要。

本文将介绍一些关键的移动应用设计知识点,以帮助读者了解和掌握这一领域的重要概念和技术。

一、用户界面设计用户界面设计是移动应用设计中最重要的方面之一。

一个好的用户界面可以提供出色的用户体验,并帮助用户快速而轻松地完成他们的任务。

以下是一些用户界面设计的基本原则:1. 简洁明了:避免过多的复杂性和混乱的布局,保持界面简洁和直观。

使用明确的图标和标签,使功能易于理解和操作。

2. 一致性:保持界面的一致性,使用相似的颜色、字体和排版。

这样可以建立用户对界面的熟悉感,提高可用性。

3. 响应式设计:确保界面在不同的屏幕尺寸和分辨率上都能良好地呈现,并且能够适应用户的交互行为。

4. 可访问性:考虑到残障用户的需求,为他们提供适当的辅助功能,如放大字体、语音导航等。

二、信息架构和导航信息架构和导航是指移动应用中组织和呈现信息的方式。

良好的信息架构和导航可以帮助用户快速找到他们需要的内容。

以下是一些常见的信息架构和导航模式:1. 导航栏:通常位于屏幕的顶部,用于提供应用的主要导航选项。

导航栏通常包括应用的logo、返回按钮和其他重要的导航链接。

2. 标签栏:通常位于屏幕的底部,用于提供应用的次要导航选项。

标签栏可以让用户在不同的模块之间切换,提供更多的功能。

3. 菜单:用于提供应用的其他选项和功能。

菜单可以是侧滑菜单、下拉菜单、弹出菜单等形式。

4. 引导页:用于向新用户介绍应用的功能和特点。

引导页通常包括滑动教程、欢迎页面等。

三、可用性和用户体验可用性和用户体验是移动应用设计中的关键考量。

一个好的移动应用应该能够提供简单、直观和愉悦的用户体验。

以下是一些提高可用性和用户体验的方法:1. 反馈机制:为用户提供及时的反馈,以便他们了解他们的动作是否成功。

反馈可以包括提示信息、动画效果等。

2. 状态保存:在用户离开应用或切换到其他应用时,保存应用的状态。

手机产品结构设计的基础知识(doc 11页)

手机产品结构设计的基础知识(doc 11页)

手机产品结构设计的基础知识(doc 11页)手机产品的结构设计基础2006-11-30 15:51手机产品的结构设计是实现产品功能的关键,这不仅需要与产品外观相协调,更要考虑后序的生产装配、喷漆、喷绘、模具设计制造等各个方面。

手机产品的形体结构设计牵扯知识范围十分广泛,主要有:1.材料选用;2.表面处理;3.加工手段;4.包装装潢;这些因素的运用直接影响着手机产品的生命和外观形象的变化。

可以说设计者水平的高低决定了产品的生命力和产品的档次高低,高档次产品不一定是高造价,运用低造价设计出高档次的产品是设计者高水平高素质的体现。

我主要想讲的是前两项,后两项以后再说。

1.要评审造型设计是否合理可靠,包括制造方法,塑件的出模方向、出模斜度、抽芯、结构强度,电路安装(和电子工程人员配合)等是否合理。

高温尼龙 HTN ZytelHTN? 液晶聚合物 LCP Zenite?(II)结晶型与无定型塑料的区别熔解/凝固晶体的本质也对成型过程产生影响,因为要破坏熔点时的晶体排列次序需要额外的热量,这热量叫做熔解热。

晶体性塑料和无定型塑料熔解热的对比如图之所示。

无定型物质的温度随看所加入的热量而增加,而且越来越呈现为液态。

当温度上升至熔点以前,结晶型塑料物质能保持强度和硬度不变。

熔解时额外所需的热量熔解热破坏了晶体的结构,同时温度保持不变,直到熔解结束。

随著塑料在模具中冷却,释放出来的熔解热必须由模具向外散掉。

然而,随著温度的降低,成型稳定性和硬度迅速地提高,工件可以相当快地从模具中脱出。

因此,结晶性塑料较适合应用于短周期成型。

收缩紧密的结构意味著从熔体到固体的结晶型塑料有一个较大的体积改变。

因此,结晶形塑料比无定型塑料有较高的成型收缩率一通常前者大于百份之一,而后者大约有0.5%。

结晶形塑料较高的收缩率使得估算型腔尺寸复杂化,但这一优点也有助于工件的脱模。

一些典型的成型收缩率的比较列于表二。

表二、成型收缩率的比较结晶形塑料收缩率聚甲醛尼龙66聚丙烯2.01.51.0-2.5无定形塑料收缩率聚碳酸脂聚苯乙烯PDF 文件使用 "pdfFactory Pro" 试用版本创建 0.6-0.80.4当结晶型塑料熔解时,它们往往变得高度液态化。

如何进行移动端设计

如何进行移动端设计

如何进行移动端设计移动端作为互联网时代最重要的设备之一,设计人员在进行移动端设计时需要考虑很多方面的因素,才能够使得设计作品真正地符合用户的需求,提升用户的体验。

那么,如何进行移动端设计呢?首先,我们要认识到移动端与PC端的不同之处,因为这两者有相当大的差异。

一方面,移动设备屏幕较小,用户的使用时机和使用场合也不同,对操作交互和UI设计都有所偏移;另一方面,移动设备是一种具有极高流动性的终端设备,涵盖了许多不同的界面设计方面。

移动端设计的首要目标应该是提升用户的使用体验和易用性。

在移动端,设计时需要考虑到用户的交互行为和最常用的操作行为,如触摸、滑动、缩放等。

因此,在进行移动端设计时,应该牢记以下几个方面的因素:一、响应式设计响应式设计是为了适配不同的屏幕大小,在设计时,应该把用户可用的界面空间最大化,以便最大限度地减少图文信息重叠和重叠,加强可用性。

同时,响应式设计也可以保持相同的信息,在应用程序在不同设备上展开的时候,提供相同的体验。

二、界面设计对于移动端,应该保持简单明了、符合人体工学的界面设计,以便让用户在使用时轻松上手。

对于按钮和控件的设置,应该考虑到用户的预期操作,减少不必要的界面元素,增强易用性。

此外,在界面设计中也考虑到应用程序的视觉效果,使用颜色来传达信息,增加视觉吸引力。

比如在界面颜色的选择上,应该保持简洁大方的基调;对于的徽标等元素,应该具有标识性且易于记忆。

三、交互设计在移动端的应用程序交互设计中,需要考虑用户的使用环境和用户的习惯行为。

比如,利用点击、滑动、拖拽等操作来完成用户的操作;利用缓存技术,增强用户操作的流畅性;对系统进行缓存,保证用户操作的连续性。

此外,要对功能进行分类,按照用户使用场景构建逻辑关系,增加用户操作的顺畅性。

四、可用性测试无论是在PC端还是在移动端,应该不断地进行测试和调整,以保证应用程序的实际操作效果和用户的期望效果相符。

在移动端设计中,则需要建立一种可用性测试机制,从视觉习惯、操作方式、使用频率等多角度进行测试,从而优化用户体验。

手机产品结构设计的基础知识(doc 11页)

手机产品结构设计的基础知识(doc 11页)

手机产品结构设计的基础知识(doc 11页)手机产品的结构设计基础2006-11-30 15:51手机产品的结构设计是实现产品功能的关键,这不仅需要与产品外观相协调,更要考虑后序的生产装配、喷漆、喷绘、模具设计制造等各个方面。

手机产品的形体结构设计牵扯知识范围十分广泛,主要有:1.材料选用;2.表面处理;3.加工手段;4.包装装潢;这些因素的运用直接影响着手机产品的生命和外观形象的变化。

可以说设计者水平的高低决定了产品的生命力和产品的档次高低,高档次产品不一定是高造价,运用低造价设计出高档次的产品是设计者高水平高素质的体现。

我主要想讲的是前两项,后两项以后再说。

1.要评审造型设计是否合理可靠,包括制造方法,塑件的出模方向、出模斜度、抽芯、结构强度,电路安装(和电子工程人员配合)等是否合理。

了它们形成象石英那种固体所具有近乎完美的结构和完整的晶体排列次序。

聚合物,例如高密度聚乙烯是有点结晶性的,尼龙的结晶性表现得更为强一些,而聚甲醛的结晶性表现得就更强了。

左图给出了一些常见的晶体形塑料和无定形塑料。

注意到许多工程塑料位于结晶型栏里,如聚甲醛,尼龙和聚酯。

这是因为结晶型结构树脂趋向于产生工程应用中所要求的特性,例如:抗化学物、油、汽油、油脂等。

机械强度和硬度。

在高温下,保持机械的和化学的性能不变。

耐疲劳性和重复的冲击。

半透明性或不透明性。

聚合物金字塔。

本图表示不同树脂的分类。

塔底是商品塑料所目的两种特性,塔顶处是高性能塑料,工程塑料处于中间的位置。

PEI:聚醚亚胺 PEEK:聚醚酮 PES:聚苯醚砜 PPS:聚苯硫醚PAR:聚芳酯 PSU:聚砜 LCP:液晶聚合物 HTN:高温尼龙PI:聚酰亚胺 PET:聚对苯二甲酸乙二酯 PBT:聚对苯二甲酸丁二酯PC:聚碳酸酯 M-PPO:改性聚苯醚 Nylon:尼龙ABS:丙烯睛丁二烯苯乙烯三元共聚物POM:聚甲醛 TPE:热塑性聚酯弹性体 PS:聚苯乙烯 PP:聚丙烯PVC:聚氯乙烯 HDPE:高密度聚乙烯 PMMA:聚甲基丙烯酸甲酯(亚加力)LDPE:低密度聚乙烯 SAN:苯乙烯一丙烯晴共聚物 SMA:苯乙烯马来酸酐表一、杜邦结晶型工程塑料化学名词简称杜邦注册商标聚甲醛 POM Delrin?聚酰胺 Nylon Zytel? 聚对苯二甲酸乙二酯 PET Rynite?聚对苯二甲酸丁二酯 PBT Crastin? 热塑性聚酯弹性体 TPE Hytrel?高温尼龙 HTN ZytelHTN? 液晶聚合物 LCP Zenite?(II)结晶型与无定型塑料的区别熔解/凝固晶体的本质也对成型过程产生影响,因为要破坏熔点时的晶体排列次序需要额外的热量,这热量叫做熔解热。

移动端APP的设计和开发基础

移动端APP的设计和开发基础

移动端APP的设计和开发基础现如今,移动互联网已成为人们生活中不可或缺的一部分,APP应用的使用频率不断增加,APP开发更加重要。

移动端APP的设计和开发是一项具有挑战性且综合性极强的任务。

本文将从界面设计、体验设计、技术开发等方面进行探讨。

一、界面设计界面设计是移动端APP的重要环节,它直接关乎用户的使用体验。

良好的界面设计可以让用户更容易上手使用APP,并增强用户对APP的满意度。

1.1用户交互用户交互设计是界面设计的核心,在设计APP界面时应该考虑用户的需求和操作习惯。

通常,用户界面应该简单明了、操作流程自然、视觉美观。

同时,也要注意不同屏幕尺寸、不同分辨率、不同操作系统版本的适配问题,保证不同设备上的用户体验一致。

1.2平面设计平面设计是移动端APP的另一个关键点。

画面美观不仅可以提升用户使用体验,还可以吸引用户留下来更长时间使用APP。

APP画面的风格和设计元素应该与所目标用户群体的喜好相符合。

用户交互设计以及平面设计是两个相辅相成的环节,良好的搭配可以增加用户粘性,提升APP的市场竞争力。

二、体验设计体验设计是APP设计和开发中一个非常重要的方面。

良好的体验设计可以有效提升APP的使用价值和用户满意度。

2.1用户研究用户研究是进行体验设计的第一步。

用户研究可以了解用户的行为、需求、体验反馈等信息。

通过这些信息可以更好地理解用户正在寻找什么、以及用户想要的是什么。

2.2信息架构良好的信息架构可以更好地提供指导用户寻找和使用APP服务的路径。

默认打开时,APP的主要功能入口应该尽可能突出,并且APP整体架构也应该是基于用户行为需求的。

2.3视觉效果视觉效果是给用户留下深刻印象的关键环节。

一些元素的旋转、渐变和动态效果的运动可以让用户一目了然所应用的操作。

同时,在用户与用户界面元素交互时,一些短触感觉也必不可少。

三、技术开发移动端APP的开发会遇到技术上的问题。

下面是几个常见问题的讨论:3.1开发语言Android和iOS是目前最流行的两个移动APP软件平台。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
移动产品设计基础(1)
界面布局 设计区域
由于在设计中,设计师是按照retina屏幕分辨率去设计的,在设计的最后输 出一倍图的时候我们需要将两倍缩小成一倍图,因此,在两倍图的设计中, 必须保证每一个单独存在的个体的大小是双数像素,如148px*248px。这样 才能使在缩小到一倍图的时候不会出现13.5*17.5像素的情况(大家都知道 世界上是没有半个像素的存在的,像素不齐便会出现虚拟像素,图像会模 糊)
移动产品设计基础(1)
尺寸与分辨率 iPhone
320px
640px
640px
1136px 960px 480px
iPhone-iPhone3GS
iPhone4-iPhone4S
iPhone5
移动产品设计基础(1)
尺寸与分辨率
iPad
iPad: 第一代的iPad屏幕尺寸为9.7英寸,分辨率为1024*768,屏幕密度为132PPI。全新的 iPad屏幕密度同样提升了两倍,分辨率达到2048*1536。最近新出的iPad mini 屏幕 尺寸为7.9英寸,分辨率为1024*768。 在设计iPad的应用程序时,设计师要以2048*1536的基准进行设计,然后制作一套 缩小两倍的图片资源。(未缩的我们叫两倍图,缩了的叫一倍图)iPad mini由于和 iPad比例一样,不需要另外设计,直接可以使用相应的一倍图适配到设备中。
移动产品设计基础(1)
界面布局
导航栏(navigation bar)
320pt*44pt
按钮可以是文 字或图标
规范里的话: 导航栏展示在顶部状态栏的下方 在一个应用的不同视觉中进行导航 提供对当前视图内容进行管理的空间 导航栏可以仅仅以横向居中方式显示当前视图的标题
当用户进入其他视图时,导航栏的标题应该更改为当前位置的标题,并且 应该提供包含上一位置的后退按钮。 除了后退按钮外,导航栏可以在标题右侧包含第二个按钮,如编辑,添加。
什么是iOS:苹果iOS是由苹果公司开发的手持设备操作 系统。苹果公司最早于2007年1月9日的Macworld大会 上公布这个系统,最初是设计给iPhone使用的,后来陆 续套用到iPod touch、iPad以及Apple TV等苹果产品上。 注意:写法是iPhone、iPad、iPod、iOS。
移动产品设计基础(1)
字体
iOS里的中文字体
苹果默认的中文字体是Heiti SC(黑体-简,黑体-简的英文名称为Heiti SC。 Heiti为黑体的拼音,SC代表简体中文(Simplified Chinese)),是Mac OS X Snow Leopard(版本10.6)包含的简体中文字型,也是iPhone OS 3.0(版本 4.0后改名为iOS)及iPod nano第五代以来的预设简体中文字型。
移动产品设计基础(1)
尺寸与分辨率
iPhone
iPhone: 第一代的iPhone屏幕尺寸为3.5英寸,分辨率为320*480,屏幕密度为165PPI,而从 iPhone4开始屏幕密度增加了两倍,分辨率达到640*960。而到现在iphone5的分辨 率则为640*1136。 在设计iPhone的应用程序界面时,设计师要以640*960的基准进行设计,然后制作 一套缩小两倍的图片资源。(未缩的我们叫两倍图,缩了的叫一倍图)因为所有 iPhone都使用了相同的尺寸,所以最终能在两种分辨率上显示的物理大小完全相同。 由于iphone5只是高度发生变化,在适配时一般保持设计控件大小不变,只是内容 露出增多。但对于一些满屏设计的界面则需要考虑是否需要另外设计一份页面 640*1136(如app背景图,启动图等等)
移动产品设计基础(1)
界面布局
标签栏(tab bar)
实际应用上: 并不是所有的首页都有标签栏。
当图标意义足够明确,可以不使用文字; 当标签意义过于抽象,可以全部只使用文字
移动产品设计基础(1)
界面布局 标签栏(tab bar)
实际应用上: 形状上不一定就是长方形,不一定所有标签都等宽。
移动产品设计基础(1)
移动产品设计基础(1)
界面布局 工具栏(tool bar)
实际应用上: 家居杂志和太平洋电脑网客户端内页工具栏展示
移动产品设计基础(1)
界面布局 点击区域
规范里的话: 在设计任何可点击的部件时,设计师应该首先考虑设计区域是否易于让用 户点击,因此在设计规范里,任何可点击的部件,大小都不应小于44*44pt。 因此,按钮不应小于44*44pt;app的banner广告图高度也不应小于44pt;列 表的高度也不应小于44pt等等。
界面布局 导航栏(navigation bar)
实际应用上: 页面标题和按钮一样可点击
移动产品设计基础(1)
界面布局
标签栏(tab bar)
320pt*49pt
规范里的话: 标签栏显示在屏幕的下方边缘 标签栏向用户提供了再应用的不同模式或不同视图间切换的能力。 标签栏显示图标和文本,每一个标签栏元素等宽地显示 标签栏被选择的标签需要有一个当前的高亮状态 无论横屏竖屏都不改变其高度 标签不超过5个时,可以在标签栏中等宽地展示 当标签超过5个时,系统会展示其中4个并展示一个“更多”的标签 可以在卡片栏上显示一个提醒标记
移动产品设计基础(1)
界面布局
导航栏(navigation bar)
实际应用上:
顶部状态栏下不一定就是导航栏,可 以没有,也可以是搜索栏等等。
导航栏大于44pt,页面标题左对齐
移动产品设计基础(1)
界面布局 导航栏(navigation bar)
实际应用上: 不同的元素组合成导航栏
移动产品设计基础(1)
移动产品设计基础(1)
移动产品特性 移动产品使用特点
移动设备的方便携带,也同时 带来了它浏览时间的碎片化。 以智能手机为例:我们通常在 短暂的时间里,完成一件任务 或者是进行一个娱乐事件,比 如:散步、坐公交、睡前、午 后闲暇、旅行的时候,开始拍 照、分享、做笔记、玩游戏、 购物,等等。在平均短短5-30 分钟的时间里,思路常常被打 断,手机常常被拿起放下,高 效和轻交互,就成为了移动设 计的特点。而对于平板电脑而 言,它的使用时间一般为在家 中较为安静,舒适的环境空间 下,使用时间也较为固定。
移动产品设计基础(1)
移动产品设计基础
字体
移动产品设计基础(1)
字体
iOS里的默认字体
在ios中默认字体分为三类: 第一种:STHeiti-Light.ttc 和 STHeitiMedium.ttc 代表的是中文字体 第二种:_H_Helvetica.ttc 和 _H_HelveticaNeue.ttc 代表的是英文以及 数字字体 第三种:LockClock.ttf 代表的是锁屏时 间字体
什么是安卓:Android是一种基于Linux的自由及开放源代 码的操作系统,主要使用于便携设备,如智能手机和平 板电脑。Android操作系统最初由Andy Rubin开发,主要 支持手机。2005年由Google收购注资,并组建开放手机 联盟开发改良随后,逐渐扩展到平板电脑及其他领域上。 2008年10月第一部Android智能手机发布。
移动产品设计基础(1)
尺寸与分辨率 iPad
768px
1536px
768px
1024px 2048px 1024px
iPad1-iPad2
iPad3-iPad4
iPad mini
移动产品设计基础(1)
尺寸与分辨率 Android
Android设备: Android设备的屏幕相对复杂一些,因为它们有各 种尺寸和分辨率。 为了让各种分辨率的屏幕显示合适的大小以方便 用户阅读或者操作,同时又能满足Android设备多 样性的需求。于是,Android官方通过对各种屏幕 进行密度等级划分,最后分为“低密度 (LDPI)”、“中密度(MDPI)”、“高密度 (HDPI)”、“超高密度(XHDPI)”这四个规 格,并同时将“中密度”定义为基准线。这样, 在设计Android应用程序的界面时,我们就可以一 视同仁把中密度的屏幕作为基准进行设计,然后 给其它密度的屏幕提供相应的图片资源。最后通 过系统的适配性自动处理,一样使得相同的内容 在各种屏幕上可以显示比较接近的大小。 在太平洋,一般我们设计为480*800的尺寸。
移动产品设计基础(1)
移动产品设计基础
界面布局
移动产品设计基础(1)
界面布局
iPhone
iPhone:
移动产品设计基础(1)
界面布局
iPhone
iPhone:
移动产品设计基础(1)
界面布局
iPad
iPad:
导航栏图标 ≤20pt*20pt 导航栏按钮 48pt*64pt
状态栏11/24
移动产品设计基础(1)
移动产品设计基础
目录
CONTENTS
一、移动产品特性 二、尺寸与分辨率 三、界面布局 四、字体 五、图标 六、切图 七、总结
移动产品设计基础(1)
移动产品设计基础
移动产品特性
移动产品设计基础(1)
移动产品特性
移动产品的种类
常用的移动产品按尺寸分有手机和平板电脑等,按平台分有iOS,Android,Windows, Windows phone等.这里我们主要讲iPhone、iPad、Android手机app的设计基础知识。
标签栏图标 ≤30pt*30pt
标签栏高 49pt
移动产品设计基础(1)
界面布局 状态栏 (status bar)
320pt*20pt 规范里的话: 状态栏是展示关于设备的重要信息,包括信号强弱、网络连接情况、电池情况等。 实际应用上: 一般而言所有界面都需要状态栏,除非是游戏等沉浸式的app,和某些全屏显示图 片的界面。
移动产品设计基础(1)
相关文档
最新文档