跳到正文
Laboe Studio
Dark glass interface panels floating in a black space with thin gold edges, beside the silhouettes of a laptop and a phone, lit by warm gold rim light

开发

从五页的公司官网,到带支付和运营后台的多租户平台。我们用 Next.js、Supabase 和原生移动技术栈搭建,并负责让它持续运行。

给需要的不只是一个宣传站的企业——平台、网店、App 或内部工具——并且希望由一支团队来设计、搭建并持续运维。马来西亚与新加坡,英文与中文。

01

业务需要,选择合适开发方式

  1. 01

    网站

    公司官网是客户、合作伙伴和搜索引擎最先落到的那一页——我们做成双语、为搜索结构化、手机上够快。

    公司官网——双语、SEO 结构化、够快。

    • 带 hreflang 的英中双语站
    • 结构化数据与 sitemap
    • 性能与无障碍检查
    我们怎么做

    我们用 Next.js 搭建,默认静态渲染,页面加载快,也不需要一台服务器盯着。搜索结构不是之后再补的一道工序:带 hreflang 的英中双语路由、结构化数据、sitemap 和干净的 metadata 随第一版一起上线。每个站上线前都在真机上过性能和无障碍检查,并配一套定制后台,你的团队不用我们也能发布内容。

    Soul Youth — products page with specifications for professional buyers
  2. 02

    手机 App

    用一套代码搭建的手机 App 同时上 iOS 和 Android,与网页产品共用后端和管理后台。

    一套代码出 iOS 和 Android,连同后端。

    • iOS + Android App
    • 共用后端与管理后台
    • App Store / Play Store 上架
    我们怎么做

    一个系统、三个界面:同一套账号、支付和内容同时驱动网站和两个 App,没有东西要录两次或事后对账。App Store 和 Play Store 上架由我们处理,包括商店现在要求的政策页和儿童安全标准,也包括在幕后运营平台的操作后台。你的受众实际在用的每个界面,同一天一起上线。

    Kaki Gaming — Malaysian Mahjong game lobby on a phone: quick match, create room, join by code
    Kaki Gaming — Block Battle match lobby on a phone: ranked and unranked match, host a room, join by code
  3. 03

    电商与网店

    对我们来说电商是按你的顾客实际购买方式来搭建的目录、结账和支付——包括以一条 WhatsApp 消息、而不是银行卡表单结束的结账。

    目录、结账、支付——Stripe 与本地渠道。

    • 带规格的产品目录
    • Stripe / FPX / 电子钱包结账
    • 订单与库存后台
    我们怎么做

    银行卡和订阅接 Stripe,受众需要时接 FPX、电子钱包等马来西亚本地渠道,webhook 带签名、幂等,上线前在正式环境验证。目录带规格、价格规则和库存;后台处理订单、库存和客户。买家在聊天里成交的场景,购物车会变成一张结构化、带编号的 WhatsApp 订单,同时记录在平台里。

    The Florist — flowers and gifts catalogue with prices from real florists
  4. 04

    门户与内部系统

    门户和内部系统是你的团队用来运营业务的软件——仪表盘、审批、角色权限,以及每个操作的审计记录。

    仪表盘、审批、角色权限、审计记录。

    • 角色权限与审批流程
    • 仪表盘与报表
    • 审计记录与对账
    我们怎么做

    我们为每天要用它八小时的人设计:清楚的角色、贴合实际决策方式的审批流程、能回答具体问题的报表。多租户系统做硬性数据隔离——行级安全、默认拒绝——上线前经过攻击测试。涉及资金的流程做对账,每次状态变化都留记录,财务和合规能追溯发生过什么。

    Laboe lead platform — operator dashboard: daily lists, send and reply counters, collection monitor, per-industry mix
    JNT Manpower — custom CMS dashboard: enquiries, page content, FAQs, news, offices, settings
  5. 05

    AI 自动化

    AI 自动化去掉的是系统之间的人工步骤——复制粘贴、重复录入、每天有人手工拼出来的报表。

    去掉人工重复劳动的工作流、agent 和工具。

    • 工作流自动化
    • 基于你数据的 AI agent
    • 内部工具与集成
    我们怎么做

    每个自动化围绕一个具体任务和可衡量的产出来定范围,然后做进你现有的工具里,而不是再加一个仪表盘。它可以是按计划在系统之间搬数据的工作流、一个用你自己文档回答问题的 agent,或者一个嵌在线上产品里的翻译层。模型哪里可靠、哪里要留人把关,我们会讲清楚。

