《自己动手做交互系统》——1.1 项目简介和背景知识

简介:

本节书摘来异步社区《自己动手做交互系统》一书中的第1章,第1.1节,作者:徐皓祎,更多章节内容可以访问云栖社区“异步社区”公众号查看

1.1 项目简介和背景知识

本章将初步介绍有形交互及其应用领域。在开始制作前,我们会向读者介绍适合自己的硬件,并熟悉它的工作原理和使用方法。最后,我们将介绍如何使用这个工具玩一个线上小游戏。

1.1.1 欢迎来到交互世界

在使用各种电子设备时,我们都要通过用户界面来操作设备与系统。我们可以通过按钮或者选项来告诉设备我们的决定,也可以通过语音或手势更精确地操纵设备,引导设备帮助我们完成工作。

随着计算机运算能力的提升,在未来,我们将会把数字系统应用到日常的生活场景中去。在这一前提下,机器的用户界面不仅仅是停留在屏幕上的线上信息。我们所使用的日常用品乃至场景本身,都可能成为交互界面。将线上信息与真实世界统一到一起,是未来交互发展的方向之一。

有形交互的任务即是解决这一问题。

有形交互试图将线上信息与现实世界相结合。例如,我们在移动目标物体时,不是按下象征向右移动的按钮,而是直接向右移动一个真实的物体。

使用有形交互的形式,计算机的操作方式将会更为自然,原本的虚拟世界也能在现实世界中得到真实的体现。以下是有形交互的几个实用案例。

3034e5f69c2fbd1e50178dffc57ef8b4c28e8c8b

3D模型投影inFORM诞生于MIT媒体实验室。用户可以远程操控变形表面,让小球来回滚动,甚至将小球捧在“手心”。

634dee893a009148b8244155b273b48442b692ac

明和电机设计的音乐蝌蚪是一款电子乐器。让蝌蚪张嘴,便可以发声。手指在蝌蚪的尾巴上滑动,可以控制音调的高低。

有形交互与图形界面:ReacTable

186948032fd74148980ed14725e4a3d38a1328f3

ReacTable是一款适合现场演出的合成器。通过移动模块或点击桌面,演奏者可轻松进行操作。

1.1.2 硬件介绍

本书将围绕有形交互这一概念,进行玩具、游戏和交互系统的制作。在制作这些项目时,我们需要使用Makey Makey或具备同等功能的硬件。请您根据实际情况采购适合自己的硬件设备。

1.Makey Makey

f7609fe06b99f520b4f8605df3fa33e4f06c4615

Makey Makey诞生于MIT媒体实验室,是一款可以模拟键盘和方向键、鼠标的电路板。使用这个硬件的乐趣在于,你可以赋予任何导电物体交互功能。

优点:即插即用,兼容Windows 与 Mac。

   硬件操作无需代码,适合新手。

缺点:接口不牢固,使用时要小心。

对象:初学者

2.酷乐宅

88e3fe108249d1b777c7f0574577d49ee84ecf0a

这是本土化的Makey Makey。个人条件允许的情况下,还请多多支持国货。

优点:无需编程。

   比原版多了两个字母接口。

   板子背后的原件被封在塑料外壳内,更好地保护接口。

   配套软件可以修改不同接口映射的键盘按键。

缺点:不兼容Mac。

对象:初学者

3.Arduino

ce2ada3602d449156d9688de83998611efc26bb7

对象:中高级电子玩家

因为Makey Makey的原型使用了Arduino Leonardo,所以如果你手头有Arduino,可以将其直接改装成Makey Makey。以我手头最原始的Uno板子为例,因为没有模拟键盘的功能,需要用FLIP更新USB固件,不过Leonardo不需要这个步骤。此外,市面上可以买到将Arduino改装成Makey Makey的扩展板,价格比较便宜。总之,Arduino不同型号硬件的改造流程不一定相同,请根据自己的实际情况来决定。

adfdd21aa7bff2bafaf92a1f5df4eca9a14ec7a8

1.1.3 硬件工作原理

不论是Makey Makey、酷乐宅,还是改装后的Arduino,它们的工作原理都是相同的。使用电路板上的两个接口测量人体的电容,我们就得到了一个电容传感器。同时,使用铝箔等导电材料,提升测量的敏感度。因此,我们可以把铝箔当作开关,像使用键盘一样按下某一个按键。当我们触摸铝箔时,电容数值升高。没有触摸时,数值会保持在较低的范围。我们可以设定一个阈值。阈值就是根据测量数值判断按键能否被激活的门槛。测量数值大于阈值时,键盘上的按键被触发。相反,测量数值小于阈值时,什么也不会发生。

1575e7d4b92e5d910fa78a744838c9c124d37f5c
相关文章
|
大数据 流计算 开发者
环境篇之项目背景介绍|学习笔记
快速学习环境篇之项目背景介绍
99 0
环境篇之项目背景介绍|学习笔记
|
小程序 API Android开发
小程序开发-第三章第四节点击查看大图,保存壁纸-全栈工程师之路-中级篇
小程序开发-第三章第四节点击查看大图,保存壁纸-全栈工程师之路-中级篇
127 0
小程序开发-第三章第四节点击查看大图,保存壁纸-全栈工程师之路-中级篇
|
Web App开发 移动开发 HTML5
【心得】Web设计师应参考的技术
导读:作者Paul是一位资深的Web设计师,他写了一篇文章《Stop obsessing over HTML5 and CSS3》。 文中他强调,作为Web设计师应该多多关注其他方面的业务,不能一味的追寻HTML5和CSS3。
925 0
|
Android开发
如何解决Android开发过程中缺乏UI素材的问题
如何解决开发过程中缺乏UI素材的问题 原则上来说,我们应该尽量把时间花在自己的专业开发上。但偶尔我们还是不得不面临需要UI素材问题,比如应付学校的项目作业,自己的个人开源项目,这些都是不太可能有UI设计师帮你完成的。
1417 0
|
数据可视化 定位技术 Android开发
可视化炫技利器诞生——VISLAB交互动画组件包发布,附详细介绍
VISLAB交互组件包的出现极大地拓展了DataV的展示与交互能力,本文作者—阿里云MVP陈琦将详细介绍此组件包的应用场景,并分享一些可视化数据分析案例与可视化心得。
4637 0