IInterest » UE http://www.iinterest.net 关注移动互联网 & HTML5 Sat, 07 Jan 2012 08:07:27 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 分享三组实用的小图标 http://www.iinterest.net/2010/01/22/mini-icon/ http://www.iinterest.net/2010/01/22/mini-icon/#comments Fri, 22 Jan 2010 03:20:53 +0000 Bell http://www.iinterest.net/?p=714 MonoIcons

下载

famfamfam_silk_icons

下载

pi_diagona_pack

下载

]]> http://www.iinterest.net/2010/01/22/mini-icon/feed/ 1 [工业设计] Objectified（中文字幕）- 艺术设计交流 http://www.iinterest.net/2009/12/30/objectified/ http://www.iinterest.net/2009/12/30/objectified/#comments Wed, 30 Dec 2009 08:11:43 +0000 Bell http://www.iinterest.net/?p=684 [2011.6.17]各种资源失效，但还是非常推荐这部纪录片

下载地址

电驴下载

]]> http://www.iinterest.net/2009/12/30/objectified/feed/ 0 浅谈淘宝改版 http://www.iinterest.net/2009/12/26/talk-about-taobao/ http://www.iinterest.net/2009/12/26/talk-about-taobao/#comments Fri, 25 Dec 2009 16:20:58 +0000 Bell http://www.iinterest.net/?p=666 早上听说淘宝改版了,遂去观摩一下,打开新版淘宝给人第一感觉就是简化了许多,精简了那些闪啊闪,弹啊弹,飘啊飘的广告,这是一个值得称赞的改动,对于操作基本集中在导航与搜索框的用户来说(比如说我=.=),冗余的内容只会降低个人的用户体验.再次,从改版中也可以看出淘宝的侧重在往社区倾斜,当然这也在预料之中,毕竟拥有如此大的用户群,不好好利用起来着实是一种浪费:) 另外对淘宝电器城比较期待~

新淘宝


不过好的心情到这里就结束了,随着使用的深入,新版给我的映象分在逐步降低.究其原因就是对细节的把握不够!

新版淘宝有许多雅虎的影子,在搜索框,导航以及弹出层的设计上淘宝与yahoo比较相似

yahoo

但在细节上却没有yahoo讲究.就拿弹出层来说,当弹出层激活时没有明显的视觉提示,第一次使用时若不是看到右上角略显突兀的关闭按钮,我还真没发现我激活了弹出层:




相比而言,yahoo的则非常清晰:




再就是在阴影的设计上,yahoo的要显得精致许多:




然后是搜索框,个人感觉略显厚重,把边框改细一点或者颜色淡一点,可能感觉会好些.




最后是宝贝栏目的显示,统一的颜色乍看起来比较整齐划一,但也是因为统一的颜色使得满屏的链接缺少视觉重点而影响到实际中的使用.可以适当改变一下颜色纯度、明暗来提高层次感.


总的来说这次改版做到了由繁化简,这点着实不容易,从而大大提高了可用性及用户体验,不足之处就在于对细节的最求还有提升的空间,相信不少淘宝的设计师在用苹果的产品,那苹果给人的感觉就是简约而不简单,虽说没有华丽的外表,但都是在细节之处体现其工业设计的强大,so～希望淘宝也能更注重细节上的设计,为用户展现一个更为精致的淘宝网.

]]> http://www.iinterest.net/2009/12/26/talk-about-taobao/feed/ 2 呼吸灯效果的按钮 http://www.iinterest.net/2009/12/10/breathing-light-botton/ http://www.iinterest.net/2009/12/10/breathing-light-botton/#comments Thu, 10 Dec 2009 09:58:31 +0000 Bell http://www.iinterest.net/?p=650 Continue reading →]]> 昨天看到一个鼠标的呼吸灯效果,很是喜欢,于是用1张jpg+2张gif图片做了个呼吸灯效果的按钮,因为2个gif图片加起来就差不多28K,所以还用了个CSS图片缓存…[CSS图片缓存会使gif提前载入,但在IE下gif载入后就直接播放了,这就无法实现呼吸灯的效果,暂时没找到解决办法].这个只能算是自娱自乐,因为开销比较大,所以实用性不强.

