读《触动人心——设计优秀的iPhone应用》| 要点摘录

2016-11-08  本文已影响194人  62154d94755a

再次读一下这本书,系统地整理其中的要点说明。不论规则优劣(尽管里面的内容已经相对比较久远,但还是有一定价值),或者说实际里想要做的更卓越以打破规则,那首先都要了解规则,学习总是有必要的,发挥前需要积累。

本书要点摘录如下:(每部分中的要点,是该主题中最精要的内容,讲效率的话,看了它之后其他的也可以不用看)

1 设计令人欣喜且易用的应用

1、优秀的设计必须要有反复考虑过的想法、精练的功能、有效的可用性和一定程度的个性化。所有这些都需要时间、精力和天分,但也许最重要的,它需要一些常识。

2 我们是如何使用iPhone应用的

1、大多数人完全不认真思考也没必要认真思考应用的设计。

2、最佳的应用设计是看不见的,操作本身看起来就是退回到幕后,而把用户的任务或是娱乐摆到前面的中心地位。

3、别让用户在程序中迷路,别让用户的不爽积累,别让用户产生太大的误解。

4、用户不论多喜欢一款应用也不会全身心投入去体会每一丝微小细节,在引导他们进一步探索时,必须原谅并预计到用户会犯的一些小错误。

5、人们之所以会使用移动应用,正是因为他们在移动,会在千奇百怪的环境中玩应用。

6、应用在和周围的环境争夺者用户的注意力。

7、移动环境使用户不能集中精神,使用应用的过程会被切成一段一段的,见缝插针于其他活动中。

8、优秀的应用能将其自身融入用户繁忙的日程中,关注界面的效率,尽量只需一两下点击即能搞定。

9、满满一箱工具,你的应用只是其中的一把。工具各尽其责,选择其中一件事,集中精力,把你的应用简化到够用就好,接着改进,不断改进。

10、必须尽一切努力提高用户体验去满足用户需求,若没能给用户留下良好的第一印象,大部分用户不会回头。

11、触屏手势中,熟悉的物理隐喻完全奏效,因为它们和真实世界中的物体运作一模一样。

12、但即使标准内置手势,也有大批人不知道,所以尽可能选择使用单手指操作。

13、只把手势作为一种完成某个操作的快捷方式,并确保这个操作能够以另外一种(虽说效率一般会更低些)方式完成,这样用户总有办法完成任务。

14、应用里的图标,用户有时都可能认不出来。

15、手指在触屏上交互可以说很笨拙,没有那么精确,所以触摸操作设计上要仔细,关注人类工程学。

16、大多数人从不会下意识地关注你的设计,但用户并不想要简化你的应用,他们想要的是简单易用。

17、优秀的应用不会让我们思考——至少不会让我们思考该如何使用(不会让我们感觉任务复杂)。

3 精心设计你应用的目标

1、触动人心的应用就是要让用户过得更好,帮他们搞定事情,笑脸常开,保持互相联系,打发无聊时间,或是满足他们当时的其他需要。

2、触动人心的应用也许赏心悦目,但伟大应用的基础,绝不仅限于把界面做好看。在应用设计中,美还需要由功能来传递,每个界面元素都必须专注于用户当下所需。

3、用户的每次点击都有所回报:反馈信息、传递欢乐、完成任务或是感到满意。

4、你的应用是做什么的?为什么?

5、你的应用与众不同地为用户解决了什么问题?

6、用户使用你应用的原因是“为什么要用“,只有这点才能让你的应用触动人心。

7、越是专注于单个需求,应用就越能成功,当你在计划应用方案时,要同时计划好用例和应用场景,即一个简单的故事。

8、你的故事内容是什么?

    8.1 五要素

          人物:框定了应用的受众

          事件:框定了受众会做的事情

          时间、地点:讲清了情境如何

          起因:描述了受众的动机和目的

9、你的应用为何是移动应用?

10、案例:Gowalla

      10.1 图标的收集游戏

      10.2 利用游戏机制来刺激广大用户

      10.3 少点花样,多点实用

      10.4 应用并不需要完成所有功能

11、移动用户的动机都能归纳为典型的3种心态

      11.1 我有个微任务要做

      11.2 我想看看附近情况

      11.3 我有些无聊

12、iPhone极适合断断续续的活动——微任务

13、iPhone包含有各种传感器,触动人心的应用能利用这个优势,为用户个人的任务和信息提供相关帮助,了解周边并因地制宜

14、iPhone你随身携带,闲暇时随时可以玩玩简单的应用或小游戏,甚至完全沉浸到阅读的世界中。

      14.1、无聊的解药很简单:有点事情总比什么都不做好

      14.2、iPhone上,用户除了工作还想要娱乐,虽然有时是出于空虚。应该考虑如何使你的应用能给你的受用带来欢乐的时光,让他们有所消遣,甚至要让他们放慢一会脚步,沉迷于应用之中。

      14.3、用以打发无聊的应用,它们共同的主线都是让人探索。

