AI PRODUCT DESIGNER · DESIGN ENGINEER

From idea to production.

I design products.

Selected work

The problem wasn’t clicking “Allow”.
It was having to stay there just in case.

AI workflows keep pausing for confirmation requests.

AI Auto Confirm desktop panel showing four workflow states

一个面板，不同状态，尽量少打扰。

正常运行时保持安静；需要用户判断时才出现审批请求；危险操作默认拦截；通知与浏览器配置则被收纳到次级流程中，不干扰核心使用路径。

默认安静运行：安全操作在后台自动处理，不需要用户介入。

当前会话标题ChatGPTChrome

●　运行中 . . .已自动处理 3 项

Claude Code & Codex−　□　×

> Analyzing codebase ...

Planning changes ...

> Creating files ...

> Updating dependencies ...

> Running tests ...

> Refactoring modules ...

Executing: npm install

◉ Paused

Built 01

https://thefourth.xyz/

THE FOURTH CARD

今天吃什么、喝什么、要不要联系他，
那些你反复权衡、迟迟下不了决定的问题，都可以交给第四张牌。

产品设计界面设计前端实现AI体验

进入体验

Built 02

GONGZEI

桌面插件

一个会陪你记录摸鱼、计算下班倒计时、生成今日总结的桌面小工具。

DesktopProductivityElectronFun

GitHub

自动记录

识别工作/摸鱼状态，让时间分配更清楚。

下班倒计时

把等待下班这件事，做成一个有反馈的小仪式。

AI 日报

自动汇总今天做了什么，减少收尾负担。

让每天的时间被看见,也让下班更值得期待。

LianShan UI / Components / Tabs

组件文档

Tabs 标签页

选项卡切换组件。提供平级的区域将大块内容进行收纳和展现，保持界面整洁。

使用: import Tabs from '@lianshan/ui/Tab'

基本用法

默认选项卡样式，下划线指示器跟随选中项滑动。

禁用

禁用某一项标签。

滚动

标签数量较多时，可以滚动并显示左右切换箭头。

import Tabs from '@lianshan/ui/Tabs';
import Tab from '@lianshan/ui/Tabs';
const [value, setValue] = useState(0);
<Tabs value={value} onChange={(e, v) =>
setValue(v)}>
<Tab label="标签一" />
<Tab label="标签二" />
<Tab label="标签三" />
</Tabs>

Value onChange variant centered orientation textColor indicatorColor scrollButtons

当前选中值切换回调展示模式是否居中标签方向文字颜色指示器颜色滚动按钮显示方向

-- -- 'standard' false 'horizontal' 'primary' 'primary' 'auto'

FIG 0.1

连山 · 工业智能平台

面向制造业复杂业务场景的工业智能产品，从高密度信息架构到核心工作流，探索复杂系统如何保持清晰与高效。

View Projects

FIG 0.2

理想 · 售后维修助手

面向售后维修场景的智能辅助工具，围绕故障描述、诊断分析与维修决策，重新组织复杂信息与操作流程。

View Projects

FIG 0.3

过往作品集

收录 Dmail、返佣平台、邮箱产品等项目，记录我在不同业务、不同产品形态中的界面设计与产品体验实践。

View Portfolio

Complex ideas,
made visible.

From system architecture to technical illustration,
turning abstract products and technologies into
clear visual anguage.

You’ve seen my work.
Now ask me anything.

Ask about my projects, process, skills, or how I turn ideas into working products.

ABOUT ME

Hello，我是sheep

一名UI设计师
也用代码让想法真正落地。

我从想法到上线参与AI产品的设计与实现,把产品思维、UI/UX前端开发与视觉表达结合起来,让复杂的需求变成清晰、可用的产品。

设计

产品设计 · UI/UX · 视觉系统

构建

前端开发 · 原型实现 · AI工作流

上线

产品设计 · UI/UX · 视觉系统

目前正在探索AI在更多场景中的产品形态,构建有真实价值的AI工具。

联系我

Git HuP

Now ask me anything.

了解这些设计与产品背后的思考、决策和实现过程。

From idea to production.

The problem wasn’t clicking “Allow”.
It was having to stay there just in case.

一个面板，不同状态，尽量少打扰。

默认安静运行：安全操作在后台自动处理，不需要用户介入。

一个面板，不同状态，尽量少打扰。

需要时再提醒：需审批操作会被主动提到前面，让用户快速允许或拒绝。

一个面板，不同状态，尽量少打扰。

危险操作直接拦截：高风险行为默认拦截，不能在当前流程中直接绕过。

配置不打断主流程

微信通知

配置浏览器

The best interaction is the one you don’t notice.

Built and Shipped

THE FOURTH CARD

GONGZEI

自动记录

下班倒计时

AI 日报

Components, Built for Production

Tabs 标签页

基本用法

禁用

滚动

LianShan Japan Website

Different products. Different problems. One design practice.
A selection of product work across AI, enterprise systems,
automotive services, communication, and more.

连山 · 工业智能平台

理想 · 售后维修助手

过往作品集

Complex ideas,
made visible.

You’ve seen my work.
Now ask me anything.

一名UI设计师
也用代码让想法真正落地。

Now ask me anything.

From idea to production.

The problem wasn’t clicking “Allow”.It was having to stay there just in case.

一个面板，不同状态，尽量少打扰。

默认安静运行：安全操作在后台自动处理，不需要用户介入。

一个面板，不同状态，尽量少打扰。

需要时再提醒：需审批操作会被主动提到前面，让用户快速允许或拒绝。

一个面板，不同状态，尽量少打扰。

危险操作直接拦截：高风险行为默认拦截，不能在当前流程中直接绕过。

配置不打断主流程

微信通知

配置浏览器

The best interaction is the one you don’t notice.

THE FOURTH CARD

GONGZEI

自动记录

下班倒计时

AI 日报

Tabs 标签页

基本用法

禁用

滚动

连山 · 工业智能平台

理想 · 售后维修助手

过往作品集

一名UI设计师也用代码让想法真正落地。

Now ask me anything.

The problem wasn’t clicking “Allow”.
It was having to stay there just in case.

一名UI设计师
也用代码让想法真正落地。