浅析iPhone平台三种应用类型的布局方式格式.doc

《浅析iPhone平台三种应用类型的布局方式格式.doc》由会员上传分享，免费在线阅读，更多相关内容在工程资料-天天文库。

1、Muxbaidux«■浅析IPhone平台三种应用类型的布局方屯在手机这样一个小小的有限的屏幕尺寸里，要使界而保持清晰合理、简洁美观，就涉及到产品“框架布局”的设计问题，我们需要根据不同的产品需求及应用场景來设计合理的界面布局。iPhone平台的标准界而布局为顶部标题栏、屮部内容区、底部丁•具栏/标签栏，设计师们根据不同的应用类型以及不同的使用情境进行着巧妙的布局，其中不乏很多勇于打破常规，帮巧合理的布局设计。今天就一起来看看iPhone平台多样化的界面布局方式。iPhone平台有三种类型的应用：效率型应用(ProductivityApplications)实用

2、型应用(UtilityApplications)沉浸型应用(ImmersiveApplications)每一种类型都有各自不同的特点和应用场景。设计之前要淸楚产品的目标、特点以及用八使丿IJ产品的动机，以选择合适的应川类型。I、•面我们分别通过这三种应川来总结一•下界面的布局方式。1.效率型应用(ProductivityApplications)效率型应用儿乎包含了从补交网络到手机银行的所有应用。此类应用具有纟fl织和操作具体信息的功能，需要比较精简的用八体验，从而不会阻碍用户的工作，要将用户体验的重点放在任务上，用户可以快速地找到需要的目标，轻松地完成操作。1

3、)如何设计效率型应用以任务为导向的设计理念。建立准确的任务模型，将用八可能的任务进行拆解，并逐一-设计优化流程。要让用八快速开始，快速找到信息，快速离开。建立清晰的层级关系，便捷准确的检索方式，以便于用户迅速定位需要的信息。要降低川八的学习成本，尽川能的使丿IJ系统的控件和操作。降低噪音，保证高级的功能在川户需要时能够找到即可，在不需要的时候也不会造成困扰。2)效率型应用的界面布局A.九宫格fo>vtvfQSearchActivityQueueShowsNewsMl.AT&T兮1：12PM%D此类界而通常是川八进入产品灰的首屏，为川八提供分类入口，入口通常以图表

4、加文字的形式展现。以格子的形式排列，可以让用八快速地找到入口・此类布局适合用于丰富的内容展现，且内容适合分类聚合。广场aB.折叠列表HotTamalesTheaterBoxFrom$1.00online/$1,00local奇新歌榜2最In歌曲照单全收C3热歌榜毎日热播一键播放FerrisBueller'sDayOff(D…From$1.99onlineScorecasting:TheHidden...From$10.97online/$13.98local■Apple®MacBook®Pro/Int…From$589.99onlined24.99…0ting!

5、为你精选专业咅乐编辐专题推荐Apple®iPad®2withWi-Fi...From$533.00online/$829.00Io…_(KSl一0;广场电自冒ooo我的ting下载列我更多SonyPlayStation®3160GB…From$60.00online/$249.99local折叠折农是为避免页而内过长的滚动而做的布局设计,通常需要在同•页面内展示大幅内容时可考虑使用此类布局C内容以两级列表的形式进行分组，每组可以分别展开显示它的子项C.图片列表图片列表可以口观地将图片的全图显示出来，方便川八快速检索什看，人幅的图片也为川户带來视觉上的愉悦体验。D

6、.旋转木马18:33■大北京Mtime.com时光网影讯查询术师委“异演：尔冬升主演：集朝伟刘冑云时长：120分钟类型：爱情彻作/奇幻上映日期：01月12日87凉影现上映798炀2餅大處杓师▼w・■・T■■・■•—..—■■旋转木马的布局适用于内容以线性或者循环的形式进行组织，充分利用有限的屏幕空间，更好的來展示•系列图形图像，从而让用八获得更好的聚焦体验，止如欢快奔腾的木马，不停的旋转展示，让每个独立个体都得到表现的机会。这种布局特别适用于屏幕空间有限而乂需要展示大量内容。常用的旋转木马式布局有两种，i种是如上图的全屏的展示，一般多用于首页，用作各个内容的入口

7、。另-种是如卜•图的应用，帯有多个项口的通常用于页面的顶部CiPod令13:41QE>•tillAT&T兮3:04PM

8、Q0

9、它用•誉之・哲5!0・旺0芒百W至虽至M世4务悝c

10、2

11、0

12、WQ刁7.刃秽A

13、OIOIS.它耳芒•牛列SBB?*9J2M•B^l?总錮孑仝RecentlywatchedMostwatched98friendsAdam.Nathan.Greg,Josh.Omar.N§33±sq2010.85^33.66*1.70%TV対

14、百为谢也衣…刃3珂刃0

15、