Template de Criação de filhos

Storyloom AI Bedtime Story App

A React Native app for parents: pick a hero, a place and a gentle lesson, and Gemini writes, illustrates and reads aloud a bedtime story. Runs on sample stories until you connect Supabase.

18 telas
iOS e Android
Dados de exemplo
Atualizado em 4 de nov. de 2026
Versão verificada
1 cópia criada

Cópia grátis · Código completo · Sem cartão

Telas

6 telas do app em funcionamento.

O que vem incluído

Story builder: a child or animal friend, six places, eight lessons, 3/5/8 minutes and four narrator voices
Three Gemini tasks in a Supabase Edge Function: write the story, draw each page, read each page aloud
Honest staged progress: writing, each picture as it lands, recording; keeps going if you leave the screen
Reader with read-along word lighting, narration playback, sleep timer, text size and a slowly dimming end
For parents: drawn avatars only, a grown-up number check before plans and deleting data, no ads or analytics
Sample mode with no backend: two sample children, six stories and 73 bundled illustrations

Sobre este modelo

Overview

Storyloom is a bedtime story app used by parents with their child. The parent picks who the story is about (their child by first name, or one of six animal friends), where it happens, what it gently shows and how long it is. The app writes the story, draws a picture for every page and reads it aloud, then keeps it in a family library with favourites and collections.

Out of the box it runs in sample mode: no backend, everything stored on the device. Connect Supabase and a Gemini key and the same screens make real stories.

Key features

Library with tonight's idea for one of the children, keep reading, a favourites shelf, Calm/Brave/Friendship collections and every story
Builder with drawn hero and place pickers, lesson chips, an optional one-line detail, length and narrator, and the cost shown before Create
Creating screen that shows each real step and each picture as it arrives; failures get their own words and next step
Story page with Read or carry on, a pages strip, favourite, edit a page's words, draw a missing picture, share the text and delete
Reader that lights each word as it is read (recorded narration or read-along pacing), with page bars, a sleep timer and text size
Kids profiles with drawn avatars built from skin tone, hair and pajama colour, never photos
You tab with the week's free story, reader settings, the grown-up check, restore purchases and Delete my data
In-app Privacy Policy and Terms of Use, and an About screen

Screens

Welcome, add your first child, Stories (library), New story, Creating, Story, Reader, The end, Collection, Kids, a child's profile, Add a child, You, the grown-up check, Storyloom Pro, Privacy Policy, Terms of Use and About: 18 screens, all built and tested in light and dark.

AI and backend

AI runs on the server through one Supabase Edge Function (`ai`) that calls Google Gemini with your key. The app signs each install in anonymously, so there is no visible account.

write-story (2 units): title and pages with a picture brief each, JSON output, a children's safety prompt; saves the story and its pages
illustrate-page (2 units a page): one flat picture-book style, later pages drawn against page 1 so the hero stays the same
narrate (1 unit a page): each page read slowly in the chosen voice, saved as audio
A six-page story uses 20 units; the daily allowance, Pro limits and the free plan's one story a week are checked on the server
Tables kids, stories and pages with row-level security; pictures and narration in a private storage bucket, shown through signed URLs

In sample mode, Create returns a designed sample story for the chosen place and hero, with bundled pictures. Sample stories have no recorded voice: the reader's read-along lights the words at a bedtime pace.

Monetisation

Free makes one new story a week and includes Storyloom's own stories, read by one voice. Pro (monthly and yearly) makes unlimited stories in all four voices. Purchases go through RevenueCat; until you connect it, the paywall shows sample prices and says subscriptions open in the App Store version. The plans screen sits behind the grown-up check.

Setup

Connect Supabase and apply the two migrations, add the Gemini key and deploy the functions, then connect RevenueCat to sell Pro. Each step below includes the request for your coding agent.

aibedtime storieskidsparentingstory generatortext to speechgeminisupabaserevenuecatreact nativeexpo

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: 442
linhas escritas para este app: 6.550
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: Outfit
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
Server › Backend › Supabase. Apply both migrations, turn on anonymous sign-ins in the Supabase dashboard, and write the public URL and anon key to .env. Until then the app runs on sample stories.
Prompt para a IA
Connect this app to the Supabase project under Server › Backend › Supabase. Apply supabase/migrations/20261019000000_ai_kit.sql and then supabase/migrations/20261019010000_storyloom.sql. Write EXPO_PUBLIC_SUPABASE_URL and EXPO_PUBLIC_SUPABASE_ANON_KEY to .env. Remind me to turn on Authentication › Sign In / Providers › "Allow anonymous sign-ins" in the Supabase dashboard and to keep the anonymous sign-in rate limit low. Then confirm the kids, stories and pages tables exist with row-level security.
Turn on the AI
Server › API keys & secrets: add GEMINI_API_KEY (a billing-enabled key; image models have no free tier). Deploy the ai function. Keep AI_FREE_UNITS_PER_DAY at 30 or more so a 9-page story fits.
Prompt para a IA
Under Server › API keys & secrets, check that GEMINI_API_KEY is set, and set AI_FREE_UNITS_PER_DAY to 30 and AI_PRO_UNITS_PER_DAY to 500 unless I say otherwise. Deploy the Supabase Edge Function ai (supabase/functions/ai) and push its secrets. Invoke it with { "task": "usage" } as a test user and show me the answer. Then make one story from the New story tab and tell me whether writing, drawing and narration all succeeded.
Sell Pro
Server › Monetization: connect RevenueCat with a monthly and a yearly product in one offering, entitlement pro. Save the webhook secret and deploy the revenuecat-webhook function.
Prompt para a IA
Connect RevenueCat under Server › Monetization for Storyloom Pro: one offering with a monthly and a yearly product and the entitlement pro. Write EXPO_PUBLIC_REVENUECAT_IOS_KEY and EXPO_PUBLIC_REVENUECAT_ANDROID_KEY to .env. Create a long random REVENUECAT_WEBHOOK_SECRET under Server › API keys & secrets, deploy supabase/functions/revenuecat-webhook with JWT verification off, push the secret, and give me the webhook URL and Authorization header to paste into RevenueCat › Integrations › Webhooks. Update PLAN_PREVIEW in src/services/iap/index.ts to match my real prices.
Choose the stories and voices
Places, lessons, narrator voices and animal friends live in src/services/catalog; Storyloom's own six stories are in templates.ts. The server's task list (functions/ai/tasks.ts) must match.
Prompt para a IA
Show me the places, lessons, narrator voices and animal friends in src/services/catalog/index.ts and the voice mapping in the server's ai function (functions/ai/tasks.ts). Apply the changes I ask for in both files so the app and the server stay in step, keep the safety prompt in write-story, and re-run the typecheck.
Set your icon, store IDs and legal pages
Rename the app, replace the icon, retune the colours and point the legal links at your own pages. Rewrite the in-app Privacy Policy and Terms of Use for your business.
Prompt para a IA
Rename the app to the name I give you in app.json and the visible copy. Replace assets/icon.svg and assets/adaptive-icon.svg with my icon and render icon.png, adaptive-icon.png and favicon.png. Change brandSeed and the overrides in src/theme/brand.ts to my colours, keeping text contrast. Set EXPO_PUBLIC_PRIVACY_POLICY_URL, EXPO_PUBLIC_TERMS_URL and EXPO_PUBLIC_SUPPORT_URL in .env, and update src/features/legal/PrivacyScreen.tsx and TermsScreen.tsx 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 suporte

Perguntas

É 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 Storyloom AI Bedtime Story 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.