移动设计
2016-01-10 15:38:50 0 举报AI智能生成
移动设计是一种专注于为移动设备如智能手机和平板电脑创建用户友好界面的设计理念。它强调简洁、直观和高效的用户体验，以满足用户在小屏幕设备上的操作需求。移动设计需要考虑的因素包括触摸操作、屏幕尺寸限制、网络连接速度等。设计师需要通过精心布局、优化导航和提供清晰的反馈来确保用户能够轻松地在移动设备上完成任务。此外，移动设计还需要考虑到不同设备的兼容性和响应式设计，以便在不同的设备和屏幕尺寸上都能提供一致的用户体验。总之，移动设计是一种关注用户需求和行为的设计方法，旨在为用户提供便捷、愉悦的移动体验。
作者其他创作
大纲/内容
移动设计
1 概述
让用户一见钟情的应用
给用户最想要的
对于移动应用，首要的是能给用户带来的核心价值是什么，要突出那个最核心的价值。
让用户一眼就看明白
尽量使用信息可视化的方法，把信息呈现得更清晰易懂
在设计上抓住用户的眼球
某个设计点上给用户新奇的感受，从而让用户记住这个应用
在交互上让应用比竞品多走一步
一个好的应用首先要满足目标用户的需要，或者激发用户的需要。而后能通过贴心的设计，减少用户的精力和花费。最后这个应用还要对用户很有吸引力，留下深刻的印象和体验。
移动应用的生命周期
准备期：应用的设计、开发
发布期：洗衣农户为你的产品买单
文字描述
基本功能描述
运营吸引描述
更新功能介绍
图片
使用期：制造第一好感
图标
程序闪屏
迭代期：引导用户跟着产品更新
转变交互思维
移动应用多样化的使用场景
休闲中：网络状态好，用户心情放松，有长时间使用应用的可能性
等候中：网络状态不稳定，使用时间短，任务需要被分解得更简单，并且能够保存状态
忙碌中：电量、网络均不稳定，需考虑离线状态；用户多线程工作，需考虑操作对象的大小
移动设备与PC不一样的物理和交互特征
移动设备需考虑电量
移动设备屏幕较小，展示信息有限，一屏只处理一件事
移动网络不稳定，流量有限
移动端输入以手势为基础，但精度不高
小而美的移动应用框架
海量屏幕尺寸下的用户体验
响应式设计
发觉意想不到的产品创意
批判性接受PC设计中的设计经验
决定应用品质与神韵的动效设计
尊重、保护好用户隐私
2 特征
应用的使用情景特征
做设计也要因地制宜
移动设备的优势：携带方便、随时随地使用、永不关机、能够在任何姿势下使用、触屏的交互方式
克服环境光的影响
白天模式/夜间模式
应对不同的环境噪音
提醒、语音的设计
迎合用户的使用姿态
考虑中断事件、持机方式
移动网络的特性
全页面加载：适用于一屏只有一个元素，如全屏图片的载入
分布加载：先加载较小的文字内容，再加载较大的图片、视频等
懒加载：用户的浏览行为唤起内容加载，滚动页面时加载更多
智能加载：根据不同网络加载内容，减少流量损耗
离线访问：断网情况下可访问已有数据，减少流量损耗和访问时间，但要占存储空间
设备的物理特性
小而繁多的屏幕尺寸
因平台而异的手机按键
丰富的传感器体验
触摸手势交互特性
用户的手指喜欢往哪点
拇指操作：建议使用11mm的最小对象
食指操作：建议使用8~9mm的最小对象
手指触摸交互基础
手机的屏幕区域操作难易程度，与拇指和手指的划动弧度正相关
食指难于操作的区域是屏幕右侧空间
屏幕左下是食指和拇指都易于操作的区域
手势交互不只是点击
常见手势：点击、双击、拖拽、滑动、晃动、放大、缩小、长按、长按+点击、双指旋转
物理特征：延时、运动、压力、方位、触点数、序列
手势交互的优势：扩大操作空间、动态体验、增加信息承载、简化操作步骤
为手势设计时应避免犯的错
设计特性：自然性、可发现性、反馈（100ms以内的反馈时间是瞬时的）、有趣的、合适的
3 原则
主流操作系统的基本原则
Android 4.0
令人陶醉、简化我的生活、让我惊叹
iOS
美学完整性、一致性、直接操作、反馈、隐喻、用户控制
Windows Phone
时尚、随时随地使用、整洁、动态效果、简单、保持一致、真实、创新
移动设计八原则
1）内容优先
重组内容，使内容符合移动的特征
优先突出用户需要的信息，简化界面导航
适当提升空间利用率
2）为触摸而设计
以信息架构为基础，建立手势交互规范
优先设计自然的手势交互，而不只是Tab点击
引导用户在情景中学习手势操作
特殊手势不是必须的
可触区域必须大于7*7mm，尽量大于9*9mm
手势操作要提供过程反馈提示
3）转换输入方式
减少文本输入，转化输入形式
简化输入选项，变填空为选择
使用手机已有的传感器输入
4）流畅性
从三个方面考虑应用流畅性：手指及手势的操作流、用户的注意流、界面反馈的转场流畅性
5）多通道设计
指系统的输入和输出都可以由视觉、听觉、触觉等来协作完成
6）易学性
提倡简单、直接的操作，清晰表达产品目标和价值
7）为中断而设计
保存用户的操作，减少重复劳动
网络中断状态
编辑中断状态
衔接用户的记忆而不是让用户重头开始
无缝切换不同设备的内容
8）智能有爱
给用户提供惊喜有趣、智能高效、贴心的设计
4 框架
框架的深度和广度
广度优先的设计
优点：更容易让用户获取产品信息
缺点：用户需要更多识别时间，占用更多屏幕空间
深度优先的设计
优点：占用屏幕空间少，留给用户最关心的内容
缺点：获取信息的路径长，操作更繁琐，新用户搜索目标的难度增加
权衡广度与深度的考虑因素
产品核心价值、内容的数量、用户熟练程度、内容组织的有效性、目标内容的使用频率、内容之间的语义相似性、使用情景特征、手机反应时间
移动应用的框架分析
应用场景角度：产品框架可以更浅一点
硬件设备角度：产品框架可以更窄一点
产品框架的移动化
移动化
产品设计阶段：分析移动特征，提供给用户最合适的基于情景的设计
交互设计阶段：应用信息组织方式，敢于再简洁功能，组合同类信息，隐藏次要功能，转移一些功能到系统平台
路径扁平化
层级信息合并
隐藏
移动应用导航的设计模式
标签式
适用项：入口选项数目不多，且用户需要在选项间频繁切换执行多任务
注意项：不适合太过复杂和不稳定的结构
标签导航的扩展形式
突出最核心功能
标签的二级菜单
辐射式
适用项：分类清晰，入口独立且固定
注意项：不适合在交叉类别中使用
列表式
适用项：较适合展示层次分明的等级结构
注意项：控制好列表的个数和分组方式
列表式的扩展形式
树状列表
平铺式
适用项：平铺页面适用于少而精的内容和随意浏览的页面
注意项：无法立即跳到非相邻页面，不适合较多页面的加载
抽屉式
适用项：以当前内容为核心展示的应用
注意项：隐藏的导航内容，需要更好的方式来调出，比如手势
点聚式
适用项：需要提取最核心的几个点来展示产品特性
注意项：汇聚后将使部分导航隐藏，需要良好的引导
模式之外的因素
用户持机和拇指使用
扩展屏幕之外的导航
移动平台特性
5 细节
让人机交互更多样
指尖与界面的互动
点击
拖拽和拨动
多指手势
虚拟键盘的设计
让设备产生存在感
摇一摇
让声音与界面交流
tom猫
打开摄像头看世界
创造虚拟世界的界面
将界面可视化
可视化的信息结构
内容信息的图形化
可感知的操作线索
看得见的反馈
用隐喻引导用户
拟物化降低用户认知
形状、材质、颜色
用线索搭建隐喻系统
营造环境的隐喻
声音的互动
降低用户注意力
制造产品的使用氛围
树立品牌认知
机器间的交流\u00A0
6 动效
小细节、大作用
告诉用户应该做什么
提醒用户将要去到那里
帮助用户减少焦虑
转菊花(spinner)
引领用户经历故事
吸引用户触碰感知
营造应用独有气质
适合动效的应用场景
转场
形变
翻页、开关门、缩小放大、折叠、翻转...
运动
从屏幕四边进入离开
无技巧转场
引导
适时出现和离开
突出主要功能
新手帮助的亮点
反馈
轻量、具有生命感的运动
连贯、有一定过渡的形变
模拟现实、情感体验
不要忽略过程反馈
加载
等待时间的关键时间点
小于0.1秒：无感知，不做任何处理
0.1~1秒：使用动效为用户提供等待提示
超过1秒：打断用户思路，降低操作效率
超过10秒：大量用户失去耐心而离开
加载动效的方式
将品牌的颜色质感等附加在抽象的形状中，让抽象的形状进行变化
直接利用品牌logo进行动作或形状的变化
启动画面
如何描述一段动态效果
需明确的内容
明确对象
大致描述变化过程
给出精确数据，如每秒帧数、画面长宽比、运动对象位移像素、缩放比例等
运动动效的基本规范
位置、运动方式、触发行为、速度和节奏、明确各个运动对象的关系
形变动效的基本规范
大小、形状、透明度、明暗、颜色等
动效设计方法
运动形变，万变不离其宗
节奏速度，掌控曲线时长
情感故事，拟物、隐喻、品牌
结合操作，关联轻量自然
点到为止，切记过犹不及
尊重习惯，谨慎进行创新
快速原型，多方沟通权衡
7 适配
客户端产品的适配
为了更多的用户
移动设备的屏幕特点
为不同屏幕密度而设计
各种屏幕尺寸的界面适配
整体缩放：首页
间距增加：九宫格导航
单向拉伸：列表
智能调整：栅格列表
延展性：启动界面
横竖屏状态下的界面设计
多设备的响应式设计
响应式布局设计
图片的响应式变化
文字的响应式展现
理性看待响应式
响应式设计的优势
开发、维护、运营成本优势
兼容性优势
改动灵活
响应式设计的缺陷
用户需求
开发成本
加载速度
8 创新
移动设计中的创新机遇
真正做好移动产品，应以需求为起点，结合移动使用场景，思考模式的进化，这样的设计才是真正的创新
创新技法详解
逆反法
打破习惯的思维方式，对已有的理论、科学技术、产品设计等持怀疑态度，反其道而行，以获得巧妙的设计和创造
离散法
冲破原先事物面貌的限制，将研究对象分离，创造出新概念新产品
移植法
把一个研究对象的概念原理方法应用于另一个研究对象
子主题
0 条评论
回复 删除
下一页
