20 советов из книги «Добавьте в корзину. Ключевые принципы повышения конверсии веб-сайтов»

1. Сократите количество шагов, которые включает в себя процесс оформления заказа. Совет настолько же очевидный, насколько и неоднозначный. Казалось бы, логично – чем больше действий нужно совершить, чтобы оформить заказ, тем больше риск отказа. В действительности всё несколько сложнее, уверены авторы книги: если покупатель нашёл действительно необходимую ему вещь, он оформит заказ, сколько бы времени не пришлось на это потратить. И наоборот – известны случаи, когда владелец сайта сокращал количество шагов до одного-двух, но отказов при этом меньше не становилось. Так что прежде чем уменьшать количество шагов, стоит попробовать один из способов, описанных далее.
2. На каждую страницу оформления заказа добавьте «индикатор прогресса» (например, шаг 2 из 5). На самом деле, не принципиально, сколько шагов должен выполнить покупатель; гораздо важнее, чтобы он каждый раз понимал, на каком этапе оформления заказа находится.

+ Чётко обозначьте задачу, которую выполняет пользователь на каждом этапе; обеспечьте ему возможность при необходимости сделать пару шагов назад, а затем легко вернуться к достигнутой ступени.
3. Ссылка на страницу с описанием товара всегда должна быть на виду. Это нужно, чтобы покупатель в любой момент мог быстро проверить, то ли он купил, что хотел. Лучше всего поместить эту ссылку в корзину вместе с наименованием товара.
4. Показывайте на странице корзины изображения товаров. Небольшое изображение выбранного товара, добавленное в корзину, способно увеличить коэффициент конверсии на 10%.
5. Как можно раньше сообщите покупателю стоимость доставки. Общая стоимость покупки – один из самых важных вопросов для покупателя, и чем раньше вы на него ответите, тем лучше. Лучше всего поместить предположительную стоимость доставки рядом с наименованием товара в каталоге.
+ Не заставляйте пользователя несколько раз вводить один и тот же адрес. Лучше спросите, совпадают ли адреса плательщика и получателя, и если ответ положительный – заполните соответствующие поля за него.
6. Указывайте наличие товара на странице с его описанием. Если товара нет на складе – покупателю лучше узнать об этом до того, как он приступит к оформлению заказа.
+ Полезно также указывать предположительное время доставки, например, «Обычно на доставку уходит Х дней».
7. Подскажите посетителю, какую кнопку или ссылку нужно нажать. Пусть кнопка «Следующий шаг» или «Продолжить» будет самым заметным элементом на странице.
8. У покупателя должна быть возможность отредактировать корзину. Предоставьте покупателям удобные средства редактирования корзины. Пусть они без труда смогут изменить расцветку или размер товара, добавить или убрать его из корзины.
9. Помогите исправить ошибку и возьмите вину на себя. Если при оформлении заказа пользователь ввёл не все данные или заполнил какие-то поля неправильно, в сообщении об ошибке чётко и понятно объясните, что и где именно нужно исправить. Преподнесите это так, будто ваша система виновата, что не смогла понять полученные данные, а не пользователь допустил нелепую ошибку.
10. Укрепите уверенность покупателей, что они имеют дело с реально существующей компанией. На этапе оформления заказа клиентам особенно важно убедиться в вашей надёжности. Предоставьте им информацию, подтверждающую реальность вашей фирмы, добавьте на страницу заказа свои телефоны и все необходимые контакты.
По книге Брайана и Джеффри Айзенберг «Добавьте в корзину. Ключевые принципы повышения конверсии веб-сайтов»

Источник: https://vc.ru/design/227878-20-sovetov-iz-knigi-dobavte-v-korzinu-klyuchevye-principy-povysheniya-konversii-veb-saytov

20 советов из книги «Добавьте в корзину. Ключевые принципы повышения конверсии веб-сайтов». Часть 2

11. Предложите сделать заказ по телефону. Если у посетителя возникли сложности при оформлении заказа или он опасается вводить на сайте номер кредитной карты – пусть позвонит по телефону. Выделите для этого отдельную линию. Особо недоверчивым дайте возможность заполнить бланк заказа вручную и выслать вам фото или скан.
12. Обеспечьте удобство новым покупателям. Сделайте процесс оформления заказа максимально простым для пользователей, которые решили воспользоваться вашими услугами впервые. Зарегистрированные клиенты так или иначе найдут способ попасть в свой аккаунт; но для нового покупателя слишком сложная регистрация станет препятствием на пути к покупке.
13. Продумайте политику скидок. Определитесь, где и как стоит предлагать скидки и бонусы. Не стоит рассказывать новому клиенту об акции, рассчитанной только на давних покупателей – так информация о скидке вместо удовольствия вызовет досаду, а это не способствует продажам.
14. Смело заявляйте о реальных преимуществах. Если вы продаёте продукцию отличного качества по цене ниже средней, вполне можно позволить себе заявление: «Если найдёте товар дешевле, мы ещё снизим цену».
15. Обеспечьте покупателю как можно больше вариантов оплаты: по карте, чеком, через платёжные системы или другим доступным способом.

