Template de Casa e decoração
Hearth AI Room Redesign App
An Expo and React Native app that redesigns a photographed room in one of 12 interior styles with AI, with refine, wall colour, boards and Pro subscriptions. Runs on sample rooms with real AI redesigns until you connect Supabase.
- 18 telas
- iOS e Android
- Dados de exemplo
- Atualizado em 4 de nov. de 2026
- Versão verificada
Cópia grátis · Código completo · Sem cartão
Telas
6 telas do app em funcionamento.
O que vem incluído
- Photo in, four redesigned versions of the same room out, each with a What changed list written by the AI
- Drag-to-compare before and after, plus Refine (brush an area), wall colours and furniture swaps as new versions
- Sample mode: six real rooms with real AI redesigns made from the same photos, so the app is complete before setup
- Three AI tasks (redesign-room, refine-area, recolor-walls) on Gemini through a Supabase Edge Function
- Daily credits checked on the server: 12 a day free, 100 a day with Pro, credits returned when a task fails
- Pro through RevenueCat: sample prices until you connect RevenueCat to sell
Sobre este modelo
Overview
Hearth is an AI room redesign app. A person photographs a room, picks the room type and one of 12 styles (Japandi, Mid-century, Scandinavian, Coastal, Boho, Organic modern, Industrial, Farmhouse, Minimal, Modern, Classic, Glam), and gets four redesigned versions that keep the room's walls, windows and floor. They compare before and after, refine a version, save ideas to boards and browse finished rooms in Explore.
It is built with Expo SDK 57 and React Native on the FluxNative kernel. With an empty .env it runs in sample mode: six real room photos with AI redesigns made in advance from those exact photos, three sample boards, and the same daily credit rule the server enforces. Connecting Supabase switches every service to the live backend with no code changes.
Key features
New design in four steps: photo (camera, library or a sample room), room type, style, options (keep the layout, colour palette, budget feel), with the credit cost on the Generate button.
Designing screen that names what the AI is doing, the usual time and the time so far, then reveals the versions. Leaving keeps the job running.
Result screen with the AI picture and the room before as an inset, a drag-to-compare slider, every version, and a What changed list.
Refine (brush an area and describe the change), Walls (seven paint colours) and Furniture (swap a piece); each adds a version and keeps the others.
Boards of saved designs and Explore photos; Explore with a style of the week, room and style filters, and Use this style.
Onboarding with large room and style cards; You tab with today's credits, taste, purchases, privacy and Delete my data.
Designed states for every AI failure: credits used up, refused, offline, not set up. Nothing is charged for a failure.
Screens
Design, New design, Designing, Result, Refine, Your designs, Boards, Board, Explore, Inspiration, You, Hearth Pro, Welcome, Onboarding, Terms of use, Privacy policy and About.
AI and backend
The ai Supabase Edge Function runs three tasks with Gemini: redesign-room (4 credits: four image edits and one vision pass for the What changed lists), refine-area (3) and recolor-walls (2).
Each person signs in anonymously. Photos and results go to a private storage bucket; designs, versions, boards and board items are Postgres tables with row-level security.
The room tasks write their own rows on the server, so a design finishes even if the app is closed.
Daily allowance per user in units, taken before a task and given back when it fails; Pro gets the larger allowance from the RevenueCat webhook.
Sample mode needs no backend: the sample rooms answer with their pre-made redesigns, and the camera, library, other styles and free-text edits say they open once the AI is connected.
Monetisation
Hearth Pro is a RevenueCat subscription with weekly and yearly plans. Without RevenueCat keys the paywall shows sample prices ($6.99 a week, $49.99 a year) with the note that subscriptions open in the App Store version, and never grants access. Connect RevenueCat to sell; purchases are logged in with the Supabase user id so the webhook raises that user's daily credits from 12 to 100.
Setup
Connect Supabase and apply the two migrations, add the Gemini key and deploy the functions, then connect RevenueCat to sell Pro. The README lists every value and what is sent to the AI provider.
O que você recebe
- Código completo: Expo e React Native em TypeScript, como um app no seu espaço de trabalho.
- Prévia ao vivo: teste cada mudança no navegador ou no celular.
- Versão verificada: compila e todas as telas abrem sem erros.
- Assistente de IA: mude o que quiser pelo chat; cada mudança usa créditos.
- Builds e envio às lojas: builds de iOS e Android, enviados à App Store e ao Google Play pelo Publish.
- Copiar não gasta créditos: a cópia em si não custa nada.
Feito com a versão atual do FluxNative.
O que você precisa
- Uma conta FluxNative: o plano Free comporta até 2 apps.
- Sem backend para começar: usa dados de exemplo até você conectar o seu.
- Creator ou superior: para builds nativos e envio às lojas.
- Contas das lojas: Apple Developer Program (US$ 99 por ano) e Google Play (US$ 25 uma vez), para publicar.
O que vem no código
- telas
- 18
- arquivos na sua cópia
- 387
- linhas escritas para este app
- 6.981
- componentes de UI prontos
- 142
Textos do app em inglês e vietnamita
Stack técnica
- Expo SDK
- 57.0.22
- React Native
- 0.86.3
- React
- 19.2.8
- TypeScript
- 6.0.3
- Expo Router
- 57.0.21
- Supabase JS
- 2.112.3
- RevenueCat
- 10.9.1
Do package.json desta versão.
Design system
- Títulos
- Fonte do sistema
- Texto
- Fonte do sistema
- Modos claro e escuro
- Liquid Glass
- Botões em pílula
- Cards simples
Configuração depois do fork
Sua cópia abre com o assistente de IA que a criou. Siga os passos em ordem: conecte em Server o que um passo pedir e depois envie cada prompt.
Connect Supabase
In Server › Backend › Supabase: connect a project, apply both migrations, turn on anonymous sign-ins in the Supabase dashboard, and write the public URL and anon key to .env.
Prompt para a IAConnect this app to my Supabase project (Server › Backend › Supabase). Apply supabase/migrations/20261019000000_ai_kit.sql and then supabase/migrations/20261019120000_hearth.sql. Write EXPO_PUBLIC_SUPABASE_URL and EXPO_PUBLIC_SUPABASE_ANON_KEY to .env (keep the keys, empty, in .env.example). Remind me to turn on Authentication › Sign In / Providers › Allow anonymous sign-ins in the Supabase dashboard, because Hearth signs every person in anonymously. Then check that the designs, design_variations, boards and board_items tables exist with row-level security on.
Turn on the AI
In Server › API keys & secrets: add GEMINI_API_KEY and set AI_FREE_UNITS_PER_DAY=12 and AI_PRO_UNITS_PER_DAY=100, then deploy the ai function and push its secrets.
Prompt para a IATurn on Hearth's AI. In Server › API keys & secrets add GEMINI_API_KEY (I will paste it), AI_FREE_UNITS_PER_DAY=12 and AI_PRO_UNITS_PER_DAY=100. Deploy the ai Edge Function from supabase/functions/ai and push those secrets to it. Invoke it as a test user with { "task": "usage" } and show me the answer: it should report a limit of 12. Keep src/services/ai/allowance.ts (FREE_CREDITS_PER_DAY, PRO_CREDITS_PER_DAY) equal to the two secrets.
Sell Pro
In Server › Monetization: connect RevenueCat with an entitlement pro and weekly and yearly packages, add the public SDK keys, and deploy the webhook with REVENUECAT_WEBHOOK_SECRET.
Prompt para a IASet up Hearth Pro (Server › Monetization). Connect RevenueCat with an entitlement named pro and a current offering with a weekly and a yearly package. Write EXPO_PUBLIC_REVENUECAT_IOS_KEY and EXPO_PUBLIC_REVENUECAT_ANDROID_KEY to .env. Save a long random REVENUECAT_WEBHOOK_SECRET in Server › API keys & secrets, deploy supabase/functions/revenuecat-webhook with JWT verification off, push the secret, and tell me the webhook URL and Authorization header to enter in RevenueCat › Integrations › Webhooks. Update PLAN_PREVIEW in src/services/iap/index.ts to the prices I choose.
Choose your styles and sample rooms
Edit the 12 styles, paint colours and the Explore feed in the catalog; replace the sample rooms (photos and their AI redesigns) or keep them for the store demo.
Prompt para a IAHelp me tailor Hearth's content. The styles, room types, paint colours and Explore photos live in src/services/catalog/index.ts and src/data/interiors.ts; the sample rooms and their pre-made redesigns are in src/data/samples.ts and assets/samples (credits in assets/samples/CREDITS.md). Show me the current list of styles and ask which to keep, rename or add; when I add a style, give it a cover photo, a short line, a palette and the descriptions the AI prompt uses.
Set your icon, store IDs and legal pages
Rename the app, draw its icon, set the colours and point the legal links at your own privacy policy, terms and support pages.
Prompt para a IAMake Hearth mine: rename the app to the name I give (app.json name, slug, scheme and bundle identifiers, the welcome screen and About), redesign the icon in assets/icon.svg and assets/adaptive-icon.svg and render the PNGs, set the accent colour in src/theme/brand.ts, and write EXPO_PUBLIC_PRIVACY_POLICY_URL, EXPO_PUBLIC_TERMS_URL and EXPO_PUBLIC_SUPPORT_URL to .env (or update the in-app pages in src/features/legal) with my company's details.
Como usar este template
- Use o template para ter uma cópia editável, com o código-fonte, no seu espaço de trabalho (Templates).
- Peça ao assistente de IA as mudanças que quiser, com suas próprias palavras (Trabalhar com o assistente).
- Teste cada mudança na prévia ao vivo ou no seu celular (Prévia).
- No Creator ou superior, gere o app para iOS e Android e envie às lojas (Visão geral da publicação).
Licença e suporte
Licença
O app criado para você é seu; o código do modelo continua da InspireUI e é licenciado para uso nos seus apps (Termos › Nossa propriedade intelectual).
Ajuda
- Guias sobre templates, o assistente e a publicação.
- Falar com o suporte em Ajuda; respondemos em geral em 1–2 dias úteis.
- Na sua cópia, pergunte ao assistente de IA sobre qualquer tela ou arquivo.
Feito pelo FluxNative
Política de suportePerguntas
É grátis?
Copiar um template grátis não custa nada, nem créditos; um Premium é uma compra única por site. Mudanças pelo chat e builds usam créditos.
O que é meu?
Você é dono do app feito para você. O código do template continua da InspireUI e é licenciado para uso nos seus apps (Terms › Our intellectual property).
Preciso saber programar?
Não. Peça mudanças ao assistente com suas palavras; o código completo está lá quando quiser.
Vem com backend?
Não. Um app completo diz qual backend precisa e você conecta o seu em Server; um design usa dados de exemplo.
Posso mudar o design?
Sim. A aba Design muda cor da marca, cores, fontes e cantos sem gastar créditos; o assistente muda o resto.
Qual plano preciso para publicar?
Creator ou superior faz build e envia às lojas, com suas próprias contas Apple e Google. O app de um template Premium faz build em qualquer plano depois que o site é conectado.
Posso baixar o código?
Sim, com Download source ou Push to GitHub, depois que seu espaço de trabalho comprar um plano, créditos ou um template pago. O app de um template Premium também precisa do site conectado.
E se foi feito com um FluxNative anterior?
Sua cópia funciona como está. Peça ao assistente para atualizá-la com recursos novos, como idiomas e moedas do app; é o último passo da configuração.
Pronto para transformar no seu app?
Comece a partir de Hearth AI Room Redesign App e mude o que quiser pelo chat. Sua cópia vem com o código-fonte completo.
Cópia grátis. Sem cartão de crédito.