Назад к списку постов
Назад к списку постов
В современную цифровую эпоху веб-сайт часто является основной точкой контакта между компанией и ее клиентами. Поэтому очень важно, чтобы ваш сайт не только отлично выглядел, но и отлично функционировал. Создание веб-сайта - это процесс, который может занять много времени и усилий, особенно если вы не знакомы с миром диджитал. Качественное взаимодействие между заказчиком и веб-дизайнером - это ключевой фактор успеха проекта, поэтому необходимо придерживаться нескольких простых советов, которые помогут вам создать красивый, функциональный и эффективный веб-сайт.
Независимо от того, работаете ли вы со студией дизайна или с дизайнером-фрилансером, есть определенные вещи, которые вы можете сделать, чтобы процесс прошел гладко.
В этой статье мы дадим вам советы и рекомендации о том, как заказать идеальный дизайн сайта.
Мы рассмотрим все, начиная с определения ожиданий, согласования сроков и заканчивая предоставлением обратной связи.
К концу этой статьи вы будете вооружены знаниями, необходимыми для уверенной работы с дизайнером и получения сайта вашей мечты.
Будьте ясны и конкретны.
Важно понимать, что дизайнер не сможет создать идеальный сайт без вашей помощи. Дизайн это симбиоз пользы и красоты. Вам нужно донести до исполнителя 2 основных параметра: какую пользу несет сайт - функциональные требования , какую роль занимает красота в вашем сайте - эстетические требования. По этим критериям вы будете оценивать конечный результат.
Определите цели вашего веб-сайта. Что вы хотите достичь с помощью этого сайта? Какую аудиторию вы хотите привлечь? Какой должна быть функциональность сайта- будет ли корзина, личный кабинет, оплата на сайте или это информационный сайт- только информация и контакты или раздел со статьями, интерактивные форма заявки? Какую пользу сайт будет приносить посетителям, какую проблему будет решать?
Информацию можно предоставить в свободном виде в текстовом документе как список пожеланий (например: мне нужен интернет магазин по продаже изделий ручной работы-сумок, на 50 товаров с корзиной и оплатой, без личного кабинета. Наши сумки изготавливаются руками и мы можем внести небольшие изменения в изделия- поменять фурнитуру/ цвет /ремешок.
У нас есть логотип,фирменные цвета и фотографии изделий, текстов для сайта нет, есть несколько рекламных буклетов) или воспользоваться готовым шаблоном- ССылка тут. Если вы не уверены в том что знаете ответы на вопросы брифа или вам нужна дополнительная консультация - созвонитесь с дизайнером или менеджером проекта - тогда информацию необходимую для создания эскиза дизайнер спросит сам, проведет интервью. На этот документ вы будете ориентироваться при приемке работы, и на него будет ссылаться дизайнер.
В зависимости от типа проекта эстетическая часть играет больше или меньше значение. У каждого бизнеса есть “вайб”, смысл, эмоции- чей то бизнес несет много рационального и мало эмоционального- например продажа прокатной стали. А чей то наоборот- например бренд украшений из необработанных камней. Как правило чем выше наценка за бренд тем больше эмоций бизнес несет. Важно не забывать при продаже “труб” тоже, что чувства всегда сильнее логики. И самый рациональный бизнес несет в себе чувство- вот ту самую рациональность и логичность.
Не получится передать дизайнеру цвета бренда и логотип и получить идеальный вариант. Так что же еще надо для сильного результата?
Нужно описать “настроение” бренда или бизнеса, те чувства которые должны остаться у человека. Например Вольво- самый безопасный автомобиль в мире- дарит чувство защищенности. Как сформулировать требования к этому настроению если я ничего не чувствую- просто бизнес? и как оно будет выражаться практически?
Если “чувств” нет или вы затрудняетесь их описать, дизайнер составит “мудборд”- набор фото передающий настроение. Важно понимать что чувство не бывает одиноко- их всегда несколько. Практически “чувства” формируются композиционными приемами и поддерживается контентом (фотографиями и текстом). Например для передачи надежности и традиционности дизайнер может выбрать композицию треугольника- с лого посередине. Самая устойчивая фигура - передающая стабильность, но имеющая потенциал к росту. Или например контрастная типографика (сочетания крупных заголовков и не очень крупного текста) с ассиметричной композицией поможет создать ощущение инновационности и динамичности. Конкретный композиционный прием во многом зависит от контента, одни и те же чувства можно передать разными способами. Важно чтобы контент для наполнения сайта отвечал бренду тоже- вам не удастся показать “премиальность” с некачественными фотографиями.
Что делать если я не понимаю что мне нравится в веб дизайне и что подойдет моему бизнесу? В таких случаях дизайнер подбирает референсы- это набор скринов похожих сайтов- той же тематики, таких же цветов, компания с такими же ценностями. Не нужно бояться показывает дизайнеру те сайты которые вам нравятся из-за опасений что вам просто скопируют сайт- озвучьте требования- “мне нравится, но копию я не хочу”, и наоборот если вы хотите копию страницы или фрагмента или приема- не стесняйтесь- вы не лишитесь индивидуальности повторив прием
Современный дизайн, модный дизайн - самое частое требование к дизайнеру. Как оценить и понять что модно сейчас. Куда посмотреть? На конкурентов? как оценить результат?
На конкурентов мы советуем смотреть обязательно- но целью оценки маркетинговых приемов, структуры страницы, текстов. Актуальный дизайн можно посмотреть на ресурсе awwwords в разделе сайт дня- это международный ресурс на котором публикуются проекты отмеченные профессиональным сообществом но при этом реально реализованные а не концепции “для хайпа” или только “для премии за креатив”. Креативные концепции можно посмотреть на дрибл и беханс (обратите внимание на отмеченные ленточками проекты- они получили “особое” одобрение).
Есть и общие вещи характерные для всех современных сайтов. Это отсутствие длинного текста (пользователь как правило не читает текст строчка за строчкой а сканирует). Текст написаны информационном стиле- коротко емко, ориентированы на продажу.. Есть анимация- легкая ненавязчивая - она обогащает впечатление, но не мешает читать/смотреть. Аккуратные шрифты- как правило используют 1-2 шрифта- например с засечками без засечек. Есть воздух (свободное место) и ясная структура - сайт как манурскрипт- последовательно экран за экраном рассказывает о продукте или компании- без попытки впихнуть “все на 1 экран” поделив его на большое количество зон. Адаптивность- сайт разрабатывается так чтобы хорошо смотреться независимо от устройства.
Как проходит работа и как оценить результат? Сколько времени занимает дизайн вебсайта?
Чаще всего работу свою работу дизайнер передает в виде ссылки на файл Figma.
Сначала дизайнер делает анализ конкурентов, составляет мудборд и подбирает референсы- показывает заказчику и уточняет позиции. Потом составляет эскизы страницы- главной или нескольких- например для интернет магазина обычно карточки и каталога, делает анимацию- опять уточняет позиции. Для эскизов лучше использовать реальный контент будущего сайта, вы должны предоставить фото, или дизайнер возьмет снимки с фотостоков, предоставить текст- дизайнер может написать примерный текст который вы отредактируете, мы не рекомендуем использовать случайный текст. И уже после согласования главных страниц создаются остальные страницы проекта, формы, всплывашки, анимация.
Макеты выглядят как набор страниц в разном разрешении, минимум 2 для дэсктопа и мобильного, но бывает и 5 для широкоформатного монитора, дэсктопа, планшета и маленького планшета (мобильного горизонтального), мобильного вертикального. Кроме того дизайнеры составляют Kit для верстальщика, когда разработка ведется не внутри компании а фрилансером, выносят используемые цвета, шрифты и готовят краткое описание, оставляют контакты для связи при возникновении вопросов. Анимация передается чаще в виде видеороликов.
Поскольку в работе дизайнера несколько этапов сроки исполнения зависят не только от того насколько быстро дизайнер выполнит работу, но и от скорости согласования и количества правок. Самое большое время занимают создание и согласование главных страниц- остальные готовятся быстрее.
Результат работы можно оценить по 2 параметрам- функциональным и эстетическим.
Оценить функциональную часть обычно не сложно- все мы пользуется сайтами и леко можем представить себя в виде пользователя. Важно смотреть дизайн на том разрешении на котором нарисован макет- поскольку не сверстанный макет не меняет масштаба- десктопную версию нужно смотреть на компьютере а мобильную на телефоне (файл Figma открывается на мобильном) так вы сможете точнее понять удобны ли кнопки для нажатия, все ли видно/ понятно.
Оценивать эстетику следует с точки зрения отражения настроения бренда или вашего бизнеса. Сайт должен быть аккуратным и вызывать приятные чувства.
Как оценить техническое качество макета? Вот так сходу оценить качество макета скорее всего не удастся, диджитал очень динамичная сфера и прочитанные в интернете правила скорее уже не актуальны. Например раньше макеты создавались в основном по модульным сеткам bootstrup кратным 8px и рисовались в Фотошопе, прошло несколько лет - появилось огромное количество размеров экрана, изменился подход к сеткам, к бутстрап устарел, дизайнеры чаще пользуются силовыми линиями чем модульными сетками и не привязываются к 8, кратность чаще 10px, а фотошоп был вытеснен Figma. С некачественным макетом работать верстальщику будет не слишком удобно, но не невозможно, сверстать можно все.
menuзакрыть
Спасибо! Заявка отправлена. Свяжемся с вами в течении часа!