Template Maison et habitat
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 écrans
- iOS et Android
- Données d’exemple
- Mis à jour le 4 nov. 2026
- Version vérifiée
Copie gratuite · Code source complet · Sans carte bancaire
Écrans
6 écrans de l’app fonctionnelle.
Contenu
- 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
À propos de ce modèle
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.
Ce que vous obtenez
- Code source complet — Expo et React Native en TypeScript, en app dans votre espace de travail.
- Aperçu en direct — testez chaque changement dans votre navigateur ou sur votre téléphone.
- Version vérifiée — elle compile et chaque écran s’ouvre sans erreur.
- Assistant IA — modifiez tout par chat ; chaque changement consomme des crédits.
- Builds et envoi aux stores — builds iOS et Android, envoyés à l’App Store et à Google Play depuis Publier.
- Aucun crédit pour copier — la copie elle-même est gratuite.
Conçu avec la version actuelle de FluxNative.
Ce qu’il vous faut
- Un compte FluxNative — le forfait Free accepte jusqu’à 2 apps.
- Aucun backend au départ — elle tourne sur des données d’exemple jusqu’à ce que vous connectiez le vôtre.
- Creator ou plus — pour les builds natifs et l’envoi aux stores.
- Comptes de store — Apple Developer Program (99 US$ par an) et Google Play (25 US$ une fois), pour publier.
Ce que contient le code
- écrans
- 18
- fichiers dans votre copie
- 387
- lignes écrites pour cette app
- 6 981
- composants d’interface prêts à l’emploi
- 142
Textes de l’app en anglais et vietnamien
Stack technique
- 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
Tiré du package.json de cette version.
Système de design
- Titres
- Police du système
- Texte
- Police du système
- Modes clair et sombre
- Liquid Glass
- Boutons en pilule
- Cartes simples
Configuration après le fork
Votre copie s’ouvre avec l’assistant IA qui l’a créée. Suivez les étapes dans l’ordre : connectez sous Serveur ce qu’une étape demande, puis envoyez chaque 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 pour l’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 pour l’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 pour l’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 pour l’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 pour l’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.
Comment utiliser ce modèle
- Utilisez le modèle pour obtenir une copie modifiable, avec son code source, dans votre espace de travail (Modèles).
- Demandez à l’assistant IA les changements voulus, avec vos propres mots (Travailler avec l’assistant).
- Essayez chaque changement dans l’aperçu en direct ou sur votre téléphone (Aperçu).
- Avec Creator ou plus, compilez-le pour iOS et Android et envoyez-le aux stores (Vue d’ensemble de la publication).
Licence et support
Licence
L’app créée pour vous vous appartient ; le code du modèle reste à InspireUI et vous est concédé sous licence pour vos apps (Conditions › Notre propriété intellectuelle).
Aide
- Guides sur les templates, l’assistant et la publication.
- Contacter le support depuis Aide ; réponse en général sous 1 à 2 jours ouvrés.
- Dans votre copie, interrogez l’assistant IA sur n’importe quel écran ou fichier.
Créé par FluxNative
Politique de supportQuestions
Est-ce gratuit ?
Copier un template gratuit ne coûte rien, pas même des crédits ; un template Premium est un achat unique par site web. Les changements par chat et les builds consomment des crédits.
Qu’est-ce qui m’appartient ?
L’app créée pour vous vous appartient. Le code du template reste à InspireUI et vous est concédé sous licence pour vos apps (Conditions › Notre propriété intellectuelle).
Faut-il savoir coder ?
Non. Demandez des changements à l’assistant en mots simples ; le code source complet est là si vous le voulez.
Y a-t-il un backend inclus ?
Non. Une app complète nomme le backend requis et vous connectez le vôtre sous Server ; un design tourne sur des données d’exemple.
Puis-je changer le design ?
Oui. L’onglet Design règle la couleur de marque, les couleurs, les polices et les angles sans coût en crédits ; l’assistant change le reste.
Quel forfait pour publier ?
Creator ou plus compile et envoie aux stores, avec vos propres comptes Apple et Google. L’app d’un template Premium se compile avec tout forfait dès que son site web est connecté.
Puis-je télécharger le code source ?
Oui, avec Télécharger le code source ou Push vers GitHub, dès que votre espace de travail a acheté un forfait, des crédits ou un template payant. L’app d’un template Premium exige aussi son site web connecté.
Et si elle a été créée avec une version antérieure de FluxNative ?
Votre copie fonctionne telle quelle. Demandez à l’assistant de la mettre à jour pour les nouveautés comme les langues et devises de l’app ; c’est la dernière étape de configuration.
Prêt à en faire votre app ?
Partez de Hearth AI Room Redesign App et changez tout par chat. Votre copie inclut tout le code source.
Copie gratuite. Sans carte bancaire.