PSD | Дизайн-пространство
28.6K subscribers
7.32K photos
429 videos
2.79K links
Пишем просто, понятно и по делу обо всём околодизайнерском 🔥
Сайт: https://dsgners.ru

По поводу рекламы и сотрудничества: @design_manager_bot
Заявление № 4896031048
Download Telegram
Источник останется анонимным в интересах дизайнера, который изначально опубликовал это
В этом UX кейс-стади подробно рассказывается о том, как этот дизайнер работал с командой и провел тщательное исследование пользователей, чтобы понять, как слушатели хотели формировать плейлисты и делиться ими. На основе полученных данных они спроектировали функцию. Учитывая все обстоятельства, плейлисты Spotify хорошо спроектированы, и это отличное исследование. Если бы я был менеджером по найму, я бы, как минимум, пригласил его на собеседование.
Однако действительно ли менеджер по найму сосредотачивается на UX решениях, когда видит этот скриншот? Независимо от того, как сильно он старается быть непредвзятым, он будет под влиянием красивого визуального дизайна, в создании которого этот дизайнер не принимал никакого участия.
Если бы этот продуктовый дизайнер вложил столько же усилий в создание функции для приложения с тусклым визуальным дизайном и использовал бы дизайн-систему этого продукта для создания этой функции, то его кейс-стади было бы провалом. Менеджер по найму сразу бы пропустил его и сказал: «Мы ищем кого-то с большим опытом визуального дизайна». Мне так кажется. Это проблема отрасли. Нам нравится говорить о том, что мы выше разногласий культуры Dribbble, но это не так.

3. Если визуальный дизайн так важен, дайте дизайнерам хотя бы шанс доказать, что они могут его создать
Думаю, больше всего в этих отказах по причине визуального дизайна раздражает то, что у меня не было возможности показать, что я могу создавать визуальный дизайн того уровня, который они хотят видеть. Это то же самое, что не попасть на прослушивание. Я показываю работу над своим портфолио. Я представляю портфолио в самом лучшем свете, и мне не удается поговорить с менеджером по найму, потому что дизайн-системы, с которыми я работал были ужасны. А компании, в которые я хочу устроиться на работу, имеют красивые дизайн-системы. Я мог бы расписать почему компания с красивой дизайн-системой посчитает более эффективным нанять хороши х визуальных дизайнеров, но я оставлю эту тему на следующий раз.
Можно было бы переработать экраны для функций, над которыми я работал, чтобы представить их в лучшем визуальном свете, но давайте проясним кое-что:
Я никогда не буду демонстрировать дизайн, если он не был одобрен и принят. Иначе это будет обманом.
Я мог бы улучшить сотни вещей в визуальном дизайне любого продукта, над которым я работал, если бы я хотел выразить свои навыки визуального дизайна в лучшем свете. Я стал ненавидеть недостатки визуального дизайна каждого продукта, над которым работал. Однако я ненавижу многие вещи в этих продуктах, визуальный дизайн – лишь одна из них.
Исправить визуальный дизайн экрана, который никогда не заботился о своих пользователях – все равно что накрасить губной помадой свинью.
По правде говоря, у меня есть некоторые визуальные изменения для всех продуктов, над которыми я работал. Я с радостью покажу их, если кто-нибудь попросит. Я был бы готов принять вызов, чтобы доказать свои навыки визуального дизайнера, если бы менеджер усомнился в моих способностях в этой области.
Тем не менее, эти дизайны так и не увидели свет, поэтому я не вижу смысла их показывать. Возможно, я говорю за себя, но я ценю архитектора, который строит свои здания, гораздо больше, чем архитектора, сидящего на стопке прекрасных концептов, которые никогда не реализовывались.
Я думаю, неверно фокусироваться на великолепном визуальном дизайне, который так и не получил одобрения и разработки. Думаю, что глупо загонять себя в угол и объяснять, почему дизайн, который я только что показал, не был реализован. У меня нет ответа, как визуально улучшенный дизайн нашел отклик у пользователей или как разработчики его кодили, потому что это концепт. Хотя у меня есть ответы на вопросы о реальном дизайне. Возможно, он не впечатляет, но есть убедительные доказательства того, как он решал проблемы. Разве это не более ценно для продукта?
Прозрачность – гораздо более важная часть работы. На самом деле, объяснение того, почему не был реализован более красивый визуальный дизайн (несоответствия, компромиссы, масштаб и т.д.) – мне это было бы интересно, если бы я брал интервью у кандидата. Мы работаем с заинтересованными сторонами, которые не всегда видят ценность наших любимых дизайнов. Что мы узнали из этого? Как дизайнер смог переубедить или пойти на компромисс в свете этих конфликтов? Это говорит мне гораздо больше об эффективности продуктового дизайнера, чем то, повезло ли ему унаследовать красивую дизайн-систему. Я бы хотел, чтобы индустрия учитывала это. Если у вас уже есть красивая дизайн-система, вам редко понадобится много таланта в области визуального дизайна.

