Стояла задача разработать дизайн многостраничного сайта по поиску Российского ПО. Нужно было разработать каталог с разными типами фильтров, карточки сайтов и сервисов, каталог аналогов и ЛК для отслеживания статистики.
О проекте
Сервис объединяет продавцов и покупателей и помогает им найти друг друга. На старте мы разработали каталог аналогов с личным кабинетом. Но в будущем проект планирует стать не просто каталогом, а биржей и комьюнити для Российских IT компаний
https://svoivit.ru/
обновляется и редактируется заказчиком
20 рабочих дней
время разработки
Дизайн-концепции
Подготовила на выбор несколько вариантов первого экрана в разных стилистика. Особых пожеланий по дизайну не было, было только предпочтение по цветам и иллюстрациям. Поэтому я предложила разные варианты.
Что было сделано:
Подготовка и исследования
Варфреймы всех страниц с текстами
Было предложено 5 вариантов дизайн-концепций первого блока
Дизайн всех страниц в Figma
Разработка мобильной версии
Подготовка к верстке
Варфреймы
Перед разработкой дизайна я всегда готовлю детальный черновой вариант со структурой и текстами. На этом этапе утверждаем UX
Главная
Главный экран служит для того, чтобы познакомить с услугами и особенностями компании, а также направить пользователя в каталог или на регистрацию. Поэтому здесь много различного типа навигации, ссылок, карточки с призывами к действия.
Каталог
В каталоге сделали 2 отдельные страницы для поиска по категориям ПО и по альтернативам
Карточка компании
В карточке компании нужно было рассказать подробнее о решениях, которые они предлагает. А также предложить другие похожие альтернативы в этой категории
Карточка альтернативы
Здесь идея была в том, чтобы показать сразу список всех доступных аналогов разных иностранных сервисов. Например Google, Trello, Notion
Личный кабинет
Он нужен для того, чтобы компании могли отслеживать статистику по просмотрам, а также менять информацию о компании и своих предложниях. В дальнейшем функционал ЛК планируют расширять
Адаптивные версии
Мобильной уделили особое внимание, так как с него планируется наибольший трафик.
UI kit
На таких проектов не обходится без подготовки макетов к верстке. Я подготовила UI kit, показала стилистику, анимации и интерактивные прототипы, чтобы у верстальщиков не возникало вопросов.