浅谈iPhone效率型应用布局设计
来源:广州中睿信息技术有限公司官网
发布时间:2012/10/21 23:25:16 编辑:itlead 阅读 1837
在手机应用的交互设计中,我们要思考如何在有限的空间做出合理的布局,展好地展现内容。我们应该根据不用的应用类型、产品定位来选择合适的界面布局。iPhone平台的标准界面布为顶部标题栏、中部内容区、底部

 

  在手机应用的交互设计中,我们要思考如何在有限的空间做出合理的布局,展好地展现内容。我们应该根据不用的应用类型、产品定位来选择合适的界面布局。

  iPhone平台的标准界面布为顶部标题栏、中部内容区、底部工具栏,这是常规的布局,作为设计师应该勇于打破常规,设计出更多精巧的布局。

 

  接下来我们讨论下设计效率型应用。

 

  以任务为导向的设计理念。建立准确的任务模型,将用户可能的任务进行拆解,并逐一设计优化流程。要让用户快速开始,快速找到信息,快速离开。建立清晰的层级关系,便捷准确的检索方式,以便于用户迅速定位需要的信息。
 


  要降低用户的学习成本,尽可能的使用系统的控件和操作。降低噪音,保证高级的功能在用户需要时能够找到即可,在不需要的时候也不会造成困扰。

 

  效率型应用的界面布局

  1.九宫格

   1.jpg

  此类界面通常是用户进入产品后的首屏,为用户提供分类入口,入口通常以图表加文字的形式展现。以格子的形式排列,可以让用户快速地找到入口。此类布局适合用于丰富的内容展现,且内容适合分类聚合。

 

  2. 折叠列表

   2.jpg

  折叠折表是为避免页面内过长的滚动而做的布局设计,通常需要在同一页面内展示大幅内容时可考虑使用此类布局。内容以两级列表的形式进行分组,每组可以分别展开显示它的子项目。

 

  3.图片列表

     3.jpg

  图片列表可以直观地将图片的全图显示出来,方便用户快速检索查看,大幅的图片也为用户带来视觉上的愉悦体验。

 

  4.侧滑分屏

   4.jpg

  侧滑分屏的界面布局是采用三屏模式(左屏、主屏、右屏),此架构具有极好的扩展性。path2.0完全颠覆了iOS guild line的模式,采用这种三屏模式,极简了主页面,主屏仅留下feed展示和添加功能。将导航放入左侧的屏幕,增加了未来的可扩展性,同时也保证了主屏幕清晰的内容。

 

  写在后面:

 

  需求决定信息架构,设计决定信息架构的表现形式,这里罗列的布局形式只涉及到冰山一角。希望给人们一点小小的启示吧!

联系我们CONTACT 扫一扫
愿景:成为最专业的软件研发服务领航者
中睿信息技术有限公司 广州•深圳 Tel:020-38931912 务实 Pragmatic
广州:广州市天河区翰景路1号金星大厦18层中睿信息 Fax:020-38931912 专业 Professional
深圳:深圳市福田区车公庙有色金属大厦509~510 Tel:0755-25855012 诚信 Integrity
所有权声明:PMI, PMP, Project Management Professional, PMI-ACP, PMI-PBA和PMBOK是项目管理协会(Project Management Institute, Inc.)的注册标志。
版权所有:广州中睿信息技术有限公司 粤ICP备13082838号-2