唯一 / 新起点 / 灵感 / 一体化
SELECTED WORK / 品牌网站案例
CLIENT / 项目品牌
他山科技 TASHAN / 触觉感知技术 品牌官网
设计重塑价值 / Design that Reshapes Value
PROJECT / 项目观察
触觉芯片 / 触觉传感器 / 技术品牌官网
首页设计稿 / 机械手的形态、指尖细节与品牌表达。
他山科技的产品，很多都藏在指尖、夹爪或设备表面。它们接收接近、接触与受力的信息，再交给芯片、算法和软件处理。单看一个传感器的外壳，很难知道它究竟能感知什么。
这个官网要介绍的，既有可以安装到设备上的硬件，也有处理触觉信号的技术和工具。产品外形、接触时发生的变化、软件中出现的数据，需要放在一起看。
PROJECT PERSPECTIVE
外壳相近，感知方式不同
页面沿着感知过程展开：先让人看到指尖与物体的关系，再介绍芯片和信号，随后进入产品与应用。每一层补充的信息不同，也为不同阅读深度留下了入口。
/01 ONEW / PROJECT NOTES
TACTILE SENSING
接近、接触、受力，分别怎么呈现
“触觉”不是一个静止的产品卖点。物体还没碰到手指、刚接触到表面、被夹紧或开始滑动，传感器面对的情况都不同。页面需要给这些差别找到具体的画面。
首页的技术规格采用大小错落的卡片。指尖上的蝴蝶对应轻微受力，两只手之间的间距对应接近感知，材料与表面细节则提示触觉识别的对象。读者可以先从画面理解现象，再看数字和说明。
设计稿 / 不同能力对应不同的视觉对象，数字作为第二层信息出现。
这些卡片没有使用一套完全相同的配图。蝴蝶的轻、指尖之间的距离、芯片的结构，分别承担不同的解释工作。深浅背景也把画面分成几组，避免一屏规格变成六段同样重量的文字。
动作，比一张静物图多说一层
技术页又把抓取过程拆成“抓取、移动、递交”。抓住之后能否稳定移动，交给另一个人时怎样变化，都是连续动作里的问题。按照动作阶段介绍，技术描述就有了可以跟随的顺序。
首页机械手的指尖细节也在做同一件事。主体保持清楚的轮廓，局部纹理则把视线引向接触的位置。品牌大字退到背景里，产品与接触区域仍然是画面主角。
画面中的蝴蝶、光效与传感范围属于解释性视觉；卡片参数来自项目原页面及设计稿，不代表本文进行了独立性能测试。
/02 ONEW / PROJECT NOTES
CHIPS & SIGNALS
先分清芯片，再看信号怎么表达
触觉芯片的差别，很难只靠几张外观图讲清。芯片系列的页面先把“红宝石、红水晶、雨花石”作为明确的阅读入口，再展开当前条目的介绍。名称、选中状态和说明文字保持在同一侧，视觉图放在另一侧。
设计稿 / 芯片名称与当前说明保持相邻，右侧使用芯片结构的概念表达。
这里有两种阅读速度：快速浏览时，可以先辨认系列与当前选项；需要进一步了解时，再读展开的内容。页面没有把所有芯片说明同时铺开，也没有让一张芯片渲染图承担全部技术解释。
架构图说明关系，界面展示输出
R-SpiNNaker 的部分换了一种画法。带有层次的网络结构、连接线和标注，用来提示系统内部的组织关系。它不是产品实拍，更适合帮助读者先建立一个结构上的印象。
设计稿 / 上方是架构的概念可视化，下方展示触觉信号的不同界面表达。
向下看，抽象结构接到了热力图、曲线和传感阵列等界面。接触位置、变化趋势和不同通道的数据不再共用一种图形，各自保留了适合的观看方式。
架构与界面放在前后两层，技术说明就有了落点：前者讲系统如何组织，后者展示信号可以怎样被观察。界面在这里用于介绍软件呈现方式，并不意味着读者能直接在官网操作一套在线监测系统。
/ WATCH THE EXPERIENCE
TASHAN × ONEW
/03 ONEW / PROJECT NOTES
PRODUCT RANGE
选型要看的，不止是外形
进入产品页，问题从“能感知什么”变成了“怎样装到我的设备上”。指尖与夹爪的接触面不同，独立单元、协同单元与阵列的排列方式也不同。外观图先交代形态，但不能代替选型信息。
 |  |
 |  |
 |  |
