12 KiB
Дизайн VEILIX
Общая задача
Нужен дизайн сайта по продаже персональных VPN. Не классический VPN провайдер, когда много клиентов на 1 сервере, а когда мы делаем каждому клиенту индивидуальный IP.
Быстрый современный сайт на tailwind с максимальной скоростью под Google Page Speed. Стек который будем дальше использовать: payloadcms + Next.
Дизайн
"Чистый" современный дизайн без лишней маркетинговых бессмысленных фраз, которые есть у всех крупных. Нам нужно выделиться, чётким предложениям видным и понятным, по делу, а не придумывать того чего нет. Прям минимум, тк нет лишней информации.
Если сравнить карты Apple vs Карты Google. Apple в своих картах явно пошёл не биться в лоб с Google, тк это бессмысленно, а сделан совсем минимальный интерфейс, при том что у Google в целом, тоже понятно, но за счёт функционала интерфейс перегружен в любом случае. Этот же пример и про Apple Music.
Основные тезисы:
- "Чистая" страница с минимум информации
- Современный шрифт, не технический
- Это сайт не для гиков, а для обычных людей. Графика, иконки, шрифты должны располагать и быть понятны человеку не компьютерному. Есть когда сайты выглядят больше как для гиков и не только по описанию и текстам, а потому какие шрифты, графика, иконки.
- Не нужны банальные иконки всяких замков, защит и прочего
- Ночная тема
Верхнее меню
- Логотип (слева)
- далее отдельно немного от логотипа правее
- Цены
- Локации
- Поддержка
- далее прижато справа:
- Переключение языков (иконка)
- Кнопка Login
- Кнопка Get VPN
Название Veilix - без слова VPN для EN. Для русского Вейликс.
Висит всегда на экране, стандартно.
Нижнее меню
Меню, теже пункты что и вверху
Дополнительно Legal страницы
Оплата карточками
Переключение темы 3 режима
Переключение языка
Логотип
Придумать логотип лёгкий, тк Veilix, от слова Вуаль - Veil, когда она легко скрывает за собой что-то, нужен и логотип такой же. Те нужно чтобы это были какие-то замки и вот это всё банальное. У Nord на лого какие-то горы, возможно что-то с севером ассоциировано.
Цвета
Сайту нужен светлый, например у Nord hero экран тёмный - так не нужно. У blancvpn тоже. При этом акцентные цвета - тёмно фиолетовый, глубокий и пастельный.
У Firefox режим инкогнито когда включается там набор градиентный фиолетовых цветов.
У Protonvpn в сторону Фиолетового неплохие цвета и светлое всё, нет тёмных.
Языки
Сделать всё на 2х языках RU и EN.
Главная страница
Hero экран
Ваш личный VPN с индивидуальным IP. Но не нужно его делать на весь экран по высоте, достаточно 2/3, чтобы далее контент просматривался ниже.
Преимущества
C иконками и расшифровкой, что это значит. Нужно написать красиво, то что перечислил ниже, можно разложить даже как-то иначе. Художественно, чтобы понятно было потребителю не разбирающемуся в технологиях, и руководителям.
-
Индивидуальный ip
- Работа с западными AI снижается риск блокировки по сравнению с публичными VPN
- Безопасность вашего трафика в любой точке мира где вы будете пользоваться
- Одинаковый IP на всех ваших устройствах где-бы вы не находились, не отличить. Вы всегда в одной локации с вашим IP.
- Любые сервисы работают стабильнее с личными IP, тк при использовании массовых часто срабатывает защита и ботов
-
Тариф включает до 4-х устройств
- Можно приобретать дополнительные тарифы в этой или других локациях с дополнительными индивидуальными IP
-
К выбранному тарифу дополнительно выделенный RU IP адрес
- Используется и как прямое соединение и для организации моста в обе стороны
-
Два типа протоколов WireGuard (Amnezia WG) и Xray (Vless + Histeria2 + xhttp)
- Дополняются и обновляются
-
Умная маршрутиризация трафика из Ру к Глобал
- К RU сайтам через RU сервер напрямую
- К Глобальным трафик через туннель прокидывается через локацию в вашем тарифе
-
При использовании из Глобала обратная маршрутиризация
- К мировым сайтам прямой коннект из вашей локации
- К RU сайтам трафик через туннель идёт через RU сервер
- Для работающих с Россией
-
О нас
- Работаем с 2022 года
FAQ
Стандартная история, несколько вопросов с ответами раскрывающимися. Придумай для моей тематике исходя из описанного в задаче.
Страницы Цены
Сразу крупно обыграть блок с ценой на первом экране, одна цена
4900 - первый месяц
2900 далее
Должен быть выбор локации, и при этом какие-то локации показывают, есть несколько серверов в наличии, а какие-то показывают будет готово через 24 часа.
Готово через 24 часа это даже фича, что покупатель реально видит что под него делается.
Выбор локации и Купить. Переход на страницу оформления заказа.
Кнопка собирать лиды, кому требуется индивидуальные условия - оставьте заявку.
Страница Поддержка
Крупно блок с контактный email и tg, дальше в FAQ разделённый по разделам и ниже форма связи.
Страница Оплаты и Оформления заказа
Страница оплаты заказа при нажатии на Купить.
Стандартно как у Nord и Blanc, с предложением Авторизоваться по почте.
Личный кабинет на Вебе
Максимально простой, как у Nord и Blanc. Страница и слева сайдбар. Для личного tailwind если используют, то на нём, если что-то другое применяют, то предлагай.
Регистрация и авторизация только по почте по одноразовому паролю, при этом не разделять авторизацию и регистрацию.
В сайбаре Главная, Купить Ключ, Список ключей и внизу Поддержка, Язык и Тема.
C Иконками пункты меню.
В отличии от Nord и Blanc у нас ключей может быть несколько, чтобы сразу в нужный попадать и видеть срок истечения.
Главная страница
- Список ключей
- Купить Ключ
- FAQ
Страница Ключа
- Дата окончания
- Изменить Оплату (привязанную карточку)
- Скачать 4 конфигурации для WG или отсканировать QR
- И ключ для Happ, crypto. Копировать и плюс QR.
Страница Купить
Внутри личного кабинета без перехода на сайт, весь функционал как в разделе Купить с выбором локации
Личный кабинет в Telegram
Нужен дизайн для MiniApp, и чтобы это выглядело в стиле телефона, например у самого Telegram, есть нативное приложение Wallet, и там похоже на интерфейс телефона.
Обыграть всё что я написал про Личный на Вебе, в парадигме MiniApp и интерфейса как у телефона.
Дополнительный вариант Дизайна
Будет 2 одинаковых сайта, но на 1 будет продаваться только индивидуальные IP, на втором чтобы была возможно и Массовые тарифы купить и также индивидуальный. Всё одинаково, за исключением 2х тарифов, Базовый и Премиум. Везде нужно это обыграть, где представлены тарифы.
Но нужно максимально унифицированно.
Чтобы в итоге это обрабатывали одни скрипты под разными доменами будет разное видно. В тч в Личном кабинете.