Цель: Редизайн главной страницы сайта www.win-vps.com, создание эстетичного и функционального интерфейса в темной цветовой гамме, совместимого как с экранами компьютеров, так и с мобильными устройствами (три варианта внешнего вида: десктоп, планшет, смартфон).
Выбор дизайнера:
🙂 Предпочтение кандидатам с набросками в Figma: Особое предпочтение будет отдано дизайнерам, способным предложить начальные наброски дизайна в Figma. 🙂
✅ Продолжение работы: В случае успешного завершения этого проекта, предусмотрена возможность продолжения работы над редизайном остальных страниц сайта.
Основные требования:
- Дизайн и стиль: Разработать новый дизайн в темной цветовой гамме, уделяя внимание чистоте, современности и удобству пользователя. Дизайн должен соответствовать принципам плоского стиля (flat design), предпочитая минимализм и упрощенные элементы без излишних украшений или сильных теней.
- Адаптивность: Убедиться, что дизайн оптимизирован для просмотра в различных браузерах, на планшетах и смартфонах.
- Визуальный акцент: Включить в дизайн элементы, которые станут "ярким пятном", привлекая внимание пользователей.
- Элементы интерфейса: Разработать новые баннеры, карусель с отзывами, карточки с ценами и другие элементы, присутствующие на текущей главной странице.
Дополнительные рекомендации:
- Использование Figma: Все дизайн-наброски и финальные макеты должны быть разработаны в Figma. Использовать стили и инструменты Figma для унификации дизайна, позволяющие централизованно менять цветовую гамму, шрифты и оформление элементов в соответствии с лучшими практиками дизайна.
- Современная сетка дизайна: Применять современные принципы сетки дизайна, чтобы гарантировать, что макет будет актуальным и соответствующим текущим тенденциям веб-дизайна.
- Экспорт дизайна в CSS: Дизайн должен быть легко экспортируемым из Figma в CSS. Названия всех фреймов и элементов должны быть логичными и понятными, чтобы облегчить процесс интеграции дизайна с веб-технологиями.
- Интерактивность: Включить интерактивные элементы, такие как анимации или эффекты при наведении, для улучшения пользовательского опыта.
- Шрифты и типографика: Использовать четкие, легко читаемые шрифты, поддерживающие общий стиль сайта.
- Иконография и изображения: Обновить иконки (желательно использовать fontawesome, т.к. есть подписка на про версию) и изображения , чтобы они соответствовали новому стилю и были высокого качества.
- Цветовая палитра: Использовать акцентные цвета для выделения ключевых элементов в дополнение к основной темной цветовой гамме.
- UX/UI: Учитывать лучшие практики UX/UI для обеспечения интуитивно понятного и приятного интерфейса.
Процесс и этапы работы:
- Исследование и анализ: Проанализировать текущий дизайн и определить, какие элементы следует сохранить или улучшить.
- Прототипирование: Создание макетов для обсуждения и утверждения ключевых элементов дизайна.
- Итерации и обратная связь: Разработка дизайна будет включать несколько итераций с возможностью внесения изменений на основе обратной связи.
- Финализация дизайна: После утверждения всех элементов, подготовка финальных макетов в Figma для разработчиков.
Следующие варианты дизайна элементов и цветовой гаммы считаем заслуживающими внимания (темный стиль):
https://www.templatemonster.com/elementor-templates/graffis-creative-mondrianism-pro-elementor-template-70274.html
https://themeforest.net/item/cork-responsive-admin-dashboard-template/25582188
https://themeforest.net/item/hostx-premium-hosting-template/34096028
https://themeforest.net/item/hostic-web-hosting-company-elementor-template-kit/31526111
https://themeforest.net/item/dompet-payment-admin-dashboard-ui-template-figma/screenshots/29544796?index=10
https://themeforest.net/item/opex-map-navigation-figma-ui-template/screenshots/39470419?index=5
https://themeforest.net/item/aenft-nft-minting-or-collection-landing-page-figma-template/screenshots/38220245?index=2
Разумеется, перечисленные варианты не являеются эталоном, а лишь отражают наше примерное видение внешнего вида.
Behance
