Orbit落地页：启用与未启用TasteSkill对比
- 播放
- 12万
- 点赞
- 1,694
- 评论
- 86
- 收藏
- 2,418
创作者用相同的提示词和同一张参考图片，分别在使用和不使用TasteSkill v2的情况下，让Claude Opus 5.5生成名为Orbit的产品管理平台落地页，以对比视觉效果。
完整提示词3,566 字符
Build a complete, production-quality landing page for Orbit, a project management platform for small product teams. Orbit combines projects, tasks, discussions, documents, and weekly progress updates in one workspace. Its core purpose is to let teams understand what is happening without constantly asking for updates or scheduling status meetings. Technical requirements Build the website using Next.js, React, and TypeScript. Use TSX components and a proper Next.js project structure. Do not create a plain HTML/CSS website. The implementation should be clean, componentized, responsive, and production-quality. Use modern CSS or Tailwind CSS for styling where appropriate. Do not merely describe the implementation. Build the complete working page. Visual reference Use the provided reference image as the primary art-direction reference. Match its overall visual character very closely: typography treatment, density, spacing philosophy, texture, contrast, borders, surface treatment, visual weight, image treatment, and general design atmosphere. However, do not copy the reference website or recreate its content. Do not copy its: branding text or copy logos illustrations exact layout individual components imagery proprietary visual assets Instead, understand the design language behind the reference and reinterpret it for Orbit. For example, if the reference uses grain, paper texture, sharp borders, muted surfaces, unusual typography, dense layouts, editorial spacing, or a particular treatment of imagery, use those qualities as inspiration while creating an original design. The finished page should clearly belong to the same visual world as the reference while still being an original website. Page The hero should immediately explain Orbit and show a convincing view of the actual product. Throughout the page, create realistic Orbit UI showing projects, tasks, assignees, discussions, documents, statuses, deadlines, and weekly updates. Include the sections that genuinely help sell the product, such as: Hero Product demonstration Core workflow Features Team use cases Integrations Customer proof Pricing FAQ Final CTA You may change, combine, reorder, or remove sections when doing so produces a stronger page. Design quality Avoid the stereotypical AI-generated SaaS aesthetic. No purple gradient hero. No glowing blobs. No glassmorphism. No giant collection of rounded cards. No endless 3-column feature grids. No random floating icons. No meaningless charts. No fake AI functionality. No excessive pills. No generic startup illustrations. No repetitive centered sections. Do not make every element a card or container. Use typography, composition, whitespace, texture, product UI, imagery, and hierarchy to create visual interest. The product UI itself should be detailed and believable. Keep names, projects, dates, statuses, and other information consistent across different product previews. Copy should be concise and specific. Avoid phrases such as “supercharge your workflow,” “unlock your potential,” and other generic SaaS language. Add subtle, intentional interactions and motion where they improve the experience. Avoid animation for animation's sake. Make the page excellent on desktop and mobile. The final result should feel designed, not generated. Take the reference image seriously. Analyze its design system first, then translate that design language into an original Orbit website. Do not ask me to choose colors, fonts, layouts, libraries, or design direction. Make those decisions yourself and implement the complete site.
出处：作者在原帖下的回复。提示词保留原文语言，未做改写。
需自备参考素材：原作除了文字提示词，还用了图片、视频、音频、文档或代码库作为输入，本站未收录这些素材。只复制提示词得不到同样的结果。
作者提到的工具
TasteSkill v2Next.jsReactTypeScriptTailwind CSS
原帖：https://x.com/itsluneri/status/2110564814531797386
全部作品数据开源在 GitHub · awesome-opus-5.5-video。
模型归属以作者自述为准，本站未独立复现。播放量为 2026-10-16 的快照。作品版权归原作者，修改署名或下架请在 X 私信 @GoSailGlobal。
