童话说说技术创业美文职业
投稿投诉
职业母婴
职场个人
历史治疗
笔记技能
美文纠纷
幽默家庭
范文作文
乐趣解密
创业案例
社会工作
新闻家居
心理安全
技术八卦
仲裁思考
生活时事
运势奇闻
说说企业
魅力社交
安好健康
传统笑话
童话初中
男女饮食
周易阅读
爱好两性

经验总结:APP页面提示样式,选择合理的就好

7月23日 星宿房投稿
  最近做交互总结,又碰到了页面弹窗提示的问题,于是便总结了下。我按弹窗提示的样式分为了以下几种来进行说明。每种样式的提示强度不同,对用户在使用app时的打扰与影响也不同。这些提示并不是说哪种好哪种不好,按照自己的规范选择合理的就好。
  以下总结,前三个提示的名称是大家习以为常的,但后面几个的命名是以我个人的经验来命的,不一定很合理,但至少可以说明点问题。
  Actionsheet
  Actionsheet即为操作列表,通常用于在当前页面给用户提供快捷的选择按钮,用在功能较多,对次要功能进行收纳的界面中。
  Actionsheet的IOS与Android的展示样式有所不同。IOS主要是以我们所熟知的半覆盖式浮层,而Android以弹框菜单为主。如下图:
  iOS的半覆盖式浮层android的弹框菜单
  上图是app中最常见的样式了,当然也会遇到一些其它的样式,如在adroid中有时也会用到半覆盖式浮层,大多是用于分享到第三方的页面。
  还有一种情况是选择菜单与当前选项关系比较紧密,选择菜单直接原地展开,当前选项为选择菜单中的一项。如下图左边是ios的popper样式,右边是android的卡片菜单。但在实际应用当中,两个平台并没有很明显的区分,一般就通用成左图的样式了。但手机屏幕比较小,用这咱展示样式会很界面显得比较碎,所以在app的实际应用中,这种样式很少用到。目前大家熟知的app中,微博首页的分组用了这种方式切换,还有qq的v6。3。1版本的空间也带入了这种设计。
  iOS的popper样式android的卡片菜单
  Alert
  Alert即为弹框提示,也叫警示框,用于向用户提供警示,用户必须进行操作后才能进行下一步操作。主要用于系统向用户提示操作后涉及隐私、及其他非常重要的信息或后果不可逆的操作流程中。必须给出明确的操作按钮,主要以以下几种样式展现。为了引导用户操作,有时会强化某按钮,弱化另一按钮。
  常见的几种alert样式
  alert打断用户的操作,因此应减少其在app中的出现次数,同时也避免出现过多导致用户对alert不重视。
  还有一种alert提醒,在使用app时经常遇到的,同时也是很另人生烦的,那就是要求对app评价的alert。这种提醒,往往会打断用户的操作,如果出现时机不恰当,会让人产生很厌烦的感觉。这里提到它,是因为它下方的操作按钮,一般有三个,所以上下排列,这咱排列相较于左右排列,按钮间的间距比较小,所以也加大了操作失误的机率。所以一般情况下慎用这种排布方式。
  app引导好评
  Toast
  Toast即为浮层提示,快速地为用户显示少量的信息。
  Toast浮动显示信息给用户,它永远不会获得焦点,不影响用户的输入等操作,主要用于一些帮助提示。常用的有两种样式,纯文字的和带图的。
  常见的两种toast样式
  这种提示样式是最常见的,能够告诉用户目前的状况,但又不会对用户造成太多的干扰,一带而过。同时这种提示也是比较容易被忽略掉的,所以对于一些比较重要的提示最好不要用这种样式。
  页面文字提示
  这也是一种比较常见的提示,主要用于对页面内容或是某个输入框或按钮进行说明的文字。一般以淡而小的文字存在于页面上,对用户的操作影响比较小,提示性比较弱,仅仅是对当前位置的说明,不会影响页面的视觉焦点。
  如下图是支付宝蚂蚁花呗的首页,红框中的文字是对前面描述的进一步说明,不影响视觉焦点,看下月应还金额时才会看到它们。在输入界面这种提示比较多见,如注册界面密码规则的提示语等。
  支付宝蚂蚁花呗
  页面顶部的提示
  位于页面顶部的提示,有三种样式,这三种样式表达的轻重性不一,所用场景不同,对用户的打扰程度也不同,是其它提示样式的一种变体。
  第一种:一直存在于页面顶部,用于重要的提示或是没网这种严重影响操作的提示。
  如下图,没有网络时,qq顶部的提示。
  第二种:操作出错或是页面内容出错是从页面顶部滑下,之后马上消失,是toast的一种变形。这样的提示比普通toast提示更显眼些,更能引人注意到。
  第三种,位于电池条的位置,用于一些上传的地方,上传需要时间,又要保证APP的流畅性,削弱对用户的干扰,甚至把干扰减少至零。如发布动态时,后台上传,在最顶部提示,这种提示更弱,很容易被忽略掉。这种提示也越来越少见了,没找到图片,请允许我ps乱入一张。
  页面上的新功能提示
  一般用于第一次出现的页面,提示一些重要或是常用的功能,或是页面功能搬家的提示。这种提示一般常见的一有两种形式,突出重点的强弱性不同。
  如下图左边的页面,功能提示比较强,必须点击掉提示才可进入下一步操作。而右边的形式就弱了好多,可看可不看,不影响页面的操作。当然这样的功能说明的提示还可以从二者延伸出一些其它样式,但终归也就是必须看和无须看两种吧。
  必须看的功能提示无须看的功能提示
  特殊提示
  通过页面的变化进行的提示,不影响页面的整体布局,同时在用户操作的地方提示,不容易被忽略。
  支付宝的手势密码错误的提示是个很好的例子,通过头像的后退缩小,错误提示文字的出现,很好的提示了用户操作的错误。最常见到这种提示的地方还有登录注册页面,输入错误时,页面出现细小而精致的变化,同时很好的提醒用户。
  大体上最常见的提示样式都在这了吧,如有遗漏或是有更好的提示,后续更新。同时也欢迎小伙伴们砸砖。
