My Beloved Archive

Crie um aplicativo mobile completo, bonito, funcional e visualmente sofisticado chamado provisoriamente de “Archive”, criado para registrar e organizar tudo que uma pessoa gosta, suas preferências, desejos, memórias e momentos importantes.

O aplicativo deve parecer uma mistura de diário pessoal, arquivo vintage, coleção de memórias e catálogo pessoal, e não apenas um aplicativo comum de notas.

CONCEITO CENTRAL

A proposta é criar um “arquivo pessoal” de alguém que você ama: um lugar onde seja possível registrar pequenas coisas que essa pessoa gosta, comentários que ela fez, músicas, roupas, marcas, presentes que gostaria de receber, lugares, comidas, filmes, jogos, promessas e momentos especiais.

A experiência deve transmitir a sensação de estar abrindo uma caixa antiga cheia de fotografias, fitas cassete, discos de vinil, bilhetes, etiquetas, cartas e pequenos objetos pessoais.

O aplicativo deve ser extremamente agradável de navegar, com microinterações delicadas, animações suaves e elementos que pareçam objetos físicos.

IMPORTANTE:

A estética pode ter influência de tecnologia retrô, computadores antigos, VHS, Hi-Fi, fitas cassete e interfaces dos anos 80/90/2000.

A atmosfera pode lembrar discretamente obras como Serial Experiments Lain e Neon Genesis Evangelion através de conceitos de tecnologia retrô, interfaces antigas, tons nostálgicos e sensação de arquivo digital.

NÃO utilizar personagens, cenas, logos, nomes, símbolos ou elementos diretamente copiados dessas obras.

Essas referências devem influenciar SOMENTE a atmosfera visual.

O conteúdo do aplicativo deve continuar sendo sobre a pessoa, suas preferências e memórias.

A interface deve continuar fofa, elegante, acolhedora e agradável.

1. TELA INICIAL

A Home deve parecer a página principal de um arquivo pessoal.

Título:

“♡ My Archive”

ou permitir que o usuário personalize o nome.

A tela pode ter:

pequeno relógio digital retrô;

data atual;

uma foto ou polaroid destacada;

contador de memórias;

“última coisa adicionada”;

acesso rápido às categorias;

uma pequena frase ou anotação favorita;

botão central “+ Adicionar”;

seção “Favoritos”;

seção “Recentemente adicionados”.

Criar uma sensação visual de uma mesa ou arquivo antigo, mas sem exagerar nos elementos.

A Home deve ser organizada e limpa.

2. NAVEGAÇÃO PRINCIPAL

Usar uma barra de navegação inferior com:

Home

Buscar

Adicionar

Favoritos

Configurações

O botão “Adicionar” deve ser visualmente destacado.

Ao pressioná-lo, abrir um menu rápido com:

Música

Playlist

Marca

Roupa

Presente

Comida

Filme/Série

Anime/Mangá

Jogo

Livro

Lugar

Frase/Comentário

Memória

Promessa

Nota

3. MÚSICAS

Criar uma seção completa para registrar músicas favoritas.

Cada música deve permitir:

nome;

artista;

álbum;

gênero;

nota;

tags;

observações;

motivo pelo qual a pessoa gosta;

data em que foi adicionada;

capa do álbum;

link externo opcional.

Mostrar músicas em formato de coleção.

Possibilitar visualizações diferentes:

lista;

capas de álbuns;

coleção de discos;

coleção de fitas cassete.

4. PLAYLISTS

Permitir criar playlists personalizadas.

Cada playlist deve ter:

nome;

descrição;

lista de músicas;

tags;

data de criação;

quantidade de músicas;

capa personalizada.

As capas das playlists devem poder ser representadas como:

fita cassete;

disco de vinil;

CD;

capa de álbum;

rádio antigo;

Walkman;

fotografia;

polaroid.

Permitir escolher cores e pequenas decorações para cada playlist.

Criar uma visualização de coleção onde as playlists aparecem como objetos físicos guardados em uma estante.

Exemplo:

“songs he loves” “late night” “driving” “nostalgia” “our songs”

Não preencher automaticamente essas playlists; deixar o usuário criar e personalizar.

5. MARCAS

Criar uma seção “Brands”.

Cada marca pode conter:

nome;

logo/foto;

categoria;

produtos favoritos;

produtos desejados;

observações;

nível de preferência de 1 a 5 estrelas.

Categorias:

roupas;

tênis;

tecnologia;

música;

acessórios;

casa;

beleza;

outros.

Mostrar as marcas como pequenas etiquetas ou cartões vintage.

6. ROUPAS & ESTILO

Criar um catálogo pessoal de roupas.