15、一个应用,重要的是要能独树一帜

       15.1 案例(签到类应用,奖励方式不同)

               Loopt,有效性

               Foursquare,竞争性

               Gowalla,可发掘性

       15.2 如何独树一帜?

              1、有独特的激励机制

              2、紧密地面向特定受众

              3、有别人无法提供的利基的内容

              4、有全新方式来展示信息

              5、有简单有效的技术

              6、有大量的社区用户在应用中互动

              7、能同样解决问题却更便宜

              8、应用会增强你在网站或现实世界中的所见所做之事

         15.3 注意,应用的表象过分花哨可能在诱导用户的过程中,让用户分心,造成用户的不满。视觉风格方面的独到设计,千万别太过花哨而掩盖了真正要传递的信息和功能。

16、APP要想活着,就要不断的心跳,这才能保持触动人心。

      16.1、如果想与受众维持长期关系,应用就要能不断提供新内容

      16.2、某些应用的主要功能天生就令其有了“心跳”,只要潜在需要存在,它们对用户就还有用

      16.3、App Store里大部分应用不是工具型应用,而是些内容型的应用——游戏、娱乐、书籍、指南、及新奇的应用,使用它们时,我们是消费者,不是工作者。一旦应用不能提供更多内容消费,我们就会换新应用。

      16.4、将次要功能附加在你应用的主要内容上,以增加主要内容的价值,比如Amazon提供产品的评论,应用开发商提供基本内容,社区驱动的点评给予了更多生命力,这是通过完善、分享主内容实现的。

     16.5、要克制,考虑什么功能可以延长应用的寿命,但不要画蛇添足

17、拿出你精心策划的功能列表,将大多数功能点扼杀

      17.1、友好易用的用户体验要求我们合理地甄选每一条能触动人心的功能点,每添加一个功能点,都是在抢夺有限的资源,过多功能点会拉低应用的体验。

      17.2、一开始,确定你的应用最关键的一项任务是什么

      17.3、接着,核对提炼出来的最重要的用例

      17.4、然后,确定用户需要频繁完成的任务,抓住相应的用例

      17.5、次任务会在考虑主要行为时很自然浮现,别把次要功能做复杂,找出能实现想法的最低要求,不断优化

      17.6、案例Umbrella : The Simpest Weather Forecast,它简单地解答一个疑惑问题:今天我要不要带雨伞?

18、如果做的应用是网站的附属应用,哪些方面是原站所不能及的

      18.1、移动场景中,最重要的用户需求之一就是使用高效

      18.2、本地应用能更优美地展示内容

      18.3、暂先留用,存放离线内容是内容型移动应用一个触动人心的功能

19 、要点***

1、关注“五要素”,发掘你应用触动人心的先决条件

2、关注你应用的功能该如何才能适用于离开办公桌后的情境。要考虑3种移动用户的心态:想完成微任务、想了解周遭所发生的事件、想打发无聊时间

3、确定好与类似应用的区别所在。“技能”和“魅力”让应用与众不同。

4、不断更新内容或打造社区,这2种方式都能让你的应用在用户手机上待得更久。

5、要想得多,但是要做的精。只提供“够用就好”的功能。

6、做网站的附属应用时,要想着如何在移动网站上做改进,而不是全盘照搬原网站。

4 为尺寸和触摸设计

1、不能只看到应用的表面好不好看,还应当注意用起来会是什么样的感觉

2、iPhone的操作系统让人们产生了现实屋里世界的强烈错觉,交互隐喻全部和点击、滑动、轻拂有关,直接操作屏幕中的物体,它们会想现实生活中医院做出反应。

3、尽管拇指能划到整个屏幕,但只有三分之一的屏幕(目前可能更少)是真正容易触及的,即拇指正对的区域。

4、为了获得人类工程学上舒适的体验,应将主点击目标放置在方便拇指点击的热区中。

    4.1、这就是为什么工具栏和标签栏一般都放在iPhone屏幕的底边,而在传统界面上这么放置不常见(桌面软件习惯放在屏幕或窗口的顶部)

   4.2、常用的按钮(导航标签)应该放在屏幕底部的左边,不常用的按钮、会改变数据的点击目标可以塞到右上方,减少误点几率。

   4.3、根据你应用最常发生的用例来排布页面元素,引导点击。

   4.4、大概85%-90%的用户用右手操作,为了迎合10%的左撇子用户,特别是界面越复杂、按钮越是多,点击越是频繁,应用越要多考虑左撇子的操作习惯。

   4.5、交互设计有些东西也要折中,包括按钮、列表项在内很多控件,都会横跨整个页面,平等对待了左右手拇指。

