Веб-дизайнерам: с чего начать создание кейса, чтобы заинтересовать клиента
Макет в портфолио ничего не рассказывает потенциальному клиенту.
Чтобы не зависеть ни от чьих вкусовых предпочтений, дизайнеры создают кейсы. Выстраивают связную историю, объясняют свои решения текстом. Клиент понимает, как работает дизайнер и формулирует представление о нем, как о компетентном специалисте.
Эта статья о первом этапе упаковки проекта в кейс — структуре.
Зачем структура
Кейс — история проделанной работы, от интервью до сдачи макета в верстку. Если какой-то этап пропущен, история получается нелогичной и выстраданной. Чтобы этого не случилось, нужно сначала прописать структуру на бумаге.
Хорошая структура выглядит так:
Если сначала продумать структуру, кейс получится логичным и цельным, потому что ты смотришь на него «издалека». Ты заранее видишь, где у тебя будут смысловые проблемы. Вот в такой структуре проблемы видны сразу:
Видно, что это несвязная структура. Логичными получились только начало и конец. Все остальные мысли вразнобой.
Польза структуры в том, что она собирает разрозненные мысли. Дизайнер заранее знает, о чем расскажет и что покажет потенциальным клиентам. Исправит все смысловые проблемы на бумаге. Готовый кейс получится в точку.
Универсальная структура
Универсальная структура кейса простая и пуленепробиваемая. Пользуйся ей, она работает всегда: обложка проекта, задача, варианты решения, дизайн-макет, блок благодарности.
Показать обложку. Показать, что это за проект:
В поисках идеального кейса или топ-10 советов как это сделать
В один осенний день Анатолий Денисов озадачил меня просьбой провести первую глобальную ревизию раздела «Кейсы» на CMSMagazine. С момента старта накопилось без малого 193 проекта. Все еще усугубилось тем, что надо не просто посмотреть и закрыть, но и выбрать несколько лучших. И все это под соусом UX/UI.
Вообще, суть этого материала чуть более широкая. Смакуя лучшие примеры, параллельно, мы будем разбираться, что такое кейс и зачем это вообще нужно.
А если нужно, то как сделать из этого действительно красивую и увлекательную историю. От бессмысленных текстов и непонятных картинок до, как это модно говорить, Вижуал Сторителлинга :). Поехали!
Зачем вообще нужен кейс?
Кейс — это универсальный и простой способ рассказать про свой проект. Такой формат существует на Западе довольно давно и пришел к нам из сферы айтишников-рекламщиков-консультантов.
В сфере веб-разработки были разные попытки подойти к этому формату. Помните, что когда-то для портфолио было достаточно просто картинок? Но, так или иначе, эволюция взяла свое. Теперь у вас может быть не только Портфолио, но и Кейсы. Причем последние могут быть фантастически разными. Поскольку мы можем использовать для этого всевозможные цифровые примочки.
Порой достаточно сделать 5-7 сочных и актуальных кейсов, чтобы обеспечить стабильный трафик на ваш сайт и какую-то ауру обсуждений в соцсетях.
Кейсы могут быть разными. На старте создания вам нужно понять, кого вы собираетесь цеплять этими историями:
Безусловно, есть какие-то отдельные уловки для каждой из этих групп по отдельности. Но сегодня мы рассмотрим советы, как сделать так, чтобы угодить всем сразу.
1. Встречают по обложке
Мы живем в эпоху информационного ожирения из-за чего читатель стал безумно ленивым. Поэтому наша главная задача — попасть в область внимания и вызвать интерес в первые 5-7 секунд. Именно столько времени в среднем нужно пользователю для принятия решения: скроллить дальше или закрыть сразу.
Для старта кейса критически важна обложка. Обычно это яркая, сочная, (порой не имеющая связи с реальностью) обложка, в который вы говорите, о чем это вообще.
Задний фон в большинстве случаев должен отличаться от белого. Либо однотонный яркий, либо с контекстным бэкграундом. Короткий и доступный для чтения заголовок. Главный скриншот вашего проекта может быть в мокапе устройства. Интересная геометрия или композиция. Простой способ проверить результат самому — посмотреть на обложку с расстояния 2-3 метров. Должно цеплять, работать как постер к фильму.
2. Заранее продумайте структуру рассказа
Помните, что кейс — это не просто куча разбросанных картинок. С кусками рассказа, как же вам было хорошо вместе с заказчиком на даче или в фотошопе. Ваша цель — зацепить взгляд пользователя и держать его в тонусе на протяжении всего скролла (а это, поверьте, не просто).
https://www.behance.net/gallery/38586573/ROSATOM
Начните кейс с внутренней структуры. Зафиксируйте ключевые моменты рассказа в блокноте и потом потихоньку разматывайте ее в прототип и в графические детали.
https://www.behance.net/gallery/33912080/Rostelecom
3. Оптимальная длина кейса
Как насытить пользователя и не дать ему уснуть? Довольно важный момент.
Я верю, что бывают такие истории, которые не могут закончиться просто. Такие они красивые и сладкие для вас, что хочется продолжать бесконечно. Но именно здесь кроется подвох.
Читатель готов воспринимать красивую и логичную историю, но в рамках разумного. Почему длина хорошего художественного фильма — 1:30м, серии в сериале — 45м, музыкального клипа — 3м? Так же и с вашим кейсом.
Ключевые приметы: от 15 000 до 20 000 пикселей.
4. Макропланы и детальки
Кейс живет ритмом. И наша задача, задав хороший тон на обложке, время от времени этот ритм поддерживать. Делается это прежде всего для того, чтобы взгляд читателя не залипал. Не стоит частить с превью макетов. Время от времени вам надо приближать на контрасте самые сочные моменты: виджеты, графики, показывать особенности стиля иллюстраций.
Ключевые приметы: Эффект зебры. На протяжении всего кейса, выделите несколько контрастных зон, где вы покажете максимум вкуснятины. Для этого хорошо подойдет: изометрия, крупные иконки, инфографика, анимационные элементы и т. д.
5. Текст необходим, но настолько же бесполезен
Я часто сталкиваюсь с большим контентным материалом. Верю, что это критически важно. Что только так вы можете рассказать, в чем же, и где был ваш УТП. Но, поверьте мне, читать много текста, да еще в кейсе — это глупость. Мы живем в цифровой среде, где вы можете рассказать о вашем проекте на абсолютно новых языках: графика, факты, видео, интерактив. И даже когда ваш проект совсем не про визуальный дизайн, поверьте, — есть масса классных вариантов сделать это незабываемо. Но не текстом.
Совсем отказываться от текста, безусловно, нельзя, но всегда проверяйте, чтобы его количество было минимально.
Ключевые приметы: Вдумчивый и вкусный копирайтинг. Короткие и крупные заголовки. Раскрывающие подстрочники. Местами 1-2 абзаца текста. Мелкие подсказки и примечания.
6. Реалистичнее и вкуснее
Кейс — это особенный жанр. Вы просто обязаны упаковать свой проект максимально эффектно. Не важно, что в реальной жизни так не бывает. Это должно быть сногсшибательно. Чтобы читатель поверил, хотя бы в рамках этого кейса.
Ключевые приметы: Использование необычных мокапов. Изометрический вид.
Этот ресурс может немного вам в этом помочь: http://www.pixeden.com/
Если хотите играть по-крупному, посмотрите еще здесь: www.creativemarket.com
7. Как вы это делаете? Расскажите про процесс
Последнее, что чаще всего остается отличительной и не избитой чертой, — это ваш личный процесс поиска решений. Как вы пришли к результату? Расскажите об этом. Можно даже немного его приукрасить. Прототипы, аналитика. Все имеет значение.
Покажите больше вариантов, можете что-нибудь еще подрисовать для эффектности. Мы часто так делаем.
Ключевые приметы: Прототипы, схемы, промежуточные решения.
8. Без анимации не едят
Еще одна успешная механика для того чтобы удержать читателя в тонусе на протяжении всего рассказа — анимация элементов. Формат GIF получил вторую жизнь. Возьмите яркие отрывки вашего интерфейса, где вы хотите показать необычные микро взаимодействия. Покажите, как это будет работать, даже если это невозможно. Это ваша сказка, ваш концепт!
https://www.behance.net/gallery/34555939/SHARP
Самый писк, когда анимационные элементы идеально вживлены в структуру кейса, и кажется, что элементы буквально оживают в нужном месте.
Но не перестарайтесь. GIF-анимация много весит и требовательна к загрузке процессора. Идеально использовать 2-3 гифки, каждая из которых не больше 5-7 секунд по времени.
Ключевые приметы: GIF-анимация, где начало ролика мастерски совпадает с его концом, образуя loop-секвенцию.
9. Мы молодцы, но об этом коротко
Не забывайте рассказать ключевые факты проекта, желательно, в измеримых показателях. Это по-прежнему может привлекать внимание и отличать вас среди остальных. Но будьте аккуратны. Это контент-задача, поэтому старайтесь придумать что-то необычное.
И второе, о чем также стоит рассказать в конце,— это основные гайдлайн, элементы UI Kit. Технические детали работы кнопок, хитрые дропдауны и т.д. Все эти мелочи, особенно в конце, подтверждают серьезность и внимание к деталям в вашей работы.
https://www.behance.net/gallery/42834421/NTV-Plus
Ключевые приметы: 160 макетов, 3 убитых мышки, 6 бессоных ночей Васи верстальщика. И обязательно заверните эти шоколадные кнопки в UI Kit на десерт.
10. Финишируйте по-голливудски
Ну чем еще его убедить, что ваш проект действительно особенный?
Напоследок остается только одно. Цельный видеоролик про проект вживую. Музыка и качество анимации ставит в его сердце жирную точку: либо вы, либо никто.
Ключевые приметы: Шоурил проекта. Продолжительность 1-1,5 минуты.
Только AfterEffects, только хардкор.
Вот, пожалуй, основные и эффективные советы, которые должны сделать ваш кейс особенным. Надеюсь, эта статья была полезной для вас.
В остальном, следите за трендами, подписывайтесь на нас.
Что такое кейс в дизайне
Кейсы — типичная проблема дизайнеров-новичков. Они знают, что портфолио должно быть, обязательно с хотя бы 2-3 работами, но как их оформить — без понятия.
Но прежде, чем перейти к практическим советам и примерам, поймите — портфолио делается не для того, чтобы показать все ваши работы. В нем не так важно количество примеров, как их качество, поэтому следует отбирать только лучшие дизайн-проекты, которые «продадут» ваш опыт, знания и навыки потенциальным заказчикам. А если таких работ пока нет, сделайте их сами. Да, так можно и этим способом пользуются многие дизайнеры, размещая в портфолио несколько несуществующих работ.
А теперь перейдем к советам!
Обложка должна сразу объяснять, о чем кейс
Просто главная страница сайта — неплохой вариант для обложки, но слишком невзрачный. Нам ведь нужен пример, который соберет тысячи просмотров и привлечет внимание клиентов? Тогда обложку лучше оформить по такой схеме:
Грамотная структура кейса — 50% успеха
Допустим, у вас есть готовый, законченный проект, вы решили его оформить в кейс и разместить на Behance. Начинать следует с обложки и продумывания структуры.
Кейс — это не набор из кучи скриншотов-картинок вашей работы. Это рассказ о вашем дизайн-проекте через текст и изображения с логичной структурой и историей, где важно показать проблему, ход мыслей и решения, результат.
Важно придерживаться такого плана:
1. Укажите цель, задачи проекта.
2. Кратко опишите свое решение-стратегию.
3. Поделитесь своими идеями-набросками и тем, как шли к поиску оптимального решения. Это лучше всего реализовать через демонстрацию прототипов, схем.
4. Перечислите названия и коды цветов, выбранные шрифты. Здесь будет уместно написать 1-2 предложения о том, почему сделали такой выбор.
5. Покажите несколько задизайненных страниц (лучших, по вашему мнению, или самых важных в конкретном дизайн-проекте).
6. Расскажите о каких-то фишках, необычных техниках или элементах проекта, покажите их. Это могут быть трендовые, небольшие детали вроде рисованных элементов или анимированных заголовков.
7. Покажите, как выглядит дизайн на разных устройствах. Как минимум — на ноутбуке и телефоне, но лучше еще и на планшете. Подберите мокапы, которые соответствуют общему стилю кейса и проекта.
8. Поблагодарите за уделенное вам время и оставьте контакты, через которые с вами можно связаться (почту, ссылки на рабочие страницы в соцсетях, телефон).
Анимация в кейсе — это всегда плюс
Анимация — это об интерактиве, а интерактив — то, что вызывает интерес к увиденному. Это один из инструментов, который позволяет сделать так, чтобы человек досмотрел кейс до конца, впечатлился и захотел заказать у вас работу. То есть, для клиента наличие интерактивных элементов (даже если их в самом проекте не было, только в примере работы) — проявление у дизайнера креативности.
Что можно добавлять в качестве анимации:
К слову о мокапах. К ним можно привлечь внимание не только через анимацию, но и через необычный формат. Идеи можно найти на сайте Pixeden.
Добавляйте минимум текста, максимум визуала
В кейсе текст используйте только для подсказок, объяснений, разделения информации на структурные элементы. Описывать свои ощущения и рассказывать, как вы любите этот проект, сколько времени его делали, как трудно дались какие-то моменты не стоит.
Если вам кажется, что текста, наоборот, очень мало, добавьте больше макропланов и яркой типографики.
На просмотр кейса должно уходить 1-3 минуты
Правило негласное, неофициальное и существует как опциональное. Не нужно показывать в примере все экраны, страницы, блоки, особенно если их было более 20. Лучше меньше, но самое крутое и важное в конкретном проекте. Покажите блоки с необычными внедренными элементами и функциями.
Дизайнеры считают, что оптимальный размер кейса — 16-20 тысяч пикселей. Меньше можно, больше — не желательно.
Что еще нужно знать?
С основами оформления кейсов дизайнеров ознакомились. Теперь некоторые мелкие, но важные рекомендации:
Научитесь профессионально оформлять кейсы
Станьте профессиональным веб-дизайнером с Айтилогией
Обучение веб-дизайну в Айтилогии — это 3,5 месяца интенсивных занятий с наставником, после которых вы станете сильным начинающим веб-дизайнером и сможете начать карьеру уже в процессе обучения.
На закрытой онлайн-платформе Айтилогии вас ждёт много насыщенных уроков и мощных практических заданий. А на персональных разборах домашних заданий вы будете отрабатывать ваши личные ошибки из практики.
После курса у вас в портфолио будет 7 потрясающих макетов: баннер, форма регистрации, 4 лендинга и интернет-магазин! Да-да, всё это на нашем интенсивном курсе для начинающих, всего за 3,5 месяца!
Всю актуальную информацию о программе курса, портфолио, стоимости обучения и рассрочке можно узнать по этой ссылке.
Что такое кейс и как его написать
В бизнесе есть множество способов заинтересовать и вовлечь покупателей. Некоторые подойдут для превращения «холодных» клиентов в «горячих», другие работают на то, чтобы привлекать тех, кто уже совершил какую-то покупку ранее. Есть и универсальные инструменты, и один из таковых – это кейс.
Я расскажу, что такое кейс, зачем он нужен и как правильно использовать его в маркетинге и бизнесе.
Понятие произошло от английского слова case, что в переводе означает «случай», «дело», «ситуация». Его представление – рассказ о реальном случае, связанном с продуктом компании. В нем показывается, какие интересные идеи или решения определенной проблемы предлагает организация. Особенно этот инструмент распространен в сфере B2B, например в консалтинге, в сфере продвижения сайтов или аккаунтов социальных сетей. Также он нередко используется в рекламе, дизайне, юриспруденции, ремонте и даже строительстве.
Зачем его писать
Во-первых, идея очень проста и наглядно показывает, что имеет клиент «ДО» и что получит «ПОСЛЕ» приобретения вашего продукта. Причем результат представляется именно в позитивном ключе.
Во-вторых, кейс показывает компанию в выгодном свете, как она успешно решает проблемы своих клиентов и не боится рассказывать об этом. В итоге это еще и повышает уровень доверия потенциальных покупателей.
В-третьих, данный инструмент отлично подогревает «холодных» клиентов. Они видят реальный положительный пример использования вашего решения, и у них возникает желание сотрудничать с вами.
В-четвертых, если разместить такой материал на корпоративном сайте или в блоге, он поможет продвинуться в поисковых системах, то есть SEO-показатели ресурса улучшатся.
Когда нужно писать кейсы
Хотя кейс и универсален, все же он подойдет не во всех случаях. Есть конкретные примеры, где этот инструмент поможет решить проблему, и сюда стоит отнести:
Но стоит помнить – если вы публикуете результаты успешного сотрудничества с другой компанией, обязательно запросите разрешение у ее представителей. Некоторые, возможно, будут не особо рады лишнему упоминанию, иные же пойдут навстречу и, возможно, даже попросят опубликовать этот материал у себя со ссылкой на вашу компанию.
Виды кейсов
В зависимости от способа подачи и места размещения, выделяют несколько видов кейсов:
Способы использования кейса
Подобные материалы нужно размещать на официальных площадках. Это сайт, официальные каналы и аккаунты в социальных сетях, блоги и многое другое. Рекомендуется также присмотреться к сторонним ресурсам, позволяющим компаниям размещать собственные публикации, например Яндекс.Дзену, онлайн- и офлайн-журналам, специализированным порталам и так далее.
Основные правила написания кейса
Далее пойдет речь об основных этапах составления кейса, ведь этот процесс должен идти планомерно, в строгой последовательности.
Подготовка
Как я уже ранее говорила, сперва необходимо получить согласие клиента, с которым вы вели этот проект. После согласования нужно определить, для кого вы составляете материал – определите целевую аудиторию, также цели и задачи, которых вы хотите достичь. Потом уже можете приступать ко сбору информации.
На этом этапе следует:
Другой момент – сбор вопросов, интересующих ваших клиентов, и выделение из этого списка тех, которые данный кейс может решить.
Связь с нужными людьми
Вы можете собрать комментарии у тех людей, которые непосредственно участвовали в проекте и играли во всем процессе важную роль. Они могут поведать много интересного, рассказать о том, как была заключена сделка, как (быть может) проводились закупки.
Составление текста
Как только вы соберете всю необходимую информацию, можете сразу же приступать к написанию истории. Старайтесь писать на простом, понятном языке. Используйте профессиональные термины по минимуму, только если без них совсем не обойтись.
Еще одно требование – разбивать текст на небольшие смысловые блоки. Помните, что один абзац должен передавать одну мысль или идею. Также полезно использовать заголовки и подзаголовки, чтобы людям было легче ориентироваться в тексте. Не используйте размытые формулировки, говорите четко и по делу, указывая в тексте точные числа. Например, «в результате было привлечено много лидов» лучше заменить на «мы привлекли 100 лидов».
Редактура и очистка
После завершения написания истории идет этап редактуры. Если всем процессом вы занимаетесь самостоятельно, отложите текст ненадолго, желательно на пару часов, и только потом приступайте к редактированию. Можно попросить коллег пройтись по тексту, отметить какие-то ошибки или несвязанные высказывания.
За этим идет еще один важный этап – добавление «усилителей». То могут быть картинки, иллюстрации или таблицы, фотографии, цитаты и отзывы, ссылки на статистику и многое другое. В общем, все то, что лишний раз подтвердит ваши слова и наглядно покажет положительные результаты.
Как правильно оформить кейс
Легче будет писать, если вы заранее в черновике составите четкую структуру будущего текста. А уж клиенты, которые будут читать текст, поймут, какую идею вы хотите передать. Составленную структуру держите всегда под рукой, чтобы не запутаться и четко понимать, что именно в данный момент стоит перечислять. Вот общий план, которого можно придерживаться:
Полученный материал надо сохранить в удобном для дальнейшего просмотра формате. Если это видео, то и говорить нечего – заливаете на сайт или в видеохостинг, потом даете на своих ресурсах ссылку.
Если же это текст, то загружаете его на свой сайт, в специальный раздел. Причем желательно назвать его более привычным образом, например «Портфолио». Можно вдобавок опубликовать текст в блоге или на каком-то профессиональном портале.
Если же это презентация, то ее необходимо сохранить в формате PDF. Объясняю, почему именно в таком: он поддерживается практически на всех устройствах и ОС; при открытии на других экранах ничего не «съезжает», сохраняется исходный вид материала, да и весит он не так много. Такие документы, если загрузить их на сайт, распознаются поисковиками, да-да! Соответственно, это еще и положительно скажется на SEO-показателях.
Частые ошибки при составлении кейса
Все мы далеко не идеальны и порой допускаем ошибки. Вот и при написании кейсов можно что-то сделать не так, а что конкретно, я сейчас расскажу:
Кейс – действительно крутой инструмент. Старайтесь описывать крупные достижения в понятном и скромном виде и публиковать их на разных интернет-площадках. Результаты не заставят ждать 😉