APP交互设计,需要注意五点事项

交互设计这个词最早提出来是在1927-1970年,那个时候只是个初创期。后续随着时间推移,互联网和机器的发展,这几年开始被人重视这个交互设计。很多公司专门成立个部门叫UED,听起来很吓人,设计师没有接触过,不知道是什么东西,具体里面有哪些核心内容?其实说白了就是把人,机器和界面相融合,做到顺其自然,顺理成章,不要反其道而行,逆天反人类。


交互设计这个词最早提出来是在1927-1970年,那个时候只是个初创期。后续随着时间推移,互联网和机器的发展,这几年开始被人重视这个交互设计。很多公司专门成立个部门叫UED,听起来很吓人,设计师没有接触过,不知道是什么东西,具体里面有哪些核心内容?其实说白了就是把人,机器和界面相融合,做到顺其自然,顺理成章,不要反其道而行,逆天反人类。

APP交互设计,需要注意五点事项

交互设计注意事项

1. 树形结构,做产品交互的逻辑关系就要像自然生长的大树,树干、树枝和树叶越往内部交互就要越少,不能在树叶上长了颗大树。

通常情况下很容易理解,交互设计与功能复杂度相联系,就像大树一样,界面展示一开始的时候是树根 树干 树枝和一片小树叶,功能点一点点变小,减弱。但是有时候我们在用app的时候会在一个很不明显的地方有一个大功能,就像发现新大陆一样,我不说这个对还是错,如果这个新大陆是一个很重要的功能点,那么做交互就要有新手引导,指引用户用这个功能,不然只有20%的用户会发现此功能,埋藏越深责用户点击率会越低。如果这个功能不是很重要那么可不可以换一种形式展现,减少功能点从一棵树变成一片树叶。

2. 大众交互,为了追求不一样而硬要改变的同时要做好新手引导。

交互的复杂多变会让用户摸不着头脑,一半用户学会这个功能需要交“学费”,要做到市面上最普遍的形式,不要因为不一样而变的不一样,如果非得要变就要把它变好,要好新手指引,不然改变了用户习惯,给那些“小白”用户造成困惑,甚至是流失很多潜在付费用户。

3. 错觉交互,利用人性的弱点扩大产品收入。

错觉交互是利用人们最正常的用户习惯来做一些用户不想做的事情,达到研发商的目的,通常利用这种情况最多的是付费,无意间骗取用户钱财,很多用户不会在意1元两元的费用打电话投诉或索要,就造成了很多研发商一款上线的产品会有大几百万的流水。

4. 深度交互

深度交互就是人机器界面又增加了机器的交互,比如:很多唱歌的app,当你录制歌曲的时候利用自带的耳机录制音乐效果会很差,不会让歌手发挥更好就自己研究了一款麦克风,用手机这款app要配合一款外接一款机器才能达到最理想的效果

5. 本质交互

“顾客是上帝”一定要分析用户。每个项目的实用性和交互性不是在给某一个老板或者哪个制作人用,不能按照他们的想法做出他们喜欢的东西,是给用户用。老板们用多年来的经验和阅历为依据在做事情,请不要忘记你的思想掌控不了用户,用户的思想你要研究甚至成为你的用户,不然总认为自己是金字塔上最高的人,指挥跟你混的人民战斗,不深入了解用户你指挥的永远是外走内不走,行尸走肉一般

举例子

直播类的APP交互汇总

1. 手指从左往右滑动屏幕时可以观看全景视频。APP交互设计,需要注意五点事项

2. 当手指上下滑动的时候可以切换视频人物,更换他人展现。

APP交互设计,需要注意五点事项

3. 当手指在屏幕上从右向左侧滑动时会退回到上一级页面APP交互设计,需要注意五点事项

4. 当手指点击点赞按钮时会出现很多点赞的图像

APP交互设计,需要注意五点事项

5. 当手点击屏幕任何地方的时候都会出现新型图案,并且新型图案会放大会爆裂

APP交互设计,需要注意五点事项

6. 当点击个人中心按钮时会出现竖半屏的设置栏

APP交互设计,需要注意五点事项

除直播间其它页面

1. 点击下方的导航栏按钮会有放大缩小动一动的效果

APP交互设计,需要注意五点事项

2. 在首页手指在屏幕上左右滑动时上面导航栏会左右切换,并且伴随放大缩小

APP交互设计,需要注意五点事项

3. 点击首页或者主页面左上角按钮时会有些变化并且能跳转其它页面

APP交互设计,需要注意五点事项

4. 在加载页面时,头像图片会有一个从小到大的变化

APP交互设计,需要注意五点事项

5. 在加载一个页面向下滑动时,漏出的部分会有小动画增添趣味性

APP交互设计,需要注意五点事项

6. 当在个人中心页面点住背景图向下滑动,背景图会随之放大

APP交互设计,需要注意五点事项

7. 人物列表的左上角有一按键,点击后人物列表会像抽屉一样一次排列退出展现其它页面

APP交互设计,需要注意五点事项

8. 点击人物列表会出现编辑人物功能

APP交互设计,需要注意五点事项

总结