Источник: https://ux.pub/editorial/priekratitie-otsienivat-produktovykh-dizainierov-kak-vizualnykh-dizainierov-498a
Почему у некоторых UX-дизайнеров нет портфолио?

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

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

Первые 3–4 года работы в области дизайна редко удается работать над проектами, которые долго не будут устаревать. Скорее всего, нам не удастся работать над проектами, имеющими большое значение. Если вы достаточно умны, чтобы получить большой кусок дорогостоящего проекта на ранних этапах карьеры, то в будущем вы сможете получить больший кусок пирога, который заменит ваш старый проект в портфолио.
Если последний проект в портфолио – лучший, вы на правильном пути
Примечание для людей, нанимающих дизайнеров
С точки зрения приема на работу всегда следует смотреть на дату публикации проектов в портфолио дизайнера. Всегда ищите последнее портфолио.
Никогда не судите о способностях человека по его старому портфолио.
Значит, весь упорный труд по созданию портфолио за три года в NID был потрачен зря?
Нет, новое портфолио будет результатом попадания в хорошую рабочую среду, которая стала возможна благодаря старому портфолио. Таким образом, новое портфолио будет в определенной степени зависеть от старого, а старое – от еще более старого, и цепочка продолжается до самого первого портфолио, использующего для заголовка шрифт Papyrus.

У портфолио есть поколения
Почему у многих дизайнеров нет портфолио онлайн?
Портфолио устаревает из-за роста профессиональных навыков.
Senior-дизайнерам может даже не понадобиться портфолио, чтобы продемонстрировать свои навыки.
Людям, которые не ищут работу / внештатный проект, оно не нужно.
Junior-дизайнеры обычно не владеют впечатляющими неустаревающими проектами.

Источник
Почему вам нужно перейти на Mobile First дизайн

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

Тогда я пришел к концепции Mobile First, согласно которой мы начинаем дизайн с точки зрения пользователя смартфона. Это не значит, что нужно игнорировать пользователей компьютеров. Мы просто ставим их на второе место. Спустя три недели я понял, что продолжу придерживаться этой концепции. И вот по каким причинам:

1. Большинство решает
Согласно статистике за октябрь 2021 года от statcounter: 55% интернет-пользователей предпочли мобильные устройства; 42% выходили в Интернет с компьютера; и 3% использовали планшет. Вы можете возразить (и будете правы), что цифры только по США и Европе все еще показывают преимущество ПК, а не мобильных. Тем не менее это преимущество с каждым годом все слабее.

2. Многоразовый дизайн мобильного приложения
Веб-приложение в браузере размещается на экране смартфона аналогично мобильному приложению. Поэтому, если вы планируете делать приложение для Android/iOS из веб-приложения, можно повторно использовать его концепции дизайна. Точно так же вы можете (и должны) искать вдохновение для дизайна своего сайта, наблюдая и повторяя идеи из любимых приложений для смартфонов.

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

