"Я потерял веру в UX"
С таких слов начинается статья, на которую я наткнулся несколько дней назад. Автор материала — основатель собственного агентства.
Рассуждает он о наболевшем: как корпорации умышленно усложняют интерфейсы ради увеличение прибыли. Главная его мысль:
"Теперь профессионалы не облегчают жизнь пользователю, а манипулируют ими, чтобы увеличить продажи"
Как он это подает и объясняет, читайте здесь:
https://vc.ru/design/202669-ya-poteryal-veru-v-ux-osnovatel-agentstva-o-tom-kak-korporacii-uslozhnyayut-interfeysy-radi-uvelicheniya-pribyli
С таких слов начинается статья, на которую я наткнулся несколько дней назад. Автор материала — основатель собственного агентства.
Рассуждает он о наболевшем: как корпорации умышленно усложняют интерфейсы ради увеличение прибыли. Главная его мысль:
"Теперь профессионалы не облегчают жизнь пользователю, а манипулируют ими, чтобы увеличить продажи"
Как он это подает и объясняет, читайте здесь:
https://vc.ru/design/202669-ya-poteryal-veru-v-ux-osnovatel-agentstva-o-tom-kak-korporacii-uslozhnyayut-interfeysy-radi-uvelicheniya-pribyli
vc.ru
«Я потерял веру в UX»: основатель агентства о том, как корпорации усложняют интерфейсы ради увеличения прибыли — Дизайн на vc.ru
Компании перестали думать об удобстве для пользователей, вводят их в заблуждение и запутывают, считает основатель дизайн-агентства Creative Good Марк Херст.
👍20🔥5❤3😢2
Продуктивность: "съешь лягушку"
Автором этого метода является Брайан Трейси. Его суть: нужно есть лягушку каждое утро.
У каждого есть самая объемная и трудная задача в списке дел на день. Вот её и называем "лягушкой". Обычно её оставляют на вечер и долго не хотят приступать.
Трейси предлагает съесть лягушку утром, в первую очередь. То есть, выполнить самую трудную задачу первой. Вечером у вас накопится усталость, что вместе с заниженной мотивацией убедят вас отложить все на завтра. Это приведет к спешке под самый конец дедлайна и понижению качества. А если лягушка — ваш проект, то он рискует так и остаться нереализованным.
Почему "лягушка"?
Самая сложная задача часто и самая неприятная. Вот поэтому и такое название. После того, как утром съели лягушку, день пройдет на куда более приятной ноте, чем когда оставили работу на вечер.
Если было полезно, вдарьте по реакциям. До скорой!
Автором этого метода является Брайан Трейси. Его суть: нужно есть лягушку каждое утро.
У каждого есть самая объемная и трудная задача в списке дел на день. Вот её и называем "лягушкой". Обычно её оставляют на вечер и долго не хотят приступать.
Трейси предлагает съесть лягушку утром, в первую очередь. То есть, выполнить самую трудную задачу первой. Вечером у вас накопится усталость, что вместе с заниженной мотивацией убедят вас отложить все на завтра. Это приведет к спешке под самый конец дедлайна и понижению качества. А если лягушка — ваш проект, то он рискует так и остаться нереализованным.
Почему "лягушка"?
Самая сложная задача часто и самая неприятная. Вот поэтому и такое название. После того, как утром съели лягушку, день пройдет на куда более приятной ноте, чем когда оставили работу на вечер.
Если было полезно, вдарьте по реакциям. До скорой!
❤59👍18🔥8
This media is not supported in your browser
VIEW IN TELEGRAM
Пример того, как улучшить взаимодействие с пользователем за счет анимации
В догонку к моему посту про микроанимации нашел хороший пример но забыл опубликовать…
Посмотрите насколько интересно можно сделать нудное заполнение формуляра.
В догонку к моему посту про микроанимации нашел хороший пример но забыл опубликовать…
Посмотрите насколько интересно можно сделать нудное заполнение формуляра.
👍59🔥22❤7
Визуализация данных. Ч.4 — инструменты
Сегодня на разборе главные инструменты для отображения данных в интерфейсе. Погнали:
/ Крупный показатель
Нужен для быстрого информирования без погружения в контекст. Как пример, сумма доходов за полугодие, количество онлайн-пользователей за сутки и т.д. Пример: способность мозга образовывать нейронные связи
/ Диаграмма
Широкий диапазон использования. Зависит от вида диаграммы. Круговая отлично подходит для отображения количества чего-либо от общей массы. Горизонтальную и столбчатую можно использовать для сравнения значений. А диаграмму Венна — отображения пересечений, классов и общих черт. Примеры и другие виды можете посмотреть по ссылке.
/ График
Для обозначения роста или падения какого-то показателя. Часто используется в сайтах аналитики. Пример: курс Биткоина
/ Схема
Идеальный инструмент для визуализации процесса. Пример: отображение в блок-схеме процесса взаимодействия разных департаментов во время работы над проектом.
/ Таблица
Отображение большого объема однородной информации для детального изучения. Примеры таблиц и гайд как их оформить по ссылке.
Под конец
Конечно, инструментов на порядок больше. Я привел самые популярные, иначе пришлось бы перевести в большую статью, которую вы вряд ли прочтете. Если было полезно, знаете, куда жмакать. До скорой!
Сегодня на разборе главные инструменты для отображения данных в интерфейсе. Погнали:
/ Крупный показатель
Нужен для быстрого информирования без погружения в контекст. Как пример, сумма доходов за полугодие, количество онлайн-пользователей за сутки и т.д. Пример: способность мозга образовывать нейронные связи
/ Диаграмма
Широкий диапазон использования. Зависит от вида диаграммы. Круговая отлично подходит для отображения количества чего-либо от общей массы. Горизонтальную и столбчатую можно использовать для сравнения значений. А диаграмму Венна — отображения пересечений, классов и общих черт. Примеры и другие виды можете посмотреть по ссылке.
/ График
Для обозначения роста или падения какого-то показателя. Часто используется в сайтах аналитики. Пример: курс Биткоина
/ Схема
Идеальный инструмент для визуализации процесса. Пример: отображение в блок-схеме процесса взаимодействия разных департаментов во время работы над проектом.
/ Таблица
Отображение большого объема однородной информации для детального изучения. Примеры таблиц и гайд как их оформить по ссылке.
Под конец
Конечно, инструментов на порядок больше. Я привел самые популярные, иначе пришлось бы перевести в большую статью, которую вы вряд ли прочтете. Если было полезно, знаете, куда жмакать. До скорой!
👍19🔥6
Как создать качественную цветовую палитру
Этим постом я открываю серию о цветовой палитре. В каждой части будет по одному совету, который буду детально объяснять. Погнали!
Выбирайте с умом
В первую очередь, определитесь с основными цветами. Как правило это первичный и вторичный цвет и их оттенки, которые ассоциируются с брендом или приложением. Они должны фигурировать везде. Должно быть от 1 до 3 основных цветов.
Дальше при выборе черного и белого цветов не надо останавливаться на одном. Выберите один из оттенков серого, которые в разных соотношениях содержит оба антагонистических цвета. Абсолютный черный не отражает яркости вообще, а абсолютный белый наоборот, отражает на все 100 %. Человеческий глаз быстро устает от контраста, созданного такой неравномерностью этих 2-х цветов. Поэтому нужно выбрать наиболее гармоничное соотношение цвета шрифта и заднего фона.
Также для интерактивных элементов следует использовать один и тот же цвет. Например, для ссылок и кнопок. Это помогает пользователям быстро сориентироваться и совершать нужные действия.
На этом фсё
В следующих частях расскажу об остальных советах. Интересно?
Этим постом я открываю серию о цветовой палитре. В каждой части будет по одному совету, который буду детально объяснять. Погнали!
Выбирайте с умом
В первую очередь, определитесь с основными цветами. Как правило это первичный и вторичный цвет и их оттенки, которые ассоциируются с брендом или приложением. Они должны фигурировать везде. Должно быть от 1 до 3 основных цветов.
Дальше при выборе черного и белого цветов не надо останавливаться на одном. Выберите один из оттенков серого, которые в разных соотношениях содержит оба антагонистических цвета. Абсолютный черный не отражает яркости вообще, а абсолютный белый наоборот, отражает на все 100 %. Человеческий глаз быстро устает от контраста, созданного такой неравномерностью этих 2-х цветов. Поэтому нужно выбрать наиболее гармоничное соотношение цвета шрифта и заднего фона.
Также для интерактивных элементов следует использовать один и тот же цвет. Например, для ссылок и кнопок. Это помогает пользователям быстро сориентироваться и совершать нужные действия.
На этом фсё
В следующих частях расскажу об остальных советах. Интересно?
👍49🔥7❤3🥰1
Работа в фрилансе и компании: преимущества и минусы обоих вариантов
Я не люблю, когда автор превозносит один вариант и опускает другой. У каждого разный вкус и желания, одному может идеально подойти спокойная работа в компании, а другому боле хардкордная и ответственная в фрилансе. Поэтому решил в этом посте разобрать плюсы и минусы обоих вариантов, а выбор оставить вам.
• Работа в компании
Возможность учиться. Есть более опытные коллеги, у которых в любой момент можно попросить совета.
Работа в команде. Это, по мне, существенный плюс, т.к. командная работа не только прокачивает технические навыки, но и развивает ряд софт-скиллов.
Монотонность. Одинаковая работы каждый день рискует превратиться в скучную рутину и перестать приносить наслаждение.
• Работа в фрилансе
Высокий потолок. Работая на себя, при меньшем усилии и трате времени, качественные спецы зарабатывают больше, чем в компании. А если развивать свои проекты, то потолок возрастет до максимальных значений.
Итог
По тексту выходит, что для начинающих лучше подходит работа в компании, т.к. там быстрее учишься и доход гарантирован. А когда наберется опыта, то можно уходить в фриланс. Это мои выводы, вы можете быть другого мнения и выбрать наиболее подходящий для себя вариант.
Я не люблю, когда автор превозносит один вариант и опускает другой. У каждого разный вкус и желания, одному может идеально подойти спокойная работа в компании, а другому боле хардкордная и ответственная в фрилансе. Поэтому решил в этом посте разобрать плюсы и минусы обоих вариантов, а выбор оставить вам.
• Работа в компании
Плюсы
Гарантированный доход. Не нужно париться по заработку.Возможность учиться. Есть более опытные коллеги, у которых в любой момент можно попросить совета.
Работа в команде. Это, по мне, существенный плюс, т.к. командная работа не только прокачивает технические навыки, но и развивает ряд софт-скиллов.
Минусы
Низкий потолок. Да, можно вполне неплохо зарабатывать, но при должном усердии быстро достигается потолок в доходе и развитии.Монотонность. Одинаковая работы каждый день рискует превратиться в скучную рутину и перестать приносить наслаждение.
• Работа в фрилансе
Плюсы
Свободный график. Можете хоть в 12 часов дня просыпаться и к 14 приступить к работе, никто вас не поругает. Главное, чтобы задачи к сроку выполняли.Высокий потолок. Работая на себя, при меньшем усилии и трате времени, качественные спецы зарабатывают больше, чем в компании. А если развивать свои проекты, то потолок возрастет до максимальных значений.
Минусы
Самодисциплина. Доход напрямую зависит от вашей ответственности и силы воли. Порой трудно оторваться от сериала и приступить к заказу. Плохая самодисциплина может привести к срыве дедлайнов, потере репутации и, в результате, низкому заработку.Итог
По тексту выходит, что для начинающих лучше подходит работа в компании, т.к. там быстрее учишься и доход гарантирован. А когда наберется опыта, то можно уходить в фриланс. Это мои выводы, вы можете быть другого мнения и выбрать наиболее подходящий для себя вариант.
👍26🔥9👏4❤2
Лягушка, цветовая палитра и фриланс
Воскресный дайджест. Посты, которые вышли на этой неделе:
\ "Я потерял веру в UX" или как корпорации умышленно усложняют интерфейсы ради увеличение прибыли
\ Продуктивность: "съешь лягушку"
\ Пример того, как улучшить взаимодействие с пользователем за счет анимации
\ Визуализация данных. Ч.4 — инструменты
\ Как создать качественную цветовую палитру
\ Работа в фрилансе и компании: преимущества и минусы обоих вариантов
Завтра выйдет опрос про контент на следующую неделю. Если было полезно, то вдарьте по реакциям. Говорят, это занимает 1 секунду, проверим?)
Воскресный дайджест. Посты, которые вышли на этой неделе:
\ "Я потерял веру в UX" или как корпорации умышленно усложняют интерфейсы ради увеличение прибыли
\ Продуктивность: "съешь лягушку"
\ Пример того, как улучшить взаимодействие с пользователем за счет анимации
\ Визуализация данных. Ч.4 — инструменты
\ Как создать качественную цветовую палитру
\ Работа в фрилансе и компании: преимущества и минусы обоих вариантов
Завтра выйдет опрос про контент на следующую неделю. Если было полезно, то вдарьте по реакциям. Говорят, это занимает 1 секунду, проверим?)
👍21🔥3
Выбираем темы на эту неделю. Выйдут 4 из 5:
Final Results
50%
Топ самых необходимых инструментов для начинающих UX-дизайнеров
13%
Визуализация. Ч.5 — проектирование интерфейса
16%
Как создать качественную цветовую палитру #2 — метод 60-30-10
15%
Как повысить удовлетворенность клиентов даже после провала
6%
Эффект изоляции
👍3🔥1
Определяем правильный интерлиньяж
Для тех, кто не знает, интерлиньяж — пробел между строками в тексте. Он делает чтение для пользователя удобным.
А теперь к сути. На днях наткнулся на интересный и довольно полезный материал. Там автор рассказывает, как математическим путем определять правильное значение интерлиньяжа. Оч нужное умение для дизайнеров. В своем подсчете он использует стандартное значение — 120 %.
Вам остается просто прочитать материал и взять прием на вооружение. Ссылка внизу:
https://vc.ru/design/463440-interlinyazh-prostaya-matematika
Для тех, кто не знает, интерлиньяж — пробел между строками в тексте. Он делает чтение для пользователя удобным.
А теперь к сути. На днях наткнулся на интересный и довольно полезный материал. Там автор рассказывает, как математическим путем определять правильное значение интерлиньяжа. Оч нужное умение для дизайнеров. В своем подсчете он использует стандартное значение — 120 %.
Вам остается просто прочитать материал и взять прием на вооружение. Ссылка внизу:
https://vc.ru/design/463440-interlinyazh-prostaya-matematika
vc.ru
Интерлиньяж. Простая математика
Какой должен быть правильный интерлиньяж загуглить просто. Тем, кто это еще не делал спойлер — 120%. В среднем это верно, точнее от этого числа удобно отталкиваться, когда уменьшаете или увеличиваете его значение. А вот насколько его изменять зависит от нескольких…
👍24🔥4
Как восстановить доверие клиентов
В 1992 году профессоры Майкл Маккалоу и Сундар Бхарадвадж провели интересное исследование. Они выяснили, что удовлетворенность клиентов после исправление компанией проблемы повышается, чем было до.
То есть, клиент будет относиться к вам более лояльно, если вы исправите косяк. Это хорошо отражает график внизу. Такое явление исследователи назвали "парадокс восстановления доверия".
Но последующие исследования показали, что он работает не всегда. Для того, чтобы он сработал, должны быть соблюдены ряд условий:
> Проблема не повлекла серьезные последствия для клиента;
> Приняты оперативные меры по решению проблемы;
> Проблема в результате была решена или предложены альтернативные варианты;
> Предложена компенсация (например, промокод на следующую покупку);
> Были описаны принятые меры по профилактике подобных проблем в дальнейшем;
> Или проблема находится вне контроля компании (например, брак товара – это не вина интернет-магазина, а вина производителя).
К этому приему нередко прибегают маркетологи, но и другим специалистами, особенно в фрилансе, он оч пригодится для повышения доверия. Ведь, в основном, именно такие клиенты в дальнейшем становятся постоянными.
Если пост был полезен, жмакните по реакциям. До скорой!
В 1992 году профессоры Майкл Маккалоу и Сундар Бхарадвадж провели интересное исследование. Они выяснили, что удовлетворенность клиентов после исправление компанией проблемы повышается, чем было до.
То есть, клиент будет относиться к вам более лояльно, если вы исправите косяк. Это хорошо отражает график внизу. Такое явление исследователи назвали "парадокс восстановления доверия".
Но последующие исследования показали, что он работает не всегда. Для того, чтобы он сработал, должны быть соблюдены ряд условий:
> Проблема не повлекла серьезные последствия для клиента;
> Приняты оперативные меры по решению проблемы;
> Проблема в результате была решена или предложены альтернативные варианты;
> Предложена компенсация (например, промокод на следующую покупку);
> Были описаны принятые меры по профилактике подобных проблем в дальнейшем;
> Или проблема находится вне контроля компании (например, брак товара – это не вина интернет-магазина, а вина производителя).
К этому приему нередко прибегают маркетологи, но и другим специалистами, особенно в фрилансе, он оч пригодится для повышения доверия. Ведь, в основном, именно такие клиенты в дальнейшем становятся постоянными.
Если пост был полезен, жмакните по реакциям. До скорой!
👍26🔥6👏1
4 сервиса для подбора палитры цветов
Подобрать цветовую схему — это половина успеха в дизайне сайта. От правильной палитры зависит настроение сайта и то, как его воспринимают пользователи. Главное — найти подходящее сочетание. Подобрал для вас 4 полезных сервиса:
1. Color-hex — информация о цвете в различных цветовых моделях
Сайт дает детальную информацию о заданном цвете, подбирая гармоничные оттенки и подходящие цвета для палитры.
2. Brand Colors — Коллекция фирменных цветов крупнейших брендов
Большая коллекция официальных цветовых кодов различных компаний. Удобный поиск и возможность сразу сохранить CSS файл с кодами.
3. Coolors — набор инструментов для создания цветовых палитр
Наиболее обширный сервис для создания палитр, что мне довелось найти. Можно искать по готовым примерам или создать свою палитру, также есть возможность сгенерить палитру из картинки, проверить контрастность палитры и даже перекрасить SVG графику.
4. Material Color Tool — генератор палитры от Material Design
Незаменимый инструмент если нужно сгенерировать правильные основные цвета для популярной библиотеки. Можно также предварительно посмотреть как цвета будут смотреться в приложении. На выходе получаем готовый код от которого разработчики будут в восторге.
На этом все! Вдарьте по реакциям если хотите больше таких подборок.
Подобрать цветовую схему — это половина успеха в дизайне сайта. От правильной палитры зависит настроение сайта и то, как его воспринимают пользователи. Главное — найти подходящее сочетание. Подобрал для вас 4 полезных сервиса:
1. Color-hex — информация о цвете в различных цветовых моделях
Сайт дает детальную информацию о заданном цвете, подбирая гармоничные оттенки и подходящие цвета для палитры.
2. Brand Colors — Коллекция фирменных цветов крупнейших брендов
Большая коллекция официальных цветовых кодов различных компаний. Удобный поиск и возможность сразу сохранить CSS файл с кодами.
3. Coolors — набор инструментов для создания цветовых палитр
Наиболее обширный сервис для создания палитр, что мне довелось найти. Можно искать по готовым примерам или создать свою палитру, также есть возможность сгенерить палитру из картинки, проверить контрастность палитры и даже перекрасить SVG графику.
4. Material Color Tool — генератор палитры от Material Design
Незаменимый инструмент если нужно сгенерировать правильные основные цвета для популярной библиотеки. Можно также предварительно посмотреть как цвета будут смотреться в приложении. На выходе получаем готовый код от которого разработчики будут в восторге.
На этом все! Вдарьте по реакциям если хотите больше таких подборок.
👍29🔥8
Как создать качественную цветовую палитру #2 — метод 60-30-10
Мы уже разобрали как нужно подбирать цвета в палитре в первом посте из цикла. Сегодня рассмотрим метод, который поможет грамотно комбинировать цвета в композиции.
Правило 60-30-10 изначально использовалось в дизайне интерьеров, но оно также идеально подходит и для цифровых продуктов.
Правило очень простое и звучит так:
60% — пространства предназначено для основного цвета;
30% — для вторичного цвета;
10% — акцент и сопровождающий цвет;
Можно использовать эти пропорции, чтобы найти правильный баланс в сочетании цветов, не превращая пользовательский интерфейс в красочную смесь.
Считается, что такие пропорции приятны человеческому глазу и позволяют легко воспринимать общую композицию тем самым направляя пользователя через интерфейс.
Также можете поэкспериментировать и применять цвета в другом порядке, и это все равно будет работать.
Мы уже разобрали как нужно подбирать цвета в палитре в первом посте из цикла. Сегодня рассмотрим метод, который поможет грамотно комбинировать цвета в композиции.
Правило 60-30-10 изначально использовалось в дизайне интерьеров, но оно также идеально подходит и для цифровых продуктов.
Правило очень простое и звучит так:
60% — пространства предназначено для основного цвета;
30% — для вторичного цвета;
10% — акцент и сопровождающий цвет;
Можно использовать эти пропорции, чтобы найти правильный баланс в сочетании цветов, не превращая пользовательский интерфейс в красочную смесь.
Считается, что такие пропорции приятны человеческому глазу и позволяют легко воспринимать общую композицию тем самым направляя пользователя через интерфейс.
Также можете поэкспериментировать и применять цвета в другом порядке, и это все равно будет работать.
👍28🔥1
Топ самых необходимых инструментов для начинающих UX дизайнеров
Я уже писал ранее о софт и хард скилах и с чего начать изучение UX.
В сегодняшней подборке — инструменты, которыми с моей точки зрения полезно овладеть любому новичку в UX дизайне.
Исследования
Любой основательный UX проект начинается с исследования. Чтобы выявить проблемы, связанные с навигацией по сайту достаточно сервисов от Яндекс.Метрика, Google Analytics или Hotjar. Для мобильных приложений есть аналогичные сервисы Firebase и UXCam. В последнем также есть инструменты, которые помогут вам проанализировать проблемы связанные с интерфейсом.
Пользовательские опросы и интервью
Лучший инструмент для пользовательских интервью — бумага и ручка :) Проводите интервью по возможности вживую в среде, где пользователь пользуется вашим продуктом, а не онлайн. Если нужно интегрировать опросы и получить обратную связь прямо в продукте, в этом вам помогут сервисы UserReport и GetFeedback
Стратегическое планирование и создание информационной архитектуры
Для создания визуальных карт путешествия клиента, пользовательских потоков и персон подойдет сервис от FlowMapp. Для планирования и работы в команде очень удобны также Miro и Fig Jam. Тут всё необходимое для действительно совместного процесса проектирования —можно и карту сайта нарисовать и интерактивно организовать работу над проектом.
Создание вайрфреймов и макетов
Когда дело доходит до проектирования интерфейсов не обойтись без Figma, Adobe XD или Sketch. Можно посветить отельную статью какой продукт лучший. Работайте с тем, который вам по душе.
Базовое прототипирование
Если работаете на Sketch — наиболее легко собирать простые прототипы в InVision. Для более сложных анимаций подойдет приложение Marvel. В Figma анимированные прототипы делаются прямо в самом приложении.
Hi-Fi прототипы
Если в ваши задачи входит создать сложный прототип близкий по функционалу к реальному продукту в этом вам помогут такие приложения как
Proto.io, Framer или Origami
В них можно создавать интерактивные формуляры, работать с живыми данными и переменными.
Это далеко не все приложения которые есть на рынке, но статья и без того получилась довольно длинной. Если было полезно — вдарьте по реакциям! А какими инструментами пользуетесь вы? Напишите в комментариях.
Я уже писал ранее о софт и хард скилах и с чего начать изучение UX.
В сегодняшней подборке — инструменты, которыми с моей точки зрения полезно овладеть любому новичку в UX дизайне.
Исследования
Любой основательный UX проект начинается с исследования. Чтобы выявить проблемы, связанные с навигацией по сайту достаточно сервисов от Яндекс.Метрика, Google Analytics или Hotjar. Для мобильных приложений есть аналогичные сервисы Firebase и UXCam. В последнем также есть инструменты, которые помогут вам проанализировать проблемы связанные с интерфейсом.
Пользовательские опросы и интервью
Лучший инструмент для пользовательских интервью — бумага и ручка :) Проводите интервью по возможности вживую в среде, где пользователь пользуется вашим продуктом, а не онлайн. Если нужно интегрировать опросы и получить обратную связь прямо в продукте, в этом вам помогут сервисы UserReport и GetFeedback
Стратегическое планирование и создание информационной архитектуры
Для создания визуальных карт путешествия клиента, пользовательских потоков и персон подойдет сервис от FlowMapp. Для планирования и работы в команде очень удобны также Miro и Fig Jam. Тут всё необходимое для действительно совместного процесса проектирования —можно и карту сайта нарисовать и интерактивно организовать работу над проектом.
Создание вайрфреймов и макетов
Когда дело доходит до проектирования интерфейсов не обойтись без Figma, Adobe XD или Sketch. Можно посветить отельную статью какой продукт лучший. Работайте с тем, который вам по душе.
Базовое прототипирование
Если работаете на Sketch — наиболее легко собирать простые прототипы в InVision. Для более сложных анимаций подойдет приложение Marvel. В Figma анимированные прототипы делаются прямо в самом приложении.
Hi-Fi прототипы
Если в ваши задачи входит создать сложный прототип близкий по функционалу к реальному продукту в этом вам помогут такие приложения как
Proto.io, Framer или Origami
В них можно создавать интерактивные формуляры, работать с живыми данными и переменными.
Это далеко не все приложения которые есть на рынке, но статья и без того получилась довольно длинной. Если было полезно — вдарьте по реакциям! А какими инструментами пользуетесь вы? Напишите в комментариях.
❤40🔥13👍5
Воскресный дайджест. Посты, которые вышли на этой неделе:
\ Определяем правильный интерлиньяж
\ Как восстановить доверие клиентов
\ Иконка зеленого для пешехода в разных странах
\ 4 сервиса для подбора палитры цветов
\ Как создать качественную цветовую палитру #2 — метод 60-30-10
\ Топ самых необходимых инструментов для начинающих UX дизайнеров
Если было полезно, дайте знать в реакциях. Завтра как обычно опрос по контенту на следующую неделю. Если хотите увидеть на канале конкретные темы, пишите в бот @uxtrendsbot. До завтра!
\ Определяем правильный интерлиньяж
\ Как восстановить доверие клиентов
\ Иконка зеленого для пешехода в разных странах
\ 4 сервиса для подбора палитры цветов
\ Как создать качественную цветовую палитру #2 — метод 60-30-10
\ Топ самых необходимых инструментов для начинающих UX дизайнеров
Если было полезно, дайте знать в реакциях. Завтра как обычно опрос по контенту на следующую неделю. Если хотите увидеть на канале конкретные темы, пишите в бот @uxtrendsbot. До завтра!
👍12🔥4❤1
Выбираем темы на эту неделю. Выйдут 4 из 5:
Final Results
14%
Визуализация Ч.5 - проектирование интерфейса
23%
Зачем нужны ментальные карты и как их строить
27%
Психология в дизайне - эффект приманки
14%
Как создать качественную цветовую палитру #3 - работа с контрастом
22%
Основы UX дизайна - эффект изоляции
👍8
Три вопроса, на которые не может ответить джуниор UX-дизайнер
Собесы - как правило, стресс для любого джуна (и не только) так как из-за напряжения можно наговорить всякой ерунды. К тому же многие работодатели не ограничиваются просьбами рассказать о себе и показать портфолио.
Недавно нашел статью, в которой автор доходчиво рассказывает к каким вопросам нужно заранее подготовится каждому молодому UX дизайнеру. Очень полезный материал, особенно если вы в процессе поиска новой работы.
https://design-glory.com/tri-voprosa-na-kotorye-ne-mozhet-otvetit-dzhunior-ux-dizajner/
Собесы - как правило, стресс для любого джуна (и не только) так как из-за напряжения можно наговорить всякой ерунды. К тому же многие работодатели не ограничиваются просьбами рассказать о себе и показать портфолио.
Недавно нашел статью, в которой автор доходчиво рассказывает к каким вопросам нужно заранее подготовится каждому молодому UX дизайнеру. Очень полезный материал, особенно если вы в процессе поиска новой работы.
https://design-glory.com/tri-voprosa-na-kotorye-ne-mozhet-otvetit-dzhunior-ux-dizajner/
👍38❤2😁1
Эффект приманки
Очень простой но зато действенный хак, чтобы подтолкнуть людей принять определенное решение. В маркетинге этот эффект используется, чтобы продать покупателю более дорогой товар.
Как он действует, проще всего объяснить на примере. Вы хотите купить попкорн — на выбор три разные по объему порции. Причем средняя стоит не намного меньше, чем самая большая. Большинство склонны взять именно большую порцию т.к. разница в цене несущественная, чего собственно и хочет продавец. Средняя порция выступает в данном примере приманкой как дополнительный, чуть менее привлекательный вариант.
Благодаря тому, что выбор мы делаем вполне осознанный сохраняется чувство контроля и мы не замечаем подвох.
«Эффект приманки» можно использовать и в любых других сферах. Так что возьмите себе на заметку - может пригодится!
Очень простой но зато действенный хак, чтобы подтолкнуть людей принять определенное решение. В маркетинге этот эффект используется, чтобы продать покупателю более дорогой товар.
Как он действует, проще всего объяснить на примере. Вы хотите купить попкорн — на выбор три разные по объему порции. Причем средняя стоит не намного меньше, чем самая большая. Большинство склонны взять именно большую порцию т.к. разница в цене несущественная, чего собственно и хочет продавец. Средняя порция выступает в данном примере приманкой как дополнительный, чуть менее привлекательный вариант.
Благодаря тому, что выбор мы делаем вполне осознанный сохраняется чувство контроля и мы не замечаем подвох.
«Эффект приманки» можно использовать и в любых других сферах. Так что возьмите себе на заметку - может пригодится!
👍34🔥3😁3
This media is not supported in your browser
VIEW IN TELEGRAM
Смотрите, как оригинально приступили к дизайну страницы "О компании" бренд хулиганской одежды
Хороший пример, как "впихнуть" в дизайн много чего и при этом сохранить сюжетную гармоничность. Посмотрите сами: https://manifesto.androll.fr/
Хороший пример, как "впихнуть" в дизайн много чего и при этом сохранить сюжетную гармоничность. Посмотрите сами: https://manifesto.androll.fr/
🔥25👏4❤1👍1
Ментальные карты — зачем нужны и как их строить
Ментальная карта (англ. Mind map) или карта мыслей, интеллект-карта — это метод визуального структурирования большого объема информации. С помощью него можно схематично систематизировать разные данные, выбрать нужные идеи или концепты.
1. Продумать логику нового продукта
В UX дизайне этот метод очень удобен для совместного воркшопа с клиентом когда нужно понять как работает сложный сервис. Так можно очень быстро визуализировать все процессы и связи связанные с работой этого сервиса, сайта или приложения.
Пример ментальной карты CRM-системы
2. Генерирование идей
С другой стороны в дизайн-процессе этот метод очень удобен для поиска оригинальных решений. Так можно за короткое время в формате совместного мозгового штурма наработать немало оригинальных идей для решения поставленных задач.
Пример ментальной карты для названия приложения
3. Планирование
Благодаря структурированию информации можно намного проще понять поставленную задачу и в дальнейшем разбить её на подзадачи. Таким образом, вы не упустите деталий и сможете успешно спланировать работу.
На самом деле нет никаких жестких правил для создания ментальных карт. Визуально интеллект-карта напоминает дерево. В центре располагается ключевая тема, идея или проблема. От неё ответвляются задачи, ресурсы, способы решения проблемы или реализации идей.
Очень удобно в Miro или Mindmeister но можно и в FigJam
В заключение. Умение строить такого рода схемы — один из хард-скилов любого UX и продуктового дизайнера. Он поможет вам разобраться с большим объёмом информации, найти нужные решения, а также грамотно спланировать работу.
Если было полезно дайте 🔥
До скорого!
Ментальная карта (англ. Mind map) или карта мыслей, интеллект-карта — это метод визуального структурирования большого объема информации. С помощью него можно схематично систематизировать разные данные, выбрать нужные идеи или концепты.
// Когда использовать?
1. Продумать логику нового продукта
В UX дизайне этот метод очень удобен для совместного воркшопа с клиентом когда нужно понять как работает сложный сервис. Так можно очень быстро визуализировать все процессы и связи связанные с работой этого сервиса, сайта или приложения.
Пример ментальной карты CRM-системы
2. Генерирование идей
С другой стороны в дизайн-процессе этот метод очень удобен для поиска оригинальных решений. Так можно за короткое время в формате совместного мозгового штурма наработать немало оригинальных идей для решения поставленных задач.
Пример ментальной карты для названия приложения
3. Планирование
Благодаря структурированию информации можно намного проще понять поставленную задачу и в дальнейшем разбить её на подзадачи. Таким образом, вы не упустите деталий и сможете успешно спланировать работу.
// Как создать ментальную карту?
На самом деле нет никаких жестких правил для создания ментальных карт. Визуально интеллект-карта напоминает дерево. В центре располагается ключевая тема, идея или проблема. От неё ответвляются задачи, ресурсы, способы решения проблемы или реализации идей.
// В чем создавать?
Очень удобно в Miro или Mindmeister но можно и в FigJam
В заключение. Умение строить такого рода схемы — один из хард-скилов любого UX и продуктового дизайнера. Он поможет вам разобраться с большим объёмом информации, найти нужные решения, а также грамотно спланировать работу.
Если было полезно дайте 🔥
До скорого!
🔥28👍5❤4
This media is not supported in your browser
VIEW IN TELEGRAM
Пример того, как 3D анимация меняет восприятие страницы
Нашел на просторах dribbble занятную анимацию перехода по контенту при прокрутке страницы вниз. Хоть это и концепт,
но эффект довольно интересный. Как вам такое?
Нашел на просторах dribbble занятную анимацию перехода по контенту при прокрутке страницы вниз. Хоть это и концепт,
но эффект довольно интересный. Как вам такое?
🔥67❤2👍2👎1