产品体验日记_01

36天前发布

原创文章 / UI / 观点
冰柠茶_cc 原创,如需商业用途或转载请与冰柠茶_cc联系,谢谢配合。

发掘优秀设计中好玩的点,坚持体验好玩的产品和交互

1,产品体验日记-片场


片场APP是一个影视取景地信息库,是一个电影旅行指南;

它搜集并收录了900+部经典影视剧的13000+个取景地;

详细解析每一处取景地在影片中出现的时间,相关场景剧情,拍摄具体位置提示,以及拍摄幕后花絮。


1.1 片场-代入感故事场景引导页

引导页采用插画与文案结合的方式,一段有趣的故事场景增加用户的代入感,巧妙地描述了软件的功能。插画融入了品牌的IP形象,强化品牌识别。


   

1.2 片场-动态数字启动页

启动页采用的是动态的轮播数字,展示了整个APP收录的电影和地点总数。启动软件的时候给人很有趣的体验,让人眼前一亮。


 

1.3 片场-个人中心漫画式排版

个人中心的缺省页面是线条插画,像是一本漫画书一样贯穿上下,排版没有那么局限,错落有致,增添趣味;未收藏内容时,缺省图是邮票插画,收藏的内容会填满这些邮票,让用户有快速收藏内容,体验软件的欲望。


 

1.4 片场-打破常规,设计感十足的登录注册页

登录&注册页面区别于大部分APP的常规设计,运用大字无插画,左上角是一句欢迎的话,登录注册按钮放在整个页面的右下角,整体页面也不会失衡;注册页面很清晰的3步引导,以及突出的“下一步”文字引导,让用户少动脑,易用性高。

 


1.5 片场-错落有致的首页排版

首页图片与图片之间采用较大的间距,整体给出合适的留白区域,让用户更有呼吸感,舒适感,增加易读性;

采用图文结合,更像是书籍,杂志的排版方式,更具真实感和设计感;

文字左右排版对比,字体大小对比,突出想要表现的重点之外,又充满设计感;

高品质的设计感电影海报配图,让整个页面更有质感,高级感。


   

1.6 片场-电影详情页面时间轴排版

在每一部影片的详情页面,剧情按照时间顺序形成时间轴,加上影片的截图,让用户更清晰的知道剧中出现的拍摄地点出现在电影的哪个时间段;距离也同样采用时间轴的排版方式,由近到远的呈现所有的地点,一目了然。


1.7 片场-地图上标记城市位置

打开不同的城市详情页面后,你会发现小圆点标记出了当前城市在世界地图上的的真实位置,小的细节丰富了整个页面的趣味。


 

1.8 片场-线路详情页可以快速跳转地点

用户已经购买的或者自制的线路,再次查看时,可以一步一步查看(适合第一次查看购买的线路),也可点击页面右上角的按钮——出现整个线路的所有列表,用户可点击相应的模块快速跳转。


 

1.9 片场-缺省页面,统一的画风,融入IP形象

缺省页统一的插画风格,与整体app的风格呼应,插画里也围绕IP形象开展,与品牌呼应,增加情感化设计,强化品牌识别。


 

2,产品体验日记-印象


印象是一个VLOG分享社区、短视频剪辑&创作的APP


2.1 印象-分享作品或用户时有两种分享方式

印象APP中,当你想要分享一个作品,或者用户时,会有两种分享方式让你选择:1,作品或者个人的名片,2,作品或者用户主页的链接。 


 

2.2 印象-分享用户个人名片可以更改样式

印象APP中,当你分享用户时,个人名片的样式可以更改,用户可以选择快捷方式(右上角的绿色按钮)更改,也可点击进入名片详情,左下角“换一换”按钮更改。


 

2.3 印象-评论区自动调节区域大小

评论区默认高度约占屏幕的1/2,当用户滑动评论区往下翻看时,区域会自动覆盖全屏,展示更多的评论内容,方便查看更多评论。


 

2.4 印象-图片过多,下方小圆点不完全展示

 图片过多时,下方的小圆点不全部展示出来,随着左滑图片,会逐渐添加。



2.5 印象-推荐用户模块左滑进入新的页面

首页出现的推荐关注用户,左滑到最后一个卡片时会出现“滑动查看更多”,再次滑动会直接进入一个新的页面,展示更多推荐关注的用户列表。


 


2.6 印象-点赞无需进入详情,首页可直接双击喜欢

用户浏览到自己喜欢的内容,无论是图片还是视频,都不需要进入详情页,可直接在列表页双击喜欢。并且当你观看一个视频较长时间或者较多次数的时候,会tips提示用户“喜欢后会收藏到我的空间哦”的字眼。


 


3,产品体验日记-常用软件


生活中,我们经常使用的一些软件同样拥有很多成熟的交互与视觉,使用的过程中来体验和积累这些有意思的点,也有效的利用了我们的碎片化时间。


3.1 灵感-个人中心可以收起

在灵感app中,用户的个人中心左上角有一个收起按钮,用户可以自己收起个人信息等相关内容,给灵感集和作品等更大的展示区域。


 

3.2 盒马-刷新进入二楼发现新功能

盒马APP中,刷新时继续往下拉可进入盒马二楼,发现一些隐藏的功能。再次下滑或者刷新,又可以关闭二楼。



3.3 盒马-金刚区图标在子页面仍然展示

盒马APP中,金刚区分类的快捷图标,在进入二级页面之后,页面上方仍然保留金刚区分类图标,用户不用退出二级页面,直接在上方快速选择其他分类。二级页面左侧是该分类下的二级分类,方便用户细致筛选商品。


 


3.4 淘宝-加入购物车时产品缩略图尺寸更改

左侧为未改版前产品缩略图,选中一个产品,上方展示其缩略图。右侧为改版后,所有产品类别默认都为大图展示,方便用户直接查看更多的产品,也避免频繁切换不同的产品进行对比。


 


3.5 淘宝-消息列表左滑功能不同

淘宝中,用户在消息列表左滑时会出现不同的功能:

a,未读消息左滑多出一项标为已读;

b,个人用户在没有未读消息时,左滑只有“置顶”和“删除”功能;

c,群组列表左滑会多出“退出群聊”功能;

d,公众号左滑会多出“取消关注”功能。


 


3.6 淘宝&乐聊-不同性质软件的截图提醒

乐聊是一款联想内部人员使用的办公软件,当截图时,会有关于企业安全的信息提示;而淘宝截图时,直接提示的就是分享给好友的提示;不同的软件截图时给出不同的提醒,也是预想用户截图之后的使用场景,进而提供快捷操作。


 


3.7 抖音-发布按钮推荐新功能

抖音在推荐用户使用连线功能时,将此功能的代表元素添加在经常使用的发布按钮上,点击发布按钮会发现重点突出了想要推荐用户使用的新功能。


3.8 微博-查看长图时自动隐藏无关信息

在微博中,用户查看图片时,可以选择点击左下角的icon手动隐藏和显示“用户名,点赞,分享”等一些信息和操作项。但当用户浏览一些长图时,往下滑动,系统会自动隐藏这些干扰项,更方便查看主体的图片内容。


  感谢查看

18
- 位站酷推荐设计师推荐 -

声明:站酷(ZCOOL)内网友所发表的所有内容及言论仅代表其本人,并不反映任何站酷(ZCOOL)之意见及观点。

    文章信息

    • 文章标签

    没有新消息