4. Интерактивные функции становятся очевидны
В мобильном дизайне невозможно узнать, где находится курсор, потому что здесь просто нет мыши. Это заставляет делать все варианты навигации очевидными. Чтобы после одного взгляда на них было ясно, для чего они и как с ними взаимодействовать. Здесь нет анимации «ховера», поэтому придется лучше поработать над дизайном ссылок, кнопок и меню, чтобы они выделялись. Это прекрасная возможность поупражняться в упрощении дизайна.

5. Подходит для Lean и Agile
Сосредоточившись на главном, вы сможете постепенно добавлять на сайт функции. А это основа концепций Agile и Lean. Agile нацелена на небольшое прибавление функций в каждом спринте. Предоставляйте рабочее ПО часто, от пары недель до пары месяцев, отдавая предпочтение более коротким срокам. Lean PDCA (Plan – Do – Check – Act) следует проводить на каждом этапе. Планирование-выполнение-проверка-действие – это цикл улучшений, основанный на том, что мы предлагаем изменения, внедряем их, после измеряем результаты и принимаем соответствующие меры. Вместо этого с десктопным дизайном перед нами огромный холст, и, скорее всего, мы сделаем полную версию со всеми наворотами. Это не только задерживает первый релиз, но и способствует «золотому напылению» (выходу за рамки требуемого). «Золотое напыление» означает добавление любой функции, не учтенной в первоначальном плане объема работ или описании продукта.
Бонус

Если вы подумываете использовать Mobile First, вот несколько советов, которые я могу дать, исходя из собственного опыта:

№ 1: Держите открытой вкладку «Инструменты разработчика». В левом верхнем углу вы найдете кнопку «Переключить панель инструментов устройства». Она позволяет имитировать область просмотра мобильного устройства и видеть страницу в версии с маленьким экраном.

№ 2: По-прежнему в верхнем левом углу вкладки «Инструменты разработчика» вы найдете кнопку «Выбрать элемент на странице для его проверки». Выберите ссылку/кнопку/текст на своем сайте, и во всплывающем окне отобразится оценка его контрастности. Это соотношение между текстом и его цветом фона. Чем выше контраст, тем легче пользователю его прочитать.

№ 3: При условии, что вы больше не будете использовать hover-эффект или подсветку, подумайте о том, чтобы использовать Material Design гайды при создании экранных элементов.

№ 4: Думайте о медиа-запросах только после того, как будете довольны их мобильной версией. Адаптивный дизайн для больших экранов должен подождать, а не отвлекать вас от завершения первоначальной концепции мобильных.

Источник: https://design-glory.com/?p=10783
Каким должен быть дизайн в эру голосового UI

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

Читать статью
https://say-hi.me/design/kakim-dolzhen-byt-dizajn-v-eru-golosovogo-ui.html
​​Примитивность vs. простота простым языком

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

Источник
Подробный разбор интерактивных компонентов (Interactive Components) Figma

В этой статье объясняется, почему интерактивные компоненты Figma (сейчас находятся в стадии бета-теста) улучшат процесс прототипирования. Новая функция сокращает время и усилия, необходимые для создания взаимодействий, снижая стоимость исследований и дизайна. Если вы хотите попробовать ее, все, что вам нужно, это бесплатная учетная запись Figma.

Читать: https://ux.pub/editorial/podrobnyi-razbor-intieraktivnykh-komponientov-interactive-components-figma-4n8g
Что делать, если новый эпизод на Netflix кажется более важным, чем проект

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

Карло Каденас знает это чувство. Аргентинский арт-директор и графический дизайнер создал «Speakloop», чтобы попрактиковаться в своих навыках. Это безумно красивая серия анимаций, где автор переделал каждую букву алфавита. Но без уже знакомых нам гарнитур. Вместо этого абстрактные формы образуют серию из 26 анимированных мини-шедевров, удивительным образом исследующих форму, движение и типографию. Вот несколько советов от Карло, основанных на его собственном опыте.

