译者注:人脑处理圆形中的信息更加快和有效,设计得当可兼具良好的使用性以及更大的吸引力,本文以移动设备为例,这一类设备恰好是使用圆形的指尖形状,为设计提供了更大的自由度,本文适合移动端设计的同学以及对此感兴趣的同学,不仅从交互上并且从视觉上都能够对以圆形为基本元素的设计起到一定的启发作用。 原文地址:http://designmodo.com/mobile-apps-circle/ 圆形被认为是能够被人眼最快识别出的对象之一。这就意味着我们的大脑有能力处理在圆形中的信息比处理在常规的三角或矩形中的数据略快一些。对于小型的以手势为基础的交互界面中,这种能力真的非常关键。这一点对移动设备来说尤为典型,在大多数的情况下,这成为了选择基本UI元素形状的决定性因素。赏心悦目的曲线取代了尖锐边缘,有助于营造一种温暖舒适的气氛,让感观愉悦。它有效地增强了用户体验,让交互界面简单而明了。 选择圆形一个最普通的原因就是它模仿指尖的形状的能力下意识也将圆形元素与按钮联系在一起。因此,作为一条规律,你很容易发现行为召唤的按钮(call-to-action buttons)应用在环形结构后,有相当一部分应用程序大肆地在设计中使用这一形状。例如,音乐导向的应用,或者是可视化的闹钟以及时钟都离不开环形结构。 本文的选例都是带有明确的圆形风格的移动交互界面,这些界面自然地融入了UI流畅性,更多的可用性和吸引力。 Eli Williamson设计的Lock Screen Concept使用绚丽的相片背景来吸引用户的注意力。紧凑的排版,醒目的圆形图案以及主体的白色给应用增加了雅致与空间感。 Cüneyt ?EN设计的Timer有着绿色的发光风格。近似霓虹闪烁式的图标及带有光效圆形在黑暗的纯色背景下非常显眼。 Timm Kekeritz设计的Partly Cloudy被贴上了怀旧的标签。柔和的调色板,新颖的旋钮,复合的画布营造出一片旧日情怀。 Marco Nenzi设计的ClapUp由于逼真的旋钮和按钮,新颖的时钟以及质朴的白色背景而看起来清爽而且高端。 Jakub Antalík设计的Coffely,由于扁平风格的精彩应用简洁而自然地呈现出准确而轻快的界面。 Circle在整个设计中都应用了圆形元素,从头像显示,状态通知以及其它按钮都用到了圆形。 Megamegacube设计的Quotes app让事情保持简单易懂,将时髦的红色背景,平实的白色的图案元素以及常规字体巧妙地结合在了一起。 Corey Liu设计的Charging Animation采用了现实主义方式。设计师巧妙地将生活元素植根于带有绿色液体的中心图标中,使它看起来栩栩如生且魅力非凡。 Michael Sambora设计的Bikester #2 wip展现了淡色与一系列精致细节刻画核心部件相结合产生的有力的视觉冲击。 Tomáš Zeman设计的Company Income App基于Metro 8美学,出色的集成了淡淡的二维单色圆形元素及大量自由空间。 Nate Dicken设计的Foresee – Let’s Go Swimming!特意注入了一些明亮的颜色来使交互界面看起来明亮而欢快。 Boris Valusek设计的Superminds呈现出惯用的水平条纹式的布局,每一行都包含着圆形头像和小标题。 Zahir Ramos设计的Laundry Master App,通过完美集成拟物化洗衣机相关按钮和旋钮和惊艳的刻画,吸引了常规客户,从而在这类应用中独树一帜,脱颖而出。 Ben Dunn设计的Napp App成功应用一些整齐微妙的整体控制牢牢地抓住了用户的注意力。 Alex Bender设计的Movenpick app是一个美食相关应用。通过用令人垂涎的冰淇淋球照片在交互界面增加圆形风格,描述了可以买到的产品的整体多样性。 Vlad Mereuta设计的WheelTunes,是一个基于手势的带有很棒音乐氛围的播放器。中心圆形头像主图标也起着播放进度条的作用。 Simon用几乎所有空白背景,基本的图形框架和潦潦几笔文字宣扬着最小化设计风格。 Michal Ratajczak设计的Trail Offroad Nightmode给人一种模糊的感觉。应用类似60年代的图标以及受到钟表界面的启发计算机字体,在深色背景的衬托下,增添了UI的复古情趣。 Uriel Albarran O. 设计的Mixer elements刻画了占据了整个空间的逼真而精致的黑色轮盘。 Louis Saville设计的Hack Day App Preview拥有和谐的蓝色风格,并出色地被白色相关加粗样式和可辨识的图标所补充,体现了很商务的感觉。 Ismail MESBAH设计的Phone App UI – Party Maker运用跳动颜色的混合,和俱乐部主题高度模糊的背景、光滑的粗字体以及派对导向的图标都非常地搭调。 Celia Sun设计的Celia’s Weather传达出欢快与清澈的感觉。主体的浅灰调色系,略微膨胀的旋钮,精巧的阴影,准确注入的明亮元素,让交互界面显得简洁细腻。 Frantisek Krivda设计的Flat Style Color Wheel通过显眼的由蓝色到白色渐变的圆环来展示数据。 Ali O. ??设计的Gas combi remote control app是由精巧的图案、和谐的调色盘、漂亮的光和影创造出来的。 Samuel Bednár设计的Alarm Clock App通过交错的样本刻画出了非同寻常的钟表界面,所有元素都是扁平风格的设计。 Arles Festival, iPhone App V2.0利用有吸引力的轻少女风格的导航系统。基于网格,菜单上的每个项目都有着精细的点画笔触、线框图标和优雅的大写字母。 Myroslav Galavai设计的Plant monitoring tool拥有自然启迪风格的UI,展现了非常棒的照片操作、相片集按钮和纤维质感的背景。 Ronge Ruan设计的HR Alarm Clock利用大量图案元素添以充满活力的效果。明亮的放射状渐变和浅色背景带来了积极的情绪。 总结 圆形风格的应用程序交互界面非常常见。旋钮、按钮、开关、进度条、头像以及其他种种经常以圆形出现,并添以振动状渐变、巧妙的阴影、精细的图标、单色扁平感及易辨识的风格。这一形状对于基于手势的iPhone和其它智能手机的交互界面并不惊奇。 圆形感觉的交互界面看起来很现代和高级吗?它们容易被识别吗?圆形能够增加应用的可用性吗?请通过评论来和我们交流你的观点。 |
圆形风格的移动应用实例
时间: 2024-10-10 19:23:59
圆形风格的移动应用实例的相关文章
CSS3实现的圆形遮罩手机应用效果实例
<html> <head> <title>CSS3实现的圆形遮罩手机应用效果实例丨芯晴网页特效丨CsrCode.CN</title> <style> .trans { -webkit-transition: 0.3s ease; -moz-transition: 0.3s ease; -ms-transition: 0.3s ease; -o-transition: 0.3s ease; transition: 0.3s ease; } .tes
C#实例.net_经典例子400个
一共470多例winform 界面特效的源码. 窗体与界面设计... 9 实例001 带历史信息的菜单 10 实例002 菜单动态合并 12 实例003 像开始菜单一样漂亮的菜单... 14 实例004 任务栏托盘菜单 15 实例005 可以拉伸的菜单界面 16 实例006 菜级联菜单 18 1.2 工具栏设计... 19 实例007 带带背景的工具栏 19 实例008 带浮动工具栏 20 实例009 在带下拉菜单的工具栏... 21
EffectiveJava——类层次优于标签类
标签类: 有时候,可能会遇到带有两种甚至更多钟风格的类的实例的类,并包含表示实例风格的(tag)域.例如下面这个类,它能够表示圆形或者矩形: /** * 类层次优先与标签类 * @author weishiyao * */ // Tagged class - vastly inferior to a class hierarchy public class Figure1{ enum Shape { RECTANGLE, CIRCLE } // Tag field - the shape of
python学习笔记-类的descriptor
descriptor应用背景 所谓描述器,是实现了描述符协议,即get, set, 和 delete方法的对象. 简单说,描述符就是可以重复使用的属性. 比如以下代码: f = Foo() b = f.bar f.bar = c del f.bar 在解释器执行上述代码时,当发现你试图访问属性(b = f.bar).对属性赋值(f.bar = c)或者删除一个实例变量的属性(del f.bar)时,就会去调用自定义的方法. 为什么把对函数的调用伪装成对属性的访问?有什么好处? 从property
Python描述符(descriptor)解密
Python中包含了许多内建的语言特性,它们使得代码简洁且易于理解.这些特性包括列表/集合/字典推导式,属性(property).以及装饰器(decorator).对于大部分特性来说,这些"中级"的语言特性有着完善的文档,并且易于学习. 但是这里有个例外,那就是描述符.至少对于我来说,描述符是Python语言核心中困扰我时间最长的一个特性.这里有几点原因如下: 有关描述符的官方文档相当难懂,而且没有包含优秀的示例告诉你为什么需要编写描述符(我得为Raymond Hettinger辩护一
python2.7高级编程 笔记二(Python中的描述符)
Python中包含了许多内建的语言特性,它们使得代码简洁且易于理解.这些特性包括列表/集合/字典推导式,属性(property).以及装饰器(decorator).对于大部分特性来说,这些"中级"的语言特性有着完善的文档,并且易于学习. 但是这里有个例外,那就是描述符.至少对于我来说,描述符是Python语言核心中困扰我时间最长的一个特性.这里有几点原因如下: 有关描述符的官方文档相当难懂,而且没有包含优秀的示例告诉你为什么需要编写描述符(我得为Raymond Hettinger辩护一
WPF 图片浏览 伪3D效果
原文:WPF 图片浏览 伪3D效果 首先上效果图: 因项目要求,需要把图片以"好看"."炫"的效果展示出来,特地研究了一下WPF关于3D方面的制作,奈何最终成果只是能够画出一个立方体并使之旋转. 项目时间仅剩两天,只好放弃3D另找出路,于是就想起了Flash中各种"炫丽"的动画效果,图片按椭圆排列,并且旋转. 于是开始代码,然后发现关于椭圆啊.正玄余玄.x,y,r等等数学知识都忘得光光了,仅有思路没有进展,无奈之下开始百度恶补数学知识.图形变换.
10款响应式 jQuery实现图片效果插件
1.基于jQuery实现的汇图网大屏焦点图效果 汇图网大屏jQuery焦点图代码,可设置切换模式,如淡入淡出切换,左右滚动切换,上下滚动切换,可设置是否自动轮播,可设置鼠标划过是否停止播放等. 在线演示 源码下载 2.HTML5基于SVG实现的过山车动画特效 今天我们要分享一款很酷的HTML5/SVG动画,这款HTML5动画是过山车效果,主要是利用了SVG的path动画来实现的,整体动画效果流畅自然,效果非常酷. 在线演示 源码下载 3.jQuery实现苹果官网页面上下滚动全屏效果 这是一款基于
Python描述符(descriptor)解密(转)
原文:http://www.geekfan.net/7862/ Python中包含了许多内建的语言特性,它们使得代码简洁且易于理解.这些特性包括列表/集合/字典推导式,属性(property).以及装饰器(decorator).对于大部分特性来说,这些“中级”的语言特性有着完善的文档,并且易于学习. 但是这里有个例外,那就是描述符.至少对于我来说,描述符是Python语言核心中困扰我时间最长的一个特性.这里有几点原因如下: 有关描述符的官方文档相当难懂,而且没有包含优秀的示例告诉你为什么需要编写