官网产品原图编排 / 指尖与夹爪传感器的不同形态。
当前产品页把型号、结构形式、三维力、接口、法向与切向分辨率、接近感知等字段放在产品图附近。读者不用从一段介绍里找规格，能沿着同一组字段逐项查看。
让图片与字段各司其职
图片适合辨认轮廓、接触面和单元布局，字段适合确认接口与能力范围。两部分相邻，既能看见产品，也能找到继续判断的依据。对于外形相近的小型器件，这种分工比放大渲染图更重要。
不过，表格不是越满越好。数字需要带着单位和适用条件一起读，详细技术判断仍然要回到产品资料。官网先让人辨认系列与差别，再把更深入的确认留给后续沟通。
/04 ONEW / PROJECT NOTES
DATA & TOOLS
传感器之后，还有采集与训练
他山的产品介绍没有停在单个器件。网站还列出了视触觉相关的训练、采集设备，以及数据处理与仿真工具。对于开发者，这些内容回答的是另一个问题：硬件装好之后，接触过程怎样记录，数据又往哪里去。
TS-VT 的画面把夹爪、被抓取的物体和受力可视化放到一起。物体的位置与彩色信号区域存在对应关系，读者能先看懂数据来自哪一次接触，而不是面对一张孤立的软件截图。
设计稿 / 夹爪、接触对象与信号区域共同说明采集过程，属于系统的视觉演示。
工具入口要具体
网站把记录、标注、清洗、导出等环节写进相关产品说明，也为触觉仿真平台提供了 MuJoCo 与 NVIDIA 平台的项目入口。内容从“我们有这项能力”，继续走到了“可以去哪里了解和使用相关工具”。
这与首页的品牌表达是不同层次的工作。首次了解的人可以停在概念与画面，带着开发需求的人则需要识别系统名称、数据环节和外部工具。把它们分开，品牌页就不会变成一整页工具文档，工具也不必藏在一句笼统的介绍里。
/05 ONEW / PROJECT NOTES
APPLICATIONS
从指尖到座舱，接触的任务变了
机械手的抓取最容易让人想到触觉，但它不是网站展示的唯一场景。服务机器人、汽车座舱、设备表面和家电内部，对“感知接触”的要求并不相同。应用页需要说清任务，而不是换一张行业配图。
设计稿 / 场景类别与对应画面并置，机器人手部用蓝色强调接触位置。
机器人应用先给出工业、服务、生活与创新等分类，再用具体动作承接。取放物品的姿态与手部细节，让人知道页面在讨论哪一类接触，也给后续了解相关产品留出方向。
同一套视觉，标出不同的感知位置
汽车部分把感知位置转移到座舱与车身。方向盘、座椅、智能表面等部位，对应离手检测、乘员感知与交互等不同任务。右侧场景图使用局部蓝色，而没有把整辆车处理成一个发光的科技物件。
设计稿 / 左侧说明应用方向，右侧突出感知部位；场景图为概念示意，并非客户落地实拍。
这类左右分区也保持了阅读秩序：文字说明应用是什么，图像交代大致发生在哪里，进一步的入口再负责带人往下看。家电液位感知、玩具识别等内容延续了这种从任务出发的介绍方式。
回到整站，蓝色贯穿机械手、芯片、界面与场景，但每个部分的画法并不相同。首页让人注意到接触，技术页解释感知与信号，产品页补足选型信息，应用页再交代实际任务。视觉的一致，来自共同的颜色与细节；内容的区别，则由各部分要回答的问题决定。
看完之后，读者应当能分清他山提供哪些器件、有哪些配套系统，以及这些技术可以用于什么任务。这比记住几句技术口号更有用，也是这套官网值得展开看的地方。
EXPLORE THE PROJECT / 项目地址
https://tashantec.com/
网站策划、设计与开发
ONEW / 品牌网站与数字体验
THE ONEW APPROACH
/01 业务翻译 /02 技术可视化 /03 品牌记忆
LET’S TALK / 项目咨询
项目咨询：jad@onew.design
onew.design
/ CONTINUE READING
往期项目
/01 品牌官网 / 行业机器人
灵锶智能 LINXAI
整机旋转与结构拆解，呈现灵锶机器人的本体形态与任务设备搭载方式。
灵锶智能 × ONEW核心｜机器狗我们上!
/02 品牌官网 / 模块化建筑
SHINEHIVE MODULAR HOUSE
型号对比与在线配置，呈现模块化房屋的空间、规格和选配方式。
SHINEHIVE × ONEW核心 | 建筑建材出海官网
/03 品牌官网 / 空间设计
戈多设计 GODOT DESIGN
大幅空间影像与两种案例视图，呈现空间作品和团队经验。
戈多设计 × ONEW核心｜空间作品的线上展陈DESIGNED TO BE UNDERSTOOD / ONEW