1. Установите границы
Сосредоточьтесь и поставьте себе конечную цель, потому что бывает действительно трудно понять, с чего начать и где остановиться. «Я хотел улучшить свои навыки в анимационной графике, и теперь у меня было 26 возможностей реализовать эту довольно простую идею. Когда вы начинаете работу над личным проектом, важно установить какую-то основу. Ограничения помогут выйти из зоны психологического комфорта и подключиться к чему-то новому».

2. Подготовьтесь
Когда у вас нет жестких сроков или требований от клиента, намного труднее мотивировать себя. Вдруг этот эпизод на Netflix начинает казаться гораздо более важным, чем окончание проекта. Карло решил детально спланировать свой проект. А главное – принять тот факт, что сложные и скучные моменты тоже станут частью процесса. «Я стал свободнее пользоваться различными системами анимации и научился многим маленьким приемам, которые теперь могу применить к заказным проектам. Но иногда дело в абстрактных навыках. Чтобы подготовиться к проекту, потребовались самоотверженность и дисциплина».

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

4. Разбавляйте проект, переставляя шаги
При анимации очень легко погрузиться в рутину. Это трудоемкий процесс, требующий одних и тех же действий снова и снова. У каждого творческого проекта есть свои скучные стороны. «Вместо того, чтобы работать в хронологическом порядке, от А до Я, я работал прерывисто. Первым созданным мной символом была буква А, вторым – буква Y и так далее. Это помогло мне сохранить открытый визуальный язык и подходить к каждой букве как к новому вызову».

5. Покажите проект миру
Speakloop отметили 36 днями типографии, а на Behance проект публиковали дизайн-организации AIGA и Motion. Вероятно, этого бы не произошло, если бы Карло не подумал о последующей жизни своего проекта. «Это может казаться очевидным, но будьте активны в социальных сетях. Если вы достаточно горды, чтобы поставить свое имя под этим проектом, убедитесь, что мир его видит!» «Поделиться своими проектами с коллегами – хороший способ получить обратную связь. Но также попробуйте показать их людям, которые не являются дизайнерами или профи визуала. Вы будете удивлены количеству полезной информации, которую они могут вам дать».

Источник
Универсальный принцип продуктивности, который поможет добиться большего в любой сфере

Книга «Цель» Элияху Голдратта, представляет собой смесь художественного романа с бизнес-историей, в рамках которой главному герою нужно превратить свой завод из убыточного в прибыльный.

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

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

Подобные простои возникают из-за узких мест — самых медленных звеньев цепочки производства. Покажу это на примере из ИТ-сферы.⠀

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

Подумайте, какие узкие места есть в вашей деятельности.

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

Источник
Почему руководства по «хорошему / плохому» дизайну не всегда подходят для теории цвета

Посты в Instagram или статьи в дизайнерских блогах представляют примеры «правильного» и «неправильного» способа проектирования. Обычно они обозначаются зеленой галочкой и красным крестиком соответственно. Хотя есть надежные и проверенные паттерны, которые часто работают лучше, чем другие, все же не стоит говорить продуктовым дизайнерам (особенно начинающим): «Это единственный правильный способ разметки формы, карточки, использования цвета или типографики» и т. д.

Дизайн – это не универсальное решение.

Автор собрал несколько примеров подобных сомнительных рекомендаций.

Читать: https://ux.pub/editorial/pochiemu-rukovodstva-po-khoroshiemu-plokhomu-dizainu-nie-vsieghda-podkhodiat-dlia-tieorii-tsvieta-599e
Руководство по проектированию улучшенной типографики мобильных приложений