Cada item pode conter:

foto;

marca;

tipo de peça;

cor;

tamanho;

modelo;

preço aproximado;

link;

se já possui;

se gostaria de possuir;

observações;

tags.

Criar categorias:

camisetas;

calças;

jaquetas;

tênis;

acessórios;

relógios;

bolsas;

outras peças.

Adicionar uma seção:

“Looks que ele usaria”

onde o usuário pode montar combinações de peças.

7. PRESENTES

Criar uma seção de wishlist e ideias de presentes.

Cada presente deve conter:

nome;

foto;

preço;

faixa de preço;

marca;

loja;

link;

prioridade;

ocasião;

motivo pelo qual ele gostaria;

observações;

status.

Status:

ideia;

pesquisando;

quero comprar;

comprado;

entregue.

Adicionar uma funcionalidade muito importante chamada:

“Ele mencionou isso”

Permitir registrar rapidamente algo que a pessoa comentou casualmente.

Exemplo:

“Ele comentou que gostaria de ter um toca-discos.”

Esses itens devem aparecer como ideias de presentes futuras.

8. PROMESSAS

Criar uma seção visualmente semelhante a uma caixa de cartas ou bilhetes.

Cada promessa deve conter:

texto;

data;

contexto;

pessoa relacionada;

status;

observações.

Permitir marcar:

promessa para nós;

promessa pessoal;

quero cumprir algum dia;

cumprida.

As promessas cumpridas devem permanecer arquivadas.

9. BONS MOMENTOS / MEMÓRIAS

Criar uma seção de memórias com estética de álbum fotográfico vintage.

Cada memória pode conter:

título;

data;

local;

fotos;

descrição;

pessoas;

música associada;

tags;

pequena nota pessoal.

Visualizações:

Álbum

Fotos em formato Polaroid.

Timeline

Uma linha do tempo cronológica.

Mapa

Memórias organizadas por localização.

Adicionar animação suave ao abrir uma memória.

10. “COISAS QUE ELE DISSE”

Criar uma seção específica para pequenas informações descobertas casualmente.

Exemplos:

“Ele disse que gosta de relógios antigos.”

“Ele comentou que gostaria de conhecer determinado lugar.”

“Ele não gosta de bebidas muito doces.”

Cada entrada deve conter:

texto;

data;

categoria;

contexto;

tags;

importância.

Adicionar opção:

“Transformar em ideia de presente”

para converter rapidamente uma anotação em item da wishlist.

11. FAVORITOS

Criar uma área central chamada:

“♡ Favorites”

Ela deve reunir os itens mais importantes.

Categorias:

música favorita;

artista favorito;

marca favorita;

comida favorita;

filme favorito;

anime favorito;

jogo favorito;

lugar favorito;

roupa favorita;

presente desejado.

Permitir ao usuário escolher manualmente o que aparece nessa página.

12. COMIDAS & BEBIDAS

Criar uma seção gastronômica.

Categorias:

comidas favoritas;

bebidas;

sobremesas;

restaurantes;

pratos favoritos;

coisas que não gosta;

coisas que gostaria de experimentar.

Usar sistema simples:

❤️ Ama ♡ Gosta ○ Talvez × Não gosta

Permitir adicionar foto e observações.

13. FILMES, SÉRIES, ANIMES E MANGÁS

Criar uma seção de entretenimento.

Categorias:

filmes;

séries;

anime;

mangá;

documentários.

Cada item pode ter:

título;

imagem;

gênero;

nota;

status;

observação;

“assistimos juntos”;

“quero assistir com ele”.

Status:

quero assistir;

assistindo;

terminado;

favorito.

14. JOGOS

Criar uma seção de jogos com:

nome;

plataforma;

gênero;

imagem;

nota;

status;

jogos favoritos;

jogos que gostaria de jogar;

jogos que vocês jogaram juntos.

15. LIVROS

Criar uma pequena biblioteca pessoal.

Cada livro pode conter:

capa;

título;

autor;

gênero;

nota;

status;

observações;

frases/anotações pessoais.

Mostrar os livros como uma estante.

16. LUGARES

Criar uma seção para lugares.

Categorias:

lugares que ele gosta;

lugares onde vocês estiveram;

lugares que ele quer conhecer;

lugares que você quer levá-lo;

restaurantes;

viagens.

Permitir:

foto;

endereço;

localização;

nota;

observações.

Criar visualização em lista e mapa.

17. CAIXA DE LEMBRANÇAS

Criar uma área especial chamada:

“Memory Box”

Essa seção deve parecer uma caixa física antiga.

O usuário pode colocar dentro:

fotos;

