ibing 销售页面：hXXps://www.designisaparty.com/prototyping
用 AI 代码编辑器 Cursor，快速制作交互式原型，轻松创建专属作品集，甚至能把 Figma 设计稿直接变成代码组件——完全不用写代码！
这门课程共22章，带你完成7个实战项目，比如钢琴应用、记事本、带真实数据的书架等，帮你积累超强作品。
你会学到如何安装配置 Cursor，修复代码错误，发布网站，以及用“模型上下文协议”（Model Context Protocol）将设计无缝连接到代码。
课程内容涵盖创意设计风格和精准的技术细节，助你打造完美的原型。通过学习，你不仅能做出专业级的交互原型，还能提升设计流程效率，打造出令人印象深刻的作品集，展示你的能力和实力。
Build interactive prototypes fast using Cursor, an AI code editor.
You will create custom portfolios or turn Figma designs into code components, no coding skills needed.With 22 chapters, you complete seven projects for your portfolio, like a piano, a note app, or a bookshelf with real data.
You learn to set up Cursor, fix code errors, publish websites, and connect designs to code using the Model Context Protocol.
The course covers creative design styles and precise technical skills for perfect prototypes.You will build professional prototypes, improve your design process, and have strong portfolio work to show your abilities.
教程目录
│ ├─01-1 Foundations
│ │ 01-Welcome to the course[ aixinshou.com ].mp4
│ │ 01-Welcome.pdf
│ │ 02-Logistics.pdf
│ │ 03-Initial set up.pdf
│ │ 04-Chaotic typography[ aixinshou.com ].mp4
│ │ 04-Intro to Cursor.docx
│ │ 04-Intro to Cursor[ aixinshou.com ].mp4
│ │ 04-Note-taking interface- Demo[ aixinshou.com ].mp4
│ │ 04-Piano demo- Full screen[ aixinshou.com ].mp4
│ │ 05-Tips for prototyping with Cursor.docx
│ │ 05-Tips for prototyping with Cursor[ aixinshou.com ].mp4
│ │ 05-Typography- Scale[ aixinshou.com ].mp4
│ │ 06-Change your Cursor theme[ aixinshou.com ].mp4
│ │ 06-Set up the repository.docx
│ │ 06-Set up the repository[ aixinshou.com ].mp4
│ │ 07-Your new BFF- Cursor Agent[ aixinshou.com ].mp4
│ │ 07-Your new BFF_ Cursor Agent.docx
│ │ 08-How to run your project.docx
│ │ 08-How to run your project[ aixinshou.com ].mp4
│ │ 08-Run your project with terminal[ aixinshou.com ].mp4
│ │ 09-The codebase.pdf
│ │
│ ├─02-2 Creative exploration
│ │ 01-1a Gain more context[ aixinshou.com ].mp4
│ │ 01-1b Specific changes[ aixinshou.com ].mp4
│ │ 01-1c Share an image for inspiration[ aixinshou.com ].mp4
│ │ 01-1d Explore ambiguity[ aixinshou.com ].mp4
│ │ 01-1e Give examples[ aixinshou.com ].mp4
│ │ 01-1f Add an image[ aixinshou.com ].mp4
│ │ 01-1h Ask Agent what to do[ aixinshou.com ].mp4
│ │ 01-Project 1- Change the name[ aixinshou.com ].mp4
│ │ 01-Project 1- Customize your homepage[ aixinshou.com ].mp4
│ │ 01-Project 1- Experimenting with styles[ aixinshou.com ].mp4
│ │ 01-Project_ Customize your homepage.docx
│ │ 02-Debugging 101.docx
│ │ 03-Deploy your website.docx
│ │ 03-Deploy your website[ aixinshou.com ].mp4
│ │ 03-Save your code with Git[ aixinshou.com ].mp4
│ │ 04-2b Explore sound effects[ aixinshou.com ].mp4
│ │ 04-2c Add a visualization[ aixinshou.com ].mp4
│ │ 04-2d Autoplay a tune[ aixinshou.com ].mp4
│ │ 04-a Tweak the visuals[ aixinshou.com ].mp4
│ │ 04-courses by design is a party[ aixinshou.com ].mp4
│ │ 04-Deploy your piano[ aixinshou.com ].mp4
│ │ 04-How to add a new prototype[ aixinshou.com ].mp4
│ │ 04-Piano demo- Full screen[ aixinshou.com ].mp4
│ │ 04-Piano demo[ aixinshou.com ].mp4
│ │ 04-Project 2- Make a piano[ aixinshou.com ].mp4
│ │ 04-Project_ Make a piano.docx
│ │ 05-Chaotic typography[ aixinshou.com ].mp4
│ │ 05-Playing with type- Set up[ aixinshou.com ].mp4
│ │ 05-Project- Playing with type[ aixinshou.com ].mp4
│ │ 05-Project_ Play with type.docx
│ │ 05-Typography- 3D[ aixinshou.com ].mp4
│ │ 05-Typography- Circular text[ aixinshou.com ].mp4
│ │ 05-Typography- Glitch effect[ aixinshou.com ].mp4
│ │ 05-Typography- Perspective[ aixinshou.com ].mp4
│ │ 05-Typography- Scale[ aixinshou.com ].mp4
│ │ 05-Typography- Text gradient[ aixinshou.com ].mp4
│ │ 05-Typography- Variable[ aixinshou.com ].mp4
│ │ 05-Typography- Wavy text[ aixinshou.com ].mp4
│ │
│ ├─03-3 Technical execution
│ │ 01-Rules.docx
│ │ 02-Note-taking interface- Demo[ aixinshou.com ].mp4
│ │ 02-Noted OS- Voice notes[ aixinshou.com ].mp4
│ │ 02-Project- Noted OS Process[ aixinshou.com ].mp4
│ │ 02-Project- Noted OS Set up[ aixinshou.com ].mp4
│ │ 02-Project_ Build a note-taking interface.docx
│ │ 03-1a Bookshelf- Add filters[ aixinshou.com ].mp4
│ │ 03-5b Bookshelf- New property[ aixinshou.com ].mp4
│ │ 03-5b Bookshelf- Visualization[ aixinshou.com ].mp4
│ │ 03-5c Bookshelf- Add a new book[ aixinshou.com ].mp4
│ │ 03-Books[ aixinshou.com ].mp4
│ │ 03-Create a bookshelf- Full set up[ aixinshou.com ].mp4
│ │ 03-Create a digital bookshelf- Process[ aixinshou.com ].mp4
│ │ 03-Edit the database[ aixinshou.com ].mp4
│ │ 03-Environment variables in Vercel[ aixinshou.com ].mp4
│ │ 03-Project_ Create a digital bookshelf.docx
│ │ 03-Step 1 Copy my database[ aixinshou.com ].mp4
│ │ 03-Step 2 Build the foundation[ aixinshou.com ].mp4
│ │ 03-Step 3 Create a env file[ aixinshou.com ].mp4
│ │ 03-Step 4- Get the API key[ aixinshou.com ].mp4
│ │ 03-Step 5 Connect the integration[ aixinshou.com ].mp4
│ │ 03-Step 6 Add the database id[ aixinshou.com ].mp4
│ │ 03-Using a mockup[ aixinshou.com ].mp4
│ │ 03-Watch me debug[ aixinshou.com ].mp4
│ │ 04-How to use the MCP server[ aixinshou.com ].mp4
│ │ 04-Set up the Figma Context MCP[ aixinshou.com ].mp4
│ │ 04-Your first MCP.docx
│ │ 05-Connect to GitHub[ aixinshou.com ].mp4
│ │ 05-Create a new Nextjs project[ aixinshou.com ].mp4
│ │ 05-Run your project[ aixinshou.com ].mp4
│ │ 05-Start a project from scratch.docx
│ │ 06-1 Craft a design library- Setup[ aixinshou.com ].mp4
│ │ 06-2 Project rules[ aixinshou.com ].mp4
│ │ 06-3 Craft a design library- Figma design library[ aixinshou.com ].mp4
│ │ 06-4 Defining typography[ aixinshou.com ].mp4
│ │ 06-5 Defining color[ aixinshou.com ].mp4
│ │ 06-6 Defining size[ aixinshou.com ].mp4
│ │ 06-7 Implementing an icon library[ aixinshou.com ].mp4
│ │ 06-8 Your first component[ aixinshou.com ].mp4
│ │ 06-Project_ Craft a design library.docx
│ │ 07-Project- Remix an arcade game[ aixinshou.com ].mp4
│ │ 07-Project_ Remix an arcade game.docx
│ │ 08-Whats next.docx
│ │
│ └─04-Appendix
│ 01-Glossary.pdf
│ 02-Prompting cheat sheet.pdf
│ 03-Reference images.pdf
│ 04-Course idea log.pdf