16. Поддержите покупателя в точке действия. Предоставьте клиенту максимум необходимой информации там, где он принимает решение о покупке. Добавьте ссылки на страницы с гарантийными обязательствами, отзывами других покупателей, правилами возврата и обмена товаров, а также условиями сервисного обслуживания. Пусть страница подгружается в новой вкладке или открывается во всплывающем окне.
17. Подкрепляйте уверенность клиента везде, где это необходимо. Когда пользователь вводит личные данные, укажите, что сохраните их в строгом секрете. В том месте, где покупателя заинтересует стоимость доставки, предоставьте конкретные цифры. А когда он захочет узнать о ваших гарантиях, дайте понять, что без проблем обменяете товар или вернёте деньги.
18. Отслеживайте ошибки. Разработайте систему, которая будет сообщать вам об ошибках, возникающих при оформлении заказа. Это поможет оперативно выявлять и устранять проблемы, снижающие конверсию.
19. Сохраняйте текущее состояние корзины. Покупатели нередко покидают сайт, оставив товары в корзине, но ведь кто-то из них может и вернуться. Когда пользователь покидает сайт, предложите ему сохранить текущее состояние корзины. Можно сообщить в электронном письме о том, что в корзине остались товары, которые будут ждать его возвращения.
20. Если ничего не помогает, задайте вопрос напрямую. Когда посетитель покидает сайт, оставив заполненную корзину, попросите его указать причину. Дайте пользователю бонус за ответ или продумайте другой стимул, чтобы он захотел ответить на ваш вопрос.
***

Возможно, некоторые из этих советов помогут вам фантастически повысить эффективность сайта, в то время как другие не дадут сколько-либо заметных результатов. Единственный способ узнать, что подойдёт конкретно вам – это попробовать.
В целом же следует понимать, что такова уж особенность продаж через Интернет – многие пользователи уходят с сайта, оставив корзину, полную товаров. Даже если вы доведете до совершенства каждую мелочь, люди все равно будут покидать сайт по причинам, которые вам не подвластны.
Но есть и хорошие новости: со страницы корзины сайт покидает гораздо меньшее количество пользователей, чем со всех предшествующих страниц. Если стараться удержать посетителей в процессе покупки с самого начала, у вас есть все шансы повысить коэффициент конверсии в несколько раз.

Источник: https://vc.ru/design/228489-20-sovetov-iz-knigi-dobavte-v-korzinu-klyuchevye-principy-povysheniya-konversii-veb-saytov-chast-2

Измените свой дизайн для глобальной аудитории: исследование кросс-культурного UX-дизайн

Межкультурная адаптация дизайна варьируется от перевода до локализации. Изучение общих и контекстуальных культурных различий поможет вам решить, какие изменения дизайна вам следует внести.

Когда бренды и организации стремятся к росту за счет выхода на глобальный рынок, они могут обнаружить, что их цифровые продукты не так популярны, как на внутреннем рынке.

Помимо маркетинговых факторов, одной из частых причин является то, что их сайты и приложения изначально разрабатываются и тестируются с учетом местного демографического профиля. То, что отлично подходит для домашней группы, может не иметь никакого смысла для людей из другой культурной среды. Вот почему дизайнеры должны модифицировать продукты для глобальной аудитории и тестировать их с этой целевой аудиторией, чтобы подтвердить изменения.

Содержание статьи 
Два типа адаптации
Факторы, влияющие на кросс-культурный дизайн
Уровень неоднородности ваших целевых аудиторий
Общие культурные различия
Культурные различия в использовании продуктов
Брендинг
Потенциальная стоимость целевого рынка
Проверьте свою целевую аудиторию
Советы по кросс-культурному UX дизайну

Читать статью: https://ux.pub/izmenite-svoy-dizayn-dlya-globalnoy-auditorii-issledovanie-kross-kulturnogo-ux-dizayn/

Что на самом деле означает простой дизайн? Правильный подход к созданию UI-kit для iOS

Простой дизайн – это клише. Мы все делаем вид, что стремимся к простому дизайну. Это звучит так же, как фраза: «Сделай мир лучше!» из сериала «Silicon Valley». Подобно эпитетам «минималистичный» и «ясный», кажется, что просто написав эти заезженные слова, мы повысим ценность дизайна. Но что означает простой дизайн? Думаю, что каждый человек понимает это по-своему.
То же самое и с понятием красивый. Как мы можем определить, что прекрасно? Есть некая волшебная формула?

Читать статью: https://ux.pub/chto-na-samom-dele-oznachaet-prostoy-dizayn-pravilnyy-podhod-k-sozdaniyu-ui-kit-dlya-ios/

10 хитростей Figma, которые я хотел бы знать раньше

Хаки Figma, о которых вы, возможно, не слышали.
Меня всегда поражало количество полезных функций, которые Figma встроила в свое приложение. То, что раньше было обходным решением в Sketch, теперь является продуманной функцией в Figma.
Я часто натыкаюсь на функции, позволяющие сэкономить время, я хотел бы узнать о них раньше. Надеюсь, часть из них будет вам интересна и пригодится в работе.

1. Самое легкое создание кругового прогресса, которое вы когда-либо делали в своей жизни

Я понятия не имел об инструменте «Arc», пока однажды случайно не перетащил его на артборд, это просто взорвало мой мозг. Он позволяет создавать простые и красивые индикаторы прогресса.

2. Используйте инструмент масштабирования, чтобы избежать искажения

Сохраняйте идеальные пропорции вашего дизайна с помощью инструмента масштабирования – просто выберите элемент, который вы хотите масштабировать, затем нажмите клавишу K на клавиатуре и потяните курсор, вуаля.
Раньше я всегда отказывался от масштабирования дизайна, потому что всегда что-то ломалось, и мне приходилось вносить коррективы. С помощью инструмента масштабирования этих проблем больше нет – все идеально масштабируется и сохраняет пропорции без необходимости доработки.