frases;

músicas;

pequenos textos;

memórias;

bilhetes;

imagens;

objetos digitais.

Adicionar uma função:

“Surprise me”

Ao tocar, o aplicativo abre aleatoriamente uma lembrança.

A animação deve parecer abrir uma caixa e retirar uma lembrança.

18. BUSCA GLOBAL

Criar busca que pesquise em TODO o aplicativo.

Exemplo:

pesquisar “jaqueta”

deve encontrar:

roupas;

marcas;

presentes;

comentários;

memórias;

favoritos.

Mostrar resultados agrupados por categoria.

Adicionar filtros por:

categoria;

tags;

data;

favoritos.

19. TAGS

Permitir criar tags personalizadas.

Exemplos:

#nostalgia #presentes #verão #rock #anime #roupas #importante #memórias #ideias

As tags devem poder ser usadas em praticamente todas as categorias.

20. SISTEMA DE FAVORITOS

Qualquer item do aplicativo pode receber uma estrela ou coração.

Ao favoritar, ele aparece automaticamente na área de favoritos.

Permitir remover sem excluir o item original.

21. TEMAS VISUAIS

Criar vários temas selecionáveis.

TEMA 1 — CASSETE VINTAGE

Cores:

creme;

bege;

marrom;

vermelho queimado;

preto suave.

Elementos:

fitas cassete;

etiquetas;

papel envelhecido;

pequenos adesivos;

textura analógica.

TEMA 2 — HI-FI RETRO

Cores:

preto;

creme;

prata;

azul escuro.

Elementos:

discos;

aparelhos de som;

botões físicos;

equalizadores;

pequenos displays digitais.

TEMA 3 — SOFT RETRO

Cores:

rosa antigo;

creme;

lavanda;

azul pastel;

marrom claro.

Elementos:

papel;

flores pequenas;

adesivos;

polaroids;

fitas decorativas.

Esse deve ser o tema mais fofo.

TEMA 4 — RETRO COMPUTER

Cores:

cinza;

preto;

verde de monitor antigo;

azul escuro.

Elementos:

janelas antigas;

pixels;

cursores;

pequenos displays;

ícones retrô.

A inspiração deve ser tecnológica e nostálgica, sem copiar nenhuma interface específica.

TEMA 5 — VHS

Cores:

preto;

cinza;

azul;

vermelho escuro.

Elementos:

fitas VHS;

labels;

timestamps;

miniaturas;

ruído analógico sutil.

TEMA 6 — DARK VINTAGE

Cores:

vinho;

marrom escuro;

preto;

creme;

dourado envelhecido.

Atmosfera mais elegante e misteriosa.

TEMA 7 — Y2K RETRO

Cores:

branco;

azul claro;

prata;

cinza.

Elementos:

CDs;

transparências;

interfaces antigas;

plástico translúcido;

pequenos elementos tecnológicos.

TEMA 8 — COZY DIARY

Cores:

verde sálvia;

creme;

rosa queimado;

marrom claro.

Elementos:

diário;

folhas;

adesivos;

fotografias;

papel artesanal.

22. PERSONALIZAÇÃO DO TEMA

Não limitar o usuário a temas prontos.

Permitir personalizar:

cor principal;

cor secundária;

fundo;

textura;

estilo dos cartões;

estilo dos ícones;

fonte;

decoração;

molduras;

tipo de capa das playlists.

Criar uma prévia em tempo real.

23. SISTEMA DE DECORAÇÃO

Adicionar pequenos elementos decorativos que podem ser usados nas páginas:

adesivos;

estrelas;

corações;

flores;

fitas;

selos;

etiquetas;

clips;

pequenos desenhos;

carimbos.

Eles devem ser opcionais para não deixar a interface poluída.

24. MICROINTERAÇÕES

Adicionar animações pequenas e elegantes:

botão físico pressionando;

página virando;

fita cassete deslizando;

disco girando;

polaroid aparecendo;

etiqueta sendo colada;

caixa de memória abrindo;

pequenos efeitos de cursor.

As animações devem ser rápidas e suaves.

Não utilizar animações excessivas.

25. ESTILO VISUAL

A interface deve combinar:

vintage + fofo + nostálgico + tecnológico + pessoal.

Evitar:

aparência corporativa;

excesso de neon;

excesso de elementos de anime;

interface genérica de aplicativo de notas;

excesso de sombras;

excesso de gradientes;

visual infantil demais.

A inspiração deve vir de objetos físicos antigos transformados em interface digital.

26. TIPOGRAFIA

Usar uma combinação de:

uma fonte limpa e moderna para informações;

uma fonte monoespaçada para elementos tecnológicos;

