UStackUStack
Make Real icon

Make Real

Make Real é um projeto GitHub arquivado com o tldraw SDK que transforma UI desenhada em experiência funcional. Clone e adapte para sua versão.

Make Real

O que é Make Real?

Make Real (repositório: tldraw/make-real) é um projeto open-source associado ao tldraw SDK. Seu propósito principal é permitir que você “desenhe uma UI e a torne real”, fornecendo um starter e código de suporte para transformar UI projetada em algo funcional em uma aplicação.

O repositório foi arquivado pelo proprietário em 20 de fevereiro de 2026, tornando-o somente leitura. A página também direciona os leitores para uma demo ao vivo e recursos para construir uma versão do projeto e aprender mais via post no blog.

Principais Recursos

  • Construído com o tldraw SDK, fornecendo a base para um fluxo de trabalho de UI baseado em desenho.
  • Abordagem de repositório starter: clone o repo para construir sua própria versão do Make Real.
  • Inclui uma experiência de demo (makereal.tldraw.com) referenciada no readme do repositório.
  • Estruturado como um codebase TypeScript/Next.js (presença de next.config.js, arquivos TypeScript/TS e package.json).
  • Repositório inclui arquivos de suporte para qualidade de código e estilo (por exemplo, arquivos de config ESLint/Prettier e Tailwind).

Como Usar o Make Real

  1. Use a demo ao vivo em makereal.tldraw.com para entender o fluxo “desenhe uma UI e torne-a real”.
  2. Clone o repositório starter do GitHub (tldraw/make-real) para construir sua própria versão.
  3. Siga o README do projeto e quaisquer recursos vinculados (incluindo o post no blog referenciado) para entender como a demo funciona e como adaptá-la.
  4. Compartilhe o que você construir via comunidade Discord vinculada na página do repositório.

Casos de Uso

  • Prototipagem de fluxo de interação de UI: Desenhe uma UI visualmente e conecte-a ao comportamento do app usando a abordagem do projeto baseada no tldraw SDK.
  • Construção de uma aplicação “canvas de UI” personalizada: Use o repositório como ponto de partida para implementar seu próprio fluxo de desenho e renderização.
  • Exploração de como uma interface desenhada pode impulsionar lógica: Aprenda com a estrutura do código como elementos de UI representados no ambiente de desenho podem ser traduzidos em comportamento funcional de aplicação.
  • Ensino ou documentação de interações de produto: Use a demo e o projeto subjacente para ilustrar como uma UI projetada pode se tornar uma experiência executável.
  • Experimentação com pipelines de UI-para-app em TypeScript/Next.js: Aproveite a configuração Next.js + TypeScript existente como template para protótipos relacionados.

FAQ

  • O repositório é mantido ativamente? Não. O repositório foi arquivado pelo proprietário em 20 de fevereiro de 2026 e agora é somente leitura.

  • Onde posso experimentar o projeto online? A página do repositório aponta para uma demo em makereal.tldraw.com.

  • O que devo clonar se quiser construir minha própria versão? A página afirma que você pode clonar o repo starter fornecido para construir sua própria versão do Make Real.

  • Com qual tecnologia foi construído? O conteúdo do repositório indica que foi construído com o tldraw SDK e usa um codebase TypeScript com configuração Next.js.

Alternativas

  • Construa sua própria configuração de prototipagem de UI com tldraw: Em vez de usar este repo arquivado diretamente, comece dos conceitos do tldraw SDK e implemente seu próprio mapeamento de elementos desenhados para comportamento de aplicação.
  • Use uma abordagem geral de prototipagem-para-código: Se seu objetivo é “transformar design de UI em telas funcionais”, você pode usar outros fluxos de prototipagem que focam em gerar ou conectar comportamento de UI, lidando com a tradução design-lógica você mesmo.
  • Crie um sistema de UI impulsionado por editor: Se quiser um fluxo “desenhe para impulsionar” similar, considere alternativas que tratam UI como estado editável (por exemplo, construtores de UI baseados em estado) em vez de seguir esta estrutura específica do projeto.
  • Procure construtores de UI mantidos ativamente baseados em edição de diagramas/canvas: Como este repo está arquivado, ferramentas mais novas na categoria “editor de canvas que impulsiona comportamento de app” podem se adequar melhor a projetos de longo prazo, dependendo das suas necessidades exatas.
Make Real | UStack