3. Перетаскивайте объекты за пределы фрейма, удерживая их внутри контейнера

Удерживайте клавишу пробела при перетаскивании объекта за пределы фрейма, чтобы он оставался внутри контейнера. Вы также можете отключить функцию «Clip contents» для фрейма, содержащего объект, чтобы вы все еще могли видеть его, когда он находится за пределами контейнера – вы также можете нажать CMD (CTRL) + Y, чтобы отобразить контуры.

4. Приведите сетку в порядок

Приведите в порядок свои проекты, щелкнув по иконке сетки в углу после выбора нескольких объектов в массиве. Это сделает все интервалы между объектами одинаковыми, а затем вы сможете перетаскивать объекты, чтобы изменить их расположение и отрегулировать интервалы.

5. Продублируйте последнее действие

Нажмите CMD + D, чтобы продублировать предыдущее действие. CMD + D также будет дублировать объекты, фреймы и все остальное.
6. Предварительно просмотрите цвет с помощью пипетки

При использовании инструмента «Пипетка» (i) удерживайте левую кнопку мыши, чтобы просмотреть как меняется цвет элемента.

7. CMD + / разблокировать все объекты

Сочетание клавиш СMD + / имеет массу полезных быстрых действий, которые помогут в рабочем процессе и позволят сэкономить массу времени. Если вы еще не используете его, я настоятельно рекомендую посмотреть, какие действия доступны в меню. Действие, которое я часто использую – это быстрая разблокировка всех объектов и изменение шрифтов.
8. Легко вставляйте изображения внутрь фигур-плейсхолдеров

Нажмите CMD + Shift + K, чтобы заменить заливку фигур или фреймов с кучей изображений.

9. Другие приемы с пробелом

Перетащите область выделения, а затем удерживайте пробел, чтобы увеличить размер выделения указателя.

Если вы рисуете фигуру, вы также можете удерживать пробел, чтобы переместить объект во время его создания.

А если этого недостаточно, вы можете удерживать клавишу пробела, чтобы запретить Figma автоматическое вложение объектов внутри фреймов или отключить auto-layout. Клавиша пробела очень удобна!

10. Content Reel + Unsplash

Content Reel и Unsplash были двумя незаменимыми плагинами, экономящими время и позволяющими избежать использования «John Doe» в качестве имени для всех пользователей. С Content Reel вы можете одним кликом мыши вставлять в свой дизайн аватары, lorem ipsum, имена, адреса и многое другое. Unsplash – это бесплатная библиотека высококачественной графики.

11. БОНУС! Исправить высоту строки за секунду

Если у вас нет определенного значения высоты строки просто введите «auto» в поле line-height, и оно автоматически отрегулируется!

Источник с примерами: https://ux.pub/10-hitrostey-figma-kotorye-ya-hotel-by-znat-ranshe/

Объединение бренда и продукта на примере дизайн-системы Netflix

Сколько раз вы запускали новый сериал на Netflix и через несколько часов видели знакомый экран: «Вы все еще смотрите?» Конечно, да, и алгоритм это знает.
За каждым опытом стоит множество визуальных элементов и компонентов.

Все это можно напрямую связать с дизайн-системой, которая может позволить командам повторно использовать эти элементы обеспечивая более эффективную согласованность в масштабе.

Читать статью: https://ux.pub/netflix-design-system/

Пять советов для junior UX-дизайнеров

1. Читайте каждый день
Дизайн развивается довольно быстро, и если вы хотите работать в этой сфере, вам необходимо читать статьи (желательно на английском языке) и смотреть видео о дизайне (например, на Youtube). Хочу отметить, что информации слишком много и прочитать все невозможно. Чтобы сделать обучение проще и быстрее, я предлагаю вам организовать тематические недели. Это означает, что на следующей неделе ваша цель – прочитать статьи по типографике. Посвятив целую неделю этой теме, вы получите более точное представление о работе со шрифтами, чем читая случайные статьи по типографике раз в 3 недели.

2. Развивайте коммуникативные навыки и сосредоточьтесь на общении
Дизайнер – это человек, который всегда должен общаться с большим количеством людей – заказчиками, разработчиками, менеджерами, бизнес-аналитиками, тестировщиками, другими дизайнерами и, конечно же, целевой аудиторией. Коммуникативные навыки играют важную роль в профессиональном росте дизайнера. Чтобы достичь более высоких уровней, вы должны обладать хорошими социальными навыками и постоянно работать над их совершенствованием.

3. Много практикуйтесь
Сосредоточившись на теории, а не на практике, вы вряд ли добьетесь быстрых и качественных результатов. Вы можете изучить все правила, но важно уметь применять их на практике. Часто бывает, что одно и то же правило необходимо использовать и сочетать с другими, в зависимости от характера проблемы, и только практикуясь вы получите этот бесценный опыт.

Вы можете сами создать проект и работать над ним.
Например, вы выучили все виды кнопок и полей. Попробуйте создать регистрационную форму на сайте или в приложении. По мере работы вы будете сталкиваться с разными задачами, вопросами и проблемами, но со временем вы узнаете, как создать процесс регистрации.

4. Подпишитесь на других дизайнеров
Многие дизайнеры добились больших успехов в области UX / UI дизайна. Некоторые из них выступают на конференциях, вебинарах, преподают на курсах, пишут статьи или публикуют сообщения в социальных сетях. У этих людей можно многому научиться, они делятся своим опытом, рассказывают об успешных проектах и ​​неудачах в работе. Например, на Youtube вы можете найти множество видеороликов о том, как другой дизайнер создает дизайн страницы или сайта. Наблюдая за чужой работой, вы можете найти для себя много полезной информации, а столкнувшись с трудной задачей в будущем, вы сможете вспомнить опыт другого дизайнера и применить его в своей работе.

