关于交互设计细节,这里一个Case 就是 Pinterest的APP端,我们一起解读一下吧。

Pinterest有着极棒的交互设计细节,同时,它构建的交流平台有十分丰富的设计作品。要知道,绝佳的设计能吸引新用户去更好的体验产品。

Pinterest是我经常使用的一个App,在我同时关注的好几个有关于UI和UX设计平台的同时,Pinterest几乎是最棒的。无论我自己有多么的缺乏社交,在Pinterest仍有成百上千的用户在不停的启发灵感,交流合作,不断创作。虽然没有给用户的作品带来直接的经济效益,但Pinterest构建的交流平台也带来了很多用处。

另外,Pinterest上丰富的设计作品,对很多人来说是非常实用的。在那儿实在有太多不同寻常的网页设计和iOS设计作品,让人们更多的关注自己的需求。在本文中我会更多的介绍Pinterest极棒的交互设计细节。

1.启动画面

我十分热爱体验不同App的启动画面,要知道启动过程中给用户带来的激活体验是十足微妙的,由此,这对设计师来说也是一个考验。这一直在改进,绝佳的设计能吸引新用户去更好的体验产品。我非常庆幸,Pinterest不论是网站还是App在这方面都做得很好。

Pinterest所关注的不是功能,而是用户的需求。在此,他们并不谈论图片,分享,社交媒体等等,仅仅单纯的陈述人们该如何使用它,如何利用它来更好的生活。不停移动的镜像画面,也展示了他们的有趣和图片特色。

2.搜索过滤

实质上,我对于这种毫不犹豫脱离iOS模式的设计是有偏见的,但我仍然认同它的实用性。Pinterest的搜索过滤有着很好的体验反馈,也让他们从千篇一律的iOS搜索设计显得独特。

3.浏览

在比较体验各种app之后,你可能会像我一样开始注意一些微妙的设计细节。精巧的切换,进入,并且利用一些减淡的元素打造了绝妙的流畅体验。没有太多突然的切换,有的只是静态状态的逐步转换。

Pinterest 交互设计细节

4.滑动刷新

很多人都尝试在iOS7的在载入指示符中做些改变,Pinterest在此只是用了很简明的设计。没有什么特别的,但仍有这很好的体验,充分显示了产品的卓越。

5.关注提示

我很抱歉的说类似于点头的动态提醒有点神经质,不过这也强调显示了Pinterest的极简设计风格,引导着来自不同地区的用户。

我想说的第二个设计细节特别容易被忽视,当我关注一个用户时,他的关注者人数会弹跳一下,取消关注也是如此。

6.滚动

滚动和模糊背景图片的设计已经并不新鲜,在此我想要突出的是,当你返回到顶部,注意这个标题栏的文本“Plants”会轻微的弹动消失,这个流动的设计简直神了。很容易发现他就是弹开然后弹回消失不见,特别的生动。

7.阅图

当用户在浏览图片时,Pinterest的每一次切换都是精心设计的。我非常喜欢阅览时,新窗口按比例弹出,主图作为背景模糊的样式。

8.点赞

你可以为你喜欢的图片点个赞。

在设计中的诸多细节很容易被忽视,但对我而言,也正是这些细节让app更生动有个性。了解此点的设计师和开发者为此而不断的改进,想出新点子。

9.操控

减淡而慢慢移出视线的图片切换,如此细微,如此之快。底部增加的深度以及图片的有形性都是设计师用心之处。

10.返回

通过下拉你能从单个图片回转到主要版面,一切都非常的流畅自然。

11.即时互动

在主要版面轻击图片即可跳出扁平的,活动的图标,让你即时点赞或者分享图片给朋友。这个操作是具有标记意义的,如果你还没有试过,强烈推荐你。

12.即时pin

无论何时你启动pin,将滑出在页面显示,此时背景会根据比例模糊。非常的简介。

13.即时点赞

当你喜欢一张照片,即可点击图片方的心形,它将轻微的弹动以示操作成功。

14.不喜欢

不喜欢这一考量是众所期待的,表情选用了心碎的图标。基于一些原因,不喜欢这一情感因素增加到了评论中,我有预感有些用户可能会因为担心“不喜欢”而减少发布照片,但这只是一种猜测。

15.发送pin

在发送pin的操作中同样采取了模糊和灵活切换。值得注意的是,一旦信息被成功发送,会有一个小的黑色气泡信息提示显示在屏幕下方。