提示：你可以先修改部分代码再运行。

]]> http://www.iinterest.net/2009/12/10/breathing-light-botton/feed/ 6 [翻译]界面提示与感知延迟 http://www.iinterest.net/2009/07/01/ui-messaging-and-perceived-latency/ http://www.iinterest.net/2009/07/01/ui-messaging-and-perceived-latency/#comments Wed, 01 Jul 2009 03:12:54 +0000 Bell http://iinterest.net/blog/?p=294 Continue reading →]]>
  • 原文：UI messaging and perceived latency
  • 作者：Roma Shah，用户体验研究员
  • 翻译：ytzong

    • 对一般的用户而言，速度并不意味着性能。用户对网站速度的感知很大程度上取决于其整体感受，包括他们如何高效的从网站获取所需，以及网站反映出来的易响应性。

    当设计 Web 站点或 Web 应用时，谨记用户来你的网站是有目的的。他们能越快（越容易）达到他们的访问目的越好。如果用户在获取内容时遇到了许多困难，他们将会离开你的网站，而去能让他们更快达成目标的其他网站。

    节省用户时间，让他们感觉没那么慢有很多工作可以做，本文只涉及提示信息。

    提示信息，要考虑三点：

    1.网站是否足够简单和直观，首次访问者是否可以很容易上手？
    如果不是，花些时间去设计首次运行经验（first-run-experience）提示。比方说，你的网站是一个拥有数项功能的强大的 Web 应用。鉴于为此类型的应用程序设计一套直观的“开箱即用”（out-of-the-box ）体验并不是一项容易的事情，用户可能需要一个入门帮助。

    首次运行经验简单的为用户说明产品是什么以及/或如何使用其亮点。从长远上看，花一点点时间让用户提前了解产品的一些关键点会给他们节省大量时间。

    提示：不要过头！不要阻止用户获取实际内容，这会令首次运行经验变成额外的一步（a cumbersome multi-step process）。

    2.提示信息是否会中断或增加用户操作？
    仔细考虑如何显示信息会增加用户的操作流程。在不影响用户操作的情况下可能有更合适的方式去显示提示信息。想象一个场景，用户完成一个动作，你认为很完美的。你认为需要二次确认（double-checking）的，为了防止用户意外出错。所以你弹出一个提示“你确定这样做吗？”，这阻止了用户的一个大的错误操作，但对于确定要执行这个动作的用户来说，你增加了一个额外的操作。作为替代，你可以运行操作立即执行，同时在操作后增加一个取消的功能。

    3.等待时如何让用户静心（reassure）
    面对现实吧，有些时候用户不得不等待。然而，你可以做一些工作使不可避免的等待时间变得比较好度过（bearable）。如果用户等待的时间较长，使用进度条。进度条不只表明必须等待，同时粗略的显示要等多久。如果要更详细一点，甚至可以显示已经完成的数据（例如 40kb of 64kb）。尽量避免估算完成时间，因为连接速度波动时，没有什么比看到完成时间一直在增长更郁闷的了。

    当用户等待的时间较短时，可以用 loading 指示器。loading 指示器通常是一个旋转变化的小东东（a spinning doo-dad of sorts），但也可以是很简单的文字”loading”。

    你也许会问，为什么极短的时间也要显示这些？loading 指示器是给用户的反馈：用户的操作已经通过，网站正在执行。没有指示器的话，用户不确定是否执行，从而可能企图再次尝试。

    延伸阅读

    这些建议只是为用户设计时需铭记的事项中的冰山一角。下面是一些可以让你入门（get you started）的关于交互设计和 Web 设计原则的资料：

    ]]>     http://www.iinterest.net/2009/07/01/ui-messaging-and-perceived-latency/feed/ 0