5. Найдите наставника
В некоторых странах наставничество не распространено. Не расстраивайтесь, попробуйте найти дизайнера среди друзей или напишите незнакомому дизайнеру и попросите его стать вашим наставником. Кроме того, вы можете попробовать посещать курсы, посвященные непонятной вам теме, и во время обучения преподаватель будет вашим наставником. Для чего нужен наставник? Когда вы тратите много времени на перечисленные выше 4 пункта, вы можете потерять азарт в обучении. Это может проявляться по-разному, но основные признаки таковы: вы потратили много времени на дизайн и внесли множество исправлений, но теперь ваше зрение затуманено, и вы понимаете, что работа не идеальна, но вы не можете понять, что именно не так; вы выучили много теории, но на практике не справляетесь с задачей; вы создали портфолио, но по какой-то причине несколько рекрутеров отказываются от него; вы запутались в тренировках и не знаете, в каком направлении дальше развиваться. Наставник может помочь вам со всеми этими проблемами.


Источник: https://ux.pub/pyat-sovetov-dlya-junior-ux-dizaynerov/

Доступность против трендов дизайна

Неоморфизм? Глассморфизм? Material Design? Все тренды дизайна могут быть доступными.

Помните, как в конце 2019 года разговоры о неоморфизме разделили сообщество дизайнеров пополам? Одной половине понравилась идея нового скевоморфизма, поскольку людям постепенно надоедают текущие тенденции дизайна. Они хотели заняться изучением и посмотреть, как его можно использовать и можно-ли вообще? Но более громкой и агрессивной группой были сторонники доступности. Что же их заботило? Неоморфизм НЕ является доступным. Они написали бесчисленное количество сообщений в различных блогах об этом, даже не смотря на то, что самая большая проблема доступности была ясно сформулирована ещё в самой первой статье. То же самое начало происходить и с Глассморфизмом.


Читать статью: https://design-glory.com/?p=6974

Как создавать доступные цифровые продукты

Качественный UX-writing – это приглашение использовать ваши цифровые продукты.

Всем читающим эту статью можно дать один отличный совет: Читайте вслух то, что вы написали. Да, вслух. Не про себя, в голове. Вслух – значит вслух. Шевелите ртом. Произнесите звуки. Слушайте свои предложения. Простой, но действительно рабочий метод. Слушание позволяет вам отвлечься от мыслей, уловить и исправить то, что вы могли не заметить. Это способ сгладить ситуацию. Слова ощущаются иначе при произношении. Первая цель хорошего UX writing – это юзабилити. Прежде чем сделать цифровые продукты индивидуальными, они должны приобрести смысл. Это означает, что ваши слова должны работать для всех. Для UX-писателей, работающих над цифровыми продуктами, вдвойне полезно слушать, как пишется интерфейс. Данный метод является довольно хорошим аналогом того, как работает чтение содержимого экрана. Слушание может улучшить ваш UX-текст, что сделает ваши продукты более удобными.

Цифровые продукты с их номенклатурой дизайна основаны на одном слове:
пользователь. Пользовательский опыт. Пользовательское тестирование. Исследование пользователей. Одно это слово иногда может скрыть очевидную, но важную истину: Пользователи – это разные люди, которые читают по-разному. Одни хорошо понимают английский язык. Другие – делают размер шрифта просто огромным. У некоторых людей есть когнитивные нарушения, или проблемы с словарным запасом. А может у кого-то есть специфический фон и окружение, которые формируют иное понимание слов. Инклюзивный и доступный UX writing — это способ напомнить людям о их принадлежности, что в этом продукте — и на этой планете — есть место для всех. Так что начните с чтения вслух. 

Читать далее: https://design-glory.com/?p=6946

Аптечка от выгорания дизайнера

Лечение симптомов, а не только причин выгорания.
На протяжении своей карьеры дизайнера, я несколько раз переживал эмоциональное выгорание, и пришел к выводу, что неразумно искать лекарство, сначала не устранив симптомы. Решение проблемы выгорания требует от нас уравновешенности и продуктивности. А это трудно сделать, когда боль – это все, о чем вы можете думать.

Стоит потратить несколько минут на оказание первой помощи при эмоциональном выгорании.

1. Сообщите своему телу, что это безопасно
Наш мозг склонен интерпретировать повседневные тревоги, как физические угрозы.
Когда мы думаем о дедлайне, наша симпатическая нервная система реагирует, вызывая дрожь, повышая кровяное давление и помещая нас в псевдосостояние борьбы. Хотя такая реакция хороша при физических угрозах, она может быть разрушительной в отношении тревожных состояний на рабочем месте, которые могут оставаться с нами после того, как мы закончим работу или даже когда мы пытаемся заснуть.

Хотя мы не можем контролировать свои физиологические реакции, их влияние можно значительно смягчить, просто сигнализировав нашему телу, что мы в безопасности (вызывая реакцию расслабления):

Медленно сделайте несколько глубоких вдохов.
Отойдите подальше от рабочего стола или ноутбука – всего, что ваш мозг связывает с тревогами на рабочем месте.
Откиньтесь в кресле или прилягте.
Поговорите с кем-нибудь о чем-то неважном.

