Yonderwell让所有好地方，都值得被看见。讨论项目

项目合作

把项目中的网站设计与开发交给我们。

我们与网站公司、技术代理商合作，承接网站设计与开发。您可以带来已确定的设计稿、品牌规范、现有网站或明确的开发需求。我们按项目确认范围、分工、价格、时间与验收方式。

讨论项目 查看技术演示
网站演示
Quinta da Curva — 网站演示
Quinta da Curva

Quinta da Curva——Yonderwell 的网站设计与开发演示。

查看实现与演示

01

先把独立项目的范围定清楚。

每次合作都有单独的书面报价，写明网站范围、职责、价格、时间与验收条件。

  1. 实现已有设计

    带来双方确定的品牌系统、视觉方向或页面设计。我们把它实现为可运行的网站，完成项目约定的路由、内容与交互。

  2. 从品牌或内容完成设计与开发

    带来品牌规范、摄影、文案或双方约定的其他素材。我们据此组织结构、完成项目专属设计，并开发完整网站。

  3. 完善现有网站的指定部分

    说明需要新增或调整的页面、交互与语言版本。我们先核对技术平台和代码仓库，再确认并实施本次约定的工作。

02 / 实现片段

看看网站如何运行。

两个演示展示合作项目可以覆盖的工作：响应式内容布局、CSS 视觉转场和有目的的动效。它们是演示界面，不连接支付或预订服务。

Quinta da Curva演示界面
Quinta da Curva — 演示界面

我们带入合作项目的工程能力

响应式 CSS

我们让布局从 390px 移动端视口到 1280px 桌面端视图都能稳定工作，在两种尺寸下保持内容易读、操作清楚。

实现片段 · CSS · Hoshimachi-sha
@media (max-width: 420px) {
  .hero h1 { font-size: clamp(2.2rem, 9vw, 2.8rem); }
  .hero-cta, .hero-cta-ghost { padding: 0.85rem 1.1rem; font-size: 0.92rem; }
  .hero-status .row { font-size: 0.8rem; }
  .hero-panel .moon-text { font-size: 0.78rem; }
  .footer-mark { width: 56px; height: 56px; }
}
Astro 与 React

Astro 静态路由让主要页面以静态 HTML 保持可读；React 交互组件只增加必要的交互能力。这个官网就是一个实际例子。

实现片段 · Astro · Yonderwell
export function getStaticPaths() {
  return LOCALES.map((locale) => ({ params: { locale } }));
}

<AvailabilityChecker client:load strings={p.availability} locale={locale} />
可控的 WebGL 动效

动效确实有助于体验时，我们可以制作 WebGL 场景，在减少动效时显示静态画面，并在屏外暂停渲染循环。

实现片段 · JavaScript · Hoshimachi-sha
window.addEventListener('message', function (event) {
  if (event.origin !== window.location.origin) return;
  if (event.data === 'yw-demo-pause') stopLoop();
  else if (event.data === 'yw-demo-resume' && !reduceMotion && !document.hidden) startLoop();
});

03

三种合作方式

  1. 委托网站项目

    由您的企业采购并支付约定的网站工作，提供品牌素材，汇总反馈并确认验收。范围、时间与交接方式都写入项目约定。

  2. 共同分担工作

    开始前先约定各方职责、交付物与费用。您负责自己的专业部分，我们负责约定的网站设计或开发部分。

  3. 介绍客户给我们

    征得潜在客户同意后，介绍双方并说明网站需求。网站范围与合作约定由我们直接与客户沟通。

从简报到交接，每一步写清楚

  1. 简报与适配判断

    请说明客户背景、目标、素材、现有平台或代码仓库，以及希望我们负责的部分。我们会带着问题回复，并说明项目是否适合承接。

  2. 范围与报价

    我们用项目专属的书面报价确定网站交付物、职责、价格、时间与验收检查。

  3. 设计与开发

    在约定的开工时间之后，我们完成项目专属的设计与开发，由指定联系人按约定节点汇总反馈。

  4. 验收与上线

    指定联系人按照书面的验收检查进行查看。之后，我们按约定的上线、移交或下一步交付安排继续处理。

交接包括项目约定的源代码、部署环境、文档与支持；移交最终客户的安排按项目分别确认。

04

说说您正在推进的项目。

简单写几句工作室、机构或客户项目的情况即可。范围、价格与时间沟通免费；项目专属的设计与开发在约定开工后进行。

brief@yonderwell.com

我们在 1 个工作日内确认收到，并在 5 个工作日内回复项目是否适合承接。

邮件里可以提供这些信息

  1. 您的工作室或企业网址：
  2. 项目目标，以及希望网站实现什么：
  3. 现有网站、平台和技术栈（如有）：
  4. 已有的设计素材、品牌资产或内容：
  5. 希望我们交付的部分，以及您期望的职责分工：
  6. 期望的时间或开工窗口：

还有部分细节没定？先发已有的项目概要，我们一起把问题理清。

打开合作邮件

将在您自己的邮件应用中打开草稿，由您检查并发送。

请不要在邮件中包含住客数据、支付信息、密码或敏感附件。