16.添加信息

如果你想要以短消息的方式分享pin,信息编辑栏将放大以方便你进行文字编辑。它将推送标题栏在顶部,移出不必要的部件以空出空间。

17.标签栏

在主页增加标签栏也挺有趣的,添加的图标通过旋转,给了用户更便捷的方式取消。我不确定这个设计的实用性,但看起来似乎还不错。总的来说,我很喜欢图标切换的模式,运用模糊和色彩十足突出了app的主要操作。

18.Pinterest登录页

作为最后一个说明的设计细节,我想重点说Pinterest的官方主页。背景由缓慢滚动的图片墙构成,我分别获取了几个不同的背景内容:计划旅行,打造花园,准备跑步。设计师用了太多的图片数据来通过登录页也展示了Pinterest的特点。

原创文章,作者:Smiler李想,如若转载,请注明出处:https://www.iamue.com/3284/

(0)
Smiler李想Smiler李想
上一篇 2015-01-26
下一篇 2015-01-26

相关推荐

  • EVA「Flow」Living in the Future | Flow 正式上线

    吕骋说:“智能语音助手解决的是人机交互,但并没有解决人人交互,我认为,把人机交互和人人交互打通才是最重要的。” 为了保证最佳的视觉体验,我们特意制作了搜狗输入法的对应皮肤 大家在搜狗输入法的皮肤商店里,…

    交互设计 2015-09-11
  • 从用户体验的角度聊《南方公园:手机破坏者》是如何盈利的

    原文作者:Matt Suckley & DeltaDNA欢迎回到In-App Purchase Inspector,在这里我们会以消费者的视角,定期测评一些F2P游戏。每期文章,我们都会考虑游戏中IAP的诱因、压力、它们的感知价值、IAP带来的扩展内容还有整个游戏体验的评估。最终目的就是看看这游戏究竟值不值得我们砸钱,不花钱的游戏体验是否也能让玩家感到满足。本期文章,我们与数据分析公司DeltaDNA合作,对改编自动画情景喜剧《南方公园...

    2018-04-02
  • VR中的协作游戏

    在VR中分享经验、与他人协作,这是绝无仅有的一个新维度。玩家们甚至语言都不通,这个事实如此奇妙,证明了我们仅凭极少的手段就能沟通和协作。

    2017-04-28
  • 蔚来ES8正式上市 | 重新定义汽车用户体验

    就在刚才,首届NIO Day蔚来日在北京五棵松体育馆圆满结束。蔚来ES8也正式上市并开启预订。近万名蔚来好友相聚于此今晚,这些信息你不容错过:蔚来ES8正式上市 公布售价蔚来ES8售价公布ES8基准版补贴前售价44.8万起,限量1万辆创始版补贴前售价54.8万,用户也可以选择电池租用方案,车价比常规购买低10万,每月支付1,280元电池月费,同时可享受电池升级服务。ES8上台亮相源于赛道冠军的极致性能4秒SUV俱乐部最大功率480千瓦(...

    2018-02-02
  • 福睿斯幸福号春运列车的背后:营销回归用户体验

    爆竹声中辞旧岁,品牌送暖入屠苏。一年一度的春节,不仅是万家团圆的时刻,也是品牌们“秀肌肉”,送暖消费者的黄金期。每到这时,煽情、怀旧、调侃、明星、红包、互动……各大品牌总会使出浑身解数以俘获消费者“芳心”。而今年最暖的,莫过于福睿斯推出的“幸福号春运列车”。今年春节期间,长安福特福睿斯联手凤凰网、12306客户端、高铁杂志《旅伴》等平台,在1月30日至3月31日期间联手为春节回家的朋友打造往返于成都—上海的“福睿斯幸福号”专属列车(D3...

    2018-03-29
  • 【译文】UI设计评审成就微创新

    产品设计流程中,有必要对设计进行评审是大家的共识。在我每周的工作内容中,参加各类大大小小的设计评审是必不可少的一环。既有脑力激荡的评审让设计方案脱胎换骨的,也有针锋相对的评审让设计方案摇摆不定的。怎样进行一场高质量的设计评审?设计师应该如何应对设计评审,更好的表达设计意图,并收集意见改进方案?怎样避免设计评审变成竞稿或PK?如何确保设计评审这样的流程能带来更大价值?带着这些问题,我们一起看看原文作者Jason的观点。*在你点评的设计细节上开始询问背后的原因及意图。为什么我们需要这条信息?对于允许索取这条信息我们设置了哪些期望?我们会用它做什么?如果我们能回答它们,再进入讨论解释各种元素的优劣以及与之对应的不同意见会比较好。“为什么”引出一个故事,解释某件事情的真实性。如果你问为什么,一切都无法奏效,你更想要创造一个故事,无论真实与否。这是让你感到糟糕的危险领域。 与询问“为什么”不同的是,考虑询问“如何”能够引出一个创造流程的故事,不必为它的存在辩护。然后你可以问设计师之前考虑过的各种可能,认真倾听设计师在提供方案之前做过的尝试。他们也许过于看重某些东西,不过没必要深究。优秀的适时交互是让产品(服务)吸引或失去客户的关键区别。将间歇性的互动变为持久关联的秘诀在于一系列精彩微交互,以及当用户需要时恰好出现的信息内容。 在设计评审流程中,应当询问每一个行动、每一次询问或者每一次数据展示是否出现在正确的时机,以确保界面在切换时传递信息时顺畅。随着扁平化设计与用户体验趋势的摇摆变化,我们能预感到页面部件缺少视觉线索的风险,因此动画能减少这种风险。 这种动效可能是颜色、透明度的变化,也可能是用猴子的手臂延伸页面这种细节,或者用户完成任务后展示太阳升起的效果。询问在UI设计中加入逐步动效的可能将极大的推动设计师改善设计,使得设计师思考时间维度的设计细节,而不只是局限在空间维度。这是一个很好的问题,我认为它是每个人都应该吸收的教训,尽管并非如此。我总喜欢提到:对用户的真实目标来说,页面或屏幕上的任何元素都不是解决方案的一部分,而是噪音和干扰。 在设计的每一步中,我们都需要自问:我们如何能够创造更小思考成本下能发挥同样作用的产品?在设计评审中,这是要求把方案简化的最佳表达。在设计中保持界面清晰很重要,使用尽可能少的点击、文案和输入框来达成目标更好。踏踏实实的把用户需要完成工作的消耗降到最低,用户会感激不尽。我们认为,很棒的产品描述(比如产品手册)对用户来说就跟“坐在60码时速的车上看到的广告牌一样”,UI设计师们比较难理解用户是如何忽略这些产品界面细节的,尽管设计师为此付出诸多努力。 优秀的设计评审放慢节奏,考虑每个元素,但是能认识到这些设计细节可能不会被用户注意到。如果参加评审的人员在颜色、字体及体验设计方面没有专业知识,他们可以考虑以下重要因素:经验告诉我,不要试图一概而论。例如我会问“我不确定开放的banner是否足以传达品牌?”,而不是问“哇,用户根本不会理解我们的品牌价值。”这就是为什么我认为每个设计师应该花时间观察用户并且使用自己的产品(又称可用性测试)。

    2017-05-18
  • 谈谈(web)网页设计中的留白原理 – 2016版

    设计中存在很多关于留白的只是,零零散散在网上也看过很多,总感觉比较零散,自己根据自己的感觉,重新把留白的原理和一些技巧系统的归纳整理了以下,也对自己的一个提升。分享给大家。

    2017-05-28
  • 从设计默认值开始,给用户和产品带来更好的用户体验

    默认值是你的数字产品的默认基准设定值,这些填充设置的默认值虽然常常不多,但是换个角度来看,它更像是是设计师为设计作出一些基本的“决定”,帮助用户更快的让产品运行起来,上手使用。默认值对于产品和用户而言很重要,今天的文章,我们将会探讨设计师要如何设置默认值的样式、交互和字段细节,确保给用户和产品都能带来更好的用户体验。

    2017-05-03
  • UI设计入门必会:Axure及Adobe系列软件如何安装

    UI设计最最基础的-软件如何正确安装且永久免费试用1、Axure 8.0正确安装、汉化、破解2、UI设计之通过CreativeCloud安装Adobe软件

    微信热点 2018-05-07
  • 分享两个交互设计作品

    今天跟大家分享的是二两童靴的两个交互设计作品,第一个是平安保险产品配置后台交互设计,第二个是台州银行客户经理移动办公App交互设计,希望大家多多交流。如果你也有好的作品想在我是UE网上展示,可以加学习群15…

    2015-07-02