项目问题
工业材料网站常常拥有大量产品与能力信息，却缺少明确的采购顺序。访问者需要先判断材料类别、可加工能力和应用匹配，再决定是否进入询价；如果这些信息被平均铺开，页面越完整，采购路径反而越慢。
Case 04 / Industrial B2B Website Concept
把一卷钢，展开成一条采购路径。
面向不锈钢冷热轧卷板的工业 B2B 官网概念，以材料、加工、应用和 RFQ 为主线，让采购者更快找到判断所需的信息。
Mobile case story
手机端重新组织
手机端重新组织
采购判断路径。
材料、加工、应用和询价，按竖屏阅读顺序展开。
JZD 判断
首页不先讲企业规模，而先回答采购者的四个问题：你提供什么材料、能做什么加工、适合哪些应用、下一步如何询价。品牌识别负责建立专业感，信息架构负责降低判断成本。
可交互概念体验 / Interactive prototype
不只看页面，
不只看页面，
直接走一遍采购路径。
滚动查看最新的真实滚动与 WebGL 钢卷官网概念，包括材料筛选、加工能力、应用场景与询价路径。该体验为 JZD Studio 自主概念提案，不连接库存、报价或客户数据。
概念范围
品牌官网信息架构、首页、材料查找、加工能力、应用场景、RFQ 询价路径、桌面与手机端响应式界面，以及完整页面滚动体验。
概念结果
将 TSINGTONG 的不锈钢冷热轧卷板信息重组为一条连续路径：从材料与规格判断，进入加工和应用理解，最后抵达 RFQ。当前结果为自主概念提案，不代表真实库存、技术参数或已上线系统。
01材料先行
先让访问者确认冷轧或热轧产品方向，再进入下一层信息。
02规格路径
用可比较的结构承载等级、表面与尺寸，具体参数仍待项目确认。
03能力解释
把加工能力和应用行业连接起来，减少抽象设备清单。
04询价过渡
RFQ 只展示交互与字段结构，本概念页不会提交或保存数据。
先把采购入口说清楚。
首页以材料选择和关键行动开场，品牌、产品与询价入口在同一视线内建立关系。桌面端强调宽阔的工业秩序，手机端重新组织导航、标题和内容顺序，不依赖横向裁切。
从材料判断进入规格路径。
Material Finder 把材料类别与下一步筛选放在同一条路径中。这里展示的是结构设计，具体钢种、规格、表面、库存和交付信息需要在正式项目中由企业确认。
把加工能力讲成采购者能理解的语言。
加工页面不只罗列设备，而是让能力、工艺与应用发生联系。展示内容仅用于概念表达，不构成真实产线、加工范围或技术承诺。
用应用场景帮助采购者建立匹配。
冷轧可服务电梯、家用电器和厨具等方向，热轧可用于罐体、船板等场景。页面通过应用分类帮助理解材料方向，不把概念场景写成真实客户或已完成项目。
把静态页面连接成真实滚动体验。
页首保留约 42 秒的完整页面演示，覆盖页面切换、滚动节奏以及 Elevators、Tanks 两类应用场景；演示结束后接入 JZD Studio 品牌片尾，完整说明这套概念如何从首屏一路进入材料、加工、应用与询价路径。
这个概念说明什么
工业 B2B 官网的价值不只是显得专业，而是让采购者更快完成判断。JZD 在这个自主提案中把品牌识别、信息架构、响应式体验和询价路径放进同一套系统；真实技术与商业信息仍需在正式项目中确认。
手机端不是桌面图的缩小版。
导航、标题、材料入口与应用内容在窄屏中重新排序，保留完整信息并缩短操作距离。手机端首页负责快速进入材料路径，应用页负责把冷轧与热轧的使用场景讲清楚。