Они не требуют больших затрат времени или усилий и могут быть объединены в одно действие. Например, вы можете встать из-за стола и поболтать с коллегой на диване или прилечь в зоне отдыха, где вы можете откинуться назад или поднять ноги.
Один или несколько этих методов, использованных во время перерыва на кофе или после работы, может помочь снять стресс и заставить ваш мозг снизить реакции на угрозы.


2. Осознайте, что вы чувствуете
Когда вы приходите домой и пытаетесь избавиться от мыслей о работе, не совершайте ошибку, игнорируя свои чувства. Вы горите и испытываете целый спектр эмоций. Все эти опасения вполне реальны, и исследования показывают, что их осознание может смягчить их влияние.
Постарайтесь подумать о том, что вы чувствуете, отвлекаясь от мыслей о самой работе, составлении планов, решении проблем или рассуждениях о том, почему что-то произошло.

Ответьте на три вопроса:

Какие эмоции я сейчас испытываю?
Что я думаю обо всем этом?
Как я себя чувствую, меняя свое обычное поведение?

Найдите время, чтобы серьезно подумать над своими ответами на эти вопросы. Самый простой способ сделать это – вести дневник, но, если вы предпочтёте поговорить с кем-нибудь об этом, убедитесь, что этот человек восприимчив и способен сосредоточить обсуждение на ваших чувствах, а не на работе или на поиске решений. Кроме того, вы можете поговорить об этом с домашним животным или растением. Звучит слегка безумно, но вы обнаружите, что они потрясающие слушатели.


3. Сделайте что-нибудь
Вы не устали, вы разочарованы.
Выгорание часто связывают с физическим истощением, но на самом деле это состояние эмоционального истощения или разочарования. Расслабление или сидение без дела, не обязательно улучшит ваше самочувствие.
Легкая физическая активность, такая как уборка или ходьба, может творить чудеса с вашим психическим благополучием и избавлять от любых нежелательных мыслей или разочарований. Ее также можно направить на продуктивные дела, которые помогут облегчить остаток недели или поднять необходимый моральный дух.

Другое определение «выгорания» – когда автомобиль вращает колеса в неподвижном состоянии, в результате чего шины начинают дымиться – это подходящая метафора для подобной ситуации. Будет много дыма, если вы нажмете на тормоза и попытаетесь остаться на месте, лучше всего найти правильное направление, чтобы направить машину и поехать.

Источник

Хватит тратить свое время на курсах, появилась крутая альтернатива 😳

Команда Design Line запустили принципиально новый способ обучения для дизайнеров. 

Подписка для дизайнеров Design Line Pro — это all inclusive в мире дизайна. 

За 1900 рублей в месяц ты получаешь:

— система прокачки твоих дизайн-навыков по критериям (есть даже уровни и лиги)
— 2 боевые задачи от ведущих агентств страны; 
— менторство каждого участника;
— все события Design Line уже включены в стоимость подписки (а если какие-то пропустил сразу получаешь записи);
— крутейший закрытый чат, который наполнен только полезной информацией;

Попробуй новый формат дизайн-тусовки прямо сейчас: https://clc.to/RJgx9w

Хотите стать лучшим UX дизайнером? Создавайте эмоциональный дизайн

Давным-давно молодой выпускник инженерного колледжа попал в мир дизайна.

Он сформировал сильный аналитический подход к UX-дизайну и его интересовали только черные линии и прямоугольники (вайрфреймы). Он придерживался аналитической позиции, согласно которой дизайн должен быть исключительно полезным.

Все могло быть хорошо, но он выработал другой сильный подход. И такой подход был антиискусством.
Наверное, потому, что все вокруг считали дизайн просто цветами и одеждой, не имеющей ничего общего с аналитикой.

Он упорно боролся, пытаясь доказать, что дизайн сводиться только к функциональности. И в этой борьбе он отгородился стеной от искусства. Он отгородился от эмоционального аспекта дизайна.

Увы! Он был не прав.
Этим дизайнером был я (неудивительно). А теперь я, наконец-то, перестану говорить о себе в третьем лице.
Что я обнаружил?
Хотя это далеко не открытие десятилетия, это изменило мой взгляд на дизайн. В прошлом году я заинтересовался эмоциональным дизайном

Я согласился с тем, что дизайн – это не просто функционал. Это также эмоциональный аспект.
Функциональный дизайн можно назвать хорошим дизайном. Но если вы хотите сделать отличный дизайн, вам нужно понять и эмоциональную часть.
Почему эмоциональный дизайн?

Он был бы не нужен, если бы проектировал для машин. Машины не действуют на основе эмоций. Они запрограммированы на выполнение определенных действий, и они будут выполнять их до тех пор пока миссия не будет выполнена! (Помните фильм Терминатор?)
Люди не машины. Люди не думают нулями и единицами.
Но мы, люди – странные существа. И наши эмоции играют еще более странную и сильную роль в нашем опыте.

А теперь представьте, что вам нужно пройти по толстой и прочной деревянной доске, соединяющей два небоскреба.

Возможно, у вас сильный выброс адреналина. Вы напуганы и не хотите идти, хотя это все та же доска. Страх меняет весь опыт. И так устроены люди.
Давайте поговорим подробнее об этом новом аспекте эмоционального дизайна.
3 круга эмоционального дизайна
Это один из лучших способов объяснить элементы эмоционального дизайна. И я узнал это от Дона Нормана.

Круг 1: Интуитивный дизайн

