简约而不简单的拟物化设计

-------新蛋网ipad 视觉点滴
前言
    作为Newegg UED团队的成员,我荣幸参与了Newegg iPad项目的UI设计。在项目即将上线,把几个月来的劳动成果进行了梳理和总结,现分享给大家,欢迎各位童鞋参与讨论。
新蛋网,众所周知,一个以3C产品为主的电子商务网站;iPad,划时代地将我们带入了平板电脑时代,移动电子商务,这是一个全新的销售与促销渠道,它能充分满足消费者的个性化需求,在未来的商务市场有着巨大的潜力。而对于设计师而言,移动电子商务的UI设计,远不止从网页或iPhone直接转换那么简单。
    
设计前期准备工作
    人在处理信息,学习和记忆的能力是有限的。随着互联网产品设计越来越重视用户体验的今天,好的设计不但在视觉上带给用户更多美的享受,同时还可以从视觉层面帮助和引导用户完成所需的操作。越来越多应用类产品也开始采用拟物化设计的方式。通过模拟现实生活中的场景,实物的质感,以及人们的日常行为习惯等,使产品的表现形式更加丰富有趣,操作也更加符合用户的日常习惯。视觉方面,我们也将延续中蛋网一贯的以橙色,黄色,作为主色调。这是象征着乐观、喜悦、幸福和希望的色彩,以高彩度的橙色作为主色彩,能够给人以温和、有能量、有律动的感觉,用户也将在带着这份幸福喜悦的心情来进行轻松愉快的购物之旅。与此同时我们把冷静沉稳的蓝色融汇其中,表现了对于业务上的专业与认真。
    
    明确了基本的设计概念之后,就开始对新蛋网的各个板块和功能进行梳理和筛选,对网页的一些功能进行了一定的取舍。我们认真考虑并研究了优秀电子商务设计可行性方针,决定以用户为中心,做清晰简洁的界面,方便购物,将最重要的内容带到最前面并为用户避免分散注意力,也就是 大道至简,一目了然。这也刚好与优秀的ipad应用的用户共性不谋而合,简单的操作、优雅的用户体验、有趣的排版,加上“少而精”的功能总是能吸引众多爱慕者。
    于是我们就尽可能地简化设计, 使用线框图,通过正确的线框图,可以实现正确的层级和创建正确的视觉趣味。然后再经过微妙的色彩填充、独特布局和有趣的图形添加一些视觉趣味。
    线框图制作完毕,整个购物流程就很清晰地被我们整理出来,接下来就是视觉效果的设计了。这个方案我们充分考虑到简约和拟物化两大核心思想,桌面,本子,卡片,皮质等这种触手可得的元素融入其中。通过巧妙的排版和对丰富细节的材质处理,做出最终真正意思上简约而不简单的拟物化首页设计方案。

    接下来随着陆陆续续的页面出炉,各种新颖有趣的视觉与交互体验也被设计出来,现在这里分享给大家。


真实的拟物化场景


用一叠纸片和书签的来查看多种商品及属性信息,富有童趣的字体使用户更亲近


可爱友好的提示方式, 在用户遇到困难时,提供及时友善的帮助
    好了,基本的UI设计先介绍到这里,大家是不是急切想要看到我们的成品去了解更多呢。一定不会让大家失望的,想在虚拟的场景中进行快乐购物或者想要满足一下好奇心的网购大军们¬¬不要忘了下载我们的客户端哦!(小做一下广告,(*^__^*) 嘻嘻……)

结束语
    项目结束了,最后说说我自己的感受,做了这么久了,开始对这个项目是充满好奇和憧憬的。执行起来后觉得这个项目是充满压力的一个“体力活”呢,不过在这个过程中,我们学到了很多也成长了很多,团队一起齐心协力做好一个产品还是蛮开心的。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
YOLO高分设计资源源码,详情请查看资源内容中使用说明 YOLO高分设计资源源码,详情请查看资源内容中使用说明 YOLO高分设计资源源码,详情请查看资源内容中使用说明 YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明YOLO高分设计资源源码,详情请查看资源内容中使用说明

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值