Благодаря стремительному развитию Интернета в последнее десятилетие типографика в интерфейсах прошла основные этапы трансформации в цифровой мир. Но дизайн мобильных приложений – это все еще новая сфера.
В этой статье я не буду говорить об общих концепциях типографики, которые можно использовать как в печатной, так и в цифровой среде. Вместо этого я сосредоточусь на нюансах и хитростях, которые можно использовать в типографике дизайна мобильных приложений.
Поскольку разработка приложений очень тесно связана с функциями операционной системы, я часто буду ссылаться на отдельные рекомендации из руководства Material Design для Android и Human Interface Guidelines для iOS.

Читать: https://ux.pub/editorial/rukovodstvo-po-proiektirovaniiu-uluchshiennoi-tipoghrafiki-mobilnykh-prilozhienii-m83
UX дизайн: Закон Фиттса — для определения оптимальных размеров и расположения элементов на сайте

Статья для начинающих UX/UI дизайнеров, исследователей и аналитиков. Этот закон помогает определить оптимальные размеры и места расположения элементов на сайте для упрощения и ускорения взаимодействия пользователей с ними.

Читать: https://vc.ru/design/188963-ux-dizayn-zakon-fittsa-dlya-opredeleniya-optimalnyh-razmerov-i-raspolozheniya-elementov-na-sayte
Обзор 12 лучших портфолио UX-дизайнера: примеры, зачем нужно, из чего состоит

UX-портфолио — это способ упаковать ваши навыки и продемонстрировать, на что вы готовы как дизайнер. В статье собрали 12 сильных образцов портфолио в плотный разбор.

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

Зачем UX-дизайнеру собирать портфолио
UX-портфолио — это международный стандарт работы для каждого дизайнера в отрасли. Портфолио применял Пол Рэнд, его же рекомендует и сейчас собирать Остин Клеон в международном бестселлере «Покажи свою работу». А еще наращивание портфолио является частью бренд-стратегии диджитал-агентств и продуктовых компаний. Одним словом — стандарт.

Перед началом сборки портфолио задайте себе серию вопросов. Какую задачу вы хотите решить с помощью портфолио? С помощью каких элементов вы хотите убедить даже самого требовательного работодателя/клиента в вашем профессионализме? Что вы хотите сообщить клиентам и что они должны узнать о вас и вашей работе при первом знакомстве с портфолио?
Ваше портфолио UX-дизайнера — это не просто виртуальная галерея всех ваших самых красивых работ. Это тщательно продуманная история, которая проводит в закулисье ваших методов и процессов. Хорошее портфолио знакомит с тем, как вы решаете спектр задач по UX-дизайну и проектированию интерфейсов. А также знакомит с вашим ходом мысли и подходом к решению задач.
А еще портфолио должно не просто раскрывать вашу культуру работы, но быть также и приятно упаковано.
Итак, давайте взглянем на 12 примеров портфолио и разберем, чем сильно каждое из них.
Интересный факт: У дизайнеров для привлечения клиентов одинаково хорошо работают: Behance, Dribbble и, конечно же, собственный сайт.

Читать статью: https://ux-journal.ru/top-luchshih-portfolio-ux-dizajnera.html
Сделайте это весело: хаос в продуктовом дизайне

Что общего у брутализма, ваби-саби и виртуальной реальности.

Если бы мне давали четверть доллара всякий раз, когда дизайнера просят сделать продукт веселым или забавным, я бы уже имел состояние. Веселье – одно из таких слов, как добролюбовь и искусство: оно настолько простое и всеобъемлющее, что не поддается определению. Итак, что же мы имеем в виду, когда стремимся сделать продукт более «веселым»?

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

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

Это парадокс Fun Designer. Чем более эффективным и масштабируемым является продукт, тем более предсказуемым, скучным – а зачастую и успешным – он становится. Как же достичь баланса между весельем и эффективностью?

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

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

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

