Rosas do Deserto é um site botânico feito sob medida para apresentar uma coleção particular de adeniums, conhecidos como rosas-do-deserto. O projeto combina fotografia, narrativa editorial e experiências interativas para transformar a visita em algo mais contemplativo do que uma galeria convencional.
A identidade visual usa fundos profundos, tons de rosa suave e verde-sálvia, tipografia editorial e movimento discreto. A experiência está disponível em português brasileiro, russo e inglês, com navegação adaptável a telas grandes e pequenas.
Visite o site: https://natadenium.vercel.app
- Galeria principal: fotografias da coleção com visualização ampliada.
- Atlas da floração: uma coleção visual independente com 20 referências de flores, filtros por cor, formato das pétalas e número de camadas.
- Comparação de flores: escolha até duas flores para observá-las lado a lado em uma área de comparação ampla.
- Calendário de cuidados: orientações sazonais sobre luz, rega, adubação, transplante e temperatura.
- Animação de floração: uma pequena narrativa SVG que percorre três etapas, do botão à flor aberta, com opção de repetir a animação.
- Jardim de pensamentos: uma experiência independente em /zen_garden, com 50 reflexões, botão para sortear outra mensagem e paisagens sonoras da natureza.
- Áudio ambiente: diferentes sons podem ser combinados; cada faixa ativa fica em repetição até ser desligada. Ao entrar no jardim independente, a música da página principal é pausada e pode ser retomada ao voltar.
- Carta do jardim: uma fotografia e uma reflexão mudam ao pedir outra carta.
- Três idiomas: português brasileiro (padrão), russo e inglês.
- Interface responsiva: navegação fixa, controles adaptados a telas pequenas e composição que respeita o conteúdo.
- Atenção à acessibilidade: textos alternativos, estados de foco visíveis e suporte à preferência por movimento reduzido.
- Vercel Web Analytics: métricas de uso na versão publicada.
O atlas é uma experiência própria, separada da galeria principal. Ele reúne referências visuais para explorar diferenças entre flores. Os filtros podem ser combinados para restringir a seleção por cor, formato das pétalas e camadas. A ferramenta de comparação permite selecionar até duas flores e observá-las lado a lado em tamanho ampliado.
O jardim também pode ser aberto diretamente, sem passar pela página principal: natadenium.vercel.app/zen_garden. As 50 reflexões abordam paciência, cuidado, natureza, limites e convivência. A paisagem sonora permite combinar gravações de chuva, pássaros, vento e outros ambientes naturais. Os créditos das gravações ficam disponíveis na própria página.
O calendário organiza recomendações por estação e apresenta tarefas práticas de cultivo. A animação de floração é uma peça visual complementar, feita com SVG e animações CSS, que mostra o desenvolvimento do botão em três momentos.
| Elemento | Objetivo |
|---|---|
| Preto e verde profundo | Criar profundidade e destacar as fotografias |
| Rosa suave e rosa empoeirado | Dialogar com as flores sem excesso de saturação |
| Verde-sálvia e tons de areia | Evocar folhas, solo e luz natural |
| Tipografia editorial | Combinar personalidade e legibilidade |
| Transparências e gradientes | Dar profundidade sem sobrecarregar a interface |
| Animações discretas | Acrescentar vida sem retirar a calma da experiência |
O objetivo não é imitar um catálogo genérico, mas criar uma pequena exposição botânica digital em que imagens, textos e ferramentas de exploração fazem parte da mesma narrativa.
- Next.js 16 — aplicação web e roteamento.
- React 19 — componentes e interface interativa.
- TypeScript — tipagem estática.
- Tailwind CSS 4 — base de estilos.
- Lucide React — ícones.
- Vercel Analytics — métricas da versão publicada.
- pnpm — gerenciamento de dependências.
- Node.js compatível com a versão do Next.js do projeto.
- pnpm.
git clone https://github.com/sunmeat/desert.git
cd desert
pnpm install
pnpm devAbra http://localhost:3000.
Para validar a versão de produção localmente:
pnpm build
pnpm startapp/
page.tsx Página inicial, idiomas, galeria e integração dos recursos
layout.tsx Layout raiz, metadados e Vercel Analytics
globals.css Estilos globais
flower-atlas.css Estilos da galeria, atlas e experiências botânicas
zen_garden/
page.tsx Página independente do Jardim de pensamentos
components/
flower-atlas.tsx Filtros e comparação de flores
care-calendar.tsx Calendário sazonal de cuidados
flower-waiting.tsx Animação de floração em SVG
garden-letter.tsx Carta visual com fotografia e reflexão
silence-garden.tsx Jardim de pensamentos e áudio ambiente
ui/
button.tsx Componente de botão reutilizável
lib/
utils.ts Funções utilitárias
public/
images/ Fotografias da coleção
audio/ Faixas de áudio utilizadas pelo site
icon.svg Ícone do site
O português brasileiro é o idioma padrão. A interface também está disponível em russo e inglês.
| Código | Idioma |
|---|---|
| PT 🇧🇷 | Português brasileiro |
| RU 🇷🇺 | Русский |
| EN 🇺🇸 | English |
Ao adicionar ou alterar uma experiência, mantenha os textos sincronizados nas três versões.
As fotografias locais da coleção ficam em public/images/. Para atualizar a galeria principal:
- Adicione as imagens à pasta apropriada.
- Atualize a lista de imagens, legendas e textos alternativos em
app/page.tsx. - Revise os textos em português brasileiro, russo e inglês.
- Teste a galeria e a navegação em telas grandes e pequenas.
Os exemplos visuais do Atlas da floração são definidos separadamente em components/flower-atlas.tsx; sua lista de imagens e metadados não depende da galeria principal. Ao atualizar o atlas, preserve os valores usados pelos filtros e confira a seleção para comparação.
Os arquivos de áudio usados no site ficam em public/audio/. Ao trocar uma faixa, verifique se o caminho está correto e mantenha os créditos das gravações na página do Jardim de pensamentos.
O projeto está hospedado na Vercel. Para configurar uma nova implantação:
- Importe o repositório do GitHub para um projeto Next.js na Vercel.
- Use o gerenciador de pacotes pnpm.
- Confira o comando de build
pnpm build. - Publique a branch principal e valide a versão publicada.
Site: https://natadenium.vercel.app
Jardim de pensamentos: https://natadenium.vercel.app/zen_garden
Feito para celebrar a beleza das rosas-do-deserto por meio de fotografia, cuidado e experiências digitais contemplativas.
«Пустынные розы» — сайт, созданный на заказ для представления частной коллекции адениумов. Проект объединяет ботаническую фотографию, редакционный рассказ и интерактивные инструменты, превращая обычный просмотр изображений в спокойное исследование растений.
Визуальная система построена на глубоких тёмных оттенках, мягком розовом, шалфейном зелёном, выразительной типографике и сдержанной анимации. Сайт доступен на бразильском португальском, русском и английском языках и адаптируется к большим и маленьким экранам.
Открыть сайт: https://natadenium.vercel.app
- Основная галерея: фотографии коллекции с увеличенным просмотром.
- Атлас цветения: отдельная визуальная коллекция из 20 примеров цветов с фильтрами по цвету, форме лепестков и количеству слоёв.
- Сравнение цветов: выбор до двух цветов для крупного просмотра рядом друг с другом.
- Календарь ухода: сезонные рекомендации по освещению, поливу, подкормке, пересадке и температуре.
- Анимация цветения: SVG-история из трёх этапов, от бутона до раскрытого цветка, с возможностью запустить её повторно.
- Сад мыслей: самостоятельная страница /zen_garden с 50 размышлениями, кнопкой для смены текста и звуковыми ландшафтами природы.
- Фоновое аудио: разные звуки природы можно сочетать; активные дорожки повторяются до отключения. При переходе в отдельный сад музыка главной страницы ставится на паузу и может продолжиться после возвращения.
- Письмо из сада: при запросе нового письма меняются фотография и размышление.
- Три языка: бразильский португальский по умолчанию, русский и английский.
- Адаптивный интерфейс: закреплённая навигация и элементы управления для небольших экранов.
- Доступность: альтернативные описания изображений, заметный фокус клавиатуры и поддержка настройки уменьшения анимации.
- Vercel Web Analytics: метрики использования опубликованной версии.
Атлас существует отдельно от основной галереи и помогает изучать визуальные различия между цветами. Фильтры можно комбинировать: цвет, форма лепестков и количество слоёв. В режиме сравнения можно выбрать максимум два цветка и рассмотреть их рядом в крупном формате.
Сад открывается напрямую по адресу natadenium.vercel.app/zen_garden. В нём собраны 50 размышлений о терпении, заботе, природе, личных границах и отношениях между людьми. Звуковая среда позволяет сочетать записи дождя, птиц, ветра и других природных явлений. Ссылки на источники аудио доступны внизу страницы.
Календарь группирует рекомендации по сезонам и предлагает практические задачи по уходу за растениями. Отдельная анимация цветения создана на SVG и CSS и показывает три состояния: бутон, раскрытие и цветок.
| Элемент | Задача |
|---|---|
| Почти чёрные и тёмно-зелёные оттенки | Создать глубину и выделить фотографии |
| Мягкий и пыльно-розовый | Поддержать тему цветов без чрезмерной насыщенности |
| Шалфейный зелёный и песочные тона | Передать природные ассоциации |
| Редакционная типографика | Сочетать характер и удобочитаемость |
| Прозрачность и градиенты | Добавить глубину, не перегружая интерфейс |
| Ненавязчивая анимация | Сохранить ощущение спокойствия и живого движения |
Это не типовой интернет-каталог, а небольшая цифровая ботаническая выставка, где фотографии, тексты и интерактивные инструменты складываются в единый рассказ.
- Next.js 16 — веб-приложение и маршрутизация.
- React 19 — компоненты и интерактивный интерфейс.
- TypeScript — статическая типизация.
- Tailwind CSS 4 — основа стилизации.
- Lucide React — иконки.
- Vercel Analytics — метрики опубликованного сайта.
- pnpm — управление зависимостями.
- Node.js, совместимый с используемой версией Next.js.
- pnpm.
git clone https://github.com/sunmeat/desert.git
cd desert
pnpm install
pnpm devОткройте http://localhost:3000.
Проверка production-сборки:
pnpm build
pnpm startapp/
page.tsx Главная страница, языки, галерея и интеграция функций
layout.tsx Корневой layout, метаданные и Vercel Analytics
globals.css Глобальные стили
flower-atlas.css Стили галереи, атласа и ботанических разделов
zen_garden/
page.tsx Отдельная страница Сада мыслей
components/
flower-atlas.tsx Фильтры и сравнение цветов
care-calendar.tsx Сезонный календарь ухода
flower-waiting.tsx SVG-анимация цветения
garden-letter.tsx Письмо с фотографией и размышлением
silence-garden.tsx Сад мыслей и фоновое аудио
ui/
button.tsx Переиспользуемая кнопка
lib/
utils.ts Вспомогательные функции
public/
images/ Фотографии коллекции
audio/ Аудиодорожки сайта
icon.svg Иконка сайта
Язык по умолчанию — бразильский португальский. Также доступны русский и английский.
| Код | Язык |
|---|---|
| PT 🇧🇷 | Бразильский португальский |
| RU 🇷🇺 | Русский |
| EN 🇺🇸 | Английский |
При изменении или добавлении функций обновляйте тексты во всех трёх версиях.
Локальные фотографии основной коллекции хранятся в public/images/. Чтобы обновить галерею:
- Добавьте фотографии в соответствующую папку.
- Обновите список изображений, подписи и альтернативные описания в
app/page.tsx. - Проверьте тексты на бразильском португальском, русском и английском.
- Протестируйте галерею и навигацию на больших и маленьких экранах.
Примеры для Атласа цветения определены отдельно в components/flower-atlas.tsx; они не зависят от основной галереи. При изменении атласа сохраняйте значения, используемые фильтрами, и проверяйте выбор для сравнения.
Аудиофайлы находятся в public/audio/. После замены дорожки проверьте её путь и не удаляйте ссылки на источники записей со страницы Сада мыслей.
Проект размещён на Vercel. Для настройки нового развёртывания:
- Импортируйте GitHub-репозиторий в Vercel как проект Next.js.
- Используйте менеджер пакетов pnpm.
- Проверьте команду сборки
pnpm build. - Опубликуйте основную ветку и проверьте работающую версию сайта.
Сайт: https://natadenium.vercel.app
Сад мыслей: https://natadenium.vercel.app/zen_garden
Проект создан, чтобы показать красоту пустынных роз через фотографию, заботу и спокойные цифровые впечатления.
Desert Roses is a custom-built website for presenting a private collection of adeniums, commonly known as desert roses. It brings together botanical photography, editorial storytelling, and interactive tools to make browsing feel more like a quiet exploration than a conventional image gallery.
The visual identity combines deep backgrounds, muted pink and sage-green accents, editorial typography, and restrained motion. The experience is available in Brazilian Portuguese, Russian, and English, with layouts designed for both large and small screens.
Visit the website: https://natadenium.vercel.app
- Main gallery: collection photography with an enlarged image view.
- Bloom Atlas: an independent visual collection of 20 flower references, with filters for color, petal shape, and number of layers.
- Flower comparison: select up to two flowers and view them side by side in a spacious comparison area.
- Care calendar: seasonal guidance covering light, watering, feeding, repotting, and temperature.
- Bloom animation: a three-stage SVG story from bud to open flower, with a replay control.
- Garden of Thoughts: a standalone experience at /zen_garden, featuring 50 reflections, a button for another thought, and natural soundscapes.
- Ambient audio: multiple nature sounds can be combined, and each active track loops until turned off. Entering the standalone garden pauses the homepage music, which can resume when returning.
- Garden letter: request another letter to reveal a different photograph and reflection.
- Three languages: Brazilian Portuguese by default, Russian, and English.
- Responsive interface: sticky navigation and controls adapted for smaller screens.
- Accessibility-minded details: alternative image text, visible keyboard focus, and support for reduced-motion preferences.
- Vercel Web Analytics: usage metrics for the published website.
The Atlas is a standalone feature, separate from the main gallery. It helps visitors explore visual differences between flowers. Filters can be combined across color, petal shape, and number of layers. The comparison tool supports up to two selected flowers and displays them side by side at a larger scale.
The garden can be opened directly at natadenium.vercel.app/zen_garden, without first visiting the homepage. Its 50 reflections explore patience, care, nature, boundaries, and relationships. Visitors can layer recordings of rain, birds, wind, and other natural environments. Audio source credits are available at the bottom of the page.
The care calendar groups practical plant-care suggestions by season. A separate SVG and CSS animation presents the stages of a flower’s development: bud, opening, and bloom.
| Element | Purpose |
|---|---|
| Near-black and deep green | Create depth and give photography the spotlight |
| Soft and dusty pink | Echo the petals without oversaturating the interface |
| Sage green and sandy tones | Introduce subtle references to foliage, soil, and natural light |
| Editorial typography | Balance personality with readability |
| Transparency and gradients | Add depth without visual clutter |
| Restrained animation | Bring the interface to life while preserving a calm atmosphere |
Rather than looking like a generic catalog, the website aims to feel like a small digital botanical exhibition, where photographs, writing, and interactive tools belong to one visual story.
- Next.js 16 — web application and routing.
- React 19 — components and interactive UI.
- TypeScript — static typing.
- Tailwind CSS 4 — styling foundation.
- Lucide React — icons.
- Vercel Analytics — production usage metrics.
- pnpm — dependency management.
- Node.js compatible with the Next.js version used by the project.
- pnpm.
git clone https://github.com/sunmeat/desert.git
cd desert
pnpm install
pnpm devOpen http://localhost:3000.
To validate a production build locally:
pnpm build
pnpm startapp/
page.tsx Homepage, languages, gallery, and feature integration
layout.tsx Root layout, metadata, and Vercel Analytics
globals.css Global styles
flower-atlas.css Gallery, Atlas, and botanical experience styles
zen_garden/
page.tsx Standalone Garden of Thoughts route
components/
flower-atlas.tsx Flower filters and comparison
care-calendar.tsx Seasonal care calendar
flower-waiting.tsx SVG bloom animation
garden-letter.tsx Photo and reflection card
silence-garden.tsx Garden of Thoughts and ambient audio
ui/
button.tsx Reusable button component
lib/
utils.ts Utility functions
public/
images/ Collection photography
audio/ Audio tracks used by the website
icon.svg Website icon
Brazilian Portuguese is the default language. Russian and English are also available.
| Code | Language |
|---|---|
| PT 🇧🇷 | Brazilian Portuguese |
| RU 🇷🇺 | Russian |
| EN 🇺🇸 | English |
When adding or changing a feature, keep the interface copy aligned across all three languages.
Local photographs for the main collection live in public/images/. To update the main gallery:
- Add the new images to the appropriate folder.
- Update the image list, captions, and alternative text in
app/page.tsx. - Review copy in Brazilian Portuguese, Russian, and English.
- Test the gallery and navigation on large and small screens.
The Bloom Atlas examples are defined separately in components/flower-atlas.tsx; they are independent of the main gallery. When updating the Atlas, preserve the metadata used by the filters and test the two-flower comparison.
Audio files used by the website live in public/audio/. After replacing a track, check its path and preserve the recording credits on the Garden of Thoughts page.
The project is hosted on Vercel. To set up a new deployment:
- Import the GitHub repository into Vercel as a Next.js project.
- Use pnpm as the package manager.
- Verify the build command is
pnpm build. - Deploy the main branch and check the published website.
Website: https://natadenium.vercel.app
Garden of Thoughts: https://natadenium.vercel.app/zen_garden
Made to celebrate desert roses through photography, thoughtful care, and calm digital experiences.