/ 翻页
Qincheng Smart Space · Redesign

亲橙智慧小程序
体验重构汇报

这一次,不止于视觉——从交互骨架到视觉语言的一次系统重构,让园区的服务与运营,被看见、也被用起来。

结构更清晰 能力更显性 视觉更有腔调

设计 / 王一 · 2026

01/ 11Intro
Background / Pain / Goal

改版,从三个真问题开始

小程序的角色正在变——它不再只是"查信息、办事情"的功能集合,而要承载园区的服务与运营。所以这次改版,解决的是三个结构性问题,而不只是界面好不好看。

现状 · 痛点
① 功能罗列,缺主次

服务平铺在金刚区,用户找不到重点,更像一个后台。

② 能力"沉在水下"

企业服务、活动、园区运营能力,用户几乎感知不到。

③ 园区面孔模糊

多园区共用一套面孔,切换路径也不够清晰。

本次 · 目标
① 结构更清晰

让服务与运营成为一级心智,找得到、用得上。

② 能力被看见

把沉在水下的园区能力,显性地表达出来。

③ 千园千面、体验统一

每个园区有辨识度,整体体验依然一致而稳定。

02/ 11Why
Interaction Structure · Overview

交互结构:把骨架重新理顺

交互层的改动归为三块,每一块都对应明确的结构动作——不谈概念,只看落点。

01

服务重构

金刚区收敛 · 服务独立成 Tab

02

能力被看见

企业服务 PGC · 活动独立 Tab · 资讯

03

园区空间

园区切换心智 · 云域导览 3D

03/ 12Structure
01 · Core Change

服务体系重构:让服务独立成 Tab

金刚区不再一屏堆满,服务被提升为独立入口,成为可持续运营的落点。

现状首页
改版首页
服务页
服务 Tab
金刚区收敛 · 可滚动扩展 按角色配置 · 千人千面 服务独立成 Tab · 一级入口
04/ 12Structure
02 · Enterprise Service

企业服务:让能力被看见

园区的运营能力再强,用户感知不到就等于不存在。企业服务这次的核心改动——让"真实的收益"替能力说话。

企业服务旧版
企业服务新版
02 · 企业服务

新增 PGC,真实获益更可信

PGC 真实客户反馈为服务背书——让真实收益看得见(如"恭喜超能科技成功申请 300 万政府补贴"),比自说自话更可信,也更有吸引力。

05/ 12Structure
03 · Operation

活动:独立成导航 Tab

把活动从"附属入口"升级为一级导航——园区的运营节奏,被持续看见。

活动页面
活动 · 一级导航

活动独立成导航 Tab

底部导航新增「活动」入口,强化"运营"心智——活动不再藏在首页深处,可被持续触达。

资讯 · 新增类目

新增资讯类目

园区资讯有了独立入口与专区,把园区的动态与内容持续传递给用户。

06/ 12Structure
04 · 05 · Spatial Perception

园区空间感知 · 切换心智

围绕"园区"本身——进得来、看得懂、换得清。

05 · 园区切换

定位自动匹配,切换更省心

按定位自动匹配最近园区(首次访客);员工 / 企业主默认常用园区、无需切换;并支持搜索与定位任意园区。

04 · 云域导览

一屏看懂园区

过去各园区各自做楼书、信息分散,访客进来 get 不到园区全貌;现在聚合园区配套、停车位等信息,用云域导览 / 3D 一屏看懂。

07/ 12Structure
Visual Language

方案一:
留白,营造秩序感

空间 温度 克制 极简 商务 留白

克制、不喧闹,只在关键处以一点高饱和点睛——安静,但有质感、有记忆点。

科技不该是冷的,园区也不只是办公楼,
而是一个朝着善意生长、有温度的社区。

首页样机

首页 · 新版样机

08/ 11Visual
Visual Detail · Key Screens

关键界面:空间 · 高级 · 温度

开屏
温度

开屏视频登录

视频背景,第一次触达就温暖、有吸引力。

banner
高级

首页画册 Banner

画廊般的陈列,一进来就是高级感。

导览
空间

园区导览 3D

专属地图指引,进园区就找得到目标。

服务
极简

全量服务聚合

左右分类,快捷定位想找的服务。

09/ 12Visual
Visual Detail · Craft

微观腔调:克制 · 活力 · 温度

金刚区图标
光影 · 稳重金刚区图标:橙金渐变 + 光影斜切,严肃但不端着的活力。
tab
克制

活动 Tab 品牌 logo

仅选中态显 logo,强透品牌,按 IP 高亮关键字。

按钮
活力

破形按钮

操作按钮破形,严肃但不端着。

便签
温度

PGC 拟物便签

便签质感,传递真实的温度。

资讯
温度

热点资讯手写字

手写"新鲜发现"作标题句号,一处呼应。

10/ 12Visual
Positioning · Self-assessment

这一版的定位

在「商务 ⇄ 活力」这条轴上定位——我这版明确偏 商务:克制、质感、腔调。

本方案 · 商务感最强
商务

克制 · 留白 · 腔调 · 偏 B、对大客户

互动

平衡点 · 有温度、不喧闹

活力

撞色 · 活泼 · 偏 C、对员工

※ 一条轴线定位:商务 ⇄ 活力不可兼得,互动居中;本方案明确偏商务。供三方案横向对比、评审打分。

10/ 11Position