Skip to content
LOCZH/安大略 · 加拿大待机OK/--:--:--EST
M4M4RK_YUportfolio
  • 项目
    项目Overview
    • 作品精选案例与项目记录
    • 游戏可玩原型与游戏开发日志
  • 影像
    影像Overview
    • 档案影像合集与视觉实验
    • 商店印刷品、海报和限量物件
  • 日志
    日志Overview
    • 博客长篇开发日志与现场笔记
    • 笔记短观察、链接与代码片段
  • 资源
    资源Overview
    • 工具38 款浏览器内开发工具
    • 链接每日使用的开发与设计书签
  • 关于
  • 联系
EN
← 项目档案
Web 应用 · 2026就绪

Bloomprint

把庭院灵感变成可执行的方案——买什么、买多少、需要哪些工具、按什么顺序、可能会出什么问题。

角色
Solo developer: planning engine, product UI, local-first storage, and optional cloud sync.
技术栈
Next.jsReact 19TypeScriptSupabaseTensorFlow.jsKonvaTailwind CSSZod
链接
在线源码
Bloomprint yard plan blueprint cover

背景

问题

改造庭院让人无从下手:一张灵感照片说不清材料、数量、工具和步骤,也说不清哪里会出错——而多数工具只会像聊天机器人一样给出自信的猜测。

方法

方案

这是一个结构化的规划应用,而不是聊天机器人:确定性引擎才是真正的依据,完全离线、无需 AI 密钥和照片也能工作——AI 只负责润色已生成的方案。每份方案都基于区域化目录(以安大略为先)、价格区间而非虚假精确价、在未测量时自动放宽的用料计算,以及分阶段的操作指南。

功能

  • Deterministic planning engine as the source of truth
  • Local-first storage with optional Supabase cross-device sync
  • Free/Open Data Mode — works with no paid API
  • Region-aware retailer links and honest price bands
  • Optional AI presentation (Claude) with silent fallback
  • On-device photo segmentation (TensorFlow.js)

架构笔记

  • The deterministic engine owns the truth; AI and live data only enrich, never override.
  • Local-first by design — the plan never waits on the network; cloud sync sits behind the local layer.
  • Every live fact carries a source, a confidence tag, and a 'last checked' time.

挑战

结果

A working local-first planning app live at bloomprint.online that chooses honest grounding — sourced facts, confidence tags, price ranges — over confident AI guesswork.

学到的东西

复盘

  1. 01Deterministic-first earns trust a chatbot-first tool can't.
  2. 02Honest hedging — ranges, 'verify before buying' — reads as more credible than false precision.
  3. 03Local-first changes every assumption about state, sync, and failure.

下一步

下一步

  1. 01Expand the catalog beyond Ontario
  2. 02Wire real live-data providers
  3. 03Add collaborative plans

相关案例

Web 应用

Nimbus

A secure file management platform shaped around calm organization, OTP access, and storage analytics.

Web 应用

M4rketView

A cryptocurrency screener built for quick scanning, watchlist thinking, and market table clarity.

上一篇M4rketViewA cryptocurrency screener built for quick scanning, watchlist thinking, and market table clarity.
返回档案
下一篇PurecreateA 3D apparel customizer that designs your shirt in real time and generates decals from a text prompt with DALL·E 3.
返回档案
频道开放·随时打个招呼 · 2026
--:--:--EST
联系

看到什么有意思的?和我聊聊。

这是一个作品集,不是服务 · 但每一条留言我都会看 — 如果哪里让你有所触动,或者只想打个招呼,欢迎写信过来。

开启对话

订阅

偶尔收到一封简讯

来自 m4rkyu.com 的笔记与日志——简短、标注日期、没有杂音。随时可退订。

作品

线上发布、游戏作品与视觉档案。

  • 项目
  • 游戏
  • 档案
  • 日志

资源

每日好用的工具与个人收藏的链接库。

  • 搜索
  • 最新
  • 工具
  • 链接
  • 笔记
  • 主题
  • RSS
  • JSON Feed
  • 商店

工作室

背景、联系方式以及合作渠道。

  • 关于
  • 联系
  • 更新日志
  • 技术说明
  • 简历筹备中

社交

在常去的平台上找到我。

  • Facebook敬请期待
  • Instagram敬请期待
  • YouTube敬请期待
  • 领英敬请期待
M4RKYUM4RKYUM4RKYUM4RKYUM4RKYUM4RKYUM4RKYUM4RKYU
始于 2024
ZhenXiao Mark YuZhenXiao Mark Yu
© 2026 ZhenXiao Mark Yu·加拿大 安大略
  • 邮件
  • GitHub
  • dev.to
  • 领英 (敬请期待)
  • 推特 / X (敬请期待)
  • Instagram (敬请期待)
由 Next.js 16 · React 19 · Tailwind 4 构建

由 Next.js 16 · React 19 · Tailwind 4 构建