触动人心--设计优秀的iphone应用(中)

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

创意的真谛,是在保证可用的情况下,寻求更好的表达方式,既要设计精湛,也要注意别让设计影响用户的实际使用。

(本文2249字,建议阅读时间10min)

第五章:iphone编码工具提供的所有标准部件

——导航栏

导航栏通常包含页面标题,后退按钮及其他,基本固定在屏幕的顶部,状态栏的下方

标准设置里,左区域—后退按钮,中间—页面标题,右边—自定义

——工具栏

通常黏附在屏幕底部,放着一些文字按钮或不带标签的图标

标签栏的按钮作用是导航,用以在全局应用主功能间的切换

工具栏的按钮操作是针对当前页面的内容,提供管理内容的命令

——图标

优秀的图标设计来之不易

苹果有两类不同的图标,一类提供给标签栏用,另一类提供给导航栏&工具栏 

——搜索栏

范围选择搜索:选择搜索结果范围/实时搜索:在关键字里没输入一个字,搜索结果都会更新。如果应用可以管理或是访问大量信息,那么用户就会强烈要求搜索功能

——表格视图

最大的特点是可触摸

最常见的功能有:

1,用来作为树状应用分类和内容导航

2,用来显示一张可选项的列表

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

4,用来罗列、分组内容详情

—表格视图单元格

只有能给内容带来价值,方便扫描列表时,才需要给表格单元格添加图形

表格视图单元格的三种样式 (如图)

—设置列表&索引列表

索引列表:直接插入了标题,标题用一条粗线作为每个分类的开始。滑动列表,在标题子项目仍在滚动通过屏幕顶部的时候,标题会吸顶,一般用于展示分类多、内容冗长的列表。

分组列表:是为相关的一小类项目所设计的,一般涌来展示设置项,功能菜单,和不同组别的内容。

—编辑表格视图的工具

标准设置中,删除一个列表需要三步:点击“编辑”—点击删除控件—点击“删除”按钮(“防御设计”避免误点的发生,不适用于一次删除多条)

一次多条可参考:“Mail”自定义控件—圆形复选框,点击“编辑”出现“删除”&“移动”按钮,以及复选框

——文本

表格视图是放置简短内容的重要容器,而文本本身也是由iphone文字相关的界面元素来管理的。设计自定义单元格时,甚至在应用里任何用到文本的地方,开发者都会用到以下四种文本容器:

1,标签用于显示很短的文本(比如输入框的标签、简要说明、或者信息)

2,文本视图适于处理长文本,同时允许用户对文本进行编辑h

3,网页视图是内嵌在页面的浏览器窗口。可以用来显示一张网页,也可以用来展示自己精心编排的文本。

4,文字输入框可以让用户输入简短的文本或数据的输入区域

编辑文本

占位文本:提醒预期内容

键盘布局

ACSII/数字和标点符号/URC/邮箱地址/数字键盘/电话拨号键盘,姓名电话键盘

拨选器,能进行多维度的选择

列表,能显示标题,将选项进行分类描述

动作选单,将再次决定的操作藏在了页面外,直到需要的时候才会出现

按钮的两种状态:

非激活不能使用时的禁用状态/双态按钮(开关控件),在按钮是“开”的时候,有选中状态

分段控件,在某种程度上就是有用的二级导航

本章总结:

1,多用标准控件,用一致性增加可靠性

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

3,多用表格视图(据说表格视图是最神通广大的iphone标准界面元素)

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

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

iphone最有效的界面原则:点击你想操作的部件即可操作。

第六章:与众不同—创建自己独特的视觉风格

作为一名应用设计师,界面如何设计,不仅会影响用户使用iphone的方式,也会影响用户对应用的感觉。

——应用的个性是什么?你希望大家看到你的应用会是什么感觉?

选好应用的个性,才能开始做视觉创意。

“有效性”往往就是最正确的个性,画一个情感氛围的框架,遵循这个框架,能够让之后的决策保持一致,情感氛围是营销宣传的基础。

——做好设计工作

设计工作分为两个方面:1,完全自定义一套界面。2,精心的重新“打扮”标准iphone元素

“打扮”时候要注意:

1,工具栏、导航栏、搜索栏、要保持一致以保证应用框架色彩的统一

2,工具栏的色彩要有品味,不能让边框喧宾夺主

3,保持标准控件的整体视觉风格(颜色渐变,圆角视觉顶光效果)

4,对熟悉的图标和控件进行细小的改动,就能让界面鲜活起来,变得与众不同

5,注意对比,应用要保持良好的易读性

6,慎用字体

7,重视感知价值

用逼真的效果感染用户,借鉴现实生活中的物体和材质

—设计自定义工具栏图标的几条建议:

1,工具栏上的每个图标不但需要互相之间的有所区别,还有有别于系统内置的图标

2,清晰地传达出按钮背后的操作含义

3,标签栏中文字标签能解释图标的含义

4,视觉隐喻

图形界面使用视觉隐喻快速解释了软件复杂的内部机制

启示,指的是展现应用用途和操作方式的视觉提示。应用的界面从真实世界借鉴的越直接,启示就会越明显

(照搬实物的好处就是无需再次验证即可知道人类工程学上会很好用,因为原物已经验证过了)

所有的隐喻,只要做好了,就会提申传统的表格视图的展示,能鼓励用户浏览更多、探索更多。

5,要坚持不懈的将经历放在达成用户的目标上,但同时要明白,效率并不总是比样式重要

本章总结:

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

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

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

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

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,547评论 6 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,399评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,428评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,599评论 1 274
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,612评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,577评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,941评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,603评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,852评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,605评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,693评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,375评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,955评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,936评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,172评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,970评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,414评论 2 342

推荐阅读更多精彩内容