基本上也就这些交互效果,其它的小的变化根据不能的产品会有些不同,这些交互展现把市场上比较流行的直播软件汇总。当我们研发某一类App的时候,就要把市场上这一类App的交互整合起来,在其中挑出自己想要的那几种,不但能增长知识含量也具有了很强的说服力。

欢迎拍砖分享。

 

作者:浩瀚,微信公众号:gh_72379020ae2a 互联网创业的坑

本文由 @浩瀚 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/26049/

(0)
CatherineCatherine
上一篇 2017-05-13 03:40
下一篇 2017-05-13 05:51

相关推荐

  • 电视交互设计的一些事 | 设计基础15

    两年前,我总结过《Apple Watch交互的一些事》,简单的分享了下手表小屏幕的交互设计。而在过去一年多的时间里,我有幸参与了电视端大屏幕的项目,在不断的尝试、探索和设计中,也收获了一些关于电视端的设计经验,因此将这些“电视交互设计的一些事”分享出来,共同探讨电视端的设计。✨硬件+远距离操控——基本交互基于桌面资料研究以及设计经验,总结了基本交互主要包含以下几个关键内容:遥控器输入、导航和菜单、信息展现、控件摆放和焦点状态。一、 遥控...

    2018-01-30
  • 交互设计的用户行为模式十二项

      安全探索 方便用户进行探索和尝试,支持多级撤销, 即时满意 让用户立即完成一个任务,给他们信心。 满意即可 人们不愿意付出哪怕一点点多余的思考,给他们他们熟悉的模式元素,让他们熟悉环境,可已立即上…

    2015-01-21
  • Adobe XD 中文汉化包 - UI/UX design in Adobe Experience Design

    Adobe XD 中文汉化包 - UI/UX design in Adobe Experience Design

    2016-03-30
  • 浅谈如何从零学习成优秀的交互设计师

    浅谈如何从零学习成优秀的交互设计师 本文全系列满满干货,是从众多交互设计前辈们分享的宝贵经验里挑选出的最实用的方法,不仅能让你彻底了解交互设计,还能帮有志在这个领域发展,却苦于没有老师的童鞋,从零开始…

    2014-12-23
  • 交互设计七大定律之The Law Of Proximity 接近法则

    最近在整理交互设计七大定律,发现了这篇老文,内容很精彩,翻译下与大家分享。 最近在整理交互设计七大定律,文章要系统的看。 目录:【交互设计七大定律】关于交互设计法则“除非有更好的选择,否则就遵从标准——交…

    2015-08-27
  • 设计一个界面动效时,需要明确价值、遵循原则和实现交付

    坦白来说,虽然我之前在项目里做过一些小动效尝试,但一直没有什么系统的方法和原则指导,大多在原型软件里凭「感觉」随意调调了事,而说不清楚为什么要做成这样。刚好最近有在和团队的小伙伴们一起进行动效设计的研究与实践,对动效设计的价值、原则和实现交付开始有了更多的了解,在本文中浅薄地总结一下。

    2017-05-12
  • 如何改善产品 UX 设计,这 5 条原则也许能帮到你

    本文编译自Medium,作者 Clark Wimberly 是一位用户体验(UX)设计师。

    2017-06-04
  • 新版MATERIAL DESIGN 官方动效指南(三)

    新版Material Design 官方动效指南已经翻译到第三章了!今天这部分,从动效的运动和材料形变入手,让你的动效自然真实,贴近现实状态。再系统的干货都比不上官方的动效指南,西瓜就在这,赶紧来捡。

    2017-05-23
  • 设计切实可靠的UI,为你的用户做决策

    真实可靠的UI是产品可信。“大量的选择并不能让人们选择所有东西,并且人们在选择的时候会不开心。”“每一个额外的选择都会导致做决定所需的时间变长。”“我必须要简化我的生活,因为除了思考如何更好的服务社会之外,我必须尽可能少的做决策。—— 马克·扎克伯格”“这就好比你最好的朋友每周都会为你准备一个个性化的音乐合集一样”“Facebook希望为点击很多链接的人提供更多的链接,为观看很多视频的人提供更多的视频,以此类推”“Facebook并没有显示所有的帖子。展示给你的都是被选择过的信息。可有趣的是,Facebook的算法会倾向于加强你哪方面想要的呢?因为这个必须要在之前就定义好。”“假如说你来到伦敦,你定了一个Hailo的车,而你在上午七点到十点之间进入了一个特定的位置。如果你到下午五点了仍然在那里,那么就可能会出现你想要离开的假设,这个时候Google Now就会提醒你订车。”“亚马逊将疑问从‘我需要这个吗’转移到了‘我还需要什么来填满这个盒子’”

    2017-05-09
  • Axure产品原型在手机上运行的完整教程

    图1 模拟丁香园的高保真原型在一般的开发工作之前,我们通常会设计产品原型,大部分为axure绘制的线框图作为产品的PRD文档,供UI和开发进行前期工作,但是有的时候客户、领导想在开发之前,看到产品的概貌,就必须做产品的高保真原型进行模拟,这时如果做出来的原型能运行在手机端,那再好不过,如图1(注:上图是仿照丁香园的家庭用药,做的一个高保真原型,算是免费给丁香园打广告,是不是考虑给我点广告费?哈哈)。原型制作软件有挺多,不过个人使用之后,...

    2018-03-06