5、iPhone的点击目标到底多大才算够,苹果公司把这个定义为44像素,推荐为一个点击目标可点且易点的最小值。

    5.1、并不是说看到的点击目标(视觉)一定要这么大,更准确的是包括了按钮自身延伸出的整个点击区域(点击范围)。

    5.2、在实在没有办法时,只要能保证点击目标的高或宽其一是44像素,另外一边可以压缩成至多30像素。

    5.3、按钮大小并不是唯一决定点击精度的因素,还得考虑按钮间距。

6、iPhone标准的标签栏为确保舒适,只提供了5个标签位,苹果公司的指南也建议把工具栏图标限制在5个。

7、案例:PCalc

    7.1、在电脑上设计开发,难以感觉到应用程序在掌上使用的真实感受

    7.2、点击按钮时,要提供反馈

    7.3、按需定制功能布局、主题样式(人们喜欢定制,将一款产品,变成“自己的产品”)

8、优秀的iPhone应用都采用的关于点击友好的指南(最佳实践)

     8.1、将重要的信息放在顶部,将重要的操作放在底部。对于一些内容量非常大的应用,将整个显示区域的内容变成点击目标,它可以鼓励你直接点击任何想看的信息,交互方式自然。

    8.2、基于44像素的设计韵律进行设计。

    8.3、尽量让一屏显示完,避免滚动条。

            8.3.1、眼不见、则不知

            8.3.2、“速览测试”强调了设计要触动人心的基本原则:简洁胜过繁密。复杂本身并没错,但要取巧将复杂的东西做得看起来并不复杂。

            8.3.3、多次点击是否一定比滚屏好?

                       身体的舒适度,点击手势比滑动滚屏更容易。

                       比点击数量更重要的是点击质量,每次点击后用户得到的越多,点击质量就越高,多点几下也就还好。

                       大部分时候,多余点击比长长的滚屏负担要少。

             8.3.4、对于待办事宜、新闻稿、文章、邮件等不可避免会很长,滚屏(常常)是查看这类长内容的最佳方式。

                        用到滚屏时,确保应用的主要操作固定在屏幕上。

    8.4、尽量减少屏幕上的元素。

            8.4.1、这个元素会不会被用户注意到?

            8.4.2、用户是否看得懂这个元素的含义?

            8.4.3、元素是不是有意义?

            8.4.4、每个工具都要与近旁的主要任务紧密关联,附属功能和附属内容要放到次屏中,或全部剔除。文本标签要简练,语句不拖沓。

8.5、将高级工具和操作“藏起来”。

9、案例(USA Today)

     9.1、左右箭头在内置的“Mail"应用里很好用,很多新闻应用受到这方面影响,但APP设计者认为在”Mail“里一般要通读所有邮件,而他并不寄希望于用户要通读所有既定的新闻,与其跳过几篇你不感兴趣的文章,还不如回到列表视图挑选来得方便来得高效——这也为该位置换为分享功能提供了理由

10 、要点***

1、人类工程学问题:要考虑你应用的手感。

2、要将主操作放置在拇指的“点击热区”中。

3、44是个神奇的数字。确保点击区域至少有44像素大小,然后基于44像素的设计韵律进行设计。

4、大胆使用空白。不要让你的设计显得拥挤不堪。

5、主要内容在上,操作在下。

6、主操作要容易够着,在切实可行的情况下避免使用滚屏。

7、用“秘密面板”、“隐藏之门”将高级工具分散到次级视图中。通过这种方式来减少边框界面。

5 学着苹果做应用

1、《iPhone人机界面指南》,常说的HIG

2、iPhone预定义3种导航模型

     2.1、平铺页面,主要用于只有一个主屏的简单应用,比如“天气”

     2.2、标签栏,在屏幕底部的一组用来在应用主功能之间切换的按钮

     2.3、树形结构,在有层级的分类选项或分类内容中向下细分,也能很容易回到上方

3、“沉浸式应用”,区别于预定义的3种导航,一般是全屏且图形丰富,使用自己的隐喻设计,比如游戏

4、平铺页面,很适合使用工具应用的使用,主要信息在卡片“正面”展示,而“背面”是简单的设置

     4.1、因没有信息层级,没有组织结构,这种组织方式称为“平铺列表”,其很适合于“浏览并发现”方式,慢慢浏览查看同样类型不同内容的页面

     4.2、为了让用户在浏览这叠页面时保持方向感,平铺页面应用的底部添加了标准“页面分页控件”(只允许每次翻过一页)

     4.3、弊端:平铺页面模型无法直接跳转到特定页面,故其不适用于功能或内容结构相差悬殊的应用

