Оди
36.4K subscribers
24.8K photos
1.11K videos
143 files
5.26K links
Журнал о дизайне и для дизайнеров. Вдохновение, обучение, инструменты.

Чат канала: @awdeechat

Сайт с полным архивом: https://awdee.ru

По рекламе: @kgreenmedia

Автор проекта: @kirillgreen
Download Telegram
Семь крутых сеток для веба: конспект лекции Сергея Гурова

Сергей более 15 лет занимается созданием интерфейсов. Он делал дизайн для многих крупных брендов, включая Сoca-Сola, Pepsi, Citroen, Intel, Балтика и Камаз. Сейчас он работает творческим руководителем Школы композиционного проектирования

У него есть лекция, в которой он разобрал 7+ вариантов сеток для интерфейсов и показал реальные примеры их применения

Мы подготовили конспект выступления с тезисами, объяснениями и скриншотами из презентации

🙂️️️️️️ awdee.ru/7-grids-for-interactive-format-lecture-notes-by-sergei-gurov

👨‍🎨 Презентация: figma.com/proto/YktKroZs0gvpZrRrNhHG1Q/7СЕТОК?page-id=110%3A65434&node-id=110-65769

📼 Лекция: youtube.com/watch?v=sJDDLLBf2lk

#awd_edu #awd_lecture #awd_synopsis
Please open Telegram to view this post
VIEW IN TELEGRAM
14 типов оптических иллюзий по Рудеру

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

🙂️️️️ awdee.ru/14-types-of-optical-illusions-according-to-ruder

#awd_edu #awd_typo
Please open Telegram to view this post
VIEW IN TELEGRAM
Термин: «Понимание задачи»

Сегодня в рубрике «Термины дизайна» мы расскажем о подходе, необходимом специалистам в любой сфере, — «Понимание задачи»

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

🙂 awdee.ru/term-understanding-the-task

#awd_article #awd_edu #awd_terms
Please open Telegram to view this post
VIEW IN TELEGRAM
Акциденция в типографике

Дизайнер Сергей Телидченко написал статью о приёмах акциденции, которые помогают вдохнуть в текст эмоции и показать характер контента

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

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

В конце статьи вы найдёте много дополнительных материалов по теме

tilda.education/articles-display-typefaces-in-graphic-and-web-design

#awd_article #awd_typo #awd_edu
Как начать читать научные исследования по дизайну и зачем они нужны

Лид DesignOps в Tinkoff Юля Кондратьева рассказала, зачем дизайнерам читать научные статьи и как правильно искать их в интернете

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

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

Чтение научных статей требует больше времени, чем поиск в Гугле, но окупается более подробными, точными данными и, часто, свежим взглядом на проблему

Статья полностью: habr.com/ru/articles/784526

📼️️️️️️На основе статьи есть видео: youtube.com/watch?v=hG4mR3r3fgI

#awd_article #awd_edu
Please open Telegram to view this post
VIEW IN TELEGRAM
Саммари: Мастер-класс Ильи Бирмана «Взгляд новичка» в интерфейсе

В ролике автор раскрывает суть принципа «Каждый экран имеет смысл», который сопровождает примерами хороших и плохих интерфейсов

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

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

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

ilyabirman.ru/meanwhile/all/newcomers-view-masterclass

#awd_edu #awd_ui
12 приёмов рисования хороших эскизов сайтов и интерфейсов

Тезисный пересказ статьи «Sharpen your sketching skills: 12 simple techniques to push your sketching skills to the next level».

1. Рисуйте уверенные, ровные линии. Можно сначала пару раз провести линию по воздуху, без нажима
2. Не бросайте линии, соблюдайте одинаковый нажим, чтобы линия имела равномерную толщину по всей длине
3. Оторвите запястье от листа, линии будут ровнее
4. Ведите линии к себе, а не от себя
5. Найдите оптимальную скорость рисования линий. При медленных движениях линии получаются волнистыми
6. Не рисуйте «волосатые» линии из нескольких штрихов. Старайтесь рисовать линии одним штрихом
7. Рисуйте прямоугольники в четыре штриха, а не в один
8. Не оставляйте в прямоугольниках разорванных углов
9. Аккуратно и плотно штрихуйте заглушки заголовков
10. Не углубляйтесь в детали, рисуйте только самое важное
11. Для тренировки рисуйте скетчи существующих сайтов и приложений
12. Держите в голове того, кому будете показывать эскизы. Рисуйте для конкретного человека и только то, что ему важно

Статья целиком на английском: creativebloq.com/how-to/sharpen-your-sketching-skills

#awd_note #awd_article #awd_edu
Лекции, интервью и обзоры на тему моушен-дизайна

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

🙂️ awdee.ru/lectures-interviews-and-reviews-motion-design

#awd_motion #awd_edu #awd_lecture
Please open Telegram to view this post
VIEW IN TELEGRAM
Сколько денег просить на собеседованиях

Основатель Карьерного Цеха Глеб Кудрявцев и владелица кадрового агентства Леся Набока обсуждают, как на собеседовании согласовать желаемый размер зарплаты и при этом не вызвать негативную реакцию работодателя

Спикеры подсвечивают вопрос обсуждения зарплаты и с позиции HR, и нанимающего менеджера, и кандидата

