这半年身边不少设计师朋友开始用 Claude Code、Codex 这类 AI 编程助手。用法很简单,用大白话告诉它"帮我做个什么",它就会把代码写好。
把 Figma 里的作品集设计稿变成能在线访问的网页
把交互原型做成能点的 Demo,拿去给开发和甲方看
不过大部分设计师都卡在第一步:
配置
。教程里全是环境变量、配置文件,看两行就劝退了。
这篇换个思路,用一个叫
CC Switch
的图形化小工具,全程点鼠标就能配好,不用碰任何配置文件。文末简单提了一下我们自己的服务,不需要可以直接跳过。
常用的是 Claude Code 和 Codex,二选一或者都装。安装方法按官方文档来,一般是在终端里粘贴一行命令。终端就是 Mac 的「终端」app 或 Windows 的 PowerShell,第一次打开会有点紧张,其实只要复制粘贴就行。
可以理解为 AI 的"电费账户",用多少扣多少。可以用官方的,也可以用兼容的第三方服务,拿到两样东西就行:
API 地址
和
API Key
(一串 sk- 开头的字符,相当于密码)。
GitHub 上的开源免费工具,作用是
用图形界面帮你管理 AI 编程助手的配置
。你不用再去找配置文件放在哪、格式怎么写,填几个空就行。
在 GitHub 搜索 cc-switch 就能找到,在 Releases 页面下载对应系统的安装包,Windows 下载 .msi,Mac 下载 .dmg。
打开 CC Switch,在顶部选择
Claude Code
标签。如果要配置 Codex,就切到 Codex 标签,后面的步骤是一样的。
点击右上角的
+
按钮,打开添加供应商面板。列表里有一些预设好的服务商,用官方或者列表里有的直接选就行。用其他兼容服务的话,选
自定义
。
填写项填什么说明名称随便起,比如"日常用"方便自己区分API Keysk- 开头那串复制时注意别带上空格请求地址服务商给你的地址见下面的注意事项
【配图建议】添加供应商面板截图,三个输入框用红框标出
Claude Code 的地址一般
不要
在末尾加 /v1
保存后,在供应商列表里点
启用
。然后
关掉已经打开的终端,重新开一个
,再启动 Claude Code,就能用了。
CC Switch 名字里的 Switch 就是"切换"。你可以添加好几个供应商,比如一个便宜的、一个稳定的:
赶甲方的正式项目
:切到稳定的,别在交稿前一晚掉链子
配好后在终端里输入 claude 启动,然后直接用中文跟它说话。下面这几句可以直接抄。
先新建一个空文件夹,把作品图片放进去,在这个文件夹里启动 Claude Code,然后说:
帮我用这个文件夹里的图片做一个作品集网站。 风格:极简,大量留白,黑白灰配色,字体用无衬线体。 首页是作品网格,点开每个作品进入详情页。 要适配手机。做完告诉我怎么在浏览器里预览。
不满意就接着说:"标题字号再大一点""网格改成瀑布流""加一个鼠标悬停放大的效果"。你像给开发提需求一样跟它沟通就行。
【配图建议】放一张实际生成的作品集网页截图,效果最有说服力
写一个 Photoshop 脚本: 把当前文档里每个画板单独导出为 PNG, 文件名用画板名称,导出到桌面的"导出"文件夹, 同时再导出一份 @2x 的版本。 告诉我这个脚本在 PS 里怎么运行。
写一个 AE 表达式,让文字图层像打字机一样逐字出现, 每个字间隔 0.05 秒,带一个闪烁的光标。 告诉我这个表达式要加在哪个属性上。
这个文件夹里有几百张切图,帮我: 1. 全部压缩,尽量不损失画质 2. 文件名里的中文和空格改成英文和下划线 3. 按 icon、banner、bg 前缀分到不同子文件夹 先给我看一下处理计划,我确认后再执行。
最后一句"先给我看计划,确认后再执行"很重要。涉及改文件、删文件的操作都建议加上,避免它直接把原图改了。
处理前最好也先备份一份。
遇到的情况大概率原因怎么办提示 401 / 认证失败API Key 没复制完整,或者多了空格回 CC Switch 里重新粘贴一遍提示 404请求地址末尾的 /v1 多了或少了按上面的规则改一下提示找不到模型模型名称写得不对去服务商的模型列表里复制准确名称切换了供应商但没生效用的还是旧的终端窗口关掉终端重新打开一直转圈没反应电脑上开着的代理软件冲突临时关掉代理试试
AI 编程助手是按用量计费的,用起来不注意的话,一下午也能花掉一杯奶茶钱。几个省钱习惯:
一个项目在一个对话里做完
:中途新开对话,它要重新"读一遍"你的文件,这部分是要再花钱的
需求一次说清楚
:风格、配色、尺寸、适配要求,一开始就说全,比来回改十几轮省得多
简单的事用便宜的模型
:改个文案、调个颜色,用不着最强的模型
定期看看账单明细
:大部分服务都能看到每次调用花了多少,心里有数
上面的方法对官方服务和第三方兼容服务都适用,挑自己用着顺手的就好。
顺便介绍一下我们自己:
TokenMarket
(tokenmarket点cheap),几个人一起维护的 API 服务,已经运行三个月了。Claude Code、Codex 都能用,可以直接填进 CC Switch。站内线路分了不同档位,练手可以选便宜些的,正式项目可以选稳定些的,正好对应上面说的"一键切换"用法。每次调用的扣费明细都能在日志里查到,新用户有试用额度以及免费的羊毛组15天使用权限,另外还有针对活跃用户的不定时抽奖活动可享受免费额度。
你用 AI 做过什么有意思的设计相关小工具?欢迎在评论区分享,配置上卡住了也可以留言。