移动应用UI设计模式 笔记整理

在大学的时候,对交互设计和UI设计的理解只局限于手机上的APP,网站之类的不在其中。理由很简单,网站页面设计早就有了,而且之前大家都把网页设计师叫做美工(心里很抵触这种叫称呼)。而UI设计和交互设计好像是伴随智能手机出现的。之前的这种理解肯定是错的,不过我的心中埋下了想设计手机APP的种子。《移动应用UI设计模式》是一本快速了解手机应用的工具书。它把手机应用的归类;拆分成十个部件,再详细介绍每个部件。

以下是整理笔记:

1.1-选项卡式-Tab Munu:选项卡式的导航在很多机型里都有不同的体现,这里只列举IOS和Android作为案例;优点:这是一种常见的导航,倘若应用要用户在不同分页里频繁切换,就用这类导航缺点:是会占用一定高度的空间。Android的这个形式看上去很熟悉,因为模仿了网页导航模式,是PC端遗留的产物。这种方式不利于大屏手机单手切换操作

案例:IOS - App Store,Faebook , 微信

案例:Android - 主题商店和应用商店

看出IOS与Android的区别了么?

1.2-舵式导航:本书里没有介绍,自行添加的。舵式导航应该属于标签卡式导航的一种延伸。中间的标签作为重要且操作频繁的入口,一般都用图形或颜色凸显出来

案例:微博,Path,Instagram

1.3-列表菜单式 List Menu:这种导航有很多种变化形式,包括个性化列表菜单,分组列表,和增强列表(Enhanced List)等。增强列表是在简单的列表菜单之上增加搜索、浏览或过滤之类的功能后形成的。列表菜单合适显示较长或拥有次级文字的标题

案例:小米手环,VPN,iPhone手机系统设置

1.4-跳板导航 Sringboard:跳板式导航对操作系统并没有特殊要求,在各种设备上都有良好表现。有时也被称为“快速启动板”(Launchpad)。跳板式导航的特征是,登录界面中的菜单选项就是进入各个应用的起点

案例:支付宝,爱奇艺

可进行位置上自定义,看案例中的橙色与蓝色的分布就是自定义的结果。对比一下自己的手机看看

1.5-陈列式 Gallery:陈列馆式的设计通过在平面上显示各个内容项来实现导航,主要用来显示一些文章、菜谱、照片、产品等,可以布局成轮盘、网格或用幻灯片演示

案例:厨房的故事,Dribbbler,Pinterest

1.6-仪表式-Dashboard:仪表式提供关于一种度量KPI(关键绩效指标)是否达到要求的方法。主要应用:商业应用,分析工具,销售,和市场应用

案列:AT,Overiew

1.7-隐喻式:用页面模仿应用的隐喻对象。主要用于游戏,同时在帮助人们组织事物(如日记、书籍、红酒等),对其进行分类的应用中也会用到。随着扁平化的流行,隐喻这种偏向拟物的设计渐渐成为过往,锤子的手机应该会有很多案例

案列:印象笔记,DailyCost

1.8-超级菜单:在选择导航模式之前,先确定信息架构。如果导航对象只有少数内容,就可以使用选项卡之类的导航模式

案列:RipCurl

1.9-抽屉式 :抽屉导航特点是菜单隐藏在当前页面之后,只要点击入口就能将它拉出来,此类导航好处是节省页面展示空间,有利于用户注意力在当前页面聚集,可以应用在不需要频繁切换内容的应用上,以对设置、内容进行隐藏。此类导航设计务必提供菜单画出的过渡动画

案例:知乎,亚马逊

『谢谢阅读:马赞赞』

后续更新:表单设计,表格设计

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

推荐阅读更多精彩内容