Брутализм – еще один претендент на добавление веселья в продуктовый дизайн. Как и ваби-саби, брутализм не извиняется за свои недостатки, а упивается создаваемым им хаосом. Хотя изначальная цель брутализма заключалась в том, чтобы отдать приоритет функции над формой, она настолько контрастирует с сегодняшним подходом к проектированию интерфейсов, что оказывает практически противоположный эффект.
Некоторые дизайнеры интерпретируют брутализм, как восстание против чрезмерно упрощенного дизайна путем намеренного создания уродливых, дезориентирующих или сложных интерфейсов.
В бруталистском дизайне форма играет ведущую роль, но делает это без каких-либо попыток совершенствования. Напротив, она настолько сырая и доступная, что приглашает любого поэкспериментировать с ней. Это качество совместной работы в дизайне привносит элемент исследования, удивления и… веселья!
Продукты, которые дают пользователям право создавать хаос – это весело. Это касается и виртуальной реальности. Во время моей работы в Facebook VR мы потратили бесчисленное количество часов на проектирование тщательно организованных систем для взаимодействия с виртуальными объектами, а затем регулярно приглашали людей для тестирования полученных результатов. Что в первую очередь делали люди при взаимодействии с виртуальным объектом в VR? Они хватали его, бросали и смеялись. Если он ломался, они делали это снова, но, возможно, с большим энтузиазмом. Они создавали хаос, вероятно, как протест против порядка в реальном мире, и при этом их скептически нахмуренные лица озаряла радостная ухмылка.
Веселье лучше всего достигается посредством взаимодействия. Есть ли лучший способ оценить силы природы и противостоять условностям, чем отдать контроль над своим интерфейсом прихоти пользователя?

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

Хотите наклеить стикер в середине сообщения? Не проблема! Хотите использовать блестящий фон, чтобы украсить домашнюю страницу? Действуйте! Не знаете, как чего-то добиться в приложении? Поищите вокруг и посмотрите, что произойдет, пока не найдете то, что ищете!

Так как же нам создавать забавные продукты? Уловка состоит в том, чтобы спроектировать системы, которые учитывают хаос: познакомить пользователей с несвязанным взаимодействием, а затем вернуть их в систематический порядок. Если ваша цель – сделать продукт интересным, как вы будете учитывать хаос?

Источник
Руководство по созданию эффективного эмоционального дизайна

Что такое эффективный эмоциональный дизайн?

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

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

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

Создайте эмоциональную связь, учитывая «вау-опыт»
«Вау-опыт» присутствует во всех сферах нашей повседневной жизни и вызывает у нас эмоциональную реакцию (даже если мы этого не осознаем). Например, мы говорим: «Вау! Это кресло и правда удобное», «Вау! Этот автомобиль такой навороченный», или «Ух ты! Только посмотри на уникальный дизайн этой книжной полки».

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

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

Читать статью: https://ux.pub/editorial/rukovodstvo-po-sozdaniiu-effiektivnogho-emotsionalnogho-dizaina-209
Советы по дизайну карусели

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

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

Читать статью: https://design-glory.com/?p=10965
Топ-9 плагинов Figma для работы с графикой и изображениями

1. Удаление фона изображения — ‘Remove BG
В идеале, чтобы удалить фон любого изображения, вам придется отредактировать изображение в Photoshop. Альтернативный метод, который я использовал ранее– это выбрать в Figma изображение и использовать опцию «multiply» в меню «Layer», чтобы фон исчез, но это не всегда эффективно. Remove BG – это потрясающий плагин, который удалит фон любого изображения в один клик, и все это не покидая Figma.

2. Преобразование изображений в векторные —’Image Tracer
Вы, наверное, переносите свои изображения в Illustrator, чтобы трассировать их, не так ли? Но теперь вы можете больше так не делать. С Image Tracer вы можете конвертировать простые черно-белые растровые изображения в векторные. Это необычайно полезно, когда у вас есть изображение, которое вы хотите преобразовать в иконку. Когда вы запустите плагин, то заметите, что на панели есть опции, которые помогут отредактировать плавность кривой и оптимизацию.

