Дизайн концепция что это
Как сделать дизайн-концепцию сайта, если вы новичок
Клиент просит создать дизайн-концепцию сайта, а вы не знаете, с чего начать? Рассказываем, как выполнить задачу и впечатлить заказчика.
Чаще всего заказчики просят создать дизайн-концепцию сайта, чтобы убедиться в том, что исполнитель правильно понял задачу и в визуальной части макета не будет неприятных сюрпризов.
Что такое
дизайн-концепция
сайта
Дизайн-концепция — набросок того, как должен выглядеть сайт, сделать его нужно быстро, это не полноценный макет. Концепция создается уже после утверждения прототипа. Прототип демонстрирует структуру страницы, а концепция показывает, как сайт будет выглядеть в результате работы.
Концепция помогает построить диалог между дизайнером и заказчиком — дизайнер знает, что ему делать дальше, а клиент уверен в том, что работа ведется в нужном направлении.
Пишет про дизайн в Skillbox. Работает директором по маркетинговым коммуникациям, изучает рекламную графику и 3D.
Этапы разработки
дизайн-концепции сайта
Работа над концепцией делится на четыре стадии: предварительный анализ, разработка, получение фидбека и доработка идеи. У каждого есть свои особенности, которые важно учитывать.
Создание брифа
Бриф нужен, чтобы понять, что от вас ждет заказчик и какой визуальный стиль лучше всего подойдет для бизнеса клиента. Работа над концепцией начинается с разговора с клиентом и заполнения брифа на создание сайта. Пример качественного брифа можно посмотреть на сайте CreativePeople.
На встрече обязательно уточните, есть ли у клиента брендбук (утвержденный набор стилей и графических элементов, которые используются во всех материалах клиента). Если да, то вам нужно будет учитывать его при создании цветовой схемы сайта, типографики, иконок и других элементов оформления.
Изучение целевой аудитории
Очень важно выяснить целевую аудиторию сайта: спросите об этом заказчика. Если клиент не может предоставить вам информацию, потратьте немного времени на изучение конкурентов. Так вы лучше сможете понять, какую концепцию нужно создать, какие элементы обязательно добавить и какую стилистику выбрать.
Подготовка мудборда
Как только вы разобрались с брифом и поняли, что хочет получить клиент, нужно подготовить мудборд — подборку референсов, изображений, графических элементов и шрифтов, которые могут быть использованы при работе над дизайном. Мудборды помогают согласовать концепцию сайта с заказчиком и объяснить ему, как будет выглядеть сайт. Для создания мудборда лучше всего подходит Pinterest. Советуем поискать не только сайты на такую же тематику, что у вашего клиента, но и затронуть смежные сферы.
После подготовки мудборда встретьтесь с заказчиком и обсудите идеи. Это поможет понять, в том ли направлении вы двигаетесь, и продемонстрирует клиенту вашу заинтересованность в проекте.
Разработка дизайн-концепции сайта
Проведя пару часов за поиском примеров, дизайнер уже представляет себе, как должен выглядеть сайт. Если у вас уже есть утвержденный прототип, то лучше всего применить свои наработки к нему, чтобы сразу показать клиенту, что он получит.
Если прототипа нет, нужно потратить немного времени, чтобы продумать структуру главной страницы. Все детали вы сможете проработать, когда клиент утвердит концепцию.
Что такое концепция
Будучи дизайнером, вы наверняка часто говорили клиентам о том, что, работая над проектом, следует показать несколько концепций в течение какого-то промежутка времени, а будучи клиентом, слышали подобное от дизайнера или студии. Что ещё забавнее звучит, так как это немного не так.
Давайте сразу объясню крайне важный аспект. Концепт и концепция это разные вещи, занимающие соответственно разные позиции в процессе разработки любого проекта. Но практически все дизайнеры и уж тем более клиенты дизайнеров или студий, путают эти понятия, выдавая одно за другое. В процессе анализа таких ошибок, я решил понять, откуда проистекает эта болезнь и понял, что дело в низкой грамотности людей, которые преподносят подобную информацию как истину. В качестве примера приведу текст с сайта одного известного “онлайн-университета” как они себя называют, где подобный подход применяется повсеместно и не только в плане концепций (там в принципе забавный подход к обучению, я так понимаю основанный на байках фрилансеров из нулевых, главное, чтобы платили за курсы). Называть имён не будем, но давайте вместе просмотрим, что они рассказывают дизайнерам и как дела обстоят на самом деле.
С самого начала, стоит привести определения этих терминов, чтобы уже было понятно в чем кроется ошибка и дальнейшее повествование открывало глаза.
Концепт — это видение проекта. Его идейная составляющая в которой раскрывается понимание вектора разработки. Сайта, логотипа, айдентики, чего угодно и в любой из сфер дизайна.
Определение из википедии намного длиннее (как обычно) но также соответствует вышеописанному. На этом моменте, дизайнеры уже должны переписывать свои тексты с описанием услуг и процессом их оказания.
Концепция — это система описательных характеристик проекта. Более детализированный вариант развития проекта.
Концепция это следующий эволюционный виток концепта, когда набросок превращается в систему, где каждый аспект системы имеет общий образ, опирается на метафору и всю предпроектную информацию, такую как: брифинг клиента, исследование аудитории, метафора в рамках которой ведется разработка, сам концепт и многое другое. Если это сайт, то вот такое количество цветов будет, вот так будут выглядеть кнопки, такой стиль иллюстраций, такие сетки, формы и так далее и тому подобное. Из-за понимания объёма работы над концепцией, её презентацией, а также какое место в процессе разработки она занимает, моё лицо неизбежно заливается улыбкой когда я вижу текст похожий на этот.
Я не буду пускаться во все тяжкие и рассказывать для чего реально нужен прототип и сколько их бывает видов, иначе на разборе этого текста мне придется писать книгу, а это только первый скриншот. Давайте сфокусируемся на концепте, более подробно разберем то, что он из себя представляет и как его делать, так как именно его они описывают в тексте, а не концепцию.
Концепт необходим для построения видения проекта, например распространенным подходом является “референсный концепт” – это когда вы находите метафору (поиск ведется по гуманитарной формуле %Проект% как %что?%) и находя подходящую, используете уже существующие примеры подставляя их в контекст проекта, тем самым показывая клиенту как может это все выглядеть и работать, так можно существенно сократить время на проработку этого этапа.
Приведу пример из своей практики, я делал сервис для архитектурного бюро Меандр в 2019 году и показывал два концепта основанных на этом подходе. У нас уже были проведены все предыдущие этапы и я имел представление о контенте, аудитории и приоритетах сервиса. Сервис wrk.space нужен для того, чтобы понять как построить офис или переехать в новый, сколько это будет стоить, сколько на это нужно времени и так далее. К сожалению собственник пока не нашел подходящего времени на полноценный запуск и хоть и проект сдан, по факту он заморожен.
Так как сервис информационный и тем не менее даёт более или менее точную информацию для переезда и стройки, родилось две метафоры:
Комикс инструкция — основанный на американских комиксах времен холодной войны, которые печатали в газетах для информирования людей в понятной форме о том, что делать в случаях ядерного удара и где находятся убежища (очень похоже на реальный переезд). Сразу понятно, какой должен быть стиль иллюстраций, кнопок, цветов, подход к форме объектов и навигации. В процессе из этого понимания выливаются принципы концепции на которых она и держится. В концепте они не закреплены, а лишь показывают общее видение.
Я использовал в этом концепте иллюстрации Notion, чтобы показать стилистику и раскрыть метафору без отрисовки даже скетчей иллюстраций, тем самым сокращая время на проработку этапа.
Вторая метафора звучала как — “Сервис как команда помощников”. Где ответы на вопросы и просчеты дает не бездушный код, а команда помощников, которые персонифицировано решают проблемы каждого пользователя, тем самым показывая высокий уровень эмпатии сервиса к их проблемам. В плане визуализации, мы решили использовать стилистику 3D как раз вновь выходившую в тренды в то время, благодаря Pitch чьи иллюстрации и были использованы в качестве референсов. Второй концепт мы в итоге согласовали и запустили в продакшен.
Превращая концепт в концепцию мы собираем все описанное выше и систематизируем в таблицу, где расписываем тип контента и его стилистические качества в рамках проекта. Например в брендинге это выглядит вот так.
Лучший пример из всех, что можно привести для понимания работы механизма. Все аспекты проекта выведены и представлены визуально, так и вы и клиент понимаете уровень целостности проекта. Многие дизайнеры назовут это дизайн-системой и будут правы лишь отчасти, так как концепция демонстрирует лишь систематизированные принципы для создания дизайн-системы но не её саму.
А для того, чтобы аргументировать решения, достаточно обратится к их источнику — метафоре. А в случае с защитой концепции ещё и к таблице системы. Они обуславливают ваши действия при работе над проектом. Тем самым защита и презентация сомкнуться в одном тексте.
Изучайте вопрос и методологию разработки проекта, не только сайтов, а проекта как такового. У всех проектов есть общие моменты и точное понимание того, над чем вы должны работать в том или ином этапе существенно сократит срок разработки и подарит вам релевантный результат, который можно будет не только легко объяснить но и не стыдно будет показать.
Если у вас есть вопросы, оставляйте комментарии или пишите мне в личку в телеграме @burhudar Возможно я знаю ответ на ваш вопрос. Кому интересно, могут подписаться на мой телеграм канал, где я регулярно или почти регулярно пишу нечто подобное @burhudar_ch
Что такое концепция дизайна интерьера?
Многие заказчики скептически относятся к созданию концепции дизайна интерьера, считая этот этап эфемерным и необязательным. На самом деле, это база, без которой невозможно создать гармоничный интерьер. Это не набор готовых идей и решений, а образ будущего интерьера, каким его видите Вы.
Здесь важны ощущения и ассоциации. Возможно, Вы не найдете ничего похожего в готовых портфолио дизайнеров, и тогда нужно обращаться к искусству. Если у Вас есть любимые произведения, направления или эпохи – это может стать прекрасной основой для разработки концепции в современной интерпретации. С такими референсами всегда очень интересно работать – здесь стоит задача не только проявить особый вкус заказчика, но и адаптировать его к современным потребностям.
Концепция дизайн-проекта – что это такое?
Она транслирует атмосферу и настроение, которое нужно создать в интерьере. Это невозможно описать терминами, все строится на личном общении с заказчиком и выявлении его истинных желаний.
Само понятие концепции – очень широкое, оно включает в себя комплекс идей и предпочтений, которые могут даже не осознаваться. Дизайнер поможет сформулировать эти мысли и преобразовать их в понятные направления, которые в дальнейшем превратятся в конкретные задачи.
Документально эта часть дизайн-проекта представляет собой описание будущего интерьера на 1-2 листах, с яркими образами, отражающими эмоциональную составляющую атмосферы дома.
Зачем нужна концепция?
Она очерчивает круг Ваших предпочтений и создает необходимые рамки, в которых будет работать дизайнер.
Существует миф, что дизайнеры для того и нужны – чтобы реализовать абсолютно все идеи, и при этом результат должен быть безупречным, в полной мере отвечающим Вашим ожиданиям.
На практике все иначе – для создания хорошего дизайна интерьера необходимы рамки, без них даже самые интересные идеи будут размытыми, их невозможно будет персонализировать. Эти рамки и являются очертаниями концепции – когда это творческое пространство определено, внутри него уже можно воплощать разные мысли, и все они будут гармонично сочетаться между собой.
Концепция решает сразу несколько задач:
Процесс разработки
Концепция разрабатывается на основе Ваших предпочтений, пожеланий, идей – все это обсуждается в ходе консультации и фиксируется в Техническом задании.
Прорабатывая эту информацию с учетом текущих трендов и перспектив, специалисты нашей студии создают общую концепцию. Это происходит без участия клиента, над содержанием концепции работает целая команда.
Когда концепция готова, ее ключевые элементы проявляются в планировочном решении. Далее, на этапе 3Д-визуализации и создания коллажей, проработка деталей становится все более подробной.
Как раз на данном этапе происходит выбор материалов, определяются архитектурные решения в соответствии с бюджетом. К этому моменту уже согласовано планировочное решение и расстановка мебели по комнатам, но при необходимости можно внести корректировки в 3Д-визуализацию.
Важно: к созданию 3Д-визуализаций мы приступаем только после того, как есть общее видение концепции, согласованное с клиентом.
Трехмерная модель будущей квартиры – это цифровое воплощение концепции, основанной на предложенных идеях. Благодаря этому появляется возможность наглядно представить, как будет выглядеть готовая квартира. Если появляются новые пожелания по поводу концепции, их желательно озвучить именно на этом этапе, чтобы можно было внести корректировки.
Этапы разработки концепции
При разработке обязательно учитывается состав семьи и примерный образ жизни всех домочадцев. Поэтому мы всегда рекомендуем заранее собрать пожелания членов семьи хотя бы в общих чертах – это помогает сделать концепцию комфортной и эстетически привлекательной для всех. По ходу работы какие-то детали могут меняться, добавлять и исчезать – но сам факт того, что вы посоветовались с семьей, будет очень важен при оценке итогового результат.
Разработка концепт дизайна
Что такое дизайн-концепция
Дизайн-концепция — это основополагающая идея, комплексное видение того, как будет воплощён бренд во всевозможных графических материалах — в фирменном стиле и упаковке, на сайте и рекламных носителях, в оформлении офисного или торгового пространства и т. д.
Дизайн-концепция рассчитана на долгосрочный период и поэтому всегда выстраивается исходя из утверждённых маркетинговых установок, и прежде всего из позиционирования бренда. То есть разработка дизайн-концепции всегда включает в себя предварительное изучение таких ключевых параметров как: предназначение продукции, её качество и цена, конкурентное окружение, целевая аудитория, география распространения, способ предоставления, а также общее видение дальнейшего развития бренда и т. д.
Кроме того, созданию дизайн-концепции как правило предшествует проектирование вербальной оболочки бренда, хотя довольно часто эти процессы могут идти параллельно. Так или иначе, вербальная оболочка бренда включает следующие основные элементы, которые оказывают прямое влияние на формирование дизайн-концепции:
Тщательно изучив всю эту информацию, дизайнер предлагает своё концептуальное видение того, из чего будет складываться визуальное представление о бренде в целом, а в ряде случаев — как будет выглядеть сам продукт (если говорить о промышленном дизайне).
Зачем нужна дизайн-концепция
Изначально дизайн-концепция может быть представлена в виде схематичного наброска, предварительного проекта будущей визуальной оболочки бренда. Однако, уже на этом этапе в ней как правило присутствуют определяющие элементы и главные характеристики, которые цементируют целостное представление о бренде и задают чёткое направление для развития этого представления. В дальнейшем, по мере того как бренд будет обрастать всё новыми и новыми графическими материалами и носителями, ясная и стройная дизайн-концепция не даст образу бренда расплыться и рассыпаться и позволит ему сохранить единство восприятия в целевой аудитории на многие годы вперёд.
Что входит в дизайн-концепцию
Дизайн-концепция может создаваться не только для всего бренда, но и отдельно для разных частей его визуальной оболочки. Так, на том или ином этапе развития бренда разработка концепт-дизайна может потребоваться только для упаковки или только для сайта, или только для рекламной кампании.
В зависимости от конкретной задачи дизайн-концепция включает в себя все или только некоторые элементы из представленного ниже списка:
После того как дизайн-концепция утверждена, на её основе разрабатываются все необходимые элементы визуальной оболочки бренда:
Где сделать дизайн-концепцию
Заказать дизайн-концепцию вы можете в компании DesignDepot (Москва). В своей работе мы применяем собственный метод проведения предварительной аналитики и используем весь свой профессиональный дизайнерский опыт для создания уникальной дизайн-концепции, в которой полностью воплотится живой, яркий и привлекательный образ вашего бренда.
О чем штурмят веб-дизайнеры. Этапы создания дизайн-концепции
Арт-директор Аша Саакян и продюсер Алёна Титова раскрывают подход агентства Nimax к созданию дизайн-концепций сайтов.
Если вы когда-нибудь взаимодействовали с digital-агентствами или веб-дизайнерами, то наверняка слышали об этапе создания концепции. В этой статье мы поэтапно разберем создание дизайн-концепции сайта на основе подхода, который практикуем в Nimax. Материал не является руководством, он предназначен для общего понимания процессов и их важности.
Дизайн-концепция сайта формирует общее видение визуальной части проекта с учетом всех источников требований и пожеланий к дизайну:
Если кратко: дизайн-концепция помогает заказчику и исполнителю смотреть в одном направлении. Так дальнейшая работа над дизайном страниц сайта становится предсказуемой и прозрачной.
При создании дизайн-концепции нужно учесть как можно больше разных типов блоков и элементов, заранее предусматривая их адаптивы: карточки, слайдеры, текстовые блоки, навигационные элементы.
При этом дизайн страниц может быть не финальным, мы формируем общее видение и пути развития. На этапе концепции происходят поиски:
Также необходимо выбрать приоритетные страницы.
Иногда заказчики обращаются с готовыми дизайн-системами, на которых построены интерфейсы одного или нескольких проектов. В таких случаях в разработке концепции нет необходимости.
Если есть понимание, как улучшить имеющуюся концепцию, то можно составить предложение и отправить его заказчику, уточнив, есть ли у него ресурсы на обновление. В списке предложений желательно отметить, как они повлияют на общее восприятие и решение бизнес-задач проекта.
Весь процесс можно разделить на три основных блока: исследование, создание дизайн-концепции и ее презентация.
1. Этапы исследования: предпроектный аудит и информационная архитектура.
2. Этапы создания дизайн-концепции: мудборд и стайлборд, генерация идей, скетчи и выбор идеи и создание макетов.
3. Презентация концепции.
Чтобы приступить к дизайн-концепции сайта, всей команде необходимо получить понимание по многим пунктам:
бизнес-задачи и процессы клиента;
особенности целевой аудитории;
Поэтому мы начинаем работу с этапа предпроектного аудита. На самом деле, этот этап начинается с первого обращения заказчика, после которого аккаунт-менеджер (или любое другое контактное лицо) знакомится с бизнесом заказчика, проводит первичный брифинг. Аккаунт передаёт собранную информацию команде, которая углубляется в проект вместе с заказчиком на Т-сессиях.
T-сессия — это групповая стратегическая сессия, где совмещается глубокая экспертиза заказчика в своей отрасли и широкая экспертиза агентства.
В результате предпроектного аудита команда получает ответы на вопросы:
Созданием полной картины проекта и выводами занимается стратег
или маркетолог, ему помогают специалисты разных областей.
Один из эффективных способов погрузить команду в проект — устроить встречу в офисе заказчика, провести по нему экскурсию, показать и дать пощупать продукт, познакомить с услугой.
1. Проводим интервью (одно или несколько) с заказчиком.
В ходе интервью у всей команды формируется представление о специфике бизнеса, о товарах, услугах и УТП компании, ЦА, конкурентах, бизнес-логике и процессах.
Даже если у заказчика есть подробно расписанное позиционирование компании, анализ по конкурентам, определена ниша и он готов предоставить все материалы исполнителю, необходимо будет применить всю эту информацию в вебе.
3. Формулируем выводы и задачи.
Понятно сформулированные выводы и поставленные задачи помогут исполнителю находиться в одном инфополе с заказчиком и уверенно перейти в следующий этап.
сформулированы задачи проекта;
составлено подробное описание проекта с выводами;
Инструменты, которые используем для предпроектного аудита:
Результатом этапа информационной архитектуры будут структурированные прототипы страниц будущего сайта с понятным контентом и пользовательскими сценариями.
Пример: благодаря проработанной информационной архитектуре пользователь сможет быстро найти нужный товар в большом каталоге, а заказчик — обратить внимание покупателей на сезонные позиции.
Инструменты, которые используем для создания информационной архитектуры:
После этапов аналитики и информационной архитектуры у нас есть достаточное количество вводных по проекту, и мы можем приступать к созданию концепции.
Мудборд — доска, отражающая настроение проекта. Он может содержать текст, фотографии и иллюстрации. Мудборд не должен передавать стилистику проекта.
Мудобрд можно формировать параллельно с этапом исследования продукта или услуги в процессе ознакомления с заказчиком и его бизнесом. С его помощью мы отображаем общее настроение будущего сайта, характер и позиционирование бренда.
Стайлборд — доска, отражающая стилистическое направление проекта.
Дизайнер смотрит референсы, собирает идеи по стилям — формирует стайлборд. Референсы могут быть сгруппированы по направлениям:
Для эффективной работы рекомендуем обсудить референсы с клиентом, чтобы синхронизироваться с ним и убедиться, что вы движетесь в правильном направлении.
Инструменты, которые используем при составлении мудборда и стайлборда:
Над генерацией идей может работать один дизайнер или вся команда, в зависимости от сложности и масштаба проекта. Создание первых набросков, скетчей и иллюстраций — из этих шагов складывается второй этап подготовки концепции. Важно решить, как на сайте будут раскрываться идентификаторы фирменного стиля и нужно ли создавать новые визуальные образы.
На этом этапе вся команда уже погружена в процессы.
Чем больше информации и выводов, тем больше фильтров, которые приводят нас к правильным решениям для продукта, в том числе визуальным.
При генерации масштабируемых и небанальных идей помогают регулярные просмотры работ топовых дизайнеров и агентств, изучение трендов, площадок с конкурсными работами, тематических дайджестов.
На этапе штурма идей нужно собрать максимальное количество вариантов без детализации и погружения в микрорешения, так как основной задачей создания дизайн-концепции является анализ гипотез. Идеи могут быть в виде текста, скетчей, поверхностных набросков или скринов.
На этом скрине можно увидеть наброски идей в результате внутреннего штурма веб-дизайнеров Nimax.
Из разнообразия вариантов выбираются наиболее подходящие критериям оценки результата.
Инструменты, которые используем на этапе генерации идей:
Из большого количества идей в ходе общего штурма выбираются самые удачные, те, которые наиболее точно помогут решить задачи сайта: визуальные и функциональные.
Иногда одна идея дополняет другую и они объединяются в одно продуманное решение.
В некоторых проектах имеет смысл подключить к отбору команду заказчика, так как именно эти люди являются носителями знаний о бизнесе и быстро помогут откинуть неподходящие идеи. Это может быть актуально для разных ситуаций:
На этом этапе нет задачи показать заказчику как можно больше идей. Достаточно иметь весомую аргументацию для одной, но самой подходящей.
Создавая макет на основе идеи и выбранных стилистических решений, нужно помнить о том, что мы задаем ритм для большого количества страниц с разным типом контента. Поэтому важно параллельно примерять решения для других страниц, учесть разные сущности, изучив подробно прототип и будущий контент.
Инструменты, которые применяем на этапе выбора идей и создания макетов:
Финальный шаг — презентация концепции заказчику. Защищать проект может сам дизайнер или менеджер проекта. В любом случае важно присутствие дизайнера во время встречи или созвона. Он сможет с профессиональной точки зрения ответить на вопросы, связанные с дизайном макетов.
Мы всегда начинаем презентацию с формулировки задачи, краткого описания будущего проекта и его аудитории.
Далее раскрываются карты. На слайдах обозначаем весь путь, который прошла команда: от аудита и идей до готового дизайна. Так мы показываем, что макеты получились не случайным образом, а методом исследования и анализа.
Лучшая демонстрация макетов — анимация, так можно заранее ответить на многие вопросы, которые могли бы возникнуть у заказчика.
Если на презентации присутствует не вся команда заказчика, мы зачастую отправляем видеопрезентацию для удобства и корректной трансляции идеи концепции.
В результате формируется набор правил и стилистических решений, которые будут распространяться на все остальные страницы проекта. Итогом становится как минимум одна отрисованная страница для демонстрации идеи, на основе которой команда презентует проект заказчику.
Так как команда заказчика понимает, в каком направлении движется дизайн, сокращается время на отрисовку внутренних страниц и упрощается процесс согласования. Остальные страницы сайта будут выглядеть в единой стилистике, а для нового контента не придётся изобретать дизайн с нуля.
Даже если проект будет передан другим дизайнерам, то при грамотном соблюдении разработанных правил, макеты разных страниц будут выглядеть целостно и в единой визуальной системе.
Подписывайтесь на телеграм-канал Школы Nimax — там вы найдете больше полезной информации о веб-дизйне, брендинге, маркетинге, digital PR и управлении трафиком.