5、平铺导航

    5.1、优点

             5.1.1、很适合少而精的内容,适于随意浏览的页面

             5.1.2、适于内容自定义,且数量可变的页面

            5.1.3、易于使用,只需熟悉的滑动手势即可导航

            5.1.4、界面占用空间少,页面分页控件只占用一点空间,给内容留下很多余地

    5.2、缺点

            5.2.1、每次只能翻过页,没法立即跳到非相邻页

            5.2.2、并不能适应较多的页面数量,页面指示器只能容下20个小点

            5.2.3、难以包含滚屏,对长文本不利

            5.2.4、页面指示器太小,可能被用户忽略,因此让用户错过应用的其他页面

6、标签栏,每个标签都像是在运行一个独立的应用,也可以对应用的信息提供不同的展现方式

     6.1、标签栏是切换选择“操作模态”的理想方案

     6.2、标签栏像一系列的小广告,综述你应用的功能范围

     6.3、每个标签里都可能包含子导航

7、标签栏

    7.1、优点

             7.1.1、点击一次即可访问到应用所有的主要功能

             7.1.2、标注清晰的菜单,告知用户主要功能和当前所在的功能

    7.2、缺点

            7.2.1、只能显示5个标签

            7.2.2、应用的每个(或大多数)页面都会被明显占据一定的屏幕空间

8、树形结构,将层级信息分类到一棵倒置的树的树枝上,对管理一大摞的分类项目非常合适,适于列表

    8.1、用可视化的方式组织树形结构,最普遍也最有效的方式,是基本的文本列表,即“表格视图”

    8.2、除了列表,还有图标、图片的形式

9、树形结构

    9.1、优点

             9.1.1、能应变大量的类别、功能和项目

             9.1.2、组织方式常见,容易理解

             9.1.3、可直接对内容进行交互,直观且占用屏幕空间小

             9.1.4、列表展示很适于用户自定义分类

   9.2、缺点

           9.2.1、主功能只有在最顶层页面才会被显示出来,不像标签栏,每个页面都可以看见

           9.2.2、主要功能和分类直接切换有些麻烦,必须要先回到顶部页面,然后再依次点入

10、三大导航模型并不互斥,可以在一个应用里混用不同的导航模型,比如一个模型组织主要的功能,另一个模型作子导航来组织次要页面

11、一张页面临时取代整个应用的显示屏,这种处理方式称为“模态视图”,会暂时绕开应用的正常操作

      11.1、应用正常的页面浏览切换方式一般是左右滑出,而模态视图是从底部出来,覆盖现有页面,这种弹出方式在微妙间强化了模态视图在流程是属于临时支路的形象

      11.2、要方便用户从模态视图回到正常流程中,模态视图中应加上必要的按钮控件

12、别把应用搞得像一张网络,用户应当能预料得到你应用中的导航路径,最理想的情况是这导航路径还是唯一的(每屏只有一个路径,这样容易让大家记住路)

13、先在纸上(白板上)画好应用界面的流程图(应用的故事板),组织好页面和任务优先级,这个阶段是做草稿,不是做设计。绘制好页面流的地图会帮你确认是否选对了导航模型

14、在纸上完成草稿后,将其挪到真实的iPhone上,测试一下真实设备上的感受,看看设计是否行得通,这时也不用太精细,关键是感受设计的大小和比例,以及布局结构

15、案例(Things)

      15.1、在概念阶段,最重要的是明白你想要完成的事情是什么:你要解决什么问题?你面向的受众是谁?他们又有什么期望?了解用户的心智模型,也就是了解用户需要应用来解决的问题是什么

      15.2、图形能少就少,如果你滥用图标,用户就会忽视图标,这样只是在视觉添乱

      15.3、对用户来书,精力应花在任务和目标上,而不是界面上(把APP打开,马上就知道点哪里),优美来源于简洁感,一款应用要处理一项任务,称得上简洁的只有少数几种

16、要点***

1、遵循普通,不见得别人就会觉得很普通,要有“苹果味”的设计感

2、苹果内置的导航模型基本上可以解决大多数应用的结构问题。要理解好每种导航模型的优缺点,而后再选用一种最合适你的导航模型:平铺页面、标签栏、树形结构

3、把你的页面都画成故事板,用这种方式来规划出你应用的清晰流程。先别考虑细节,先考虑大局

4、开始丑点没关系。先从原始的原型应用开始,而后再做详细设计,然后再编码

6 标准控件

1、相似性和一致性将会增加设计的可靠性。

2、导航栏,在标准设置里,左区域显示“后退按钮”,中间区域显示“页面标题”(告诉用户当前在应用中的位置),右边区域为空白。

     2.1、这3个区域可以重写,添加控件或显示元素。

     2.2、尊重后退按钮,把导航的左侧永久性地划给它。

     2.3、导航栏右边可根据需要添加按钮或控件。

     2.4、中间区域,一般用于标题,告诉用户当前所在,对提供可用性很重要。

     2.5、为让大家不迷路,更好的办法是一开始缩小探索范围,减小树形结构的深度。

     2.6、如果用户处在某个分类的深处要切换到另一个主分类,如果有个快捷方式立即穿过层层页面回到顶层是更好的。

     2.7、在全屏模式下,可根据需要隐藏导航栏,标准做法是通过点击屏幕来隐藏显示导航栏(做成半透明)。

