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

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

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

Читать: https://ux.pub/editorial/10-printsipov-dizaina-kotoryie-dolzhien-znat-kazhdyi-dizainier-52f6

Лучшие No-code конструкторы на одной схеме, упрощающей выбор

No-code (ноукод, зерокод) — это решение задач, которые обычно решают программисты, без самого программирования, то есть разработка без кода, с помощью конструкторов.

Зачем эта схема?

Чтобы помочь выбрать подходящий инструмент для задачи, которую вы хотите решить, не прибегая к помощи программистов. Основные категории задач, которые уже сейчас можно решать с помощью No-code подхода:
Сайты
Чат-боты
Мобильные приложения
Онлайн-школы
Веб-приложения
Базы данных
Автоматизации

Чем лучше списков?
Уже есть большое количество разных списков No-code конструкторов (раз, два, три, четыре и т.д.), но у них есть недостатки:
Много инструментов, среди которых сложно что-то выбрать
Не понятно, что из этого реально используется, а что нет
Включены просто полезные сервисы вроде Calendly

Источник

Многоязычное проектирование UI

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

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

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

Не «ОК», а «соглашаюсь», «ладно», «хорошо» или «понятно»: как формулировать текст для чекбоксов, кнопок и переключателей

Отрывок из книги «Этой кнопке нужен текст. O UX-писательстве коротко и понятно»

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

Атомарный дизайн — одна из тех штук, из-за которых я советую начинающим UX-писателям держаться поближе к дизайнерам и не увлекаться тем, что говорят и творят редакторы, копирайтеры и прочие подобные люди.
Я сейчас о тех, которые пишут много чего, в том числе для интерфейсов, и любят хвалиться, как между реально стоящими делами могут «даже страницу 404 написать». Мало у кого из пишущих, тем более у таких, которые «между делом», вы научитесь систематизациии организации дизайнерского уровня.

Читать: https://vc.ru/books/228901-ne-ok-a-soglashayus-ladno-horosho-ili-ponyatno-kak-formulirovat-tekst-dlya-chekboksov-knopok-i-pereklyuchateley

Навигация: основные правила и наглядные примеры

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

В своей статье «Навигация важнее поиска» Джерри Макговерн рассказывает о том, как его команда «провела обширное тестирование задач с технической аудиторией. 70% начали задание, перейдя по ссылке из меню, 30% воспользовались поиском по сайту». Макговерн утверждает, что люди в первую очередь полагаются на навигацию, потому что нажимать на ссылки проще и быстрее, чем пользоваться поиском. Он объясняет, что когда слова в ссылке соответствуют тому, что ищут люди, вероятность того, что они нажмут на ссылку, выше.

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

Объектно-ориентированный подход к UX

Почему объектно-ориентированный подход к UX помогает создавать масштабируемые и согласованные системы

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

Читать: https://ux.pub/editorial/obiektno-oriientirovannyi-podkhod-k-ux-306a

Как составить UX-портрет пользователя за 7 шагов: метод персон

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

В статье попробовали структурировать опыт работы с портретами в b2b и b2b2с по направлениям TravelTech, EdTech, Outsourcing Software Research & Development c 2011 года.

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

Читать: https://ux-journal.ru/kak-sostavit-portret-polzovatelya-za-7-shagov.html

Пожалуйста, дайте шанс junior UX-дизайнерам

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

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

Работодатели должны прекратить эту хрень и начать давать больше возможностей junior дизайнерам. Знаю, что мне должно быть все равно, эти вакансии не для меня, и это не моя компания или команда, но считаю, что начинающий дизайнер, только что пришедший из университета, должен иметь возможность устроится на работу. Я хочу отправить электронное письмо менеджерам по найму, чтобы убедить их открыть двери для новых талантов. Но я слишком занят, чтобы написать им, поэтому ограничусь статьей на Medium. Это ведь должно сработать, верно?

Читать статью: https://ux.pub/editorial/pozhaluista-daitie-shans-junior-ux-dizainieram-45cl

Почему мы скругляем углы

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

Читать: https://ux.pub/dinozavrix/pochiemu-my-skrughliaiem-ughly-7ik