uma fonte de máquina de escrever ou manuscrita para pequenos detalhes.

A legibilidade deve ser prioridade.

27. CARTÕES

Os cartões devem parecer objetos físicos.

Exemplos:

Polaroid;

ficha de arquivo;

etiqueta;

envelope;

capa de disco;

cassete;

cartão de biblioteca;

página de diário.

Cada categoria pode ter um estilo de cartão diferente.

28. PRIVACIDADE

Como o aplicativo contém informações pessoais, incluir:

bloqueio por Face ID/biometria;

senha;

ocultar conteúdo da prévia de notificações;

opção de bloquear determinadas categorias;

exportar dados;

backup;

apagar dados.

29. CONFIGURAÇÕES

Criar configurações para:

tema;

cores;

fonte;

animações;

sons;

biometria;

notificações;

backup;

exportação;

gerenciamento de dados.

30. NOTIFICAÇÕES E LEMBRETES

Permitir criar lembretes para:

aniversários;

datas importantes;

promessas;

presentes;

lugares que gostaria de visitar;

itens da wishlist;

memórias.

Não tornar as notificações invasivas.

31. EXPERIÊNCIA DE ADIÇÃO RÁPIDA

O usuário deve conseguir adicionar algo em poucos segundos.

Ao tocar no botão “+”, mostrar:

“o que você quer guardar?”

🎵 Música 🎁 Presente 💬 Coisa que ele disse 📸 Memória 👕 Roupa 🏷️ Marca 🍜 Comida 📍 Lugar 🫶 Promessa ⭐ Nota

Depois abrir um formulário simples.

32. DASHBOARD

A Home pode mostrar pequenos indicadores:

“47 músicas” “12 marcas” “8 presentes” “23 memórias” “5 promessas” “16 coisas que ele mencionou”

Esses números devem ser discretos e decorativos.

33. EMPTY STATES

Quando uma categoria estiver vazia, não mostrar uma tela fria.

Exemplo:

“Esta gaveta ainda está vazia ♡”

“Talvez ele mencione alguma coisa que você queira guardar aqui.”

Usar pequenas ilustrações vintage.

34. DESIGN RESPONSIVO

Priorizar experiência mobile.

Criar:

cards adaptáveis;

navegação confortável com uma mão;

botões grandes o suficiente para toque;

espaçamento agradável;

suporte a telas pequenas;

suporte a modo claro e escuro quando aplicável.

35. ARQUITETURA

Organizar o aplicativo de maneira modular para que novas categorias possam ser adicionadas posteriormente.

Estrutura conceitual:

Home → categorias → itens → detalhes → favoritos

Busca → resultados globais

Adicionar → criação rápida

Favoritos → itens salvos

Configurações → aparência → privacidade → dados

36. PRINCÍPIO MAIS IMPORTANTE

O aplicativo deve fazer o usuário sentir:

“Eu estou guardando pequenas partes dessa pessoa em um lugar só.”

Ele deve parecer íntimo, nostálgico, bonito e cuidadosamente montado.

Não deve parecer um CRM, banco de dados ou aplicativo corporativo.

Deve parecer uma caixa de lembranças digital, com estética vintage e tecnológica.

Priorizar:

beleza;

facilidade de uso;

organização;

personalização;

sensação emocional;

pequenas interações prazerosas.

Criar uma interface completa e navegável, com todas as telas principais, estados vazios, formulários, cartões, menus, modais, animações e componentes necessários para que o aplicativo pareça um produto real e pronto para uso.

Rodar localmente

Precisa de Node.js 20+ e npm.

npm install
cp .env.example .env   # preencha com a URL e a anon key do Supabase (ou deixe vazio para usar só local)
npm run dev            # http://localhost:8080
npm test

Publicação

O site roda na Vercel, ligado ao GitHub: cada push na main publica sozinho. Variáveis na Vercel: VITE_SUPABASE_URL e VITE_SUPABASE_ANON_KEY. Banco e regras de acesso: supabase/migrations/.

Acesso (só o casal)

O arquivo é um só, compartilhado por duas pessoas:

1. Rode as migrações de supabase/migrations/ em ordem no SQL Editor.
2. Cadastre os dois e-mails que podem entrar: insert into public.members (email) values ('[email protected]'), ('[email protected]');
3. Em Authentication → Users → Add user, crie os dois usuários com esses e-mails.
4. Em Authentication → Sign In / Providers, desligue "Allow new users to sign up", mantenha "Confirm email" ligado e deixe só o provedor Email ativo.
5. Em Authentication → URL Configuration, coloque o endereço da Vercel em Site URL e em Redirect URLs.