3、工具栏上的部件、操作是针对当前页面上的内容,提供管理内容的命令。

     3.1、放上一些文字按钮或不带标签的图标。

     3.2、苹果建议图标的数量要限制在5个或以内。

     3.3、避免将工具栏和标签栏都堆到同一张页面里。

4、苹果提供了两类不同的图标,一类是给标签栏用的,另一类是给导航栏和工具栏用的。

5、搜索栏,如果应用可以管理或访问大量信息,用户会强烈要求要有搜索功能

     5.1、如果在布局中屏幕上下部都放上了控件,别再把搜索栏固定在屏幕上,可以让其随着你的内容滚动。

     5.2、标准的搜索栏不只是一个文本输入框,还有几个可选的附件,比如提示文字、范围选择栏。

     5.3、实时搜索,如果应用能提供再好不过,在搜索关键字里每打一个字,搜索结果都会更新。

6、表格视图,是增强型列表。

     6.1、表格视图是可触摸的。

     6.2、表格视图最常见的功能

              6.2.1、用来作为树状应用分类和内容的导航

              6.2.2、用来显示一张可选项的列表

              6.2.3、用来快速浏览、索引一张长列表

              6.2.4、用来罗列、分组内容详情

     6.3、素面的表格视图什么装饰都没有,可以往它上面添置各种功能附件或视觉附件

              6.3.1、表格视图有3个标准图标,可以放在任意单元格中

              6.3.2、也可以把标准控件(或自定义小控件)放入表格右槽中

              6.3.3、右边区域里的指示器和控件会告诉用户点击单元格后将发生什么事情

     6.4、表格视图单元格的副标题样式有3种标准样式

             6.4.1、副标题样式

             6.4.2、蓝文本样式

             6.4.3、带标签的值样式

    6.5、表格视图有2种给列表添加标题的方式

            6.5.1、索引列表,直接在列表中插入标题

            6.5.2、分组列表,将表格视图列表分组成区块,在页面上一搓搓聚合起来

   6.6、标准的表格视图附有一个可选的编辑模式:添加、删除、排列项目

7、文本

     7.1、有4种文本容器

              7.1.1、标签,用于显示很短的文本

              7.1.2、文本视图,适于处理长文本,也允许用户对文本进行编辑

              7.1.3、网页视图,是内嵌在页面的浏览器窗口,显示一张网页或展示自己编排的文本

              7.1.4、文字输入框,让用户输入简短的文本或数据的输入区域

    7.2、可以设定任意输入框和文本视图,是否使用iPhone的拼写“自动纠错”(“自动首字母大写”)功能,基本上开着好,但对于姓名、地址、URL或密码输入等,就并不好

    7.3、本页还是新开

             7.3.1、在本页就地编辑所有文字,比如“设置”应用,添加和编辑邮件账户信息。如果有一小组输入框,采取这个流程,用户可以高效地挨个输入,很可能将内容全部填上。

             7.3.2、显示所有的值,然后每项值都新开一张页面,分别编辑,比如“通讯录”应用。如果用户没必要一次输入完,这种方式更合适。

   7.4、根据每个输入框要输入的内容类型,提供对应的键盘,能帮助用户减轻敲键盘的痛苦

           7.4.1、可以为每个输入框弹出的键盘自定义“return”键的标签

8、多选控件

    8.1、标准控件包含3种

             8.1.1、拨选器

             8.1.2、列表

              8.1.3、动作选单,将次操作藏在页面外,直到需要时才出现。

9、按钮,根据想法变换样式,从一个普通的文字按钮到图形丰富

    9.1、只要要做2套样式,分别对应按钮的“控件状态”。

    9.2、开关控件:双态按钮。

10、分段控件,从一些可选项中选取一个选项

      10.1、可提供多个选项供选择,而开关控件只有2个。

11、滑动条,可以很方便在有最小值和最大值时提供校调,以及长文档中导航,快速浏览。

12、设置,一般有三类

       12.1、内容设置

       12.2、账号设置

       12.3、隐私设置

                  12.3.1、如果你的应用分享了用户信息或在线活动,那么应该提供不公开信息的选项。

13、要点***

1、多用标准控件。一致性将增加可靠性。

2、屏幕上不能超过2条“栏”——上边导航栏,下边就标签栏或工具栏。不要把搜索栏固定着,而要让它顺着屏幕滚动。

3、多用表格视图。表格视图是最神通广大的iPhone标准界面元素。