10 советов, которые помогут найти вдохновение для создания логотипа


1. Отбросьте очевидные идеи
Классические логотипы – хороши, для начала… но не стоит на них останавливаться
Копайте глубже. Рассматривайте не только топ 10 лучших логотипов за все время (хотя и это неплохо, как для начала). Вам нужно рассмотреть более широкий спектр вариантов, изучить дизайнерские подходы в целом и их разновидности по всему миру.
Каждый раз, когда что-то бросается в глаза или нравится по какой-либо причине, делайте заметки об этом. Дайте этим эмоциям и впечатлениям повлиять на процесс создания дизайна и сделать вклад в развитие нового логотипа.

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

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

4. Загляните в будущее вашего клиента
Обсудите с вашим клиентом его планы на будущее – что он планирует на следующие 12 месяцев или пять лет? Является ли изменение направления его деятельности неизбежным, или образ его новых товаров можно как-то отобразить в логотипе, который вы создаете? Вам нужно позаботиться о долговечности и актуальности логотипа, потому что время от времени бизнес терпит изменения.
Например, возьмем компанию Carphone Warehouse (сотовые телефоны для автомобилей): никто больше не покупает телефоны для автомобилей. Возможно, стоит сменить название сверх успешного бренда, создание которого заняло годы, на что-то более подходящее?

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

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

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

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

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

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

Источник

Почему дизайнеры сами себя ограничивают?

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

Источник

​​14 лучших инструментов для выбора цветовых схем

1. Adobe Color CC
Adobe – мощная корпорация, в которой есть инструменты для всего. Поэтому креативщики компании не могли пройти мимо и создали инструмент и для работы с цветовыми схемами. Этот ресурс поможет создавать и сохранять различные цветовые схемы, каждая из которых состоит из 5 цветов. Он доступен в браузерных вариантах и в настольных версиях. В последнем случае вы можете импортировать свою схему сразу в Photoshop, Illustrator или InDesign.

2. Check my Colours
Предназначен для проверки переднего плана и фона цветовых сочетаний всех элементов DOM для определения достаточного контраста при просмотре.  Все тесты основаны на алгоритмах, предложенных World Wide Web Consortium (W3C). Алгоритм работы максимально прост: вы указываете адрес сайта, который хотите проверить, а инструмент делает вам полную раскладку. 

3. The Color App
Инструмент The Color App стремится сделать поиск цветов гораздо проще с большой цветовой сеткой. Он также позволяет предварительно просматривать цвета, узнавать значения RGB, HEX и HSLA и создавать палитры цветов, чтобы посмотреть, как они работают вместе. Работает на iOS и Mac. 

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

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

6. SpyColor.com
Это полезный сервис, на котором можно узнать информацию про любую цветовую модель (RGB, CMYK и др.).

7. Designspiration
Гениальный инструмент для поиска референсов и картинок по заданным цветам. Выбирайте до 5 оттенков цвета с палитры – и инструмент покажет фото с ними. Вы можете сохранить фото в своей коллекции на сайте или купить стоковую фотографию, если собираетесь использовать ее в проекте. 

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

9. Paletton
Здесь, составляя цветовые схемы, можно выбирать не просто отдельные цвета, но и еще указывать их яркость, контраст, насыщенность.

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

11. ColourMod
Этот ресурс предлагает полезный способ выбрать и определить цвет без необходимости запуска дополнительных инструментов посерьезнее. 

12. ColorZilla
Сначала этот ресурс был доступен только как Firefox-плагин, но теперь он есть и в браузере Google Chrome. Он включает палитры цветов, пипетки, генератор градиента CSS и палитры браузера.

13. Colormunki
Это интернет-приложение позволяет создавать цветовые палитры из Pantone-образцов, используя ряд различных методик для создания занятных комбинаций.
14. ColorBlender
Один из самых простых и доступных инструментов. Он позволяет выбрать образец, настроить цвет и в режиме реального времени наблюдать за тем, как он генерирует набор из 5 сочетаемых цветов. Готовые палитры могут быть загружены непосредственно в Photoshop или Illustrator в виде файла EPS.

Источник