Что вам подсказывает ваша интуиция, когда вы видите красивую мебель или декор?
Интуитивный уровень дизайна – это 
внешний вид
Нельзя игнорировать восхитительные или пугающие визуальные эффекты, потому что они напрямую апеллируют к нашему сознанию.
Это глубоко укоренившиеся бессознательные, субъективные и автоматизированные чувства.
Он широко используется в брендинге, где продукты обращаются к нам не потому, что предлагают ощутимые выгоды, а потому, что отражают наши 
взгляды, убеждения, чувства
 и то, как мы хотим себя чувствовать.

Круг 2: Поведенческий дизайн
Сколько раз вы проклинали красивое платье, в котором вам трудно дышать?
Вы когда-нибудь ударялись лбом о полностью прозрачную стеклянную дверь?
Почему вы не можете добиться идеальной температуру для теплого душа?

Поведенческий уровень дизайна – это удобство использования. Вы хотите, чтобы эти вещи работали быстро и эффективно, чтобы вы могли достичь своих целей. Это практический аспект эмоционального дизайна.

Продукты, которые позволяют нам беспрепятственно достигать наших целей, без ошибок и препятствий, как правило, доставляют нам положительные эмоции.

Круг 3: Рефлеторный дизайн
Вы гордитесь тем, что носите обувь Nike, шорты Nike, Nike это, Nike то, Nike все?
Как вы думаете, что подумают ваши друзья, если вы купите эти смарт-часы?
Вы хотите сделать фото нового кафе, которое вы открыли для себя, и поделиться им со всем миром?
Рефлексивный уровень дизайна связан с рационализацией и интеллектуализацией продукта. Вы начинаете думать об этих вопросах. Могу я рассказать об этом историю? Апеллирует ли это к моей самооценке, к моей гордости?

Уровень рефлекторного дизайна относится к размышлениям пользователя о продукте до, во время и после использования.

Источник

Как несмотря на апатию завершить дизайн проект

Если и есть что-то хуже творческого ступора, так это апатия к работе. У вас бывало такое состояние, когда попросту плевать, как все пройдет? Если да, то вы знаете, насколько удручает осознание, что ранее радовавшая работа стала в тягость.
В периоды апатии мы хоть и осознаем, что обязаны сделать, но в этом абсолютно не заинтересованы. К этому может привести масса причин. Возможно, вам надоела однотипность задач. Или попался клиент, который настаивал на проведении заведомо провальных изменений. А может в вашей жизни происходят события, которые отвлекают от работы и вызывают постоянное чувство беспокойства.
Даже зная причины, которые могут привести к этому состоянию, мы не можем оградиться от апатии. Разве только не подымать пятую точку с дивана, что грозит апатией ко всему миру.
Также, вы можете страдать от того, что нет свободы творчества. Многие дизайнеры загнаны в рамки, поэтому им приходится придерживаться определенного шаблона.

В свое время меня полностью затянул веб-дизайн, он казался очень интересной и увлекательной сферой. Даже сейчас, я уверен, что кодинг сайтов никогда мне не надоест. Но несмотря на сильное увлечение работой, у меня бывают не самые лучшие времена.
Когда попадается проект, требующий большого количества времени и монотонной работы, у меня могут опуститься руки. Раньше я боролся с этим так – брал в руки геймпад и погружался в виртуальный мир, пока дедлайн не начнет гореть ярким огнем. Очевидно, это не лучший выход, но как это контролировать? Если вы сталкиваетесь с подобным, сначала ответьте себе на вопрос: «Кому нужен этот проект?».

Клиенту
Если проект нужен клиенту, относитесь к нему, как к заданию, которое нужно завершить. Вариант только один – выполнить свои обязательства. Как профессионал, вы должны приложить все усилия и довести дело до конца. Делать хуже, чем можешь – вредить себе.

Мне
На этот счет существует несколько мнений. С одной стороны, вы имеете полное право забросить проект, когда утратили интерес. В том смысле, что это ваше свободное время, и кому как не вам им распоряжаться.

Как себя пересилить:
И так, для начала определитесь вы должны это сделать потому, что хотите или потому что нужно.
Вот пять советов, которые помогут пересилить себя:

1. Для начала нужно начать
Это, пожалуй, самая сложная часть, особенно, когда работа вас не интересует. Здесь часто находятся более важные дела или вы постоянно переносите проект на другой день. В любом деле самое главное – начать.

2. Переключитесь на другую часть проекта
Если работа позволяет переключаться между задачами или этапами, попробуйте этот способ. Малейшее разнообразие в процессе, переключение между задачами или перерыв помогут освежить мысли.
И правда, эта хитрость не раз помогала найти решение в ситуациях, когда, казалось бы, совсем не было идей. Кроме этого, получится ускорить процесс работы.

3. Делайте привычные вещи непривычными способами
У этого совета есть свои плюсы и минусы.
Начнем с плюсов. В случае с веб-разработкой можно попробовать новый тип структуры сетки, скрипт, редактор кода и все в этом роде. Если вы совместите процесс изучения новых инструментов со скучными заданиями, будет намного интереснее и вы проведете это время с большей пользой.

4. Балуйте себя за проделанную работу
Награждайте себя за успехи. Отмечайте преодоление трудностей чем-то приятным, ведь вы этого заслужили. Сделайте перекус, похлопайте себе, если вам это доставит удовольствие. В такие моменты очень важно ощущать значимость своего труда.