4、认真为每个文本输入框选好键盘,选择是否开启自动纠错功能。

5、减少配置项。不用把配置项放到“设置”应用里。

7 创建自己独特的视觉风格

1、iPhone用户选择应用也和大多数司机选择他们的车一样,都是在做自我表达。

2、界面如何设计,不仅影响用户使用iPhone的方式,也会影响用户对应用的感觉。

3、应用和人一样,当它的个性既与受众合得来,又与内容相称,这时应用会变得魅力十足。

4、在iPhone的个人场景中,大家会认为应用,更多地是偏向于内容,而不是“软件”;偏向于体验而不是工具;偏向于娱乐而不是完成任务。

5、先选好你应用的个性,才能开始做视觉创意。应用的个性应当把控好体验的氛围,既能抓住受众,又能符合受众手头任务的要求。

6、只要看起来很奢华(有档次),应用的“感知价值“就会上升。

7、当你的设计给人以真实物体的错觉时,会令用户感觉坚实可靠,甚至喜欢上你的设计。

8、应用的视觉表现会给用户一条重要的提示,引导他们使用你的应用,当新功能找不到对应的标准图标,或者想做个非标准样式,就要自行设计了。

9、用上隐喻,图形界面使用“视觉隐喻”快速解释了软件复杂的内部机制。

10、在重新“造轮子”前,先有几个考虑

      10.1、你在解决的问题,是不是内置工具就能帮你解决的?

      10.2、自作聪明?

      10.3、你界面的隐喻适合你的机器吗?

      10.4、界面是不是太多了?

11、把某个真实物体用做你界面的隐喻,也许能确保用户马上能熟悉界面,但也限制了原物件应有的形态和功能。

       11.1、比如电子书,能否把精力放在研究“电子书”新的交互方式上,开发出纸质书无法做到的交互效果?

       11.2、新一代的机器让我们有空间去想象新一代的界面,甚至能为老媒体内容想象出新界面。

       11.3、有时候就应该绕开我们熟悉的隐喻,而别重新捡起这些隐喻。

12、案例(Twitterrific)

13、要点***

1、触动人心的设计会让应用魅力十足。在开始设计前,为你的应用选好个性方向。

2、在标准控件上使用自定义颜色或图形,能让控件焕然一新。奢华的材质能增加你应用的感知价值,逼真的界面元素让用户有点击欲。

3、图标重在意义清晰而不是个性。图标干净的轮廓胜过浮华的细节。

4、从真实世界借鉴界面隐喻,但是要确保借鉴的应用能适合于手机,同时最好能用标准控件。

5、大胆不怕冒险。

8 介绍你的应用

1、最初的接触决定了用户和应用之间的情感关系的大部分。

    1.1、能把大家吸引过来并服务好,你的应用就有魅力,而能赢得大家的信任,还在于一开始就感觉亲切。

    1.2、应用图标、启动图像、介绍页面,是第一印象的关键所在。

2、你应用的图标就是你的名片

     2.1、应用的图标从根本上讲是一幅广告,它的卖点要明确。要能出彩,要有特色。

     2.2、多考虑点商业,少弄点艺术。理解不了就不会点击图标。

     2.3、将图标设计得写实明了的方式

              2.3.1、对于设计比较独特的应用,图标在视觉上可引用其设计,创造出应用自身的一种预览效果。

              2.3.2、专注于表现应用的功能。

              2.3.3、有些应用功能抽象,难以通过简单图形符号说清,这时用图标描绘出应用的名称,围绕标题打造一个视觉品牌(有的品牌知名度较高,这种方式尤为奏效)。

3、应用的名称没有想象得那么重要,至少从用户的角度是如此,尽管名称对应用的营销很重要

4、启动图像用来给用户一个感觉,应用已经启动了。

    4.1、一般有2种

            4.1.1、仿照界面

            4.1.2、制作一张精美的启动画面,展示插画或logo

    4.2、这2种方式,心理结果明显不同,“仿照界面”让应用感觉加载更快,而后者尽管活泼,但越吸引注意越让用户感觉启动缓慢。

5、运行暂停的错觉

6、有点应用功能复杂,任务繁多,即使界面设计得再好,添加点引导提示会很有用。

7、说明书不是万能的

     7.1、应用的主要功能应该容易明了,只需稍微做些探索,或借助首次提示即可完成。

     7.2、大部分人都不会去看软件说明书,也不会寻求说明书的帮助。

     7.3、不能依赖帮助页面来引导用户,但比较深入的应用和毕竟偏僻的用例,可以做一些额外解释。

8、清晰的布局和语言在应用的每个页面都很重要,尤其是首页

     8.1、几点通用的原则

             8.1.1、不要说工程师说的话。

             8.1.2、考虑设计成主面板(概览情况)。

             8.1.3、多做”速览测试“。

9、案例(Facebook)

