作者都是各自领域经过审查的专家,并撰写他们有经验的主题. 我们所有的内容都经过同行评审,并由同一领域的Toptal专家验证.
迈卡·鲍尔斯的头像

弥迦书鲍尔斯

Micah通过品牌、插图和设计帮助企业建立有意义的联系.

专业知识

分享

当按钮被按下时,实际发生了什么? 我们有没有停下来思考一下我们正在激活的力量? “受压”状态蕴藏着如此多的潜力,如此多的可能性. 有些是平凡的,有些是惊人的,还有一些是如此邪恶,我们不能在这里发表.

今天,按钮 交互 名人. 产品团队为每一个状态、标签、颜色和圆角而苦恼. 精心设计的按钮有助于导航,促进转换,并改善用户体验. 纽扣是世界上最可爱的东西 设计 世界,但并非一直如此.

像许多物体一样 工业时代在美国,纽扣是默默无闻地诞生的. 几十年来,, 他们默默无闻地辛苦工作, 被虐待和忽视, 原料被我们的粘胶剂碾碎和捣碎, food-caked手指. 当然,也有例外. 一些耀眼的明星登上了全球舞台. 谁能忘记“播放”按钮这样的典范呢, 不祥的“世界末日”按钮, 或者史泰博旧广告上那个不可抗拒的“Easy”按钮?

按钮设计

除了这些异常之外,按钮几乎没有引起人们的注意. 不管. 无论晴雨,无论是否得到认可,他们只是做了自己该做的事情. 向下走,向上走,尽职尽责地发起各种各样的行动.

那么我们是怎么走到这一步的呢? 我们是如何从一个被遗忘的纽扣之地来到我们现在居住的这个郁郁葱葱、光彩夺目的纽扣香格里拉的?

从杠杆到语音命令——按钮简史

这可能会让人感到震惊, 但这个按钮的历史相对较短, 跨度在130-140年之间. 为了进一步了解,我们求助于Zendesk首席产品设计师Bill DeRouchey.

领域的博客 点击触摸 是充满了引人注目的侦探工作,照亮了曲折的背景故事按钮和他们融入社会. 但对于设计爱好者和纽扣狂热者来说,真正的瑰宝是他的演讲 按钮历史.

从19世纪90年代开始, 德鲁什思考了纽扣的哲学和人类学影响. 整个 演讲 值得注意的是,有一些更吸引人的观点值得强调:

  • 在按钮出现之前,我们生活在杠杆时代. 与杠杆, 我们可以看到一个动作(拉动杠杆)是如何触发类似的机械动作的, 我们可以根据这个得出最终结果.
  • 随着按钮时代的到来,运动被抽象化了. 这是人类历史上第一次, 最初的动作(按下按钮)可能会导致完全不同的动作. 根据德鲁希的说法, 这是人类感知周围世界方式的巨大转变, 按钮与一件事联系在一起——易用性.
  • 从19世纪90年代到50年代, 钮扣被宣传为一种让生活更轻松的方式, 快, 更方便, 我们在那个时期的消费品广告中经常看到这种情况.

UI按钮设计

  • 同时, 按钮面板被用来控制高度复杂的机器和自动化系统, 越来越多的人意识到,与按钮的互动需要特殊的训练. 在流行文化中, 按钮甚至被描述为过于混乱,造成压抑的工作环境.
  • 随着70年代的到来, 蓬勃发展的家庭视频游戏系统世界引入了简单, 基于按钮控制器, 按钮在我们的游戏心理中占据了一席之地.
  • 到了20世纪80年代,虚拟按钮出现在计算机界面中. 这些按钮仍然需要通过物理按钮(电脑鼠标)来控制。, 软件公司也不遗余力地解释用户应该如何与它们互动.
  • 随着20世纪90年代的互联网热潮,我们被引入了一种新的纽扣形式——无纽扣纽扣. 在线,任何图形元素(文本,图标,照片等).)可以变成一个可点击的链接. 大约在同一时间,进入2000年代,触摸屏技术变得越来越先进. 随着2007年第一款iPhone的发布, 表面触控按钮开始迅速普及.
  • 今天,我们生活在两个时代之间. 物理按钮比比皆是, 触控按钮比以往更受欢迎, 无按钮交互性的实例正在扩展到以前被忽略的对象, 空间, 和地方.

用户体验按钮

简单是按钮设计的目标

熵不会放过任何实体. 我们体验到像按钮一样的东西, 简单而纯粹的东西, 我们想要增加效果. 单个按钮变成了一排按钮, 变成一个按钮面板, 变成一个无限可点击选项的屏幕. 设计师 应该注意下面的信息图中的这种趋势,并记住按钮的力量一直是它的简单性.

触摸的力量——按键设计的演变

了解基本知识

  • 什么是UI按钮?

    用户界面(UI)是人与设备的计算机操作系统交互的点. 传统上,用户界面包含允许用户启动操作的按钮. UI按钮就是存在于用户界面中的按钮.

  • 为什么CTA很重要?

    在数字产品和网站中, CTA(行动号召)鼓励人们执行各种任务,如购买商品和服务或填写表格. CTA的措辞和位置很重要,因为它必须激起用户的需求感,并提供明确的行动方式.

  • 用户界面的关键元素是什么?

    用户界面元素一般有四个字段. 输入控件包括复选框和文本字段等元素. 导航组件包括搜索字段和图标等元素. 信息组件包括工具提示和通知等元素. 容器通常显示为手风琴.

  • 按钮状态是什么??

    在数字界面中,按钮通常被表示为小矩形或正方形. 当人们决定与按钮交互时,他们需要看到它是可操作的. 在他们的核心, 按钮状态(如启用), 徘徊, 按下)显示功能,当人们悬停在或点击一个按钮.

  • 什么是专注状态?

    当用户使用键盘或语音命令等替代输入法选择或突出显示按钮(或其他一些用户界面组件)时,聚焦状态向用户显示. 随着设计师寻找增加无按钮交互性的方法, 关注焦点的国家将变得越来越重要.

聘请Toptal这方面的专家.
现在雇佣
迈卡·鲍尔斯的头像
弥迦书鲍尔斯

位于 温哥华,华盛顿州,美国

成员自 2016年1月3日

作者简介

Micah通过品牌、插图和设计帮助企业建立有意义的联系.

Toptal作者都是各自领域经过审查的专家,并撰写他们有经验的主题. 我们所有的内容都经过同行评审,并由同一领域的Toptal专家验证.

专业知识

世界级的文章,每周发一次.

订阅意味着同意我们的 隐私政策

世界级的文章,每周发一次.

订阅意味着同意我们的 隐私政策

Toptal设计师

加入总冠军® 社区.