V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
爱意满满的作品展示区。
binhb

分享使用 Claude Design 重新设计 landing page 的案例(已上线)

  •  
  •   binhb ·
    ZingerLittleBee · 1 day ago · 620 views

    大概操作流程如下:

    1.我给出 github 地址,Claude 分析之后会提出几个问题(如下),大多数问题我都是让 Claude 自己来决定的

    Questions answered:
    - goal: Landing page / marketing site redesign
    - screen: Dashboard (overview)
    - theme: Both (toggle)
    - fidelity: Bold rethink — different visual language entirely
    - interactions: Fully interactive prototype (hover, filter, sort, animated transitions)
    - explore_axes: Decide for me
    - frame: Decide for me
    - brand: Decide for me
    - tweaks: Decide for me
    

    2.然后 Claude 给出 redegisn 的页面( html 格式),生成如下图的 asset

    3.有了页面之后就可以使用 comment 选择元素,进行对话,局部 redesign

    4.复制 design 的 prompt 给 Claude Code 就可以开始实现了(右上角有 handoff to Claude Code 的按钮,点击会生成如下 prompt )

    Fetch this design file, read its readme, and implement the relevant aspects of the design. https://api.anthropic.com/v1/design/h/xxxxxx Implement: the designs in this project
    

    整体 redesign 就几次对话,就结束了,体验非常不错

    Claude degisn 给出的原始版本: https://dockerman-design.netlify.app/

    简单修改的上线版本: https://dockerman.app/en

    几乎只是做了一些文案的调整

    好看与否,看官自己评判,反正我是挺满意的

    2 replies    2026-04-25 15:52:05 +08:00
    ggdxwz
        1
    ggdxwz  
       1 day ago
    捉个虫,production 这边版本是加了页面平滑滚动吗,在部分平台下体验有点问题,可能还是去掉比较好
    binhb
        2
    binhb  
    OP
       1 day ago
    @ggdxwz 感谢提醒,应该是之前的版本的残留,lenis + GSAP ScrollTrigger
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5941 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 86ms · UTC 06:38 · PVG 14:38 · LAX 23:38 · JFK 02:38
    ♥ Do have faith in what you're doing.