02

清楚范围,到可用产品

  1. 定范围

    用户需求、内容、技术要求,以及「做成什么样算成功」。我们把它写成一份你可以拿来要求我们的范围——页面、流程、集成,以及明确不做的部分。

  2. 做原型

    在正式开发前,先验证交互、版面和技术路线。你在手机和电脑上点过真实流程,我们先证明最有风险的集成能跑通,再写别的。

  3. 开发

    把正式版本做出来,并接上它依赖的系统——支付、登录、内容、第三方 API。你在一个实时预览地址上跟进进度,而不是看幻灯片。

  4. 测试

    性能、响应式、无障碍,以及真实浏览器与真机。自动化端到端测试覆盖关键流程,支付流程在上线前于正式环境验证。

  5. 上线

    部署、监控并持续支持。我们做的东西自己运维——同一套技术栈跑着我们自己的平台,所以生产环境会出什么问题我们知道,并在你注意到之前修好。

03

设计它的一支团队搭建

软件里最贵的错误发生在交接处:画得出来却建不出来的设计、市场团队量不出来的结账、没人用的 CMS。我们的设计师和开发是同一支团队,内容、界面、交互、性能和交付的决定一起做、一直连着。下面的演示就是这个论点:一个产品的五个层,每一层重述同一套系统。

  1. 陪玩市场的电脑端:按游戏、段位、在线状态浏览。
  2. 同一套系统在平板上重新排版——不是另一个版本。
  3. 预订、聊天、积分都在手机上,和网页版同一套代码。
  4. Memecoin 竞技场的桌面端:对决、奖池、销毁在一屏。
  5. 竞技场的手机版——版面自适应,账本只有一套。

04

关于开发,常被问到的

用什么技术栈?

网页用 Next.js 和 TypeScript,数据与登录用 Supabase(Postgres),托管在 Vercel,收款用 Stripe 和本地支付渠道,iOS 和 Android 用原生或跨平台技术栈。我们选成熟、有长期支持的工具,交接之后系统也维护得动。

能接手现有网站 / App 吗?

通常可以。我们先做一次简短的审计——代码、托管、数据、哪里在坏——然后直说值得扩展还是该重做。无论哪种,开工前你都会先拿到书面建议。

上线后做维护吗?

做。每个项目都带交接,之后提供修复、更新和小功能的持续支持。我们自己的平台也跑在同一套技术栈上,知道生产环境会出什么问题。

支付和本地渠道怎么处理?

银行卡和订阅用 Stripe,受众需要时接 FPX、电子钱包等马来西亚本地渠道。支付流程用带签名、幂等的 webhook 搭建,上线前用真实银行卡在正式环境端到端验证。

能加 AI 功能吗?

能——在它真正有用的地方。我们做过带 AI 翻译的 App 内语音、自动化工作流和内部 agent。AI 的范围围绕一个具体任务和可衡量的产出来定,不是首页上的一个标签。

做双语站吗?

做。英文加中文是我们最常见的组合,也交付过三语(EN / 中文 / BM)产品。双语是按架构来做的——分路由的 URL、按语言的 metadata、一套内容系统——不是事后补的翻译。

产品上线之前需要一套识别。 设计

上线之后需要有人来看。 营销

告诉我们做到什么,我们告诉你要怎么出来。

评估一个项目