Видео с Moscow Dribbble Meetup 2018 в Москве:
1. Роман Худоногов из «Сетки» — Инструмент паблишинга;
2. Кирилл Куликов и Мила Дайн из агентства Norde — Яркая иллюстрация и промо;
3. Влад Зелинский из RealtimeBoard — Visual collaboration;
4. Команда Rambler & Co — Есть ли жизнь после редизайна;
5. Команда Альфа-Банка — О своей дизайн-системе;
6. Команда Mail.Ru — Как создавался стиль конференции;
7. Екатерина Соломеина из Future London Academy — Как работают британские дизайн-студии;
8. Nick Budden из Phase — Инструмент дизайна интерфейсов;
9. Юлия Музафарова из «БЭМ Дизайн» — Декларативная дизайн-система;
10. Иллюстраторы Дима и Лета Штольц — Яркая иллюстрация.
Подборка на ютубе: youtube.com/watch?v=PItiqlnNu3Q&list=PLzqQCeTtpSBqHHkOZySytY2S_4Iay6aDU
Альбом ВКонтакте: vk.com/videos-50773057?section=album_24
1. Роман Худоногов из «Сетки» — Инструмент паблишинга;
2. Кирилл Куликов и Мила Дайн из агентства Norde — Яркая иллюстрация и промо;
3. Влад Зелинский из RealtimeBoard — Visual collaboration;
4. Команда Rambler & Co — Есть ли жизнь после редизайна;
5. Команда Альфа-Банка — О своей дизайн-системе;
6. Команда Mail.Ru — Как создавался стиль конференции;
7. Екатерина Соломеина из Future London Academy — Как работают британские дизайн-студии;
8. Nick Budden из Phase — Инструмент дизайна интерфейсов;
9. Юлия Музафарова из «БЭМ Дизайн» — Декларативная дизайн-система;
10. Иллюстраторы Дима и Лета Штольц — Яркая иллюстрация.
Подборка на ютубе: youtube.com/watch?v=PItiqlnNu3Q&list=PLzqQCeTtpSBqHHkOZySytY2S_4Iay6aDU
Альбом ВКонтакте: vk.com/videos-50773057?section=album_24
YouTube
Norde: Кирилл Куликов и Мила Дайн — Яркая иллюстрация и промо
Они стремительно взлетели в популярности на Dribbble за последние год-полтора и сформировали свой узнаваемый стиль иллюстрации. Мила и Кирилл рассказали о том, откуда берутся тренды в иллюстрациях и какие исторические корни у современных подходов, как отличается…
Бывший фронтендер и владелец студии, а теперь менеджер проектов и стендапер Илья Якямсев рассказал о рабочей депрессии. Краткий пересказ:
Если вы более 5 лет работаете в IT, у вас есть психические расстройства. Ломается орган, который работает. Если человек дурак, лентяй и лоботряс, у него нет психических отклонений.
ДМС никогда не включает лечение психических расстройств. В современной компании забота о человеке ограничена формулой «коллектив, позитив, корпоратив». Отсюда всякие «плюшки» и «джедаи». В реальности большую часть времени вы сидите в наушниках и фигачите.
Самые ответственные люди трогаются умом быстрее других. Тот, кто прочитал книги по эффективности, производит ещё больше фигни и неправильных действий.
Как понять, что у вас депрессия:
— Нарушение сна больше недели: вы плохо спите или вас везде вырубает;
— Торможение («упал прод, надо бы поднять, пойду напишу инструкцию, как его поднимать») или энтузиазм, основанный на истерике («не буду спать, но завтра всё будет готово»).
В депрессии обрубается и радость, и печаль. Вы играете в игру, но вам всё равно, даже когда выигрываете. И вам пофиг, что вам пофиг.
Появляется страх, что раскроют. На работе вы начинаете напрягаться, чтобы люди видели с вашей стороны адекватные социальные реакции. Это дополнительная нагрузка.
Люди в депрессии — идеальные работники. Они берут на себя любые обязательства и ответственность просто из страха. Это лучший коллектив для неопытного менеджера. Особенно, если коллектив бухает.
Депрессия вызывает физические изменения. Становится физически трудно двигаться.
Когда вы обнаруживаете себя глубоко в депрессии:
— Поздно предохраняться;
— Срочно обращайтесь к врачу. Не пытайтесь заниматься самолечением, дальше будет «радио в голове», биполярка и шизофрения;
— Не бухайте;
— Остановитесь. Не надо дёргать руль на высокой скорости.
Если сотрудник сообщает о том, что у него клиническая депрессия, лучшее решение для менеджера — уволить его. Когда сотрудник разберётся с причинами, скорее всего, он уволится сам.
Как снизить вероятность депрессии:
— Медитация без религиозных составляющих. Помогает засыпать (перестать решать рабочие вопросы с закрытыми глазами) и принимать решения;
— Физкультура без лишнего энтузиазма: зарядка, а не триатлон. Начните с простых упражнений на шею, которые можно найти в интернете с 800 млн просмотров. Потребуется лишь 1,5 метра на полу. Это должен быть не рывок, а ежедневное обслуживания своего тела;
— Выходите на солнечный свет. Если курите, в этом плане вам повезло.
Каждый день, когда идёте на стендап-митинг, думайте о том, что происходит в вашей жизни, что за день вы сделали для себя. Если вы 8 лет каждый день делаете одну и ту же фигню, вам конец. «Что нового я узнал, есть ли у меня планы, куда я двигаюсь?» — на этот вопрос вы начнёте отвечать, если начнёте его задавать.
Депрессия заставляет перестать врать самому себе. Если вам перестала нравиться работа, сваливайте. Либо со временем вы погрузитесь в депрессию, из-за страха будете принимать плохие решения, перестанете рисковать и нести ответственность. В результате вас всё равно уволят.
Прочие рекомендации:
— Думайте о себе. Важно не только, что вы отдали компании, но и что получили взамен;
— Если что-то причиняет вам дискомфорт, меняйте это;
— Сначала думайте, как быть нормальным внутри коллектива, а потом помогайте коллективу измениться. Не жалуйтесь на коллектив, сами делайте всё правильно и помогайте другим исправиться;
— Перестаньте заниматься фигнёй. Каждый день выкидывайте по куску фигни. Делегируйте её: то, что для вас — фигня, для другого — хороший опыт;
— Начните заниматься фигнёй. Узнавайте новое хотя бы по краям своей деятельности. Что вас больше всего раздражает, тем и займитесь;
— Делайте всё медленно. Жизнь начинает нестись быстро, как профессионал вы делаете всё быстро и перестаёте замечать скорость. Когда вы переключаетесь на другую деятельность, не надо сразу претендовать на мастерский уровень. Попробуйте, если не понравится — нафиг. Не надо уезжать в Лондон на 5-летний курс ради того, о чём вы узнали 2 дня назад;
#burnout
Если вы более 5 лет работаете в IT, у вас есть психические расстройства. Ломается орган, который работает. Если человек дурак, лентяй и лоботряс, у него нет психических отклонений.
ДМС никогда не включает лечение психических расстройств. В современной компании забота о человеке ограничена формулой «коллектив, позитив, корпоратив». Отсюда всякие «плюшки» и «джедаи». В реальности большую часть времени вы сидите в наушниках и фигачите.
Самые ответственные люди трогаются умом быстрее других. Тот, кто прочитал книги по эффективности, производит ещё больше фигни и неправильных действий.
Как понять, что у вас депрессия:
— Нарушение сна больше недели: вы плохо спите или вас везде вырубает;
— Торможение («упал прод, надо бы поднять, пойду напишу инструкцию, как его поднимать») или энтузиазм, основанный на истерике («не буду спать, но завтра всё будет готово»).
В депрессии обрубается и радость, и печаль. Вы играете в игру, но вам всё равно, даже когда выигрываете. И вам пофиг, что вам пофиг.
Появляется страх, что раскроют. На работе вы начинаете напрягаться, чтобы люди видели с вашей стороны адекватные социальные реакции. Это дополнительная нагрузка.
Люди в депрессии — идеальные работники. Они берут на себя любые обязательства и ответственность просто из страха. Это лучший коллектив для неопытного менеджера. Особенно, если коллектив бухает.
Депрессия вызывает физические изменения. Становится физически трудно двигаться.
Когда вы обнаруживаете себя глубоко в депрессии:
— Поздно предохраняться;
— Срочно обращайтесь к врачу. Не пытайтесь заниматься самолечением, дальше будет «радио в голове», биполярка и шизофрения;
— Не бухайте;
— Остановитесь. Не надо дёргать руль на высокой скорости.
Если сотрудник сообщает о том, что у него клиническая депрессия, лучшее решение для менеджера — уволить его. Когда сотрудник разберётся с причинами, скорее всего, он уволится сам.
Как снизить вероятность депрессии:
— Медитация без религиозных составляющих. Помогает засыпать (перестать решать рабочие вопросы с закрытыми глазами) и принимать решения;
— Физкультура без лишнего энтузиазма: зарядка, а не триатлон. Начните с простых упражнений на шею, которые можно найти в интернете с 800 млн просмотров. Потребуется лишь 1,5 метра на полу. Это должен быть не рывок, а ежедневное обслуживания своего тела;
— Выходите на солнечный свет. Если курите, в этом плане вам повезло.
Каждый день, когда идёте на стендап-митинг, думайте о том, что происходит в вашей жизни, что за день вы сделали для себя. Если вы 8 лет каждый день делаете одну и ту же фигню, вам конец. «Что нового я узнал, есть ли у меня планы, куда я двигаюсь?» — на этот вопрос вы начнёте отвечать, если начнёте его задавать.
Депрессия заставляет перестать врать самому себе. Если вам перестала нравиться работа, сваливайте. Либо со временем вы погрузитесь в депрессию, из-за страха будете принимать плохие решения, перестанете рисковать и нести ответственность. В результате вас всё равно уволят.
Прочие рекомендации:
— Думайте о себе. Важно не только, что вы отдали компании, но и что получили взамен;
— Если что-то причиняет вам дискомфорт, меняйте это;
— Сначала думайте, как быть нормальным внутри коллектива, а потом помогайте коллективу измениться. Не жалуйтесь на коллектив, сами делайте всё правильно и помогайте другим исправиться;
— Перестаньте заниматься фигнёй. Каждый день выкидывайте по куску фигни. Делегируйте её: то, что для вас — фигня, для другого — хороший опыт;
— Начните заниматься фигнёй. Узнавайте новое хотя бы по краям своей деятельности. Что вас больше всего раздражает, тем и займитесь;
— Делайте всё медленно. Жизнь начинает нестись быстро, как профессионал вы делаете всё быстро и перестаёте замечать скорость. Когда вы переключаетесь на другую деятельность, не надо сразу претендовать на мастерский уровень. Попробуйте, если не понравится — нафиг. Не надо уезжать в Лондон на 5-летний курс ради того, о чём вы узнали 2 дня назад;
#burnout
— Представьте, что будете жить вечно и попробуйте запланировать (даже на «через 100 лет») то, что всегда откладывали на потом;
— Будьте здоровы.
Если сомневаетесь в том, что делаете или как себя чувствуете, займитесь этим вопросом в первую очередь.
https://www.youtube.com/watch?v=K6oZuB8_dU8
#burnout
— Будьте здоровы.
Если сомневаетесь в том, что делаете или как себя чувствуете, займитесь этим вопросом в первую очередь.
https://www.youtube.com/watch?v=K6oZuB8_dU8
#burnout
YouTube
Илья Якямсев "Эффективность не работает", конференция FrontDays 2018
Сайт конференции: https://frontdays.ru/
Группа в вк: https://vk.com/frontdays
Группа в фб: https://www.facebook.com/frontdays/
Группа в вк: https://vk.com/frontdays
Группа в фб: https://www.facebook.com/frontdays/
Дмитрий Ваницкий написал о взаимодействии цветов и дал несколько советов о работе с ними.
Цвета объектов часто рассматриваются в вакууме. Если карандаш поглотил весь свет кроме зелёного, значит, он зелёный. Но мы видим его в среде, где на него воздействует тысяча факторов, которые искажают восприятие.
Чтобы изобразить ванильное мороженное, можно открыть «Каталог цветов на все случаи жизни» и найти там нужный цвет. Но если мороженное должно быть освещено светом падающей звезды, отражённым водной гладью, то вряд ли мы найдём что-то подобное.
— Математическая цветовая модель может передать реальный цвет объекта, но он будет отличаться от того, как зритель его видит;
— Цвет, который мы видим, никогда не бывает один, он находится в среде, которая его искажает;
— Запоминайте правила поведения и взаимодействия цвета, а не коды или конкретные цвета в конкретных ситуациях.
Любимый пример Людвига Быстроновского с «несочетаемым красным и зелёным»: просто посмотрите на грядку с клубникой. Цветовая гармония — лишь мера слаженности цветовой палитры, которая служит определённой цели, вызывая необходимое эмоциональное переживание.
Проблема автоматизации поиска гармоничной палитры ещё и в том, что алгоритмы оперируют составом самого цвета, но никак не соотношением количества этих цветов.
Когда 2 цвета слишком сильно контрастируют, можно добавить в каждый частичку партнёра. Если это набор цветов или при разбавлении получается грязь, можно использовать 3-й цвет-партнёр, который привнесёт единство.
В реальном мире восприятие даёт сбои. Например:
— Остаточные изображения, когда рецепторы не могут быстро остыть, и мы видим то, чего нет;
— Цветовая адаптация, когда при долгом лицезрении яркой палитры рецепторы сами снижают интенсивность, чтобы не перегреться.
Атмосфера тоже обладает непрозрачностью, просто она гораздо разреженнее плотных объектов и набирает массу медленнее. Почему солнце в зените светит почти белым, а на рассвете или закате — оранжевым и красным? Во втором случае лучи преодолевают больший объем атмосферы, что вносит свои искажения в восприятие цвета.
Это актуально для работ с перспективой или несколькими планами. Чтобы создать реалистичную глубину, надо смещать цветовую палитру объекта ближе к цвету атмосферы, уменьшая контраст, будто он погружается в туман.
Источник света тоже вносит коррективы. Если лампа светит приятным жёлтым светом, то тени, отбрасываемые освещённым предметом, становятся синее.
При ярком белом свете мы видим жёлтые и красные цвета ярче синих, но всё меняется с приходом ночи — синие цвета выступают вперёд, а красные и жёлтые кажутся почти чёрными.
Геометрическая прогрессия цветового тона воспринимается мозгом как арифметическая. Чтобы скорректировать восприятие, надо сделать шаг между тёмными тонами больше.
https://medium.com/design-spot/dc5e60f04033
Цвета объектов часто рассматриваются в вакууме. Если карандаш поглотил весь свет кроме зелёного, значит, он зелёный. Но мы видим его в среде, где на него воздействует тысяча факторов, которые искажают восприятие.
Чтобы изобразить ванильное мороженное, можно открыть «Каталог цветов на все случаи жизни» и найти там нужный цвет. Но если мороженное должно быть освещено светом падающей звезды, отражённым водной гладью, то вряд ли мы найдём что-то подобное.
— Математическая цветовая модель может передать реальный цвет объекта, но он будет отличаться от того, как зритель его видит;
— Цвет, который мы видим, никогда не бывает один, он находится в среде, которая его искажает;
— Запоминайте правила поведения и взаимодействия цвета, а не коды или конкретные цвета в конкретных ситуациях.
Любимый пример Людвига Быстроновского с «несочетаемым красным и зелёным»: просто посмотрите на грядку с клубникой. Цветовая гармония — лишь мера слаженности цветовой палитры, которая служит определённой цели, вызывая необходимое эмоциональное переживание.
Проблема автоматизации поиска гармоничной палитры ещё и в том, что алгоритмы оперируют составом самого цвета, но никак не соотношением количества этих цветов.
Когда 2 цвета слишком сильно контрастируют, можно добавить в каждый частичку партнёра. Если это набор цветов или при разбавлении получается грязь, можно использовать 3-й цвет-партнёр, который привнесёт единство.
В реальном мире восприятие даёт сбои. Например:
— Остаточные изображения, когда рецепторы не могут быстро остыть, и мы видим то, чего нет;
— Цветовая адаптация, когда при долгом лицезрении яркой палитры рецепторы сами снижают интенсивность, чтобы не перегреться.
Атмосфера тоже обладает непрозрачностью, просто она гораздо разреженнее плотных объектов и набирает массу медленнее. Почему солнце в зените светит почти белым, а на рассвете или закате — оранжевым и красным? Во втором случае лучи преодолевают больший объем атмосферы, что вносит свои искажения в восприятие цвета.
Это актуально для работ с перспективой или несколькими планами. Чтобы создать реалистичную глубину, надо смещать цветовую палитру объекта ближе к цвету атмосферы, уменьшая контраст, будто он погружается в туман.
Источник света тоже вносит коррективы. Если лампа светит приятным жёлтым светом, то тени, отбрасываемые освещённым предметом, становятся синее.
При ярком белом свете мы видим жёлтые и красные цвета ярче синих, но всё меняется с приходом ночи — синие цвета выступают вперёд, а красные и жёлтые кажутся почти чёрными.
Геометрическая прогрессия цветового тона воспринимается мозгом как арифметическая. Чтобы скорректировать восприятие, надо сделать шаг между тёмными тонами больше.
https://medium.com/design-spot/dc5e60f04033
Medium
Взаимодействие цвета
Мысли о цветовой гармонии и в целом о цвете, или точнее сказать о его взаимодействии со средой, в…
Ребята из студии Евгения Ярового записали 3-й выпуск передачи «ДжонФёдор», в котором обсудили:
— Онлайновые курсы дизайна, а точнее то, как они себя продают, и связанные с ними персоны;
— Реакцию дизайнеров на экспресс-дизайн студии Артемия Лебедева, в частности, жёсткий пост Олега Чулакова;
— Историю браузера арт-директора Actis Wunderman;
— Реакцию простых людей на брутальный бренд Иркутска;
— Негативное влияние паблика «Десигн» на дизайнеров и их отношения с заказчиками, а также лекцию админа этого паблика, основной посыл которой можно сформулировать как «клиент — дол***б»;
— Дизайнеров ВКонтакте и копирование элементов Фейсбука;
— Профессиональный подход к работе.
https://www.youtube.com/watch?v=_ZecICTZeek
— Онлайновые курсы дизайна, а точнее то, как они себя продают, и связанные с ними персоны;
— Реакцию дизайнеров на экспресс-дизайн студии Артемия Лебедева, в частности, жёсткий пост Олега Чулакова;
— Историю браузера арт-директора Actis Wunderman;
— Реакцию простых людей на брутальный бренд Иркутска;
— Негативное влияние паблика «Десигн» на дизайнеров и их отношения с заказчиками, а также лекцию админа этого паблика, основной посыл которой можно сформулировать как «клиент — дол***б»;
— Дизайнеров ВКонтакте и копирование элементов Фейсбука;
— Профессиональный подход к работе.
https://www.youtube.com/watch?v=_ZecICTZeek
Илья Бирман написал о сером тексте:
«Белый фон — это бумага, а текст на нём — это оттиск набора с краской. Поэтому серого текста на белом фоне быть не может: краска-то одна! Серый на белом выглядит компромиссно и поддельно.
Вместо оттенков серого в типографике используется разная жирность шрифта. Хочется сделать текст легче — возьми более тонкое начертание, но цвет оставь чёрным.
Чёрный фон — это темнота, а текст на нём — это свет. Поэтому серый цвет — это просто приглушённый свет. Серый на чёрном выглядит естественно, потому что яркость света может быть совершенно любой.
Жирность на чёрном работает плохо — разницы <…> почти не видно».
https://ilyabirman.ru/meanwhile/all/gray-text/
Игорь Штанг считает, что если чего-то не делали раньше, это не значит, что этого не нужно делать сейчас. Серый цвет — уже давно полноправная альтернатива другим шрифтовым приёмам вроде курсива или мелкого кегля.
В заметке — примеры серого текста на печатных макетах конца 20 века.
https://nobelfaik.livejournal.com/173188.html
Кстати, 15−17 сентября в Москве Игорь проведёт свой курс «Типографика и вёрстка» — один из немногих платных курсов, которые я проходил сам и готов рекомендовать: https://vk.com/typeschool_msk (не реклама).
«Белый фон — это бумага, а текст на нём — это оттиск набора с краской. Поэтому серого текста на белом фоне быть не может: краска-то одна! Серый на белом выглядит компромиссно и поддельно.
Вместо оттенков серого в типографике используется разная жирность шрифта. Хочется сделать текст легче — возьми более тонкое начертание, но цвет оставь чёрным.
Чёрный фон — это темнота, а текст на нём — это свет. Поэтому серый цвет — это просто приглушённый свет. Серый на чёрном выглядит естественно, потому что яркость света может быть совершенно любой.
Жирность на чёрном работает плохо — разницы <…> почти не видно».
https://ilyabirman.ru/meanwhile/all/gray-text/
Игорь Штанг считает, что если чего-то не делали раньше, это не значит, что этого не нужно делать сейчас. Серый цвет — уже давно полноправная альтернатива другим шрифтовым приёмам вроде курсива или мелкого кегля.
В заметке — примеры серого текста на печатных макетах конца 20 века.
https://nobelfaik.livejournal.com/173188.html
Кстати, 15−17 сентября в Москве Игорь проведёт свой курс «Типографика и вёрстка» — один из немногих платных курсов, которые я проходил сам и готов рекомендовать: https://vk.com/typeschool_msk (не реклама).
ilyabirman.ru
Серый текст на белом и на чёрном
Сейчас расскажу вам о том, как можно относиться к серому цвету на белом и на чёрном фоне
Фильм «Основатель» рассказывает, как кафе братьев Макдоналдов с очень быстрым обслуживанием превратилось в огромную сеть.
В этом отрывке — о проектировании компактного и эффективного кухонного пространства. Всё как мы любим: прототип (кухня нарисована мелом на асфальте), тестирование прототипа, итеративные улучшения.
Хорошее видео, если надо объяснить кому-нибудь пользу прототипов и их тестирования.
https://www.youtube.com/watch?v=jTageuhPfAM
В этом отрывке — о проектировании компактного и эффективного кухонного пространства. Всё как мы любим: прототип (кухня нарисована мелом на асфальте), тестирование прототипа, итеративные улучшения.
Хорошее видео, если надо объяснить кому-нибудь пользу прототипов и их тестирования.
https://www.youtube.com/watch?v=jTageuhPfAM
YouTube
Speedee Service System
👍1
Одностраничное бизнес-приложение предлагало пользователям зарегистрироваться с помощью соцсетей Google+, FB, VK и LinkedIn, чтобы сохранить данные. Конверсия была 2,5%.
Приложение может хранить данные локально и в Google Диске. При авторизации в Диске можно запрашивать пользовательские данные в Google+. Для новых пользователей по умолчанию настроено сохранение данных в Диске.
Регистрацию заменили на авторизацию, из соцсетей оставили только Google+. Конверсия стала 36,7%.
https://spark.ru/startup/bpsimulator/blog/9083/
Приложение может хранить данные локально и в Google Диске. При авторизации в Диске можно запрашивать пользовательские данные в Google+. Для новых пользователей по умолчанию настроено сохранение данных в Диске.
Регистрацию заменили на авторизацию, из соцсетей оставили только Google+. Конверсия стала 36,7%.
https://spark.ru/startup/bpsimulator/blog/9083/
SPARK
Как мы повысили конверсию в десять раз
Собрав данные аналитики по конверсии посетителей сервиса, мы ужаснулись - сервис теряет клиентов на ровном месте. Проанализировав данные и предприняв необходимые изменения, коэффициент конверсии был значительно ...
Джордан Сансон написал, как сообщить, какие поля в форме обязательны.
Большинство дизайнеров использует звёздочки для обозначения обязательных полей. Лучше обозначать необязательные поля:
— Звёздочка очевидна для вас, но не для всех. Есть те, кто не поймёт её смысла;
— Обязательных полей обычно больше, чем необязательных;
— Чем меньше визуального шума в форме, тем она читабельнее;
— Обязательное поле — препятствие на пути пользователя. Необязательное — наличие выбора. Лучше указывать на позитивные моменты (наличие выборе), чем на негативные (препятствия).
Какой текст использовать:
— На английском лучше «Optional», а не «Not required». Отрицания обычно менее понятны;
— От себя добавлю, что на русском лучше писать «Не обязательно». Слово «Опционально» менее понятно широким пользовательским массам.
https://sketchapp.me/obyazatelnye-i-neobyazatelnye-polya-pri-zapolnenii-form/
Большинство дизайнеров использует звёздочки для обозначения обязательных полей. Лучше обозначать необязательные поля:
— Звёздочка очевидна для вас, но не для всех. Есть те, кто не поймёт её смысла;
— Обязательных полей обычно больше, чем необязательных;
— Чем меньше визуального шума в форме, тем она читабельнее;
— Обязательное поле — препятствие на пути пользователя. Необязательное — наличие выбора. Лучше указывать на позитивные моменты (наличие выборе), чем на негативные (препятствия).
Какой текст использовать:
— На английском лучше «Optional», а не «Not required». Отрицания обычно менее понятны;
— От себя добавлю, что на русском лучше писать «Не обязательно». Слово «Опционально» менее понятно широким пользовательским массам.
https://sketchapp.me/obyazatelnye-i-neobyazatelnye-polya-pri-zapolnenii-form/
❤1
На прошлой неделе в Санкт-Петербурге прошла встреча сообщества UX Club с докладами в формате TEDx. Видеозаписи:
1. Этические ограничения при выборе заказчика. Антон Григорьев: youtu.be/8D1MgXdsBYg
2. UX-тренды в 2018 году. Сергей Кривой: youtu.be/iULegO_rjFc
3. Зачем пользователю контролировать интерфейс? Варвара Казакова: youtu.be/ZKavIXQE6tQ
4. Роль UX в современной продуктовой разработке. Артём Комаров: youtu.be/c7u_qxjOv1w
5. Поиск себя в профессии. Что влияет на наш путь. Илья Александров: youtu.be/yyKGe5Q9nO4
6. Как классно работать UX-дизайнеру в образовании. Глеб Кушедов: youtu.be/ebYFm5cghMc
7. Как мы работаем без менеджеров и у нас не отвалилась *0#@. Антон Илларионов: youtu.be/RODLu2xbLYY
8. Impact mapping как инструмент проектирования продукта. Андрей Гуров: youtu.be/X3ojJP-IojA
Плейлист: https://www.youtube.com/playlist?list=PLE-Z0vGqSOmd9-uu-r_4EbDsHmVt1xHLw
1. Этические ограничения при выборе заказчика. Антон Григорьев: youtu.be/8D1MgXdsBYg
2. UX-тренды в 2018 году. Сергей Кривой: youtu.be/iULegO_rjFc
3. Зачем пользователю контролировать интерфейс? Варвара Казакова: youtu.be/ZKavIXQE6tQ
4. Роль UX в современной продуктовой разработке. Артём Комаров: youtu.be/c7u_qxjOv1w
5. Поиск себя в профессии. Что влияет на наш путь. Илья Александров: youtu.be/yyKGe5Q9nO4
6. Как классно работать UX-дизайнеру в образовании. Глеб Кушедов: youtu.be/ebYFm5cghMc
7. Как мы работаем без менеджеров и у нас не отвалилась *0#@. Антон Илларионов: youtu.be/RODLu2xbLYY
8. Impact mapping как инструмент проектирования продукта. Андрей Гуров: youtu.be/X3ojJP-IojA
Плейлист: https://www.youtube.com/playlist?list=PLE-Z0vGqSOmd9-uu-r_4EbDsHmVt1xHLw
YouTube
Этические ограничения при выборе заказчика
Рассказывает Антон Григорьев из компании «Проекторат» в рамках встречи сообщества UX Club в Санкт-Петербурге 30.08.2018 в формате TEDx.
Страница мероприятия: https://www.facebook.com/events/1526960674075652/
Сайт Антона: https://vandergrav.ru/
Страница мероприятия: https://www.facebook.com/events/1526960674075652/
Сайт Антона: https://vandergrav.ru/
Джефф Дэвидсон написал про закон Миллера, который гласит, что среднестатистический человек может удерживать в кратковременной памяти только 7 ± 2 элемента.
«Одна из ключевых концепций закона — деление на порции. Кусочки информации нужно собирать в «гештальты» — информационные порции, которые проще осмыслить. К примеру, слово · с т а к а н · — это одна порция, поскольку буквы скомбинированы в некий осмысленный гештальт. Если мы переставим буквы · к а а н т с ·, то перед нами уже 6 отдельных порций. Формирование порций — важнейший элемент организации информации».
https://medium.com/начинающему-ux-дизайнеру/b45e1cb3fc0d
Константин Кичинский об исследованиях Миллера написал следующее:
«О чем [на самом деле] говорят опыты, на которые ссылается Миллер, и как его выводы можно применять в дизайне? Нетренированному человеку сложно по памяти идентифицировать слишком мелкие различия, его мозг все равно любые градации будет делить на от 4 до 10 категорий в зависимости от типа объекта.
Например, если речь идет о банальных ползунках, рейтингах со звездочками и прочих шкалах, то нужно помнить о том, что человеку трудно различать 10, 20 или 100 различных значений (100 вообще за гранью добра и зла), чем меньше делений, тем лучше. Дайте ему 5 звездочек, делите час максимум на 10 минутные интервалы (лучше 15, 20 или 30), покажите ему 4−5 оттенков одного цвета, а не всю палитру целиком. В игрушках нет смысла делить шкалу жизней или прогресса более чем на 10 частей, лучше ограничьтесь 5−6».
https://outofline.ru/a900c6937d13
Сьюзан Уэйншенк в своей книге рассказала об исследовании Алан Бэддли:
«В 1994 году физиолог Алан Бэддли обнаружил, что работы, описывающей действительное исследование, не существовало; опубликован был только доклад Миллера на конференции. И в основном он касался предположений Миллера о том, что, возможно, существует некий предел для количества информации, которое человек может обрабатывать одновременно.
Бэддли провел серию экспериментов, касающихся процессов в человеческой памяти и обработки информации. Другие исследователи, в том числе Нельсон Кован, пошли по его стопам и показали, что «магическим» числом является 4».
«Одна из ключевых концепций закона — деление на порции. Кусочки информации нужно собирать в «гештальты» — информационные порции, которые проще осмыслить. К примеру, слово · с т а к а н · — это одна порция, поскольку буквы скомбинированы в некий осмысленный гештальт. Если мы переставим буквы · к а а н т с ·, то перед нами уже 6 отдельных порций. Формирование порций — важнейший элемент организации информации».
https://medium.com/начинающему-ux-дизайнеру/b45e1cb3fc0d
Константин Кичинский об исследованиях Миллера написал следующее:
«О чем [на самом деле] говорят опыты, на которые ссылается Миллер, и как его выводы можно применять в дизайне? Нетренированному человеку сложно по памяти идентифицировать слишком мелкие различия, его мозг все равно любые градации будет делить на от 4 до 10 категорий в зависимости от типа объекта.
Например, если речь идет о банальных ползунках, рейтингах со звездочками и прочих шкалах, то нужно помнить о том, что человеку трудно различать 10, 20 или 100 различных значений (100 вообще за гранью добра и зла), чем меньше делений, тем лучше. Дайте ему 5 звездочек, делите час максимум на 10 минутные интервалы (лучше 15, 20 или 30), покажите ему 4−5 оттенков одного цвета, а не всю палитру целиком. В игрушках нет смысла делить шкалу жизней или прогресса более чем на 10 частей, лучше ограничьтесь 5−6».
https://outofline.ru/a900c6937d13
Сьюзан Уэйншенк в своей книге рассказала об исследовании Алан Бэддли:
«В 1994 году физиолог Алан Бэддли обнаружил, что работы, описывающей действительное исследование, не существовало; опубликован был только доклад Миллера на конференции. И в основном он касался предположений Миллера о том, что, возможно, существует некий предел для количества информации, которое человек может обрабатывать одновременно.
Бэддли провел серию экспериментов, касающихся процессов в человеческой памяти и обработки информации. Другие исследователи, в том числе Нельсон Кован, пошли по его стопам и показали, что «магическим» числом является 4».
Medium
Важнейшее правило UX дизайна, которое все нарушают
…в продуктовом дизайне, да и вообще в жизни.
Йохан Кундерс написал об адаптации пользователя и покупателя.
Пользователи — не покупатели. Ситуации пользователя и покупателя в корне отличаются. У них разная мотивация, разные возможности, они по-разному оценивают продукт и вкладываются в него, поэтому их адаптация должна отличаться.
Обычно адаптация пользователей есть только на начальном этапе, после чего они застревают на уровне «Я компетентен» и перестают исследовать продукт (особенно, если он сложный). Продукт не так сильно интегрирован в жизнь пользователя, и со временем пользователь может отказаться от его использования.
Рекомендации по адаптации на начальном этапе:
— Создайте ожидание. Упомяните функции продукта, предложите узнать, как другие люди его используют;
— Не бросайте пользователя после окончания онбординга. Предложите сделать следующий шаг;
— Создайте словарь продукта. Например, IFTTT вводит понятие «рецепта» — настроенной связи между сервисами.
Цель адаптации — наступление ага-момента. Это момент, в который пользователи осознают, что продукт может сделать для них, и у них возникает желание использовать его снова. Маркетинг даёт обещания, адаптация пользователя предоставляет доказательства.
Для этого надо:
— Определить, что в продукте наиболее ценно;
— Сделать так, чтобы первое взаимодействие было связано с целями пользователя или задачами, выполнение которых он ждёт от продукта;
— Убрать из адаптации всё, что мешает быстро добраться до ага-момента.
Чем лучше обозначена проблема, тем легче достигнуть ага-момента. Найти ага-момент в функциях можно быстрее, чем в продукте в целом.
Новые пользователи — это всегда вопросы. Они пытаются оценить полезность продукта в долгосрочной перспективе и сравнивают ваше решение с аналогами.
Покупатели уже некоторое время пользуются вашим приложением. Вместо вопросов появились ответы и более сложные вопросы, вместо сомнений — мотивация, вместо старого решения проблемы — ваше решение.
Поэтому отдельным функциям не нужен целый процесс, чтобы достичь ага-момента. Бывает достаточно письма о новых возможностях и подсказок в приложении.
https://vc.ru/design/44888-prevratit-polzovatelya-v-pokupatelya
Пользователи — не покупатели. Ситуации пользователя и покупателя в корне отличаются. У них разная мотивация, разные возможности, они по-разному оценивают продукт и вкладываются в него, поэтому их адаптация должна отличаться.
Обычно адаптация пользователей есть только на начальном этапе, после чего они застревают на уровне «Я компетентен» и перестают исследовать продукт (особенно, если он сложный). Продукт не так сильно интегрирован в жизнь пользователя, и со временем пользователь может отказаться от его использования.
Рекомендации по адаптации на начальном этапе:
— Создайте ожидание. Упомяните функции продукта, предложите узнать, как другие люди его используют;
— Не бросайте пользователя после окончания онбординга. Предложите сделать следующий шаг;
— Создайте словарь продукта. Например, IFTTT вводит понятие «рецепта» — настроенной связи между сервисами.
Цель адаптации — наступление ага-момента. Это момент, в который пользователи осознают, что продукт может сделать для них, и у них возникает желание использовать его снова. Маркетинг даёт обещания, адаптация пользователя предоставляет доказательства.
Для этого надо:
— Определить, что в продукте наиболее ценно;
— Сделать так, чтобы первое взаимодействие было связано с целями пользователя или задачами, выполнение которых он ждёт от продукта;
— Убрать из адаптации всё, что мешает быстро добраться до ага-момента.
Чем лучше обозначена проблема, тем легче достигнуть ага-момента. Найти ага-момент в функциях можно быстрее, чем в продукте в целом.
Новые пользователи — это всегда вопросы. Они пытаются оценить полезность продукта в долгосрочной перспективе и сравнивают ваше решение с аналогами.
Покупатели уже некоторое время пользуются вашим приложением. Вместо вопросов появились ответы и более сложные вопросы, вместо сомнений — мотивация, вместо старого решения проблемы — ваше решение.
Поэтому отдельным функциям не нужен целый процесс, чтобы достичь ага-момента. Бывает достаточно письма о новых возможностях и подсказок в приложении.
https://vc.ru/design/44888-prevratit-polzovatelya-v-pokupatelya
vc.ru
Превратить пользователя в покупателя — Дизайн на vc.ru
Перевод статьи автора Chargebee Йохана Кундерса о том, чем отличаются адаптация пользователя и покупателя, как избежать «зыбучих песков» продукта и привести пользователя к aha-моменту.
Ралука Будиу из Nielsen Norman Group написала про карусели на смартфонах.
Большинство останавливается после просмотра 3−4 слайдов.
Стремитесь наиболее интересные слайды расположить в начале. Пользователь быстрее найдёт то, что ему нужно. Интересные слайды также могут вовлечь его в более длительное взаимодействие с каруселью.
На смартфоне анимированные карусели не так заметны — смена слайдов может произойти уже тогда, когда пользователь прокрутил страницу вниз. Обозначить карусель можно так (способы можно сочетать):
— Точки: слабый сигнал, так как они обычно довольно мелкие;
— Стрелки: могут недостаточно хорошо контрастировать с некоторыми слайдами;
— Отображение части следующего слайда: сильный сигнал.
Слайды карусели должны быть связаны друг с другом, чтобы оправдывалось ожидание пользователя, сформированное первым слайдом.
Контент важных слайдов должен быть доступен каким-нибудь альтернативным способом.
Убедитесь, что карусель на смартфоне поддерживает свайп. Но есть нюансы: в мобильном Safari свайп вправо от границы экрана — аналог кнопки «Назад». Частично проблему решают отступы от карусели до границ экрана.
https://ux.pub/o-dizajne-karuselej-carousel-na-mobilnyx-ustrojstvax/
Большинство останавливается после просмотра 3−4 слайдов.
Стремитесь наиболее интересные слайды расположить в начале. Пользователь быстрее найдёт то, что ему нужно. Интересные слайды также могут вовлечь его в более длительное взаимодействие с каруселью.
На смартфоне анимированные карусели не так заметны — смена слайдов может произойти уже тогда, когда пользователь прокрутил страницу вниз. Обозначить карусель можно так (способы можно сочетать):
— Точки: слабый сигнал, так как они обычно довольно мелкие;
— Стрелки: могут недостаточно хорошо контрастировать с некоторыми слайдами;
— Отображение части следующего слайда: сильный сигнал.
Слайды карусели должны быть связаны друг с другом, чтобы оправдывалось ожидание пользователя, сформированное первым слайдом.
Контент важных слайдов должен быть доступен каким-нибудь альтернативным способом.
Убедитесь, что карусель на смартфоне поддерживает свайп. Но есть нюансы: в мобильном Safari свайп вправо от границы экрана — аналог кнопки «Назад». Частично проблему решают отступы от карусели до границ экрана.
https://ux.pub/o-dizajne-karuselej-carousel-na-mobilnyx-ustrojstvax/
UXPUB 🇺🇦 Дизайн-спільнота
О дизайне каруселей (carousel) на мобильных устройствах
Карусели на сенсорных экранах страдают от плохой видимости и последовательного доступа, и не все проекты используют жест свайпа, как элемент управления карусели.
Гаврил Перов поделился советами для дизайнеров на фрилансе (in English).
Как найти клиентов:
— Создайте профиль на Бихансе. Клиенты находятся там быстрее, чем на Дрибле;
— Публикуйте в соцсетях ссылки на свои кейсы;
— Присоединитесь к группам в Фейсбуке, где клиенты ищут дизайнеров;
— Напишите в агентства с близким уровнем работ и похожим рабочим процессом;
— Удалите из портфолио проекты, которые вам не нравятся;
— Если у вас много друзей и подписчиков, напишите о завершённом проекте и готовности к новым задачам;
— Заводите знакомства с людьми и делайте свою работу хорошо.
Как оценивать задачи:
— Продавайте проекты, а не затраченные часы;
— Узнавайте о бизнесе клиента и ЛПР как можно больше до начала работ. Если с ними нельзя найти общий язык, это лучше понять в самом начале;
— Оценивайте количество страниц и сложность каждой, сколько часов займёт её создание;
— Добавляйте 30−50% к получившейся оценке на факапы и работу с комментариями;
— Делите проект на этапы. Например, 1) главная страница, 2) внутренние, 3) мобильная и планшетная версия, 4) стайлгайд;
— Рекомендую договариваться о 50% предоплате и 50% постоплате каждого этапа;
— Список страниц можно показывать клиенту, чтобы обосновать стоимость. Возможно, он захочет удалить какие-то страницы и упростить функции.
Как показывать результаты:
— Если клиент видит работу в первый раз, вы должны её презентовать;
— В презентацию стоит включить информацию, которую вы обсуждали ранее: мудборды, варианты визуального стиля, предыдущие версии макетов;
— Во время презентации следует говорить о клиентских целях, как ваш дизайн поможет достичь их, что вы обсуждали с клиентом ранее, о референсах и популярных примерах;
— Презентацию можно записать на видео, чтобы отправить членам команды, которые не смогли присутствовать;
— Создайте шаблоны презентации, чтобы для следующего клиента достаточно было изменить цвета, шрифт и логотип. Достаточно 2 компоновок: 1) мокап с макбуком или айфоном, 2) часть полноразмерного макета и рядом вся страница целиком.
Как работать эффективно (максимально субъективные рекомендации):
— Сначала покажите 2 мудборда, чтобы клиент выбрал максимально подходящий;
— Затем покажите 1,5 экрана десктопа или 2−3 экрана смартфона, на которых будет видно, как раскрывается выбранный клиентом визуальный стиль. Важно объяснить, что на этом этапе клиент должен принять (или не принять) предлагаемый стиль, что позволит избежать обсуждения типографики, цветов и кнопок на следующих итерациях, когда экранов будет уже много;
— Если надо, делайте прототипы;
— Если вы на 100% уверены, что на итерацию надо 2 дня, закладывайте 3−4;
— Клиентские комментарии и правки следует обсуждать. 70% из них — мнение, которое можно изменить. Пробуйте вместе проговаривать решение, которое получится после отработки конкретного комментария;
— Будьте на связи, чтобы клиент всегда знал, что происходит с проектом.
https://medium.com/@gavrilperov/cde562c0cf24
Как найти клиентов:
— Создайте профиль на Бихансе. Клиенты находятся там быстрее, чем на Дрибле;
— Публикуйте в соцсетях ссылки на свои кейсы;
— Присоединитесь к группам в Фейсбуке, где клиенты ищут дизайнеров;
— Напишите в агентства с близким уровнем работ и похожим рабочим процессом;
— Удалите из портфолио проекты, которые вам не нравятся;
— Если у вас много друзей и подписчиков, напишите о завершённом проекте и готовности к новым задачам;
— Заводите знакомства с людьми и делайте свою работу хорошо.
Как оценивать задачи:
— Продавайте проекты, а не затраченные часы;
— Узнавайте о бизнесе клиента и ЛПР как можно больше до начала работ. Если с ними нельзя найти общий язык, это лучше понять в самом начале;
— Оценивайте количество страниц и сложность каждой, сколько часов займёт её создание;
— Добавляйте 30−50% к получившейся оценке на факапы и работу с комментариями;
— Делите проект на этапы. Например, 1) главная страница, 2) внутренние, 3) мобильная и планшетная версия, 4) стайлгайд;
— Рекомендую договариваться о 50% предоплате и 50% постоплате каждого этапа;
— Список страниц можно показывать клиенту, чтобы обосновать стоимость. Возможно, он захочет удалить какие-то страницы и упростить функции.
Как показывать результаты:
— Если клиент видит работу в первый раз, вы должны её презентовать;
— В презентацию стоит включить информацию, которую вы обсуждали ранее: мудборды, варианты визуального стиля, предыдущие версии макетов;
— Во время презентации следует говорить о клиентских целях, как ваш дизайн поможет достичь их, что вы обсуждали с клиентом ранее, о референсах и популярных примерах;
— Презентацию можно записать на видео, чтобы отправить членам команды, которые не смогли присутствовать;
— Создайте шаблоны презентации, чтобы для следующего клиента достаточно было изменить цвета, шрифт и логотип. Достаточно 2 компоновок: 1) мокап с макбуком или айфоном, 2) часть полноразмерного макета и рядом вся страница целиком.
Как работать эффективно (максимально субъективные рекомендации):
— Сначала покажите 2 мудборда, чтобы клиент выбрал максимально подходящий;
— Затем покажите 1,5 экрана десктопа или 2−3 экрана смартфона, на которых будет видно, как раскрывается выбранный клиентом визуальный стиль. Важно объяснить, что на этом этапе клиент должен принять (или не принять) предлагаемый стиль, что позволит избежать обсуждения типографики, цветов и кнопок на следующих итерациях, когда экранов будет уже много;
— Если надо, делайте прототипы;
— Если вы на 100% уверены, что на итерацию надо 2 дня, закладывайте 3−4;
— Клиентские комментарии и правки следует обсуждать. 70% из них — мнение, которое можно изменить. Пробуйте вместе проговаривать решение, которое получится после отработки конкретного комментария;
— Будьте на связи, чтобы клиент всегда знал, что происходит с проектом.
https://medium.com/@gavrilperov/cde562c0cf24
👍1
Дмитрий Ваницкий написал о профессиональном выживании дизайнера: как не сдохнуть под напором обстоятельств и не прикончить в себе маленького человечка, желающего делать мир лучше.
Если вы ещё не начали:
— Многие считают, что курсов и базовых навыков достаточно. Готовьтесь отработать свои 10 тысяч часов, полных боли, критики, коммуникации с суровыми заказчиками и коллегами.
— Не стоит заниматься дизайном ради денег (внешняя мотивация). Если вас не прёт от выравнивания базовых линий, балансировки иконок и сессий интервью (внутренняя мотивация), вас ждёт долгая и мучительная профессиональная смерть.
Если вы начали:
— Не существует «серебряной пули», набора правил, которых надо придерживаться, чтобы получать хороший результат. Придётся постоянно практиковаться, ошибаться и учиться. Крадите как художники: берите чужие идеи и видоизменяйте их, чтобы они лучше подошли под ваш контекст. Соглашайтесь на разные задачи, даже если вы ничего подобного раньше не делали, и потом шерстите литературу и трясите экспертов.
— Не принимайте на веру слова экспертов. Проверяйте каждый факт, знание и утверждение. Если есть хоть какие-то сомнения — разбирайтесь.
Если вы юный дизайнер:
— Если считаете, что вы всё освоили, значит вы остановились в развитии.
— Учитесь работать с критикой. Фильтруйте необоснованную, если критикующий ничего не предлагает, если критика вызвана ленью (когда разработчик заворачивает ваше решение, потому что его сложно реализовать). Критика вашего решения — не критика вас как специалиста. Будьте готовы к тому, что своим самым жёстким критиком будете вы сами.
— Учитесь коммуницировать, а именно: слушать людей и продавать свои решения.
Если вы зрелый дизайнер:
— Вы многое знаете и умеете, и чтобы рост был таким же интенсивным, как раньше, вы берёте на себя больше. Следствие: потеря качества, постоянный стресс от дедлайнов и выгорание. Научитесь говорить «нет», расставляйте приоритеты, делайте одно дело за раз и не более 2 проектов одновременно, делегируйте.
«Начинайте делегировать что-то малое и неинтересное. Почему неинтересное? Что для одного — скукота, для другого — очень интересно и весело. Вы разгружаете себя, а кто-то получает бесценный опыт».
— Часть вашей работы будет бессмысленной (проекты «в стол»). Подождите, возможно, для проекта ещё не настало благоприятное время. Проверяйте идеи как можно раньше. Ищите смысл сами. Шоты на Дрибле помогают скрасить бытие и получить дозу социального одобрения.
— Определите предел знаний, которые вам даст текущая работа, чтобы понять, когда уходить. Засидевшись в комфортном гнезде, вы станете не нужны рынку, за ваши знания будет готова платить только компания, в которой вы сейчас работаете. Выходите из этого гнезда, изучайте смежные области, меняйте окружение.
https://designpub.ru/designers-survival-guide-3a9625f166de
Если вы ещё не начали:
— Многие считают, что курсов и базовых навыков достаточно. Готовьтесь отработать свои 10 тысяч часов, полных боли, критики, коммуникации с суровыми заказчиками и коллегами.
— Не стоит заниматься дизайном ради денег (внешняя мотивация). Если вас не прёт от выравнивания базовых линий, балансировки иконок и сессий интервью (внутренняя мотивация), вас ждёт долгая и мучительная профессиональная смерть.
Если вы начали:
— Не существует «серебряной пули», набора правил, которых надо придерживаться, чтобы получать хороший результат. Придётся постоянно практиковаться, ошибаться и учиться. Крадите как художники: берите чужие идеи и видоизменяйте их, чтобы они лучше подошли под ваш контекст. Соглашайтесь на разные задачи, даже если вы ничего подобного раньше не делали, и потом шерстите литературу и трясите экспертов.
— Не принимайте на веру слова экспертов. Проверяйте каждый факт, знание и утверждение. Если есть хоть какие-то сомнения — разбирайтесь.
Если вы юный дизайнер:
— Если считаете, что вы всё освоили, значит вы остановились в развитии.
— Учитесь работать с критикой. Фильтруйте необоснованную, если критикующий ничего не предлагает, если критика вызвана ленью (когда разработчик заворачивает ваше решение, потому что его сложно реализовать). Критика вашего решения — не критика вас как специалиста. Будьте готовы к тому, что своим самым жёстким критиком будете вы сами.
— Учитесь коммуницировать, а именно: слушать людей и продавать свои решения.
Если вы зрелый дизайнер:
— Вы многое знаете и умеете, и чтобы рост был таким же интенсивным, как раньше, вы берёте на себя больше. Следствие: потеря качества, постоянный стресс от дедлайнов и выгорание. Научитесь говорить «нет», расставляйте приоритеты, делайте одно дело за раз и не более 2 проектов одновременно, делегируйте.
«Начинайте делегировать что-то малое и неинтересное. Почему неинтересное? Что для одного — скукота, для другого — очень интересно и весело. Вы разгружаете себя, а кто-то получает бесценный опыт».
— Часть вашей работы будет бессмысленной (проекты «в стол»). Подождите, возможно, для проекта ещё не настало благоприятное время. Проверяйте идеи как можно раньше. Ищите смысл сами. Шоты на Дрибле помогают скрасить бытие и получить дозу социального одобрения.
— Определите предел знаний, которые вам даст текущая работа, чтобы понять, когда уходить. Засидевшись в комфортном гнезде, вы станете не нужны рынку, за ваши знания будет готова платить только компания, в которой вы сейчас работаете. Выходите из этого гнезда, изучайте смежные области, меняйте окружение.
https://designpub.ru/designers-survival-guide-3a9625f166de
Medium
Designer’s Survival Guide
Доброго вечера, дорогие читатели. Тема этой статьи может показаться довольно резкой, но смею вас заверить, всё будет в рамках дозволенного…
История Уральского филиала ВНИИТЭ, занимавшего первые места на всесоюзных выставках: как всё начиналось в 1960-е годы и развалилось в 1990-е. Интересно посмотреть на образцы их дизайна. И понять, почему в Советском союзе дизайн товаров народного потребления был так себе.
«Мы занимались тяжёлым железом и изыскивали малейшие способы сделать его эстетичнее. Взяли практически не переделанный судовой редуктор. Он был серого цвета, очень корявый с металлическим шильдиком, на котором специальными штампами были выбиты буквы о том, что это такое.
На опытном производстве по чертежам завода сделали редуктор из оргстекла очень классно и ровно, покрасили в небесно-голубой цвет и налепили замечательный красивый шильдик с маркой нашей дизайн-программы, завода и так далее.
Макет произвёл на заводе фурор. С тех пор они красят свои редукторы в голубой цвет. Это действительно был для них шок, что просто аккуратное цветовое решение может настолько повысить товарный вид продукции».
https://www.youtube.com/watch?v=vF6gjli0FWw
«Мы занимались тяжёлым железом и изыскивали малейшие способы сделать его эстетичнее. Взяли практически не переделанный судовой редуктор. Он был серого цвета, очень корявый с металлическим шильдиком, на котором специальными штампами были выбиты буквы о том, что это такое.
На опытном производстве по чертежам завода сделали редуктор из оргстекла очень классно и ровно, покрасили в небесно-голубой цвет и налепили замечательный красивый шильдик с маркой нашей дизайн-программы, завода и так далее.
Макет произвёл на заводе фурор. С тех пор они красят свои редукторы в голубой цвет. Это действительно был для них шок, что просто аккуратное цветовое решение может настолько повысить товарный вид продукции».
https://www.youtube.com/watch?v=vF6gjli0FWw
YouTube
«Техническая эстетика» Документальный фильм об Уральской школе дизайна
Документальный фильм «Техническая эстетика» знакомит зрителя с поколением дизайнеров, о котором практически ничего не известно, но проекты которых десятилетиями формировали материальную культуру нашей страны.
Название неслучайно – именно так назывался ежемесячный…
Название неслучайно – именно так назывался ежемесячный…
Михаил Озорнин поделился гайдлайном, как делать подписи для таймсерий — графиков, где что-то зависит от времени.
Повышение информативности:
— Дублировать одно и то же — плохо. Не надо писать отметки 01.01.2015, 01.02.2015, 01.03.2015.
— Для дат лучше всего использовать формат 1 мая, 2 июня, 13 ноя. Месяцы сокращаются до 3 букв без точки (кроме июня и июля), ведущий ноль у числа не пишется.
— Если год на отметках повторяется, лучше подписать его только у 1-й отметки этого года. Год стоит продублировать у крайних отметок.
— Секунды у времени не пишутся, если не сказано обратного. Любое время, кроме полуночи лучше писать без ведущих нулей (6:25, но 00:00).
Улучшение оформления:
— Если отметок много и текст подписи переносится на 2 строки, лучше уменьшить количество отметок, чтобы текст не переносился.
— Текст подписи выравнивается по центру, сама подпись — по пеньку.
— Между отметками должен быть минимальный отступ в 16 px, если отступ будет меньше, то отметки слипнутся.
#time
Повышение информативности:
— Дублировать одно и то же — плохо. Не надо писать отметки 01.01.2015, 01.02.2015, 01.03.2015.
— Для дат лучше всего использовать формат 1 мая, 2 июня, 13 ноя. Месяцы сокращаются до 3 букв без точки (кроме июня и июля), ведущий ноль у числа не пишется.
— Если год на отметках повторяется, лучше подписать его только у 1-й отметки этого года. Год стоит продублировать у крайних отметок.
— Секунды у времени не пишутся, если не сказано обратного. Любое время, кроме полуночи лучше писать без ведущих нулей (6:25, но 00:00).
Улучшение оформления:
— Если отметок много и текст подписи переносится на 2 строки, лучше уменьшить количество отметок, чтобы текст не переносился.
— Текст подписи выравнивается по центру, сама подпись — по пеньку.
— Между отметками должен быть минимальный отступ в 16 px, если отступ будет меньше, то отметки слипнутся.
#time
mikeozornin.ru
Как делать подписи для таймсерий
Таймсерии — графики, где что-то зависит от времени обычно. В посте я расскажу, как делать на них подписи
Новые выпуски передачи Walking head: с основателем «Проектората» Егором Камелевым и проектировщиком из Redmadrobot и членом «Гильдии вольных проектировщиков» Евгением Игнашовым.
Егор Камелев
4.1. youtube.com/watch?v=3WBMr1E46Vs
— Как стал работать проектировщиком;
— Как перешёл на фриланс;
— Зачем основал «Проекторат»;
— Чем «Проекторат» является сейчас;
— О передаче накопленного опыта и знаний;
— Об изменении мировоззрения.
4.2. youtube.com/watch?v=hqwNDftdv2c
— Куда может развиваться проектировщик-фрилансер: проектирование в чужой компании, создание собственной, смена вида деятельности;
— Об опыте формирования своей команды, почему отказался от такой конфигурации;
— Почему свой продукт лучше своего агентства.
4.3. youtube.com/watch?v=AbFLHSDc9Yc
— Почему советы начинающим давать отчасти бессмысленно;
— О том, что зарабатывать больше, — некорректная цель;
— О целеполагании: выборе направления для развития, обучении на клиентских проектах;
— О навыках, которые нужны, чтобы хорошо зарабатывать в любом деле;
— Как учиться проектированию (исключительно практика), как обеспечить себе хороший старт;
— Как устроиться на работу;
— Помогут ли курсы по дизайну и проектированию найти работу.
Евгений Игнашов
5.1. youtube.com/watch?v=GusCmUn5O4c
— Реально ли зарабатывать проектированием, вообще не занимаясь дизайном UI;
— Как находить клиентов (напрямую и через студии);
— Как пришёл к профессии проектировщика, а затем UX / UI-дизайнера, как стал арт-директором в красноярской студии «Чипса»;
— О комплексном предложении услуг проектировщика: проектирование, дизайн, написание ТЗ, авторский надзор;
— О типах проектов и ценах.
5.2. youtube.com/watch?v=r8uM-r1WIj0
— О взаимодействии проектировщика с аналитиком;
— Проектной работе в Redmadrobot;
— Жизни на корпоративной квартире роботов;
— Нюансах оформления отношений с заказчиками.
5.3. youtube.com/watch?v=9p1wIv8hUss
— Что лучше, быть UX / UI-дизайнером или специализироваться;
— Про отличия продуктового менеджера от продуктового дизайнера;
— Про взаимодействие с ПО (product owner);
— Про А/Б-тесты как способ договориться.
5.4. youtube.com/watch?v=pYLv_cGZO_I
— Про фишки при продаже услуг проектировщика;
— На что обратить внимание и чему учиться, чтобы быстрее стать продуктовым дизайнером;
— Как понравиться клиенту за счёт грамотного подхода к проектированию;
— Стоить ли отказываться от Акшуры и переходить на Скетч и Фигму.
Егор Камелев
4.1. youtube.com/watch?v=3WBMr1E46Vs
— Как стал работать проектировщиком;
— Как перешёл на фриланс;
— Зачем основал «Проекторат»;
— Чем «Проекторат» является сейчас;
— О передаче накопленного опыта и знаний;
— Об изменении мировоззрения.
4.2. youtube.com/watch?v=hqwNDftdv2c
— Куда может развиваться проектировщик-фрилансер: проектирование в чужой компании, создание собственной, смена вида деятельности;
— Об опыте формирования своей команды, почему отказался от такой конфигурации;
— Почему свой продукт лучше своего агентства.
4.3. youtube.com/watch?v=AbFLHSDc9Yc
— Почему советы начинающим давать отчасти бессмысленно;
— О том, что зарабатывать больше, — некорректная цель;
— О целеполагании: выборе направления для развития, обучении на клиентских проектах;
— О навыках, которые нужны, чтобы хорошо зарабатывать в любом деле;
— Как учиться проектированию (исключительно практика), как обеспечить себе хороший старт;
— Как устроиться на работу;
— Помогут ли курсы по дизайну и проектированию найти работу.
Евгений Игнашов
5.1. youtube.com/watch?v=GusCmUn5O4c
— Реально ли зарабатывать проектированием, вообще не занимаясь дизайном UI;
— Как находить клиентов (напрямую и через студии);
— Как пришёл к профессии проектировщика, а затем UX / UI-дизайнера, как стал арт-директором в красноярской студии «Чипса»;
— О комплексном предложении услуг проектировщика: проектирование, дизайн, написание ТЗ, авторский надзор;
— О типах проектов и ценах.
5.2. youtube.com/watch?v=r8uM-r1WIj0
— О взаимодействии проектировщика с аналитиком;
— Проектной работе в Redmadrobot;
— Жизни на корпоративной квартире роботов;
— Нюансах оформления отношений с заказчиками.
5.3. youtube.com/watch?v=9p1wIv8hUss
— Что лучше, быть UX / UI-дизайнером или специализироваться;
— Про отличия продуктового менеджера от продуктового дизайнера;
— Про взаимодействие с ПО (product owner);
— Про А/Б-тесты как способ договориться.
5.4. youtube.com/watch?v=pYLv_cGZO_I
— Про фишки при продаже услуг проектировщика;
— На что обратить внимание и чему учиться, чтобы быстрее стать продуктовым дизайнером;
— Как понравиться клиенту за счёт грамотного подхода к проектированию;
— Стоить ли отказываться от Акшуры и переходить на Скетч и Фигму.
YouTube
Walking head #4.1: Егор Камелев, Проекторат
Основатель «Проектората» Егор Камелев рассказывает:
— Как стал работать проектировщиком;
— Как перешёл на фриланс;
— Зачем основал «Проекторат»;
— Чем «Проекторат» является сейчас;
— О передаче накопленного опыта и знаний;
— Об изменении мировоззрения.
В…
— Как стал работать проектировщиком;
— Как перешёл на фриланс;
— Зачем основал «Проекторат»;
— Чем «Проекторат» является сейчас;
— О передаче накопленного опыта и знаний;
— Об изменении мировоззрения.
В…
Эрик Бэйли написал, почему не стоит использовать плейсхолдеры.
Если опустить технические проблемы браузеров и особенности режима высокой контрастности, остаются аргументы:
— После того, как пользователь начал ввод текста, плейсхолдер пропадает. Если там была подсказка о формате ввода, она потеряется. Придётся вспоминать подсказку или удалять введённый текст;
— Из-за плейсхолдера неопытные пользователи могут решить, что поле заполнено;
— Длина плейсхолдера ограничена длиной текстового поля. Формат — только текст. Иногда этого мало, чтобы донести послание.
— Плейсхолдер менее контрастен в сравнении с пользовательским текстом, и его труднее читать. Если делать его темнее, пользователи будут путать плейсхолдер и свой текст.
Эрик предлагает размещать текст плейсхолдера между подписью к полю и самим полем. Такое решение:
— Связывает визуальную и структурную иерархию: сначала указано, для чего нужно поле ввода, потом данные, которые нужно знать, чтобы его правильно заполнить, и в конце сама пустая графа;
— Будет переведено вместе со всей страницей;
— Не воспринимается как заранее введённые данные;
— Легко разобрать даже в условиях плохой видимости;
— Не исчезнет, как только пользователь начнёт заполнять графу;
— Может включать в себя семантические теги и быть стилизовано с помощью CSS.
https://vc.ru/design/46752-nuzhen-li-saytu-vspomogatelnyy-tekst-v-polyah-vvoda
Если опустить технические проблемы браузеров и особенности режима высокой контрастности, остаются аргументы:
— После того, как пользователь начал ввод текста, плейсхолдер пропадает. Если там была подсказка о формате ввода, она потеряется. Придётся вспоминать подсказку или удалять введённый текст;
— Из-за плейсхолдера неопытные пользователи могут решить, что поле заполнено;
— Длина плейсхолдера ограничена длиной текстового поля. Формат — только текст. Иногда этого мало, чтобы донести послание.
— Плейсхолдер менее контрастен в сравнении с пользовательским текстом, и его труднее читать. Если делать его темнее, пользователи будут путать плейсхолдер и свой текст.
Эрик предлагает размещать текст плейсхолдера между подписью к полю и самим полем. Такое решение:
— Связывает визуальную и структурную иерархию: сначала указано, для чего нужно поле ввода, потом данные, которые нужно знать, чтобы его правильно заполнить, и в конце сама пустая графа;
— Будет переведено вместе со всей страницей;
— Не воспринимается как заранее введённые данные;
— Легко разобрать даже в условиях плохой видимости;
— Не исчезнет, как только пользователь начнёт заполнять графу;
— Может включать в себя семантические теги и быть стилизовано с помощью CSS.
https://vc.ru/design/46752-nuzhen-li-saytu-vspomogatelnyy-tekst-v-polyah-vvoda
vc.ru
Нужен ли сайту вспомогательный текст в полях ввода — Дизайн на vc.ru
Конспект материала дизайнера Эрика Бэйли о том, почему плейсхолдеры ухудшают пользовательский опыт.
❤1👍1🔥1
Евгений Лазаренко написал о показателях, с помощью которых можно оценивать продуктовые решения.
1. Метрики вовлечения пользователей:
— Количество сеансов на пользователя (Sessions per user);
— Продолжительность сессии для когорты (Session duration for a cohort), с течением времени;
— Количество ключевых действий пользователя за сеанс (Key user actions per session). Таким действием может быть лайк.
2. Бизнес-метрики:
— Пожизненная ценность клиента (Customer Lifetime Value). LTV — чистая прибыль, которую вы получите от клиента, прежде чем он перестанет платить;
— Стоимость привлечения клиента (Customer acquisition cost). Для SaaS-стартапов отношение LTV и CAC должно быть 3 и выше;
— Какую сумму платит вам каждый месяц рядовой клиент (Average revenue per account);
— Ежемесячный повторяющийся доход (Monthly recurring revenue) — доход компании в месяц;
— Отток клиентов (Customer churn) — % от платящих пользователей, который вы теряете каждый месяц (по когортам и общий);
— Отток доходов (Revenue churn) — % дохода, который компания теряет в месяц из-за оттока или возвратов на прошлый тариф. Меньше обращайте внимания на Customer churn и больше следите за Revenue churn. У SaaS-стартапов Customer churn должен быть ниже 2%, а Revenue churn — отрицательным;
— Удержание клиентов (Retention rate).
3. Служба поддержки:
— Количество входящих тикетов. Если вы выпустили обновление, и количество тикетов подскочило, возможно что-то пошло не так;
— Индекс потребительской лояльности (Net promoter score) — готовность клиента рекомендовать ваш продукт. Не делайте высокий NPS самоцелью. Мета-анализ от Keiningham не нашёл подтверждений, что NPS отражает способность компании к росту. Лучше обратитесь к клиентам и соберите у них обратную связь.
https://ux-journal.ru/kak-vybrat-pravilnye-metriki-dlya-produkta.html
1. Метрики вовлечения пользователей:
— Количество сеансов на пользователя (Sessions per user);
— Продолжительность сессии для когорты (Session duration for a cohort), с течением времени;
— Количество ключевых действий пользователя за сеанс (Key user actions per session). Таким действием может быть лайк.
2. Бизнес-метрики:
— Пожизненная ценность клиента (Customer Lifetime Value). LTV — чистая прибыль, которую вы получите от клиента, прежде чем он перестанет платить;
— Стоимость привлечения клиента (Customer acquisition cost). Для SaaS-стартапов отношение LTV и CAC должно быть 3 и выше;
— Какую сумму платит вам каждый месяц рядовой клиент (Average revenue per account);
— Ежемесячный повторяющийся доход (Monthly recurring revenue) — доход компании в месяц;
— Отток клиентов (Customer churn) — % от платящих пользователей, который вы теряете каждый месяц (по когортам и общий);
— Отток доходов (Revenue churn) — % дохода, который компания теряет в месяц из-за оттока или возвратов на прошлый тариф. Меньше обращайте внимания на Customer churn и больше следите за Revenue churn. У SaaS-стартапов Customer churn должен быть ниже 2%, а Revenue churn — отрицательным;
— Удержание клиентов (Retention rate).
3. Служба поддержки:
— Количество входящих тикетов. Если вы выпустили обновление, и количество тикетов подскочило, возможно что-то пошло не так;
— Индекс потребительской лояльности (Net promoter score) — готовность клиента рекомендовать ваш продукт. Не делайте высокий NPS самоцелью. Мета-анализ от Keiningham не нашёл подтверждений, что NPS отражает способность компании к росту. Лучше обратитесь к клиентам и соберите у них обратную связь.
https://ux-journal.ru/kak-vybrat-pravilnye-metriki-dlya-produkta.html
Продуктовый дизайн (UX/UI), брендинг и аналитика
Как выбрать правильные метрики для продукта - Продуктовый дизайн (UX/UI), брендинг и аналитика
Список метрик сгруппированных по трем категориям: вовлечение пользователей, бизнес-показатели и сервис.
Егор Горохов написал, как дизайнеры студии Kelnik передают верстальщикам информацию о вертикальных отступах.
Отступы разделены по уровням. 1-й уровень — самый маленький отступ. Например, между заголовком h4 и параграфом или иллюстрацией и подписью. Отступ 2-го уровня отбивает два таких блока. И так далее.
Уровень блока показан цветом.
Дизайнер расставляет в макетах блоки отступов. Для них в Скетче подходят символы. Есть библиотека, в которой уже забит стандартный набор вертикальных отступов.
Расставить отступы по странице — дело не быстрое и муторное. Но преимущества такие:
— Макеты выглядят аккуратнее;
— Проще рисовать после перерыва;
— Новый дизайнер, которого подключают к проекту, рисует в той же системе координат, для фронтендеров не будет сюрприза;
— Поддержка проекта опирается на конкретные цифры при разработке.
По оценке фронтендеров, время на работу с отступами сокращается на 90%. Фронтендер тратит 5−10 минут на заведение настроек в SASS и больше не переживает об отступах. Ему не нужно ничего замерять линейками, он своими глазами видит (цветовое кодирование), какой отступ у блока.
https://designpub.ru/82cad46dd34f
Отступы разделены по уровням. 1-й уровень — самый маленький отступ. Например, между заголовком h4 и параграфом или иллюстрацией и подписью. Отступ 2-го уровня отбивает два таких блока. И так далее.
Уровень блока показан цветом.
Дизайнер расставляет в макетах блоки отступов. Для них в Скетче подходят символы. Есть библиотека, в которой уже забит стандартный набор вертикальных отступов.
Расставить отступы по странице — дело не быстрое и муторное. Но преимущества такие:
— Макеты выглядят аккуратнее;
— Проще рисовать после перерыва;
— Новый дизайнер, которого подключают к проекту, рисует в той же системе координат, для фронтендеров не будет сюрприза;
— Поддержка проекта опирается на конкретные цифры при разработке.
По оценке фронтендеров, время на работу с отступами сокращается на 90%. Фронтендер тратит 5−10 минут на заведение настроек в SASS и больше не переживает об отступах. Ему не нужно ничего замерять линейками, он своими глазами видит (цветовое кодирование), какой отступ у блока.
https://designpub.ru/82cad46dd34f
Medium
Отступы в дизайне: системный подход
Как контролировать отступы между блоками на большом проекте
❤1