5. Передайте проект другому специалисту
Это крайняя мера, к которой можно прибегнуть. В безвыходной ситуации вы всегда можете передать выполнение проекта другому специалисту. Прежде чем это сделать убедитесь в его профессиональности. Качество работы должно быть не ниже того уровня, на котором находитесь вы. И обязательно убедитесь в этом, перед сдачей проекта клиенту. Или же, можно перепоручить часть обязанностей, которые вам даются хуже всего или бесят.

Источник

Как создавать профессиональные формы?

В этой статье мы рассмотрим, как создавать формы на профессиональном уровне и взглянем на самые популярные советы по созданию таких форм.

Форма, представляет собой интерфейс, который собирает у пользователя необходимую информацию, а затем передает ее третьей стороне. Формы выглядят как самые невинные и простые компоненты пользовательского интерфейса, но в ту же очередь они являют собой наиболее важный вид взаимодействий с вашим продуктом. Они помогут вашим пользователям зарегистрироваться и провести оплату. Их основная цель — помочь пользователям и предприятиям достичь своих личных целей путем установления отношений или диалога между ними. Даже с учетом их огромного значения, достаточно часто можно встретить плохо сделанные формы. Вот несколько советов по созданию правильных форм:

Подберите ярлыки

Ярлыки над полями — это эффективный способ создания форм и ускорения их заполнения. Кроме того, формы, разработанные таким образом являются более гибкими и лучше «реагируют» на различные устройства.

Сгруппируйте поля

Ярлыки должны находится ближе к полям ввода, а между самими полями должно быть некоторое пространство. Такой подход поможет пользователям не запутаться и сделает их опыт более приятным и легким.

Необязательные поля вместо обязательных

Лучше будет сделать так, чтобы необязательные поля были более четкими, чем обязательные. Таким образом форма будет понятной и менее утомительной для пользователя. Пользователи чувствуют себя более комфортно, если они знают, что это поле необязательно заполнять, а не наоборот.

Разделить на группы

Длинные формы, заполненные большим количеством полей, могут быть ошеломляющими и сложными для понимания. Их следует разделить на логические группы, добавив соответствующий пробел и соответствующий заголовок. Благодаря такому подходу пользователи не чувствуют себя перегруженными длинными формами, ведь они разделены на несколько составляющих частей.

Сообщайте пользователям встроенные коды ошибок

Нет ничего более пугающего, чем непонятная ошибка. Ошибки перекладывают всю ответственность и работу на конечных пользователей, что скорее всего, приведет либо к разочарованию пользователя, либо к отказу от использования формы в целом. Предоставьте пользователям четкие инструкции по исправлению ошибок.

Заключение:

В целом, никто на самом деле не хочет заполнять формы, в этом нет ничего зазорного. Но существует множество способов сделать ваши формы более простыми в и понятными для пользователей. Простая в использовании форма — это эффективный способ увеличения конверсии, продаж и вовлеченности со стороны вашей аудитории. Не стоит ими пренебрегать.

Источник

Руководство для новичков по применению цвета в UI дизайне

Вас разочаровывает теория цвета? Вы устали от старых пресетов палитр? Устали нажимать кнопку «regenerate» для создания цветовой палитры?
Не волнуйтесь, вы не одиноки …
Мы надеемся, что эта статья станет вашим виртуальным гидом по мистической горе цвета. К тому времени, как вы достигнете вершины, вы обретете все необходимые навыки для создания красивых, согласованных палитр.

Содержание статьи 
Предпосылки
Формат этого руководства
Выбор вашего продукта
Работа с HSL
Проектирование в оттенках серого
Определение оттенков серого
Применение оттенков серого
Примечание о доступности – проверьте контраст
Выбор индивидуальности
Выбираем основной цвет + оттенки
Применение базового цвета
Слегка окрашенные оттенки серого (Tinted grays)
Расширяя свою палитру
Вывод

Читать: https://ux.pub/rukovodstvo-dlya-novichkov-po-primeneniyu-tsveta-v-ui-dizayne/

6 способов снизить когнитивную нагрузку при проектировании интерфейса

Усталость от принятия решений – это популярный термин, используемый для описания случаев, когда люди приняли слишком много решений за определенный период времени. Исследования показывают, что это в основном происходит из-за того, что когнитивные ресурсы человека со временем уменьшаются. Вот почему после 30 минут серфинга на Netflix в поисках чего-то нового, вы в конечном итоге смотрите сериал «Офис». Ваша способность принимать решения начала давать сбой – даже если это неплохое шоу!

Содержание статьи 
1. Уменьшите количество вариантов, из которых пользователю нужно выбрать
2. Сделайте так, чтобы было легче вернуться на правильный путь, если вы допустили ошибку
3. Используйте для навигации визуальные подсказки
4. Снизьте когнитивную нагрузку, используя знакомые паттерны и соглашения
Используйте последовательную цветовую схему
Используйте повторение в дизайн-паттернах и соглашениях
Используйте знакомые иконки и символы для обозначения повседневных действий, например, корзину для удаления файлов.
5. Создавайте дизайн, думая о пользователях, а не о себе или своей компании.
6. Будьте проще – не перегружайте пользователей сразу слишком большим количеством опций или функций

Читать: https://ux.pub/6-sposobov-snizit-kognitivnuyu-nagruzku-pri-proektirovanii-interfeysa/

Фетишизация UX-дизайна. Быть дизайнером – значит намного больше, чем мы себе представляем

В 2012 году Google Ventures создала дизайн-спринт. Это пятидневное взаимодействие с членами вашей продуктовой команды. Вы «пробегаете» весь процесс проектирования за неделю, от определения проблемы до создания прототипа. Его суть в том, чтобы привнести идеи от ключевых заинтересованных сторон и помочь им сочувствовать своим клиентам.

