2014-08-17 分类: 网站建设
作为平台能力的直接反应,第一移动网站是一个运动的“妥协”而不是“工艺”。今天的功能更齐全的设备,但是,让我们有机会创造更多的视觉上的设计,不仅能激发和吸引用户,但也增加经验的可用性。然而,随着这个机会也有新的挑战。
进入1部分:信息架构我们探讨是什么使得在物质和规格方面的桌面移动不同;如何,在哪里,当我们使用移动设备;以及我们如何使用这些设备时的行为和感受。然后,在2部分:交互设计我们看着影响这些差异在发展的结构和功能。这两篇文章在手机和平板电脑设计提供依据。现在我们总结设计移动通过必要的探索视觉设计方案和相关的好实践,产生美丽的三部分研究中,可用的应用程序。
我们先看看移动的物理约束的设计,包括好实践指南,然后我们再看看设计通信:利用视觉设计支持的移动网站和应用程序的内容。
对于物理约束设计
物理形式和手机和平板设备的触摸屏界面为我们提供了一些基本的可用性的考虑。在一个桌面用户可以扫描在更广阔的领域的内容或悬停在进一步的信息元素,移动用户都集中在一个较小的区域,必须以不同的方式演绎的相互作用。牢记定义移动布局和移动的特异性相互作用的细节,我们可以创建一个直观的
移动体验。
可用的布局
有限的可用空间在手机屏幕上提供了一个有趣的约束在如何展示内容和互动。具体的布局需要精简和集中。
•的布局结构–提供强有力的基础设计需要考虑如何地利用可用的屏幕空间。网格系统帮助设计师实现:结构均匀间隔的垂直线作为安排内容指南。网格确定活动空间,这使得设计师确定按钮,最有效的配置更容易的标题,或图像。安装这些组件沿网格可以让用户在他们的旅程,同时创造一个清洁、美观的视觉。
•空间滚动和滑动–至关重要的是,用户可以浏览内容不承诺行动,他们没有意愿,没有激活一个项目时,他们试图滚动。换句话说,元素之间的间距必须足够让用户能够方便地浏览这些元素。
友好的用户交互
触摸屏界面的移动设备上也意味着视觉设计必须加强相互作用;换句话说,大小和元素的位置应保证使用方便,和指示的重要性和相关性的行为。
•按钮灾区–我们讨论2部分:交互设计,适当的尺寸和间距的按钮将确保他们可以很容易地激活。理想情况下,按钮应该44px和57px之间在标准屏幕和88px到114px对高密度屏幕(视网膜)。这允许足够的地区很容易激活一个按钮一般的指尖。
•可达性和明显的控制–如果相关互动项目是触手可及的对方会让用户更快速地使它们之间的过渡。这将有助于减少任何混淆用户可能在如何相互连接,加快更复杂的过程。
为了加强沟通,我们需要让我们如何理解和解读信息的好使用。人类大脑对视觉信息比语言快得多,这意味着它可以使用视觉和图像增强沟通非常有价值。好的视觉造型将增添价值,支持的内容或交互的目的,并提高整体的用户体验(移动和桌面)。
垂直的节奏
第一加强沟通我们会考虑是垂直节奏的运用。信息架构创建一个合理的流程内容,然而视觉设计可用于在内容的视觉层次创造进一步明晰。在内容部分的大小和间距合理的使用将创造一个良好的垂直节奏支持的内容层次的沟通。
除了垂直网格系统前面所提到的,一个基线网格可以帮助创造一个良好的垂直节奏,使内容更容易阅读和理解。具体来说,基线网格创建一个结构虽然线的高度规范。这个定义的字体和大小提供了明确的领导水平的规则,但也可用于定义内容组之间的间距。遵循这些规则将确保段落复制清晰,用户可以清楚的区分和功能组之间的部分。基线网格很难准确执行在HTML和CSS,但不提供有用的指导,在开发和设计过程中的间距尺寸。
使用的颜色
颜色是一个非常有价值的交流工具,可以用多种方式支持内容和相互作用。
•传达一种色调或风格色彩设计是很主观的,依赖于个人经验和文化。然而,使用特定的音调和色调可以帮助传达的目的的一个整体印象。明亮大胆的颜色,创造出一种乐趣,暗色调创造一种优雅而柔和的色调或气氛更灰可以创造一种复古的感觉。学习更多关于色彩理论有助于我们选择最适合的设计目标的颜色。
•区分部分颜色可以用来突出内容的项目,说明项目是相关的,或支撑结构的内容如内容如何分离。
•区分静态项和交互的功能,用强烈的对比将有助于沟通差异的目的或内容或功能之间的联系。使用混合的中性和明亮的颜色,或颜色在色轮结束反对将确保具体项目脱颖而出,给用户。创建一致的颜色的使用,例如在静态的、活跃的和不活跃的项目,整个设计也将展示内容和功能的差异更明显。
隐喻可以用不同的方式来支持通信的消息或主题。
•支持一个潜在的主题-隐喻可以超越一个单一的设计元素,而成为设计或功能的一个关键主题。在Flipboard应用,翻转过渡是用户互动的一个组成部分,和本的顺利实施是在应用程序的成功的一个因素。用一个比喻这样可以让概念的快速通信的用户,以及帮助应用程序都有一个独特的命题。
•按钮和交互设计时使用简单的借壳按钮可以有一个简单的方法来模拟现实生活中的互动元素,使功能明显。然而,值得注意的是,如果奉承方式必须符合品牌或风格指南那么可以有效如果颜色和样式可以明确区分静态项目。Wunderlist采用按键与现实造型
•影像学图标可以设计移动时,在有限的屏幕空间允许的复杂概念的快速通信。使用视觉隐喻的图标是图标,已经成为网络标准,如删除,摄像头,和电子邮件图标我们提及,意味着他们可以经常工作没有标签,虽然可以理解的一瞥。设计简单,却清晰的图标是一个具有挑战性的任务,所以重要的是要了解如何图标影响你设计的清晰性。
移动的未来
一个清晰的认识和标准的约束,如本系列介绍,有任何移动的设计师。然而,一旦我们掌握了这些,才能有超越的指引的能力;打破规则和推动创新创造出灿烂而独特的。这样,随着不断的用户考虑,允许我们创建功能和美学理想的平衡。
设计的移动有一些非常激动人心的挑战和机会在它前面。科学技术的迅猛发展和用户环境的不断变化意味着今天的约束,不可能在未来几年存在。创新思维和创新能力,将有助于我们发掘看待这些挑战的新方法,并允许我们继续寻找新的、美丽的和有用的在我们前面的设计问题的解决方案。
当前名称:移动部分设计:视觉设计
链接地址:/news/20231.html
成都网站建设公司_创新互联,为您提供面包屑导航、网站策划、品牌网站制作、网站营销、软件开发、微信公众号
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联
猜你还喜欢下面的内容