3. Создание изометрических фигур — ‘Easometric
Easometric, как следует из названия, преобразует ваши слои в изометрические фигуры. Он позволяет экономить время, иначе вам придется вручную настроить в Illustrator изометрическую визуализацию перспективы. Панель инструментов интуитивно понятна, и вы можете в один клик выбрать нужную перспективу.

SkewDat и Mockup – пара плагинов, которые также помогут вам исказить слои.

4. Создание 3D-фигур — ‘Oblique
Oblique – отличный плагин, который помогает создавать проекции, тени, добавлять глубину и экструдировать слои. И все это непосредственно в Figma. Его панель управления проста и помогает установить угол проецирования, расстояние и выбрать цвета для контуров и заливок.

Roto – еще один плагин, который поможет создать экструзии с перспективой, а на панели есть предварительный просмотр в реальном времени.

5. Создание анимации — ‘Motion
Motion довольно просто использовать, если вы знакомы с такими инструментами анимации, как Principle или After Effects. В нем есть временная шкала свойств объекта, которые вы можете индивидуально контролировать и экспортировать в виде GIF, фреймов, спрайтов или CSS.

Figmotion – это еще один плагин, который поможет создать анимацию, а также позволит экспортировать ее в CSS или JSON, что отлично подходит для передачи проекта разработчикам.
6. Создание эффектов движения —’BeatFlyer Lite
С BeatFlyer Lite вы можете добавлять крутые эффекты к слоям Figma. Бесплатная версия имеет множество эффектов, таких как масштабирование, вибрация, свечение, размытие при масштабировании, маскирование и десятки других эффектов. Интерфейс простой, слева перечислены все доступные эффекты, и вы можете индивидуально управлять свойствами анимации эффектов, нажав на иконку настроек. Главный экран позволяет управлять скоростью и временем, а также предоставляет параметры экспорта.

7. Конвертирование дизайнов в видео — ‘SUPA — Figma to Video
Supa – Figma to Video – замечательный плагин для добавления простых переходов к слоям на артборде, и преобразования дизайнов в анимированные видео. Плагин простой в использовании, и вы можете выбирать предустановки анимации, применяемые к проекту, который в дальнейшем можно преобразовать в видео.

8. Воспроизведение и экспорт GIF — ‘GIF
По умолчанию, даже если ваши GIF-файлы или анимированные объекты выглядят статично на экране редактора, Figma поддерживает GIF-файлы в режиме прототипа. Но плагин GIF от Rogie может воспроизводить ваши GIF-файлы в режиме редактора, а также помогает экспортировать анимированные фреймы в виде GIF-файлов непосредственно из Figma.

9. Создание макета девайса — ‘Clay Mockups 3D
Плагин Clay Mockups 3D может стать альтернативой этому процессу. Это лучший плагин для создания аккуратных макетов устройств, и вы можете настроить модель устройства, цвет и угол камеры, и все это не покидая Figma. Он экономит уйму времени, и я очень люблю этот плагин.


Источник
Google шрифты: 5 малоизвестных вариантов

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

№ 1: Barlow Barlow – один из классных вариантов, на который вам стоит обратить внимание при выборе шрифта для приложения, сайта и т. д.

№ 2: Encode Sans Encode sans – еще один отличный, но малоизвестный шрифт. Можно использовать для любых проектов бесплатно.

№ 3: Cabin Cabin – красивый шрифт, который также почему-то менее популярен среди дизайнеров, хоть и не хуже других от Google. Лично мне очень нравится использовать его в своих приложениях.

№ 4: Sarabun Sarabun – тоже отличный Google шрифт, который оказался менее известным. По-моему, он прекрасно подойдет для высокопроизводительных приложений и сайтов.

№ 5: Prompt Prompt – последний на сегодня замечательный шрифт. Мне он нравится своей насыщенностью. Люблю использовать его для заголовков на сайтах и в приложениях.

Источник