物联网需要什么样的UI交互方式?

简介: 物联网(Internet of Things,缩写:IoT)是基于互联网、传统电信网等信息承载体,让所有能行使独立功能的普通物体实现互联互通的网络。

> 来源 | HaaS技术社区

不看这几篇好文,就别说自己了解物联网

物联网

1991年由美国麻省理工学院( MIT )的Kevin Ashton教授首次提出物联网的概念。

物联网(Internet of Things,缩写:IoT)是基于互联网、传统电信网等信息承载体,让所有能行使独立功能的普通物体实现互联互通的网络。

说到物联网的UI交互方式,就不得先提一下移动互联网UI交互方式。

移动互联网

最近10年的手机芯片高速发展,同时伴随着显示屏幕、摄像头、4G/5G移动网络的快速普及,移动互联网不是简单的在手机上延续PC互联网的交互方式,而是进一步深化了个人对带屏硬件的交互方式,通过触摸交互方式,达到更直观的信息交互行为。

载体

交互方式

系统

PC电脑/笔记本

鼠标点击、按键,摄像头、麦克风

Window、Mac、Linux

智能手机

屏幕触摸、摄像头、麦克风

android、IOS

从上面一个最基本的对比,由于手机能将更直接的屏幕触摸替代鼠标点击,让每个人出门都不需要再携带笨重的鼠标,从而升华了设备和人的交互。

下面为IOS/android上比较常见的几种屏幕触摸交互