Короткая выжимка из выпуска:
— Заранее подготовьтесь к вопросам о желаемой зарплате, о размере зарплаты на прошлом месте работы, о том, проходите ли вы собеседования в других компаниях
— Чтобы оценить стоимость своего труда, рассчитайте собственный МРОТ (минимальный размер оплаты труда) и обязательно сопоставьте его с рынком. Мониторьте средние зарплаты по отрасли, узнайте, сколько просят ваши конкуренты, спросите в чатах про размер зарплат у коллег по цеху, обратитесь к карьерному консультанту
— Лучше сразу сказать о своих предварительных зарплатных ожиданиях и узнать размер зарплаты, который готова предложить компания. Это позволит не тратить время на общение, если ваши ожидания не совпадут с предложением работодателя
— Конкретный размер зарплаты и условия работы обговаривайте с HR-ом. С нанимающим менеджером и с командой обсуждайте ваши hard- и soft-скиллы, продукт, взаимодействие в команде, процессы, но только не деньги
— Важно обсудить: серая или белая зарплата, на руки или gross, распределение зарплаты на оклад и премию
— Уже после получения оффера торгуйтесь, чтобы получить более выгодные условия по будущей зарплате. Не бойтесь просить больше денег. Это навык и его нужно прокачивать

📼️️️️️️ youtube.com/watch?v=KWU0dIWlCiI

#awd_edu #awd_lecture #awd_career #awd_summary
Please open Telegram to view this post
VIEW IN TELEGRAM
Как разобраться в задаче — бесплатный мини-курс на Tilda Education

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

Длительность всего курса составляет чуть менее часа

tilda.education/task-understanding-course

#awd_edu
Архив журнала «Техническая Эстетика»

По ссылке представлены сканы выпусков легендарного советского издания о дизайне, датированные 1964–1992 годами

Также рекомендуем статью на «Шрифте» об истории ТЭ

#awd_retro #awd_edu #awd_archive
Нейроэстетика: мозг человека и восприятие искусства

Лекция профессора биологического факультета МГУ Вячеслава Дубынина на тему нейроэстетики

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

Конспект лекции от нейросети на пять минут: 300.ya.ru/v_PMQDDsBa

📼️️️️️️ Лекция целиком на два часа: youtube.com/watch?v=xcNHoxNRv-I

#awd_edu #awd_lecture
Please open Telegram to view this post
VIEW IN TELEGRAM
Как Женя Арутюнов писал книгу «Сложный дизайнер». Ролик о том, что происходило «за кадром»

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

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

Чтобы понять, о чём и для кого именно писать, Женя проводил бесплатные консультации с читателями своего телеграм-канала. Так ему удалось выяснить, с какими проблемами они сталкиваются и о чём писать, чтобы книга стала полезной и востребованной

А ещё в ролике Женя показал команду — тех людей, кто помогал ему написать книгу

📼️️️️️️ Посмотреть видеорассказ Жени: youtube.com/watch?v=1M79Q9t4CSU

Купить книгу: intuition.news/ru/book

#awd_book #awd_edu
Please open Telegram to view this post
VIEW IN TELEGRAM
Как сгенерировать нейронками набор 3D-иллюстраций в едином стиле: пошаговое руководство

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

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

Как всё это сделать, читайте в статье: dtf.ru/s/595875-neiroiskusstvo/2612396

#awd_edu #awd_3d #awd_neuralart #awd_midjourney #awd_techno
🇬🇧 Бесплатный 76-страничный гайд по промтам

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

Авторы собрали более 200 техник создания промтов и фреймворки, построенные на их основе. На практических примерах они показали, как работают промты и как по максимуму задействовать потенциал ИИ-моделей

arxiv.org/pdf/2406.06608

#awd_edu #awd_ml #awd_techno
🙂 Точные методы создания оптического баланса между фигурами

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

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

awdee.ru/formulas-for-optical-adjustments

#awd_edu #awd_article
Please open Telegram to view this post
VIEW IN TELEGRAM
Как работают оптические иллюзии

Рекомендуем посмотреть увлекательный получасовой ролик Дункана Кларка о механизмах, благодаря которым оптическим иллюзиям удаётся обманывать наше восприятие

📼 youtu.be/u5cfCUM9MZc

(на превью статичная картинка, а не гифка, как вам могло показаться)

#awd_dessert #awd_fun #awd_edu
Please open Telegram to view this post
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Creativity in the Age of AI

Шестиминутная короткометражка о креативности в эпоху искусственного интеллекта, роли человека в этом процессе и о том, какие возможности на самом деле открывает ИИ

Авторы объясняют, почему появление нейросетевых генераторов — не конец креативности, а её начало, и почему изобилие ИИ-контента рождает дефицит оригинальных идей

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

📼 youtu.be/y7g-nRooZr8

#awd_ml #awd_edu
Please open Telegram to view this post
VIEW IN TELEGRAM
Как рисовать эмоции

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

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

Коротко перечислим ключевые рекомендации из статьи:
— Выражение лица можно изменить с помощью размера зрачков и формы бровей
— Губы помогут придать новый оттенок выражению лица. Важно помнить, что рот может двигаться ассиметрично
— В анимации нос двигается синхронно с губами. Главные элементы, которые можно изменить, — кончик и ноздри
— Если лицо персонажа появляется в кадре не крупным планом, то передавайте эмоции персонажа через тело. В этом будут полезны позы и движения — танцы, сжатые кулаки, прыжки, испарина на лбу, гусиная кожа и многое другое
— Мультипликаторы используют в работе FACS — систему, которая связывает каждую эмоцию с тем, какие мышцы в теле за неё отвечают. Это огромная цифровая библиотека с описаниями, фото- и видеообразцами проявления чувств разных людей
— Программы, в которых можно смоделировать конкретную эмоцию или звук, издаваемый персонажем: Adobe Character Animator, Cartoon animation 4, CrazyTalk 8

Статья полностью: skvot.io/ru/blog/kak-risovat-emocii

#awd_article #awd_summary #awd_illustration #awd_edu
🙂 14 типов оптических иллюзий по Рудеру

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

awdee.ru/14-types-of-optical-illusions-according-to-ruder

#awd_edu #awd_typo
Please open Telegram to view this post
VIEW IN TELEGRAM