429 lines
16 KiB
TypeScript
429 lines
16 KiB
TypeScript
import {
|
||
Body,
|
||
Button,
|
||
Container,
|
||
Column,
|
||
Head,
|
||
Hr,
|
||
Html,
|
||
Img,
|
||
Link,
|
||
Preview,
|
||
Row,
|
||
Section,
|
||
Text,
|
||
} from "@react-email/components";
|
||
import { Tailwind } from "@react-email/tailwind";
|
||
import * as React from "react";
|
||
|
||
const baseUrl = "https://files.graff.tech/mail2";
|
||
|
||
function GraffEmail() {
|
||
return (
|
||
<Html>
|
||
<Head />
|
||
<Preview>Интерактивный инструмент продаж для застройщиков</Preview>
|
||
<Tailwind>
|
||
<Body className="bg-white my-auto mx-auto font-sans">
|
||
<Container className="mx-auto max-w-[600px]">
|
||
<Section className="p-4 pb-0 mb-10">
|
||
<Button href="https://graff.tech" target="_blank">
|
||
<Img
|
||
src={`${baseUrl}/logo.png`}
|
||
alt=""
|
||
width={104}
|
||
className="mb-10"
|
||
/>
|
||
</Button>
|
||
<Text className="text-[#798FFF] font-semibold text-[32px] text-wrap leading-[32px]">
|
||
Интерактивный инструмент продаж для застройщиков
|
||
</Text>
|
||
<Text className="mb-10 leading-snug">
|
||
Помогаем бизнесу эффективно демонстрировать свой объект.
|
||
<br />
|
||
Продавать больше и быстрее.
|
||
</Text>
|
||
<Button
|
||
href="tel:+78007700076"
|
||
className="w-full bg-[#798FFF] rounded-full flex justify-center items-center text-white py-[8px] font-semibold sm:w-fit sm:px-[24px]"
|
||
style={{ alignItems: "center", justifyContent: "center" }}
|
||
>
|
||
Связаться
|
||
</Button>
|
||
</Section>
|
||
|
||
<Section className="mb-16 px-4 rounded rounded-2 border overflow-hidden">
|
||
<Img
|
||
src={`${baseUrl}/image1.gif`}
|
||
alt=""
|
||
width={"100%"}
|
||
className="rounded-[8px]"
|
||
/>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Text className="text-[#798FFF] font-semibold text-[24px] leading-[24px] mt-0">
|
||
Функциональные <br /> возможности
|
||
</Text>
|
||
<Text className="leading-snug mb-10">
|
||
Интерактивная презентация увлекает покупателей и предоставляет
|
||
актуальную информацию о жилом комплексе.
|
||
<br />
|
||
Отвечает на интересующие вопросы, показывает особенности
|
||
и преимущества объекта.
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/1.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Вся инфраструктура на одном экране
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/2.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Виртуальный тур по жилому комплексу
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/3.gif`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Конфигуратор интерьера
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/4.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Параметрический поиск квартир
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/5.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Интеграция с CRM-системой
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/6.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Любой рендер за несколько секунд
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/7.gif`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Формирование вишлиста
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/8.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Отправка коммерческого предложения
|
||
</Text>
|
||
|
||
<Img
|
||
src={`${baseUrl}/features/9.jpg`}
|
||
alt=""
|
||
className="mb-3 rounded-[8px]"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="font-bold mb-3 text-[14px]">
|
||
Экскурсия в виртуальной реальности
|
||
</Text>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Text className="text-[#798FFF] font-semibold text-[24px] leading-[24px]">
|
||
Эффективность инструмента продаж в цифрах
|
||
</Text>
|
||
<Text className="mb-10 leading-snug">
|
||
За 10 лет работы с застройщиками, реализовали 21 проект
|
||
<br />и собрали подробную статистику
|
||
</Text>
|
||
<Hr className="mb-6 border-[#F0F2F8]" />
|
||
<Text className="text-[#798FFF] text-[64px]">18%</Text>
|
||
<Text className="leading-snug">
|
||
увеличения конверсии
|
||
<br />
|
||
из консультации в бронирование
|
||
</Text>
|
||
|
||
<Hr className="mb-6 border-[#F0F2F8]" />
|
||
<Text className="text-[#798FFF] text-[64px]">12%</Text>
|
||
<Text className="leading-snug">
|
||
увеличения конверсии
|
||
<br />
|
||
из бронирования в продажу
|
||
</Text>
|
||
|
||
<Hr className="mb-6 border-[#F0F2F8]" />
|
||
<Text className="text-[#798FFF] text-[64px]">x2</Text>
|
||
<Text className="leading-snug">
|
||
сокращает время
|
||
<br />
|
||
реализации проекта
|
||
</Text>
|
||
</Section>
|
||
<Section className="px-4">
|
||
<Text className="text-[#798FFF] text-[24px] font-semibold">
|
||
Graff.estate stream – демонстрация жилого комплекса в браузере
|
||
</Text>
|
||
<Text className="leading-snug">
|
||
Высокий уровень графики и полное погружение покупателя в процесс
|
||
выбора квартиры. Местоположение и устройство значения не имеют.
|
||
<br />
|
||
Нужен только интернет.
|
||
</Text>
|
||
</Section>
|
||
|
||
<Img
|
||
src={`${baseUrl}/image2.png`}
|
||
alt=""
|
||
className="mb-4 -mt-8"
|
||
width={"100%"}
|
||
/>
|
||
|
||
<Section className="p-4 mb-16">
|
||
<Button
|
||
href="https://stream.graff.tech"
|
||
target="_blank"
|
||
className="w-full bg-[#798FFF] rounded-full flex justify-center items-center text-white py-[12px] font-normal sm:w-fit sm:px-[32px]"
|
||
>
|
||
Посмотреть демо
|
||
</Button>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Text className="text-[#798FFF] text-[24px] font-bold">
|
||
Победители BuildUP 2023 в номинации IT
|
||
</Text>
|
||
<Img
|
||
src="/static/images/winners_buildUp_image.png"
|
||
alt=""
|
||
className="mb-3"
|
||
width={"100%"}
|
||
/>
|
||
<Text className="leading-snug">
|
||
в 2023 году наш продукт для застройщиков graff.estate был
|
||
признан лучшим в категории IT на Акселераторе технологических
|
||
стартапов от лидеров в строительстве и девелопменте Build UP от
|
||
Фонда «Сколково»
|
||
</Text>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Text className="text-[#798FFF] text-[24px] font-semibold">
|
||
Реализованные проекты
|
||
</Text>
|
||
<Button href="https://www.youtube.com/watch?v=qyj3QICSq_I">
|
||
<Img
|
||
src={`/static/images/projects/aivaz.png`}
|
||
alt=""
|
||
className="mb-3"
|
||
width={"100%"}
|
||
/>
|
||
</Button>
|
||
<Text className="text-[14px] font-bold m-0">
|
||
ЖК «Айвазовский City»
|
||
</Text>
|
||
<Text className="text-[#6C7493] m-0 text-[12px] mb-8">
|
||
Россия, Тюмень
|
||
</Text>
|
||
<Button href="https://www.youtube.com/watch?v=xXgPV0P6U0U">
|
||
<Img
|
||
src={`/static/images/projects/revolution.png`}
|
||
alt=""
|
||
className="mb-3"
|
||
width={"100%"}
|
||
/>
|
||
</Button>
|
||
<Text className="text-lg font-bold m-0 text-[14px]">
|
||
МФК «Re:volution towers»
|
||
</Text>
|
||
<Text className="text-[#6C7493] m-0 text-[12px]">
|
||
Россия, Екатеринбург
|
||
</Text>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Text className="text-[#798FFF] text-[24px] font-semibold">
|
||
Отзывы наших клиентов
|
||
</Text>
|
||
<Button href="https://www.youtube.com/watch?si=IbpH9rwxrQq8TDc9&v=j-7wAmdZ1rE&feature=youtu.be">
|
||
<Img
|
||
src={`/static/images/reviews/1.png`}
|
||
alt=""
|
||
width={"100%"}
|
||
className="mb-3"
|
||
/>
|
||
</Button>
|
||
<Text className="text-lg font-bold m-0 text-[14px]">
|
||
ЖК «Авторский квартал Машаров»
|
||
</Text>
|
||
<Text className="text-[#6C7493] m-0 mb-3 text-[12px]">
|
||
Россия, Тюмень
|
||
</Text>
|
||
|
||
<Button href="https://www.youtube.com/watch?v=lAWF91CPOdY">
|
||
<Img
|
||
src={`/static/images/reviews/2.png`}
|
||
alt=""
|
||
width={"100%"}
|
||
className="mb-3"
|
||
/>
|
||
</Button>
|
||
<Text className="text-lg font-bold m-0 text-[14px]">
|
||
ЖК «Айвазовский City»
|
||
</Text>
|
||
<Text className="text-[#6C7493] m-0 text-[12px]">
|
||
Россия, Тюмень
|
||
</Text>
|
||
</Section>
|
||
|
||
<Section className="px-6 mb-16">
|
||
<Text className="text-[#798FFF] text-[24px] font-semibold">
|
||
География проектов
|
||
</Text>
|
||
|
||
<Text className="text-lg font-semibold m-0">Россия</Text>
|
||
<Img
|
||
src={`/static/images/geography/russia.png`}
|
||
alt=""
|
||
width={"100%"}
|
||
className="mb-10"
|
||
/>
|
||
<Text className="text-lg font-semibold m-0">ОАЭ, Абу-Даби </Text>
|
||
<Img
|
||
src={`/static/images/geography/abu_dhabi.png`}
|
||
alt=""
|
||
width={161}
|
||
/>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Text className="text-[#798FFF] text-[24px] font-semibold">
|
||
Наши клиенты в девелопменте
|
||
</Text>
|
||
<Section>
|
||
<Column className="flex flex-row gap-2 border flex-wrap justify-center items-center">
|
||
{Array.from({ length: 30 }).map((_, index) => (
|
||
<Img
|
||
key={index}
|
||
src={`/static/images/clients/${index + 1}.png`}
|
||
alt=""
|
||
width={140}
|
||
/>
|
||
))}
|
||
</Column>
|
||
</Section>
|
||
</Section>
|
||
|
||
<Section className="px-4 mb-16">
|
||
<Column className="flex flex-col sm:flex-row sm:gap-6">
|
||
<Section style={{ borderRight: "1px solid #F0F2F8" }}>
|
||
<Text className="text-lg font-semibold my-2">Контакты</Text>
|
||
<Text className="m-0">
|
||
<Link
|
||
href="mailto:info@graff.tech"
|
||
className="text-[#35363C]"
|
||
>
|
||
info@graff.tech
|
||
</Link>
|
||
</Text>
|
||
<Text className="mt-0 mb-4">
|
||
<Link href="tel:+78007700076" className="text-[#35363C]">
|
||
8 800 770 00 76
|
||
</Link>
|
||
</Text>
|
||
<Text className="mt-0 mb-4">
|
||
<Link
|
||
href="https://graff.estate/"
|
||
className="text-[#35363C]"
|
||
>
|
||
graff.estate
|
||
</Link>
|
||
</Text>
|
||
</Section>
|
||
<Hr className="border-[#F0F2F8] mb-6 sm:hidden" />
|
||
<Section style={{ borderRight: "1px solid #F0F2F8" }}>
|
||
<Text className="text-lg font-semibold">Социальные сети</Text>
|
||
<Text className="m-0">
|
||
<Link
|
||
href="https://t.me/GRAFFinteractive"
|
||
className="text-[#35363C]"
|
||
>
|
||
Telegram
|
||
</Link>
|
||
</Text>
|
||
<Text className="mt-0 mb-0">
|
||
<Link
|
||
href="https://vk.com/graff.interactive"
|
||
className="text-[#35363C]"
|
||
>
|
||
VK
|
||
</Link>
|
||
</Text>
|
||
<Text className="mt-0">
|
||
<Link
|
||
href="https://www.youtube.com/@GRAFFtech"
|
||
className="text-[#35363C]"
|
||
>
|
||
YouTube
|
||
</Link>
|
||
</Text>
|
||
</Section>
|
||
<Hr className="border-[#F0F2F8] sm:hidden" />
|
||
</Column>
|
||
</Section>
|
||
</Container>
|
||
<Section className="bg-[#F0F2F9] px-4 py-8 sm:px-14">
|
||
<Button href="https://graff.tech" target="_blank">
|
||
<Img src={`${baseUrl}/logo.png`} alt="" width={120} height={46} />
|
||
</Button>
|
||
|
||
<Text className="text-[#C1C7E8] leading-snug mb-0">
|
||
© 2023 GRAFF interactive.
|
||
<br />
|
||
Все права защищены
|
||
</Text>
|
||
</Section>
|
||
</Body>
|
||
</Tailwind>
|
||
</Html>
|
||
);
|
||
}
|
||
|
||
export default GraffEmail;
|