![image.png](https://ucc.alicdn.com/pic/developer-ecology/b38fa7502652481dbf7b1ff9a03f8c5c.png)

物联网的交互方式

上面也提到物联网覆盖的领域特别广,从而导致其交互方式千变万化,下面先针对详细讲解一下其领域中的交互方案

载体

交互方式

系统

穿戴手表

屏幕触摸、麦克风

android、RTOS

教学平板/点读笔

屏幕触摸、摄像头

android、Linux、RTOS

商显广告屏

屏幕触摸 or 无交互

android、Linux、RTOS

工控机

屏幕触摸 or 按键

Linux、RTOS

智能面板

屏幕触摸 or 按键

Linux、RTOS

门禁&对讲

屏幕触摸 or 摄像头

Linux

从上个列表中也不难发现,只要是带屏幕的物联网设备,同时也比较难逃脱屏幕触摸这种最直接的交互方式,因此讲完最基本的物联网交互方式,那自然就会有对应的UI方案与其交互方式匹配。

以下为在IoT场景上新增的几种交互形态(触摸交互则不在这里体现了):

手势交互

手势识别属于隔空识别的操作模式,从安全性上较以往的按键交互、触屏交互有很大的提升,不会有按键操作可能出现的触电风险,也不会有触屏操作卡屏的较高几率

![image.png](https://ucc.alicdn.com/pic/developer-ecology/470e5f6dea054e1789ea3969595d35ca.png)

语音交互

语音就是人最自然的与IoT交互的方式,原因是什么呢?

因为人与人之间交互也一样,也是用语音作为最自然的方式人和机器也是可以做到这么自然流畅的交互。

语音交互是,即使是你在开着车,手不方便的时候,不看屏幕,不用触摸屏幕上的任何东西,也能够跟你的车交互。

下图是天猫精灵提供的语音交互能力

![image.png](https://ucc.alicdn.com/pic/developer-ecology/4fe0d5135ab64ca2b3add5d56e58811a.png)

物理网的UI方案

随着MCU高频高性能产品的推出,以及人际交互应用越来越多,使得很多产品可以以较低成本实现较为炫酷的显示效果。而越来越多的设备上数据可视化需求是GUI应用发展越来越快的根本原因。

GUI为人机交互提供了更直观UI的操作,尤其是对于一些智能化设备,使得设备操作更加简单易用。设备的联网通信给GUI提供了更多内容呈现的可能,设备厂商或内容服务商通过带一块显示屏,可以把更多的内容将会借助GUI呈现出来。

如今GUI主要的应用领域有智能家居、物联网、医疗、汽车、消费电子、工业等。其中消费电子是近几年来GUI需求增长最快的领域,当然其他应用领域也将会随着智能化终端的应用而带动GUI的发展。

随之而来的是,传统的直接基于目标设备的嵌入式GUI开发模式出现了开发周期长,开发成本高,开发门槛高等问题。考虑到GUI已经成为人与机器沟通的桥梁,且嵌入式系统对GUI的需求越来越高,而这一切均要求有一个开发效率高、可配置及美观的GUI支持。

由于android系统本身的UI方案比较成熟,下面表格主要讲解Linux 和 RTOS系统上的UI方案,以及部分对比内容。

UI方案

开发语言

资源开销

GPU支持

动画

图片解码

QT

C++(跨平台)

内存 > 10MB

支持

支持

BMP/GIF/PNG/JPEG

MiniGUI

C(跨平台)

500KB < 内存 < 4MB

不支持

支持

BMP/GIF/PNG/JPEG

LVGL

C(跨平台)

100KB < 内存 < 2MB

不支持

不支持

默认仅支持BMP,有转换工具

GTK+

C(Linux为主)

内存 > 10MB

支持

支持

BMP/GIF/PNG/JPEG

柿饼UI

JS为主,C++为辅

(RTT系统为主)

内存 > 800KB

不支持

支持

BMP/GIF/PNG/JPEG

以下简单介绍一下开源的3个UI引擎。

QT

完整的跨平台软件开发框架,实现了一套代码可以在所有操作系统、平台和屏幕类型上部署,从台式机、嵌入式系统到可穿戴设备、移动设备。

![image.png](https://ucc.alicdn.com/pic/developer-ecology/02077dfa9c834cbb9a598d15f1e82c57.png)

MiniGUI

MiniGUI 是一个自由软件项目。其目标是提供一个快速、稳定、跨操作系统的图形用户界面(GUI)支持系统,尤其是基于 Linux/uClinux、eCos 以及其他传统 RTOS(如 VxWorks、ThreadX、uC/OS-II、Nucleus 等)的实时嵌入式操作系统。

![image.png](https://ucc.alicdn.com/pic/developer-ecology/f81f0d59ea504c99bfde2e2a565e66c2.png)

Lvgl

littlevgl是一个小型开源嵌入式 GUI 库(简称LVGL),界面精美,消耗资源小,可移植度高,支持响应式布局,全库采用纯 c 语言开发,移植上手简单。

![image.png](https://ucc.alicdn.com/pic/developer-ecology/6a6520da03084aaea401b0b49a6b3043.png)

本领域技术发展方向

物联网领域芯片种类繁多,而可视化应用场景广泛,UI未来会向以下几个方向发展:

  1. 需要提供统一的UI框架,支持业务逻辑和UI界面可复用(例如:UI需支持不同屏幕的布局),支持多端部署;
  2. 支持可视化开发,减少开发者的工作量;
  3. 支持组件化、小型化,能适配不同的设备和资源需求;

提供完善的Native渲染方案,同时结合JS 热加载,热更新等特性,将用户从C/C++研发,逐步转换成JS应用 & 小程序开发。

更多精品好文

如何分析物联网设备问题,看懂这篇文章就够了

透过ALSA这层迷雾剖析AliOS Things音频框架设计

漫谈农业物联网与互联网技术的结合

传感器,物联网时代的智能硬件数字化入口

如何快速搭建一个像“天猫精灵”的智能语音助手?

物联网之IP Camera解决方案简介

从语音交互历史浅看它是否会是物联网行业的一个爆点?

带你走进多媒体世界:视频文件是怎么播放出来的

物联网云端一体AI方案的探索

物联网设备连接的下一个引爆点:4G Cat.1

物联网教育现状和前景

一文看懂蓝牙在物联网中的应用场景

下一个智能硬件爆品是什么?

华为、阿里、小米都在用的全屋智能技术

为什么物联网领域使用Rust的项目越来越多?

开源硬件的前世今生

物联网碎片化的一些思考

边缘计算在物联网行业的应用

物联网太难 ? 不妨试试用Python来开发

5G会给物联网行业带来哪些变化?

必须要了解的物联网安全知识

ARMv9能给ARM带来新一轮腾飞吗?(安全篇)

ARMv9能给ARM带来新一轮腾飞吗?(人工智能篇)

国产物联网操作系统的出路在哪里?

RISC-V架构能否引领物联网时代?

物联网到底为什么这么火?

谁才是物联网连接技术中的王者?

物联网平台大量出现能否将行业带入爆发式发展

脚本语言适合物联网开发吗

从“嵌入式”到“物联网”的四大转变

物联网发展新趋势

相关实践学习
阿里云AIoT物联网开发实战
本课程将由物联网专家带你熟悉阿里云AIoT物联网领域全套云产品,7天轻松搭建基于Arduino的端到端物联网场景应用。 开始学习前,请先开通下方两个云产品,让学习更流畅: IoT物联网平台:https://iot.console.aliyun.com/ LinkWAN物联网络管理平台:https://linkwan.console.aliyun.com/service-open
相关文章
|
7月前
|
人工智能 物联网 编译器
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
234 11
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
|
6月前
|
开发框架 前端开发 JavaScript
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发一
本文介绍了方舟开发框架(ArkUI)及其两种开发范式:基于ArkTS的声明式开发范式和类Web开发范式。ArkUI是用于构建HarmonyOS应用界面的UI框架,提供极简UI语法和基础设施。声明式开发范式使用ArkTS语言,以组件、动画和状态管理为核心,适合复杂团队协作;类Web开发范式采用HML、CSS、JavaScript三段式开发,适用于简单界面应用,贴近Web开发者习惯。文中还概述了两者的架构和基础能力,帮助开发者选择合适的范式进行高效开发。
222 15
|
6月前
|
编解码 前端开发 Java
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发三
本文介绍了基于声明式UI范式的图形绘制与动画效果实现方法,涵盖绘制图形、添加动画效果及常见组件说明三部分内容。在绘制图形部分,详细讲解了如何通过Circle组件为食物成分表添加圆形标签,以及使用Path组件结合SVG命令绘制自定义图形(如应用Logo)。动画效果部分则展示了如何利用animateTo实现闪屏动画,包括渐出、放大效果,并设置页面跳转;同时介绍了页面间共享元素转场动画的实现方式。最后,文章列举了声明式开发范式中的各类组件及其功能,帮助开发者快速上手构建复杂交互页面。
253 11
|
2月前
|
存储 开发者 容器
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
本文介绍了ArkTS语言中的Class类、泛型、接口、模块化、自定义组件及状态管理等核心概念,并结合代码示例讲解了对象属性、构造方法、继承、静态成员、访问修饰符等内容,同时涵盖了路由管理、生命周期和Stage模型等应用开发关键知识点。
301 1
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
|
5月前
|
JavaScript 前端开发 UED
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发四
本文介绍了Web组件开发与性能优化的相关内容。在Web组件开发部分,涵盖创建组件、设置样式与属性、添加事件和方法以及场景示例,如动态播放视频。性能提升方面,推荐使用数据懒加载、条件渲染替代显隐控制、Column/Row替代Flex、设置List组件宽高及调整cachedCount减少滑动白块等方法,以优化应用性能与用户体验。
249 56
|
5月前
|
编解码 UED 开发者
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发之常见布局
本文主要介绍了自适应布局与响应式布局的相关内容。自适应布局部分涵盖线性布局、层叠布局、弹性布局和网格布局,详细说明了各布局的特性及使用方法,例如线性布局中的排列、拉伸与缩放,弹性布局的方向、换行与对齐方式等。响应式布局则重点讲解了栅格系统和媒体查询,阐述如何通过栅格组件和媒体查询条件实现不同设备上的适配效果。这些技术帮助开发者灵活应对多尺寸屏幕的设计需求,提升用户体验。
334 55
|
9月前
|
前端开发 安全 开发工具
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
608 90
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
6月前
|
存储 开发框架 API
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发二
本文详细介绍了基于声明式UI开发的健康饮食应用的设计与实现过程。内容涵盖从基础环境搭建到复杂功能实现的全流程,包括创建简单视图、构建布局(如Stack、Flex)、数据模型设计、列表与网格布局构建,以及页面跳转和数据传递等核心功能。 本文通过实际案例深入浅出地解析了声明式UI开发的关键技术和最佳实践,为开发者提供了宝贵的参考。
264 14
|
5月前
|
JavaScript 前端开发 开发者
09.HarmonyOS Next数据驱动UI开发:ForEach与动态渲染完全指南(上)
在现代前端开发中,数据驱动UI已成为主流开发范式。HarmonyOS Next的ArkTS语言和声明式UI框架完美支持这一理念,使开发者能够以更高效、更直观的方式构建复杂应用。
179 1

相关产品

  • 物联网平台