10、要点***

1、应用的图标要清晰明了,用来描述应用的功能、界面、名称或品牌。

2、在图标设计中,要加强主轮廓。

3、名称短才是好。

4、把启动图像做成假的应用背景,这样可以减少启动的感知时间。

5、创建出运行暂停的错觉。

6、为首次使用的用户提供简单的迎宾毯式的指示标牌。

7、应用的首页应该特别清晰。如果可以的话,多使用主面板视图的方法。

9 用手势来操作

1、触摸屏拉近了计算机和我们之间的距离,把操作变得密切而私有,只需触摸要操作的内容,操作个人设备变得直接、明白、有人情味。

2、触摸界面依赖于我们熟知的日常世界中触碰物体的交互行为,所以这种使用体验更加自然、直观。

3、易发现的手势来源于经验:如果有些动作对现实物体可以做,或对鼠标控制的指针可以做,那么大家就会同样在触屏上试试能不能做。

4、沿着走出来的路铺上道:观察首次使用者在使用你的应用过程中的2个点,”多次尝试却未奏效的手势“和”耗时的操作“。

5、减少耗时操作是几乎所有自定义手势的发明动机

    5.1、你不能指望大家都能发现这个手势

    5.2、当在应用中添加了非标准手势后,要确保通过可见的控件,同样也能完成这个功能。

6、帮助大家发现自定义手势的最好方法是,通过替换或扩充对应的标准手势,让自定义手势既不显露,却又一览无遗。

     6.1、不要让你的扩充沦为彻头彻尾的劫持,把标准手势拿来用做目标违背初衷的行径是很不恰当的。

7、在界面上恰当的地方要求用户做难做的操作,或有一定难度的手势,这样可以防止误点悲剧的发生,这种方式被称为“触屏自卫设计”。

     7.1、需要额外更多的点击,是软件界面中的传统,用时间换取删除者的懊悔。

     7.2、限时撤销

8、手机的物理机制,响应越逼真,可触界面的控制感就越丰满。

9、要点***

1、手势来源于经验。大家是如何触摸现实物体的,是如何用鼠标控制指针的,就会如何在触屏上做相同的尝试。

2、沿着走出来的路铺上道:观察大家如何使用你的应用,然后来添加观察到的相应手势。观察内容包括尝试后未成功的手势,和周而复始的耗时操作。

3、为没有发现你应用手势的人,准备好备用方案。所有的手势操作都应该能通过可见的控件来完成。

4、通过扩充标准手势,来帮助用户发现自定义手势。

5、除了用来触发撤销/重做对话框或某些新奇用法以外,要避免使用摇动手势。

6、提供多点触摸手势的同时,也要提供单指手势作为替代。

7、给手势稍加点难度,或使用点击组合,以此来防止意外的误点击发生。

8、为每次点击和操作都提供视觉反馈,然后有节制地加上声效。

10 屏幕旋转

1、并不是非得支持屏幕旋转。

2、有些媒体是横屏格式的,游戏往往也是只支持横屏的。

3、如果你的应用只有一个方向,就没必要再在另一个方向里加上提示或额外的界面来告诉用户把手机转回来。只需要直接启动就进入横屏方向即可;界面自身已经说得很清楚了,要旋转手机了。

4、横屏的考量还来自于媒体的注意力需要,由于水平布局天生即适合沉浸式的体验,所以横屏方向很适合于游戏和视频。

5、在一些例子中,横屏视图是竖屏方向的增强模式,这时很多控件被移除,展示出丰富的视觉效果以便用户浏览,这不只是在翻转屏幕界面了,翻转出的是全新的视图,这叫做“模式变更”。

6、设计横屏时注意的因素

     6.1、导航栏和工具栏会被压扁

     6.2、从竖屏开始

     6.3、注意动画效果

     6.4、四面兼顾

     6.5、要做就要全做

7、向屏幕的一边转过去,会让用户在一段时间内感觉迷失方向,应该要想办法抚平这种暂时的界面眩晕感。

8、要点***

1、先要把你应用的一个屏幕方向优化好,然后再添加对横屏的支持。

2、在横屏中通过不同方式来展现内容,而不是一味地放大。

3、你的应用里是不是需要很多文字输入工作?如果是的话,横屏和竖屏键盘都要提供。

4、可以不用在横屏里重新组织内容和信息,而用横屏来提供图形内容。

5、不是所有人都会尝试旋转你的应用的。注意不要把重要内容和功能藏在屏幕旋转后。

6、有些功能可能不合适在横屏视图中使用,有些功能却本来就适合于横屏视图。要避免你的受众在屏幕旋转、布局改变时,迷失了方向。

11 警告、打断和更新