投诉 评论 转载

百度糯米店铺设计思考:以用户思维去创造设计需求设计应该是创造新事物新方向的引导者,不仅要主动的思考产品和业务需求,更要通过用户思维去创造设计需求,给产品和业务带来更大的影响,给用户创造更多的价值。项目背景作为o……做交互方案时,请注意检查这4个点作为一名交互设计师,到底什么程度才能算得上是“专业”?成为一名专业的设计师是否有方法与捷径呢?答案是肯定的,但是今天我分享的内容还不敢称之为体系,只能说是几个小小的经验吧,希望……经验总结:APP页面提示样式,选择合理的就好最近做交互总结,又碰到了页面弹窗提示的问题,于是便总结了下。我按弹窗提示的样式分为了以下几种来进行说明。每种样式的提示强度不同,对用户在使用app时的打扰与影响也不同。这些提示……和用户谈一场甜蜜的恋爱:让产品吸引用户的3个方法今天我拿了一些美好设计的案例,跟大家分享,如何通过美学、诱惑和游戏等等手段来取悦用户,和用户谈一场甜蜜的恋爱。在以往大部分时间里,我们都关心怎样设计出让人明白又好用的产品……App加载动画知识体系:交互、视觉都需要掌握!我大胆预测了一下,以后App的加载动画都应该遵循越来越简洁的设计原则,突出内容,去掉无用的、过渡的形式设计。也许无文字提示的加载动画确实是一个流行趋势!对于视觉设计师来说……一个APP的视觉风格:配图是一个重要的,同时极易被忽略的点在我们常规意义上组成一个APP的视觉风格有几大元素颜色、交互元素、字体、阴影、ICON的图形等,但是有一个总容易被设计师们忽略的元素,它能给与用户一个非常直观的视觉记忆,大家却……设计师进阶:从UED向UXD转型UXD(Userexperiencedesigner)概念为何在当下越来越热?这个新Title对设计师意味着什么?UXD对设计师提出了怎样的新要求,设计师们又如何去转型UXD呢……百度地图:智能化设计探索,让出行更简单出行一直是地图用户的核心诉求。随着移动互联科技的飞速发展,越来越多的出行服务参与到地图用户的生活中,同时也使得用户的出行场景变得复杂多变。但传统地图的出行功能无论从产品还是从用……孟菲斯设计风:重回80年代,为网页注入迷人的设计风格复古一直在流行,这也是为什么过去许多设计趋势常常会沉寂若干年之后,又再次走到潮流的最前线。今天,我们要聊的是孟菲斯设计风(MemphisDesign),这种设计风格充满了80年……写给初学者:UI、UX、GUI新手科普指南这篇文章会跟各位伙伴简单介绍UI、UX跟GUI三者的差异,同时也会根据自身经验说明一些业界实际的需求状况,有任何问题欢迎透过留言一起讨论喔!关于UX(UserExperi……至纯至简手机百度8。0设计总结8。0是手机百度发展过程中一个重要里程碑,它不仅延续了产品建立以来的要点,打破历史包袱,与时俱进地从体验和产品角度进行了创新,通过全新的整体交互框架与视觉风格,将搜索、语音搜索……如何把产品思维应用在APP页面上产品思维的终极目标就是让产品经理和UI设计人员、交互设计师等建立卓有成效的合作关系,携手做出更好的移动端产品。当我们想起移动APP用户体验的时候,都会想到一款简……
我是如何从数据分析到用户研究再到产品经理的?产品设计应该做到什么程度?产品经理你的沟通的效率,将直接决定了做事的效率产品经理,这个功能你真的需要吗?9个要点,轻松提高产品经理的沟通能力一个令人高潮的产品应该有哪些细思极恐的细节?对于用户的“怒点”,产品经理该怎么办用户访谈,问几个为什么就可以了吗?从马斯洛需求理论的角度,看手机K歌app的产品需求数据分析的5个坑,你踩过几个?如何成为一名产品经理?这是我自学产品的8个方法从一次小型用户访谈中学到的四个亲身经验

友情链接:中准网聚热点快百科快传网快生活快软网快好知文好找作文动态热点娱乐育儿情感教程科技体育养生教案探索美文旅游财经日志励志范文论文时尚保健游戏护肤业界