设计细节:IOS应用PATH

来源:互联网 发布:乐外卖是什么软件 编辑:程序博客网 时间:2024/05/29 13:24
支持iOS的Path 一直以来都与亮眼的设计和专注于细节联系在一起,尽管一开始似乎接受Path的人不多,但最近几个月表现出了增长——我发现PATH是一款被 低估的产品。

译者: shirley_yyz 原作者:Brian Lovin

支持iOS的Path 一直以来都与亮眼的设计和专注于细节联系在一起,尽管一开始似乎接受Path的人不多,但最近几个月表现出了增长——我发现PATH是一款被 低估的产品。当然,我还不能把自己称为一个重度用户,但我对所有倾注了团队热情和爱的产品都是死忠。

Path上周开了一个很大的发布会,推出旗舰版Path的同时还发布了一个新的独立的消息应用。这提醒我在“设计细节”系列里为Path留一席之地。希望你们能喜欢这 些视频——如果我漏掉了什么,喊粗来!

下面是IOS版Path中我喜欢的一些设计细节:

  1. 登陆

Path让人欣喜的弹出设计语言没有让新用户浪费任何时间,轻弹出和淡出效果让所有的模块都鲜活起来。只是精彩——接下来我们还会看到在这款应用中其他几个相似的例子 。 一致性+1分!


2. 新手引导

这个新手引导流程非常流畅!没有额外的东西或不必要的信息——只是一些简单的开始步骤,菜单消失后,用户看到的是简单的欢迎界面和分享按钮上的提示信息。设计师在这个 小小的细节投入了多少时间可见一斑——尤其是提示信息上的语言。

创建一个时刻——这里向新用户介绍分享时刻的步骤,没有任何华而不实的东西。这里不是让你分享你在Candy Crush得分的地方,而是一个让你与朋友分享时刻的地方,赞。


3. 让Path有名

我记得当Path第一次发布的时候——这个弹出式分享按钮抓住了用户和设计者的眼球。我记得看到这个的第一反应就是“他们到底怎么做到的!?”Path最近的更新在设 计细节上做了一些小改变,但是感觉变动不大。

点击“+”按钮,飞出式菜单上有各种你可以在path上分享的内容的图标。这些图标弹出来的同时旋转,当然这里可能需要多花一点时间来看一遍这些动画,但是给新用户带 来的体验确是无价的。


4. 攻略

Path在攻略模块有些细节相当出彩。在第一次登陆时会在相应的版块看到相应的提示卡,这些提示卡会提供一些信息帮助用户更好地了解和试用Path,而这对于任何产品 设计者来说都是一项艰巨的任务。

还有:不要错过提示最后的一个小细节——这个发生在一瞬间,但是为整个体验加分不少。


5. 资料卡淡出效果

我看到越来越多的应用采用了这种滚动+淡出技术——这个在Path上交互体验非常棒。当你开始向下滚动你的资料的时候,屏幕上的一些元素渐渐地淡出,而逐渐被一个简单 地“我”代替。

注意,在这里我的封面会直接显示在IOS状态栏后面——这种让封面填满屏幕的感觉非常棒!


6. 分享互动

Path让人们与朋友分享时刻的方式友好而有趣——用完美像素的表情来表达情绪(绝大部分表情都支持购买)。注意,我的表情是以泡泡的形式出现的哦!


7. 更换资料卡图片

这一部分很有可能会被忽视,但非常值得一提。单击资料卡的任意一处,你就可以更换你的头像或背景图片。你不需要在设置或奇葩的选项里乱弄一气,只要单击就可以轻松修改 图片。大爱!


8. 买表情

在这里我只想展现一个细节,就是这款应用在交互和动画方面的坚定的一致性。


9. 地图

这里有两件碉堡的事情:

· 返回按钮是Path的‘P’签名logo。这一点对我来说非常棒——答案非常明显,因为对于所有设计者来说返回很有可能就是“后退”或“关闭”的文字列,但这里的 logo(也许认知上没那么明显)为这款应用增加了许多“风味”和个性。

· 注意,在我转动地图的时候,设计精致的指南针也会随着地图旋转。就是这样的小地方,童鞋们…


10. 搜索

请忽略视频放到一半的时候的黑屏——我也不知道为什么:)

Path的搜索界面真的挺有趣的,当我在应用主界面单击具有磨砂效果的搜索栏时,屏幕上会出现几个建议选项,吸引我单击和体验。我非常希望看到有多少用户体验了这 个搜索建议——这很有可能代表了99%的网站的现有搜索方案。


11. 加载提示

这个我大爱!当我打开搜索附近后,跳进眼帘的是一个非常棒的加载提示。在这里我要强烈表达我对设计师的赞扬,他们完全跳过了那些旋转提示、进度条或者加载文字的老套路 ,而是开发了一套非常符合这个应用整体设计语言的且趣味性极佳的加载方案。


12. 给朋友加星

在这个界面里我可以通过给我朋友的名字加星把他添加进我的“朋友圈”。这个细节虽然非常小,但不应该被忽略——在你加星或者取消的时候,注意星星的跳进和跳出。


13. 分享

恩,我该从何开始呢?

那我就从分享按钮的交互方式开始吧,在这里我选择了“内容分享”——引号变大后,然后与其他图标同时淡出。现在在越来越多的应用里都可以看到这种平滑的过渡效果(别看 了,就是你,推特!)。

在我进入文字视图时,我可以在朋友圈或仅自己可见的模式中切换——模式的切换相当出彩,切换动作非常流畅,绝不会跳来跳去或无缘无故的花屏。


14. 时钟

童鞋,你该不会认为我忘了这个吧,我清楚的记得我第一次用Path的时候,这个细节征服了我——当你在查看自己的信息历史时,右上角会出现一个指针时钟,在你持续滚动屏幕时,时钟的指针会根据你发布信息的时间和日期动态调整。指针的变化非常流畅,日期的淡出变化也毫无违和感。

如果你想学习如何用简单和清爽的方式取悦用户,那Path绝对值得下载。


15. 用户信息历史底部

额,我很有可能弄了一个截屏,大家忘记这个视频吧:)

我就是想指出这个只会出现在用户信息历史的底部的小细节——一个略带凹陷质感的花纹。这个是Path的另一个亮点,在这个应用不起眼的角落吸引了用户的注意力。


16. 下拉刷新

我看了一些像Path一样的下拉刷新,感叹于他们为这个倾注了多少时间和努力。这里没有过多的界面,没有Path中其他交互过程的流畅度、跳跃感和整体感,所以在这里 不值得多提,这些脸书早就做了。


17. 网站

啊,对了,还有一个网站。我曾严重怀疑Path的网站会有超多内容,但他们居然不是这样设计的。他们的团队把这个网站设计的令人愉悦、有娱乐性而且有很棒的交互体验—— 即使小到这个应用的一个登陆页面。严重推荐大家去看看path.com的官网去看看超赞的网页设计。


谨以此文献给对设计有追求的人,译者也许不专业,但很用心。

0 0