PageSourceSearch

https://www.abclub.ai/assets/Blog-B9t8K9dM.js

js abclub.ai collected 2026-10-05 13:47:00 UTC 10,810 bytes, 1 lines download raw bytes

1import{j as e}from"./ui-Gn93sXnx.js";import{N as c}from"./Navigation-a_FszFY9.js";import{S as m}from"./SeoHead-n2vtGfxW.js";import{r as h}from"./vendor-Dxln9S8c.js";import{C as g}from"./CursorBlog-FbMUke-0.js";import{A as p,F as u}from"./AppleNotesMCP-CPGRdl1y.js";import{s as x}from"./sfEvents-BeqGnQNZ.js";import{u as f}from"./useConvertKitSubscriberCount-CKfgve9O.js";import{M as b}from"./mail-CsP9kALA.js";import{A as n}from"./arrow-right-D9LRyWcr.js";import"./Helmet-_NQcQ4uB.js";import"./index-AgFXObMB.js";import"./router-da-5gp3u.js";const w="https://app.kit.com/forms/9087462/subscriptions",v=[{id:8,title:"Upcoming Design Events in San Francisco",excerpt:"A quick roundup of upcoming SF and Bay Area design events, screenings, showcases, makeathons, and speaker sessions worth checking out.",author:"AI Builder Academy",date:"2026-05-27",readTime:"4 min read",category:"Events",image:"https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?q=80&w=2000&auto=format&fit=crop",slug:"upcoming-design-events-san-francisco"},{id:7,title:"Interaction Models: Thinking Machines Lab's Research Preview, Explained",excerpt:"A practical breakdown of Thinking Machines Lab's interaction model research preview: micro-turns, native multimodal processing, split architecture, and what it means for AI-native products.",author:"AI Builder Academy",date:"2026-05-26",readTime:"8 min read",category:"Research Breakdown",tags:["AI interaction models","Thinking Machines Lab","Micro-turns","Multimodal AI","Split architecture","Voice AI latency","Human-AI communication","AI-native product design"],image:"https://images.unsplash.com/photo-1558494949-ef010cbdcc31?q=80&w=2000&auto=format&fit=crop",slug:"interaction-models-thinking-machines-breakdown"},{id:6,title:"Apple Notes MCP: Manage Your Notes Directly from Claude Code",excerpt:"An MCP server that lets Claude Code read, create, search, update, and delete your Apple Notes, all through natural conversation. Here's how to set it up in three steps.",author:"John Rodrigues",date:"2026-03-22",readTime:"5 min read",category:"Guide",image:p,slug:"apple-notes-mcp"},{id:5,title:"AI-Powered Design: Bridging Figma, Code, and Design Systems",excerpt:"Explore how AI tools like Claude Code and Cursor are revolutionizing design-to-code workflows. Learn what's possible when you connect your Figma design system directly to your codebase.",author:"AI Design Academy",date:"2025-01-28",readTime:"6 min read",category:"Insights",image:u,slug:"control-figma-with-cursor-claude"},{id:4,title:"Clawdbot: The AI Agent That Has Everyone Buying Mac Minis",excerpt:"Why designers and creatives are rushing to set up always-on AI assistants — and how you can too. A deep dive into the open-source agent changing personal AI.",author:"John Rodrigues",date:"2025-01-25",readTime:"12 min read",category:"Insights",image:"https://images.unsplash.com/photo-1620641788421-7a1c342ea42e?q=80&w=2000&auto=format&fit=crop",slug:"clawdbot-ai-agent-mac-mini"},{id:1,title:"Cursor 2.0: The Future of Vibe Coding is Here",excerpt:"Cursor recently launched Cursor 2.0, introducing Composer 1, Agent Mode, and parallel workflows. These updates drastically improve efficiency and hint at where vibe-coding tools are heading.",author:"John Rodrigues",date:"2024-11-28",readTime:"5 min read",category:"Product Update",image:g,slug:"cursor-2-0-update"},{id:2,title:"7 Observations on How AI is Reshaping Product Design",excerpt:"After directing 5+ AI products and writing 46 articles, here are key observations on how AI is the next UI, the rise of agents, and why designers must evolve.",author:"John Rodrigues",date:"2024-11-23",readTime:"4 min read",category:"Insights",image:"https://images.unsplash.com/photo-1550684848-fac1c5b4e853?q=80&w=2000&auto=format&fit=crop",slug:"ai-reshaping-product-design"},{id:3,title:"Where to Get Started with AI: 6 Steps from Chaos to Clarity",excerpt:"Overwhelmed by how fast AI is changing? We've mapped out 6 practical steps and resources to help you build your foundation and start creating.",author:"AI Design Academy",date:"2024-11-20",readTime:"5 min read",category:"Guide",image:"https://images.unsplash.com/photo-1618005182384-a83a8bd57fbe?q=80&w=2000&auto=format&fit=crop",slug:"where-to-get-started-with-ai"}],j=[...v].sort((a,s)=>new Date(s.date).getTime()-new Date(a.date).getTime()),F=()=>{const a=f("4,200+"),[s,l]=h.useState(!1),r=s?"bg-[#151518] text-white":"bg-white text-[#1d1d1f]",i=s?"text-white/58":"text-[#6e6e73]",d=s?"bg-white/[0.045]":"bg-[#f5f5f7]",o=s?"border-white/10 bg-[#151518] text-white placeholder:text-white/35 focus:border-white/25":"border-black/10 bg-white text-[#1d1d1f] placeholder:text-[#6e6e73]/60 focus:border-[#1d1d1f]/30";return e.jsxs(e.Fragment,{children:[e.jsx(m,{title:"AI Design Blog: Vibe Coding, Claude Code & Cursor Tutorials",description:"The AI design blog for product designers. Tutorials on Claude Code, Cursor, vibe coding workflows, MCPs, and shipping AI-
1powered products from idea to ship.",canonical:"/blog"}),e.jsxs("div",{className:`min-h-screen overflow-x-hidden selection:bg-[#C98659]/20 ${s?"bg-[#0e0e10] text-white":"bg-[#f5f5f7] text-[#1d1d1f]"}`,children:[e.jsx(c,{hide:["Workshops"],hideLogin:!0,landingTheme:s?"dark":"light",onLandingThemeToggle:()=>l(t=>!t)}),e.jsxs("main",{className:"mx-auto max-w-[1400px] px-6 pb-16 pt-24 sm:pb-24 sm:pt-32 md:px-10",children:[e.jsxs("div",{className:"mb-12 space-y-8 sm:mb-16",children:[e.jsxs("div",{className:"max-w-4xl",children:[e.jsx("p",{className:"text-sm font-semibold uppercase tracking-[0.16em] text-[#C98659]",children:"Blog"}),e.jsx("h1",{className:"mt-4 text-4xl font-semibold tracking-tight sm:text-5xl md:text-7xl",children:"Notes for builders."}),e.jsx("p",{className:`mt-5 max-w-2xl text-lg leading-8 ${i}`,children:"Useful breakdowns, tools, and field notes for building AI products from zero to one."})]}),e.jsx("div",{className:`rounded-[28px] p-5 shadow-sm md:p-6 ${r}`,children:e.jsxs("div",{className:"grid ga
1p-6 md:grid-cols-[0.88fr_1.12fr] md:items-center",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-xs font-semibold uppercase tracking-[0.16em] text-[#C98659]",children:"Newsletter"}),e.jsxs("h2",{className:"mt-2 max-w-lg text-2xl font-semibold leading-tight md:text-3xl",children:["Weekly AI notes for ",a," builders."]}),e.jsx("p",{className:`mt-3 max-w-md text-sm leading-6 ${i}`,children:"Product shifts, useful tools, and practical workflows in one concise email."})]}),e.jsxs("div",{className:`rounded-[22px] p-4 ${d}`,children:[e.jsxs("div",{className:"mb-4 flex items-center gap-3",children:[e.jsx("div",{className:`flex h-10 w-10 items-center justify-center rounded-full shadow-sm ${s?"bg-[#0e0e10] text-white":"bg-white text-[#1d1d1f]"}`,children:e.jsx(b,{className:"h-4 w-4"})}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-lg font-semibold leading-tight",children:"Get the wrap-up"}),e.jsx("p",{className:`mt-0.5 text-sm ${i}`,children:"Free. Unsubscribe anytime."})]})]}),e.jsxs("form",{action:w,method:"post","data-sv-form":"9087462","data-uid":"523a052d48","data-format":"inline","data-version":"5",className:"grid gap-3 lg:grid-cols-[1fr_1fr_auto]",children:[e.jsx("input",{"aria-label":"First name",name:"fields[first_name]",placeholder:"Your name",type:"text",autoComplete:"given-name",className:`h-12 min-w-0 rounded-full border px-4 text-sm outline-none transition-colors ${o}`}),e.jsx("input",{"aria-label":"Email address",name:"email_address",placeholder:"Email address",required:!0,type:"email",autoComplete:"email",className:`h-12 min-w-0 rounded-full border px-4 text-sm outline-none transition-colors ${o}`}),e.jsxs("button",{type:"submit",className:`inline-flex h-12 min-w-[148px] shrink-0 items-center justify-center gap-2 rounded-full px-6 text-sm font-semibold transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#C98659]/35 ${s?"bg-[#C98659] text-white hover:bg-[#B6784E]":"bg-[#1d1d1f] text-white hover:bg-black"}`,children:[e.jsx("span",{className:"relative z-10 text-[#fff]",children:"Subscribe"}),e.jsx(n,{className:"relative z-10 h-4 w-4 text-[#fff]"})]}),e.jsx("input",{type:"hidden",name:"fields[source]",value:"blog-page"})]})]})]})})]}),e.jsx("div",{className:"mb-20 grid grid-cols-1 gap-6 md:grid-cols-2 lg:grid-cols-3",children:j.map(t=>e.jsxs("div",{className:`group flex h-full cursor-pointer flex-col overflow-hidden rounded-[24px] p-3 shadow-sm transition-transform duration-200 hover:-translate-y-1 ${r}`,onClick:()=>window.location.href=`/blog/${t.slug}`,children:[e.jsx("div",{className:`relative mb-5 aspect-[16/10] overflow-hidden rounded-[18px] ${s?"bg-white/5":"bg-[#ececef]"}`,children:e.jsx("img",{src:t.image,alt:t.title,className:"h-full w-full object-cover transition-transform duration-500 group-hover:scale-[1.02]"})}),e.jsxs("div",{className:"flex flex-1 flex-col px-2 pb-3",children:[e.jsx("div",{className:"mb-3 flex items-center gap-2 text-[10px] font-semibold uppercase tracking-[0.16em] text-[#C98659] sm:text-xs",children:t.category}),e.jsx("h3",{className:"mb-3 text-xl font-semibold leading-snug tracking-tight transition-colors group-hover:text-[#C98659]",children:t.title}),e.jsx("p",{className:`mb-4 line-clamp-3 text-sm leading-6 ${i}`,children:t.excerpt}),e.jsx("div",{className:`mt-auto flex items-center gap-2 text-xs font-medium ${i}`,children:e.jsx("span",{children:new Date(t.date).toLocaleDateString("en-US",{month:"short",day:"numeric"})})})]})]},t.id))}),e.jsxs("section",{className:`mb-20 rounded-[28px] p-5 shadow-sm sm:p-7 ${r}`,children:[e.jsxs("div",{className:"mb-6 flex flex-col gap-2 sm:flex-row sm:items-end sm:justify-between",children:[e.jsxs("div",{children:[e.jsx("p",{className:"text-[11px] font-semibold uppercase tracking-[0.22em] text-[#C98659]",children:"SF events"}),e.jsx("h2",{className:"mt-2 text-2xl font-semibold tracking-tight sm:text-3xl",children:"Design events worth showing up for."})]}),e.jsxs("a",{href:"/events",className:"inline-flex items-center gap-2 text-sm font-semibold transition hover:text-[#C98659]",children:["View all",e.jsx(n,{className:"h-4 w-4"})]})]}),e.jsx("div",{className:"grid gap-3 md:grid-cols-2",children:x.slice(0,4).map(t=>e.jsxs("a",{href:t.href,target:t.href.startsWith("http")?"_blank":void 0,rel:t.href.startsWith("http")?"noopener noreferrer":void 0,className:`rounded-[18px] p-4 transition-colors ${s?"bg-white/[0.045] hover:bg-white/[0.07]":"bg-[#f5f5f7] hover:bg-[#ececef]"}`,children:[e.jsx("p",{className:"text-[11px] font-semibold uppercase tracking-[0.14em] text-[#C98659]",children:t.meta}),e.jsx("h3",{className:"mt-2 text-base font-semibold leading-snug",children:t.title}),e.jsx("p",{className:`mt-2 line-clamp-1 text-sm leading-6 ${i}`,children:t.body})]},t.href))})]})]})]})]})};export{F as default};

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.