1、什么时候该打断?

     1.1、不要轻易使用模态警告框,警告框是用于紧急消息提醒的。

     1.2、一些正确使用警告的方法

              1.2.1、应用不能进行

              1.2.2、能帮点小忙吗?

                         1.2.2.1、好的警告框会在出问题时提供解决方案:这种方法行不通了,要换种方法试试看吗?

                         1.2.2.2、可以通过在警告框里添加2个按钮达到此目的,一个关闭警告框,一个出发备选操作。

             1.2.3、请授权

     1.3、一些要注意的地方

             1.3.1、不要使用警告框来弹出欢迎消息

             1.3.2、不要弹出来让用户到App Store里打分

             1.3.3、一会儿就能好的小问题就不要用警告框了

2、警告框不但应让大家知道有东西出错了,还要让大家放心。最好的方法是,语气要淡定、干脆地把事情说清楚。

3、推送通知,应给大家提供微调推送时间和内容

     3.1、提供详细的内容控制

     3.2、确保要有“安静时分”

     3.3、让声音可选

4、“主屏幕标记”是在iPhone主屏中,贴在应用图标上,带数字的红色圆圈

     4.1、如果确实要提供主屏幕标记,那也提供一个关闭标记的可选项。

     4.2、尽管主屏幕标记有好有坏,但它确实体现了“被动消息”的价值。

5、当应用正在运行时,应该告诉一声,特别是那些需要好一会功夫才能完成的任务

    5.1、“菊花转”就是专用来表示“我正在运行中”的。它的专业称呼是“活动状态指示器”。

             5.1.1、菊花转,不但能表明应用正在运行中,它还附带告诉用户,什么时候结束运行(菊花转消失时)。

   5.2、巧妙地应用工具栏按钮(模态按钮),也可以告知工作正在处理中,且不张扬。

            5.2.1、“模态按钮”是指一个按钮,会根据应用的状态不同和用户所做的事情不同而改变外观。

   5.3、菊花转和模态按钮,在发生事情时能安慰用户,但只能持续一小会,当时间更长,就需要其他手段了。

6、时间变快:进度条和其他分散注意力的控件

    6.1、事情发展的快与慢取决于环境,取决于眼前注意力的分散程度,取决于任务的枯燥程度。

            6.1.1、一些界面小花招,通过良好的沟通、指示、全程分散注意力,来让时间变快。

    6.2、进度条,给出了剩余时间的视觉估量:只要简单知道还要等多久,心里就会平静得多。

             6.2.1、对需要持续数秒的进度,只要可能,就做出提示告知任务还有多久,这时进度条非常合适。

    6.3、如果进度时间很长,就要考虑是不是给用户在等待期间一些东西做做或看看

             6.3.1、比如游戏,或者发挥自己的特长,给点东西让大家去探索。

    6.4、让运行速度看起来更快,最好的办法是让其的确加快。

7、要点***

1、在应用不能继续运营的紧急情况,或应用需要用户授权运行的情况下,才能使用警告框。

2.、在警告框消息中,要淡定地把事情说清楚。在出问题的时候,考虑用“什么鬼东西”按钮来提供帮助和信息。

3、警告框的默认按钮应该永远设定在最安全的那个选项上。

4、推送通知发出消息总是用“喊”的;要让大家可以确切地选择推送哪些通知,在什么时候推送。

5、不要使用胡乱计数的恶臭主屏幕标记。

6、用菊花转和模态按钮来安抚用户,告诉他们应用正在努力运行中。

7、使用进度条、娱乐项目、预载内容的方式,让你的应用看起来运行得更快。

12 和其他应用打成一片

1、任何应用都可以读取、添加、编辑这些共享信息:通讯录、照片和日历事件。应用也可以访问到用户放在“设置”应用里全系统通用的参数选项。

2、用好共享内容的几点建议

     2.1、尽量浏览、减少输入。

     2.2、输入个人信息。

     2.3、混到一起。

     2.4、扩充已有信息。

3、你的应用就是组合中的一小块,把控制权交给其他应用。

4、要点***

1、不要自己搞一套联系人、日历事件或照片应用。要使用全系统通用的地址簿、日历和相册。

2、提供方法,让用户可以将现有记录创建或添加到现有联系人和日历事件里。

3、大方地将次要任务链接到其他应用去完成,同时也让你的应用能接受链接。

4、过多地在应用中来回切换,会让用户愚钝。最好在任务结束时链接到其他应用,而不要在任务进行到一半时链接过去。

5、在网页视图和地图视图中,采用“够用就好”的原则,让大家跳到“Safari”和“地图”中去使用更多高级功能。

鲤洋读书随想:理论研习再多,更是要投入到实际场景及目标平台用案例实践,这样才能更充分理解理论,运用理论和优化理论,同时(间接)获得实战经验,训练出思维和身体的感觉。

鲤洋

yiaha@foxmail.com

2016.11.08

上一篇下一篇

猜你喜欢

热点阅读