И, похоже, это сработало.

Девять лет спустя семинары и сессии по выработке идей стали обычным явлением в продуктовых командах. Теперь не дизайнеры так же часто используют такие термины, как «юзабилити» и «дизайн-мышление». Но каковы последствия этого? Повредило ли нам такое вовлечение заинтересованных сторон в процесс?


Читать статью: https://ux.pub/fetishizatsiya-ux-dizayna-byt-dizaynerom-znachit-namnogo-bolshe-chem-my-sebe-predstavlyaem/

8 трендов дизайна, которые не прижились

Каждый год мы начинаем со списка трендов дизайна, которые, по мнению экспертов, будут доминировать в проектах в следующем году. Безусловно, в таких прогнозах бывают и промахи.
В одном приложении это фишка, которая работает отлично, а в другом – плоско. Вот некоторые из трендов, которые быстро исчезают.

Элементы вне экрана

Одна из тенденций дизайна, которая набирала обороты в начале года, заключалась в использовании элементов вне экрана. Это способствовало горизонтальной прокрутке. Все, от текста до изображений, будто выходило за рамки.
Почему тренд не прижился: это исключительно сложная техника. Внеэкранные элементы выглядят по-разному при разных размерах экрана, и это может существенно повлиять на удобочитаемость и понимание.

Перекрывающиеся элементы дизайна

Использование перекрывающихся элементов дизайна – еще одна тенденция, которая может быть визуально ошеломляющей, но которую сложно заставить работать в реальных ситуациях.
Почему тренд не прижился: требовалось много времени и усилий, что все работало как надо. И у вас должен быть только правильный контент, который хорошо наслоится.

Супер минимальная эстетика

В то время как настоящий минимализм никогда не выходит из моды надолго, супер-минималистичный стиль просуществовал относительно недолго. На главной странице этих дизайнов почти ничего не было. Вы, наверное, уже догадались, почему эта тенденция не продержалась долго.
Почему тренд не прижился: в этой школе нет ничего плохого, но есть проблема – здесь мало того, что привлекает внимание.

Интересные паттерны при прокрутке

Как и многие тренды из этого списка, классными паттернами при прокрутке сложно управлять и контролировать на разных устройствах и размерах. Основа использования – помочь посетителям сайта перемещаться по дизайну.
Почему тренд не прижился: пользователи хотят знать, чего ожидать, и не хотят думать о том, как взаимодействовать с дизайном. Это создает когнитивную нагрузку и люди могут уйти с сайта, так и не разобравшись.

Преувеличенное белое пространство

Этот тренд не так и плох, но выглядит очень непривычно. Просто посмотрите на скрин выше: контент занимает здесь около трети места – слишком расточительно.
Почему тренд не прижился: если у вас много контента, то эта фишка превратится в бесконечную прокрутку. Это никому не нужно.

Видео везде

Перед началом 2021-го во многих блогах и статьях высказывалась идея, что этот год станет годом видео. И хотя тренд отошел на второй план, но наверняка быстро вернется.
Почему тренд не прижился: похоже, тенденция не так широко разошлась из-за ковидных сокращений: в ограниченном бюджете сложно найти деньги на видео.

Формы пузырей и капель

Почти удивительно, что эта тенденция исчезла – по многим из тех же причин, по которым исчезло видео. Хотя формы пузырей и капель казались хорошей альтернативой реальным изображениям.
Почему тренд не прижился: при таком количестве проектов эта тенденция, возможно, исчезла из-за общей усталости от дизайна.

Подсказки ИИ

Мы верили, что этот год станет годом дополненной реальности и искусственного интеллекта. Но поспешили: бывает такое, что технология не поспевает за прогнозом.

Почему тренд не прижился: ИИ – интересная технология, которую тяжело осознать. Многое происходит в фоновом режиме. Возможно, дизайнеры просто не могли придумать больше способов показать это визуально.

Источник

Как создать дизайн-концепцию сайта в 5 шагов

Дизайн-концепция — это визуальная концепция будущего дизайн-проекта, которая наглядно представляет стиль и общее настроение будущего сайта, какие ассоциации он будет вызывать у пользователей, какая палитра цветов будет использоваться, какие шрифты, иконки и прочие визуальные паттерны будут взяты в работу. Это важный этап перед стартом дизайна, потому как с его помощью можно задать общий стиль и настроение сайта, который будет устраивать заказчика.

Фундаментальная отсылка. Концепция – это объединение в систему всех идей (взглядов), выработанных для понимания направления развития. Она дает ответ на вопрос — как достичь намеченной цели. По сути, это единый определяющий замысел (стратегия) для решения любой задачи.

Термин дизайн-концепция произошел от объединения двух латинских слов «designare» и «conceptio». «Designare» значит «определять» и «conceptio» – «понимание, система».
Руководство призвано помочь вам сориентироваться в любой дизайн-концепции, независимо от формата, контекста и целей.

Содержание:

Что такое дизайн-концепция сайта для чего она нужна
Инструкция по разработке дизайн-концепции сайта
Этап 1. Сбор данных о деле клиента
Этап 2. Дизайн-исследование и пространство для концепции
Этап 3. Дебют стиля: конструктор образа и примерка
Этап 4. Информационная архитектура и текстовые прототипы
Этап 5. Стильная дизайн-концепция и тестирование
Что важно учесть при создании дизайн-концепции сайта

Читать статью: https://bit.ly/2YefnfZ