31241
Журнал о дизайне и для дизайнеров. Вдохновение, обучение, инструменты. Чат канала: @awdeechat Сайт: https://awdee.ru По рекламе: @design_manager_bot Автор проекта: @kirillgreen
Хороший UX и интерфейсы интересные 🌩
23 ноября проведут первый Alfa Design Meetup, где обсудят менеджмент в дизайне, межкомандное взаимодействие и автоматизацию, куда без неё.
Коллеги из Альфа-Банка и mos.ru поделятся, на что важно обращать внимание при вёрстке макетов, как с помощью AI-инструментов сделать работу более эффективной и куда расти, если вы уже senior 💻
Что ещё: расскажут о том, как сформулировать ценности продуктов с помощью ChatGPT, поэтому тем, кто занимается их развитием, тоже будет интересно.
⚡️Зарегистрироваться можно по ссылке.
Реклама. АО "АЛЬФА-БАНК" erid:2VtzqukCFHS
#цитата_дня
В дизайнерской среде мы любим говорить, что лучше один раз увидеть, чем сто раз услышать, но еще в миллион раз лучше иметь действующий прототип
Джон Эдсон, «Уроки дизайна от Apple»
Собрали крутейших профессионалов из дизайна (и не только!), чтобы закрыть год красиво и зарядиться новыми знакомствами на следующий!
Темы выступлений будут как о дизайне сегодня, так и о ключевых навыках, которые могут повлиять на развитие креативных специалистов. Спикеры поделятся своим опытом и знаниями. Ну и, конечно, можно будет с каждым познакомиться и задать вопросы.
Один день. Шесть спикеров. Сотня полезных знаний и невероятных знакомств.
Весь движ будет проходить 2 декабря на территории Красного Октября.
💛 А про промокоду AWDEE скидка 10%
Узнать о спикерах и забрать свой билет по ссылке: framecon.ru
Реклама ИП Чубуков Станислав Иванович, ИНН 422900418239, erid: 2SDnjd5SWdW
Динамическая айдентика технологического стартапа smlXL
Компания разрабатывает методики для создания новых типов цифровых продуктов для поиска, маршрутизации и работы с данными на блокчейне. Они также стремятся внедрить новую парадигму, в которой разработчики смогут делать более сложные приложения, но быстрее и дешевле
Ступенчатый размер букв в логотипе воплощает идею роста, которая лежит в основе стартапа
Специально созданный генератор кинетической типографики превращает видео и изображения в буквы. В итоге на выходе они напоминают сильно сжатые растровые изображения, раннюю графику видеоигр и шелкографические портреты Уорхола
Больше видео и картинок: awdee.ru/dynamic-identity-of-the-technology-startup-smlxl
#awd_identity via bpando.org/2023/10/12/generative-branding-tech-start-up-smlxl-by-dia
🙂️️️️️️ Шрифт в кинематографе
Александр Васин — графический дизайнер, преподаватель, основатель фестиваля типографики Typomania
В 25-минутной лекции автор разбирает особенности использования шрифтов на примере множества совершенно разных фильмов
Так в заставках кинокартин про Чарли Чаплина есть прямая отсылка к книжной типографике, для которой были характерны центральная выключка, антиквы и плотная вёрстка
В титрах фильмов 20-х годов дизайнеры использовали твёрдые, жирные гротески (Броненосец Потёмкин), палочные шрифты и странные антиква (Проститутка). В начале 30-х на титульных заставках размещали наивные рисованные гротески (Чапаев). Во второй половине 30-х дизайнеры перешли на антиквы и прописные буквы (Весёлые ребята)
В заставках советских фильмов, как правило, применяли центральную выключку, сочетание контрастных шрифтов и размашистые росчерки
Отдельного внимания заслуживают вступительные титры для фильмов Хичкока, которые делал знаменитый Сол Басс. В них дизайнер делил экран на части, совмещал типографику с рисунком, живой линией и анимацией, создавая в итоге типографические шедевры
Если обратить внимание на заставки фильмов Квентина Тарантино, то там преобладают оранжево-жёлто-красные заголовки с иллюзией объёма и стилизация под комиксы
А Ларс фон Триер в титрах и заставках своих картин применяет преимущественно рукописные буквы, чтобы добавить картине напряжение. Но есть серии фильмов, в которых он использует шрифты из книжного дизайна, а в других — трафаретную типографику
📼️️️️️️ Лекция полностью: youtu.be/AF2PZgUVqoY?si=etVYfOPG77TEJZMP
#awd_typo #awd_summary #awd_lecture
Kyugo — дизайн приложения для тайм-менеджмента
В приложении автор представил день не в виде скучных таблиц, а в формате кругового циферблата
Мы спросили у дизайнера приложения Тома Гарси, как ему пришла в голову такая идея
Он рассказал, что однажды решил привести в порядок собственную хаотичную жизнь и начать использовать приложение для планирования ежедневных задач. Том перепробовал множество сервисов, но все они оказались неудобными для него. Тогда он решил создать собственное приложение для тайм-менеджемента
В результате долгих поисков, исследований и экспериментов Том понял, что его мозг представляет дни в виде циферблатов. Тогда он начал расспрашивать других об их восприятии времени и обнаружил, что люди часто представляют день в форме круга. Так появилось приложение Kyugo
Когда пользователь заносит информацию о мероприятии и его продолжительности в приложение, оно автоматически добавляет контрастный сегмент внутрь круга. Таким образом при взгляде на циферблат, человек может сразу оценить степень загруженности его дня. К тому же нём можно одним нажатием вносить изменения в график
app.kyugo.app
Больше картинок: awdee.ru/kyugo-time-management-app-design
#awd_ui #awd_mobile
10 принципов Артёма Горбунова
Саммари выступления основателя Бюро Артёма Горбунова в Яндексе. В лекции он рассказал о принципах, которые помогают ему жить, работать и управлять
Коротко перескажем эти принципы:
1. Прямо сейчас. Если перед вами стоит сложная задача и вы не знаете, как к ней подступиться, задайте себе вопрос: Что мне мешает достичь цели прямо сейчас? При таком подходе вы начинаете думать о главной проблеме, которая мешает добиться результата
2. Не авось. Если сделать что-то на авось, есть два варианта развития событий. Старший товарищ заметит вашу ошибку и наругает вас. Или, что ещё хуже, вы сделаете проект, запустите его, он начнёт работать и что-то в нём пойдёт не так. Поэтому не полагайтесь на авось
3. Я виноват. Когда что-то идёт не так, хочется обвинять других. Но в этом случае вы перекладываете ответственность на обстоятельства. Если вы признаёте вину, то можете влиять на происходящее
4. Не ной. Нытьё дискредитирует вас в глазах окружающих, и они будут считать, что на вас нельзя положиться
5. Не бери деньги у мудаков. Деньги всегда связаны с доверием и создают ожидания. Поэтому не берите деньги у клиентов, которым вы не доверяете
6. Учись
7. Не ссы. Меняйте профессию, открывайте собственный бизнес и заводите детей даже тогда, когда кажется, что уже слишком поздно
8. Путешествуй
9. Помни. Человеческая память ограничена, поэтому чтобы сохранить воспоминания, используйте подручные приспособления. Например, ведите записи, сохраняйте важную переписку, переносите данные из старого компьютера на новый
10. Мечтай. Делите свои мечты с другими людьми: путешествуйте с ними, делайте совместные проекты. Тогда ваша мечта станет мечтой тех, с кем вы ею поделились
📼️️️️️️Лекция полностью: youtube.com/watch?v=ZMeWeU1Y6PI&t=2s
#awd_lecture #awd_summary
💚 11.11 у Журналуса
«Журналус» — медиа о дизайне, фильтрует инфошум, выбирая самое ценное, важное и полезное. Он помогает развиваться в профессии и быть в курсе трендов, но при этом не тратить часы на скроллинг лент.
А ещё подписчики могут:
— Собирать коллекцию избранных статей, проектов, инструментов и лекций;
— Тусить в ламповом закрытом телеграм-чате, где делятся портфолио, ищут проекты и сотрудников;
— Читать Журналус Daily — закрытый телеграм-канал ежедневного формата.
📖 По промо-коду AWDEE скидка 50 % на годовую и 30 % месячную подписки. Действует до 20.11.
https://zhurnalus.artlebedev.ru?erid=2SDnjcu1uep
Реклама ИП Олейниченко Кирилл Александрович, ИНН 781697320774, erid: 2SDnjcu1uep
📖 Бренд-дизайнер: как освоить профессию и достичь в ней высот — Журналус № 380
Мы продолжаем серию спецвыпусков «Как освоить профессию и достичь в ней высот». В новой части мы расскажем о профессии бренд-дизайнер
Содержание выпуска:
— Лучшие статьи и лекции по теме
— Большая подборка инструментов
— Образовательные материалы по основным инструментам
— Ресурсы для поиска мокапов, шрифтов, иллюстраций и других ассетов
— Примеры хорошего брендинга
Доступно в телеграм-боте и веб-версии, в Daily-формате, а ещё лежит в почтах у подписчиков
Реклама ИП Олейниченко, ИНН 781697320774, erid: Kra23gh5z
Тинькофф Журнал проводит исследование про зарплаты в дизайне. Так что если вы делаете логотипы, сайты и другие рекламные продукты — расскажите Т—Ж о своем опыте, а потом Журнал проанализирует, за какие навыки платят больше, где лучше условия работы и что волнует сообщество дизайнеров.
Опрос анонимный и займет всего 5-7 минут. В конце опроса вас будет ждать подарок — промокод на любой курс Учебника Т—Ж!
Поучаствовать можно тут.
Реклама АО «Тинькофф Банк», ИНН 7710140679
Сайт ежегодной конференции для разработчиков GitHub Universe
Удобная система карточек хорошо структурирует контент. А разнообразие градиентных 3D-иллюстраций визуально воплощает множество интересных событий, которые обещает GitHub Universe своим гостям
Больше скриншотов: awdee.ru/github-universe-annual-developer-conference-website
githubuniverse.com
#awd_web #awd_site
Стартовало ежегодное исследование: какие дизайн-команды в отечественных продуктовых компаниях самые сильные
Такой рейтинг полезен рынку. Дизайнерам — лучше понимать, где есть хорошие вызовы и комфортная среда для профессионального роста. Компаниям и дизайн-командам — видеть, что нужно улучшить
Пожалуйста, примите участие: bit.ly/dsgnteam-2023
Ваше мнение поможет сделать исследование лучше. Результаты исследования появятся в январе. Вы найдёте отчёт в крупных дизайн-каналах и изданиях, включая Оди
Результаты за прошлые годы:
— dmpatterns.com/teams-2021
— dmpatterns.com/teams-2020
— dmpatterns.com/teams-2019
— dmpatterns.com/teams-2018
Cтиль британского форума о телевидении и развлечениях Too Much To Watch
Ежегодное мероприятие Королевского телевизионного общества проходило в Кембриджском университете и длилось два дня. Форум собрал лидеров индустрии для обсуждения будущего СМИ и влияния на него нейросетей
В айдентике прослеживается явная аллегория между бесконечным контентом, который заполняет всё наше свободное время (Too Much To Watch — Слишком Много Всего Смотреть), и кинетическими «надутыми» буквами, заполняющими всё свободное пространство
Больше картинок и видео: awdee.ru/styled-by-the-british-forum-on-television-and-entertainment-too-much-to-watch
#awd_identity via studio-kiln.com/project/rts-cambridge-convention-2023
Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: пройдите несколько секций собеседования и получите офер за несколько дней.
Ближайшее мероприятие:
• 20-24 ноября — Fast Track для продуктовых дизайнеров, офер за неделю в команду HR Tech.
Зарегистрироваться
Реклама. ООО "Яндекс". erid: 2VtzqxjeTYb
Midlibrary — коллекция из 4400+ стилей Midjourney
Библиотека содержит стили определённых художников, архитекторов, дизайнеров, иллюстраторов и фотографов
Чтобы сгенерировать картинку в выбранном стиле, к промту достаточно добавить имя автора. Оно указано на странице стиля в разделе Optimal prompt. Там же есть галерея работ, описание стиля и его характеристики
Для удобного поиска на сайте есть рубрикатор по категориям, стилям и отдельным характеристикам
midlibrary.io/styles
#awd_tool #awd_webtool
🙂 Проектируем фильтрацию листинга товаров в приложении
Станислав Хрусталёв написал новую статью о лучших практиках и ошибках в дизайне фильтров
На примерах российских приложений автор разобрал следующие аспекты:
— Размещение кнопки фильтров
— Внешний вид кнопки
— Появление экрана с фильтрами
— Интерфейс выбора фильтров
— Пояснения к фильтрам
— Слайдеры
— Фильтры выбора из списка
— Полный список значений по фильтру
— Фильтры выбора цвета
— Бинарные фильтры
— Применение фильтров
— Активные фильтры в листинге
— Активные фильтры на экране фильтров
— Сброс фильтров
— Закрытие экрана фильтров
— Прочие интересные фичи
awdee.ru/designing-product-listing-filtering-in-the-application
#awd_article #awd_ux #awd_cx
Туториалы по созданию цветовых эффектов в Adobe Illustrator
Мы собрали видеоуроки, из которых вы узнаете, как сделать эффектные градиентные и светящиеся иллюстрации
Темы:
— Цветная спиральная иконка
— Градиентные сферы
— Глитч-эффект
— Стеклянный 3D-текст
— Светящаяся бабочка из линий
— Градиентный 3D-виток
awdee.ru/tutorials-on-creating-color-effects-in-adobe-illustrator
#awd_edu #awd_ai
🙂️️️️️️ Как учиться быстрее и эффективнее
Саммари лекции Дмитрия Карпова, руководителя Школы креативного мышления Клубов Мышления Института 2035. В видео он рассказывает, как подготовить себя к тому, чтобы в короткие сроки получить нужные знания и сразу же начать их применять
Коротко расскажем ключевые тезисы:
— Эффективность обучения зависит от измеримости результата. То есть сначала вы делаете что-то на одном уровне, а потом начинаете делать на другом. Здесь важно определить критерии и методы измерения
— Картина мира. Чтобы быстро обучаться, нужно потратить время и описать для себя картину мира — то, как вы видите свою жизнь, свои достижения и неудачи. Например, я хочу продавать элитные автомобили, потому что мне это интересно, я всегда буду много зарабатывать и уважать себя за это
— Описание картины мира усилит мотивацию к обучению. Записывайте, как в процессе обучения она будет меняться, а именно, ваш социальный статус, отношение людей, материальное состояние
— Картина результатов. Спросите себя, почему определённые результаты будут радовать вас. Когда вы думаете о том, что вы станете человеком, который зарабатывает своими мозгами, чувствует, что может развиваться дальше самостоятельно, чувствует уважение окружающих людей — это картина результатов, которая будет вдохновлять на обучение
— Картина фактов. Когда вы приступаете к обучению, научитесь с помощью символов, схем, образов или рисунков фиксировать на бумаге то, что изучаете. Это поможет не только лучше запоминать информацию, но и начать применять новые знаний в текущей жизни
— Создайте целостную картину мира, картину результатов и картину фактов. Перед сном просматривайте всё это. И после полноценного сна вы поймёте, что ваш мозг провел огромную работу — переварил информацию, вошёл в ресурсное состояние и готов к обучению
📼️️️️️️ youtube.com/watch?v=Bn6ldhiQeBE
#awd_edu #awd_lecture #awd_career #awd_summary
👨🎨 5 новых бесплатных Figma-плагинов #2
Мы собрали и проверили ещё 5 полезных плагинов. Чтобы вы быстрее разобрались, как они работают, мы записали короткие скринкасты
— Split Image Effect — делит изображения на полосы, ромбы, квадраты, прямоугольники
— Random Gradients — генерирует рандомные красочные градиентные фоны
— ToolTips — быстро создаёт кастомизируемые тултипы. Всё, что нужно — написать текст тултипа, задать его направление, а потом настроить размер, цвет надписи и цвет фона
— Fake it — генерирует фейковые данные для заполнения макетов. Содержит более 200 типов данных: имён, названий, телефонных номеров, номеров банковских карт и многого другого. Данные создаёт на более, чем 60 языках, включая русский
— Hugeicons Pro — библиотека из 6500+ бесплатных линейных SVG-иконок
awdee.ru/5-new-free-figma-plugins-2
#awd_figma #awd_tool
Самокат представил новую упаковку товаров собственной торговой марки.
Онлайн-ритейлер переосмыслил подход к дизайну, чтобы сделать внешний вид товаров удобнее и функциональнее для покупателей. Теперь для разных категорий продуктов предусмотрен свой уникальный дизайн. Такое решение позволяет покупателю легче найти нужный товар под актуальную ситуацию потребления.
Премиальные товары выполнены в более темных оттенках, а продукты категории ЗОЖ, например, без сахара, имеют спокойную белую упаковку с отметкой о пользе на лицевой стороне. Дизайн упаковки импульсных продуктов выполнен в ярких цветах, а для товаров ежедневного потребления Самокат разместил полезную инфографику на лицевой стороне.
При работе над редизайном Самокат опирался на обратную связь от пользователей. Например, покупатели поделились, что хотели бы видеть способ приготовления продукта не на обороте, а на более заметном месте. Поэтому Самокат добавил эту информацию на лицевую сторону.
Кроме того, сейчас на упаковку выносятся советы по переработке. А в карточках некоторых товаров бренда Самокат есть пометка, что упаковку можно сдать на переработку.
#промо
Новая айдентика итальянской сети ресторанов Erbert
Раньше Erbert позиционировался как супермаркет органических и свежих продуктов. Но недавно основатели бренда придумали новую уникальную концепцию. Они решили превратить супермаркеты в рестораны быстрого питания, которые при этом предлагают посетителям здоровую еду. Над созданием рецептов работают не только шеф-повара, но и диетологи
В айдентике логотип с округлыми засечками, простые силуэтные иллюстрации и естественные оттенки подчёркивают полезность продуктов, из которых готовят еду для гостей
Больше картинок: awdee.ru/new-identity-of-the-italian-restaurant-chain-erbert
#awd_identity via behance.net/gallery/180599673/Erbert-Identity
🙂️️ Тренд: сайты с эффектом свечения в стиле Linear
Мы решили делиться с вами своими наблюдениями в отношении последних тенденций в веб-дизайне. Один из трендов, который слегка outdated, но тем не менее заслуживает внимания — тёмная тема с фиолетовым отливом, эффектами свечения, светящимися обводками. Первый раз такая эстетика появилась на лендинге сервиса Linear
В статье мы собрали шесть примеров таких сайтов: awdee.ru/trend-sites-with-glow-effect-in-linear-style
А если вы захотите реализовать похожий эффект в своём проекте, вот ссылка на пошаговый Figma-туториал по созданию таких светящихся градиентов: figma.com/community/file/1197134505417110601
Если вы встречали примеры такого тренд, присылайте в комментарии
#awd_web #awd_site
🙂️️ Арт-районы: DUMBO в Нью-Йорке
Первая статья из серии, в которой Глеб Клинов рассказывает об арт-районах крупных городов: откуда они взялись, как в них попасть и чем заняться.
Начнем с Нью-Йорка: awdee.ru/artzone-dumbo-nyc
#awd_article
Новая айдентика Максима Ильяхова
Ильяхов решил добавить в свои каналы больше собственного мнения и самого себя. Так родилась идея добавить к существующему оформлению его голову с текстовой кареткой, которая меняет выражение лица в зависимости от контекста
А поскольку он создаёт и публикует много контента, то перед дизайнерами стояла задача ускорить производственный процесс. И если раньше иллюстрации для постов и статей рисовал специальный иллюстратор, то теперь их делают почти мгновенно за счёт сочетания сгенерированного ИИ-фона, головы автора и яркого заголовка
Тот случай, когда нейросети заменили иллюстратора :–)
Стиль разработали дизайнеры Бюро
Больше картинок и видео: awdee.ru/maxim-ilyakhovs-new-identity
#awd_identity via bureau.ru/projects/maximilyahov-identity
Цифровой архив американского центра графического дизайна и типографики Letterform
Основатель архива — коллекционер Роб Сондерс. На протяжении 40 лет он собирал предметы, связанные с типографикой, каллиграфией и графическим дизайном. В 2015 году в Сан-Франциско Сондерс открыл центр Letterform для посетителей, где представил более 100 000 печатных артефактов
Представители центра оцифровали и опубликовали коллекцию на сайте. Чего только нет в этом архиве — и граффити, и панковские афиши из семидесятых-восьмидесятых, и раритетные брендбуки мировых компаний, и флаеры, и зины, и книги о шрифтах, и многое другое
Онлайн-архив содержит удобный поиск и рубрикатор по авторам, студиям, направлениям в дизайне, декадам
Отличное место для исследования визуальной культуры прошлого и поиска новых идей
Больше картинок: awdee.ru/digital-archive-of-letterform-an-american-center-for-graphic-design-and-typography
oa.letterformarchive.org
#awd_retro #awd_print #awd_collection
🙂️️ Как сократить объём текста в интерфейсе без потери смысла
Перевод статьи Тейлора Дайкса из Nielsen Norman Group о том, как укорачивать и улучшать интерфейсные тексты
Автор рекомендует следующие действия:
— Уберите словесный мусор
— Уберите лишние слова
— Избавьтесь от избыточности
— Обращайте внимание на зависимые предложения
— Обращайте внимание на содержание
— Ищите лишнюю информацию
— Переставляйте слова
Для лучшего понимания он приводит примеры UX-текстов с разбором ошибок
awdee.ru/rewriting-digital-content-for-brevity
#awd_article #awd_ux
Типографская раскладка Бирмана
Что такое раскладка. Когда вы печатаете на клавиатуре, разным кнопкам на ней соответствуют разные символы. Если вы пишете по-русски, то скорее всего у вас установлены две раскладки — русская и английская. И если вы используете русскую раскладку, но вам нужно ввести слово на английском языке, то вы переключаетесь между раскладками
Что такое типографская раскладка Бирмана. Она включает много полезных символов, которые не поддерживает обычная раскладка. Например, правильные кавычки («»), тире (—), знак евро (€), фунта (£), умножения (×), минус (−), знак зарегистрированной торговой марки (®), копирайта (©), параграфа (§), градуса (°), стрелочки (←→↑↓), неразрывный пробел и другие
Преимущества типографской раскладки. Сделать текст опрятным без типографской раскладки сложно, потому что на обычной раскладке нужных символов либо нет, либо их написание требует запоминания сложных комбинаций клавиш
А на типографской раскладке редкие символы расположены логично, поэтому их легко запомнить
Как вводить символы. На плакате типографской раскладки символы, которые расположены на клавише снизу, вводят с зажатым Alt. Символы, которые расположены на клавише сверху, вводят с Alt+Shift
Комбинирующиеся символы. На плакате типографской раскладки комбинирующиеся символы находятся на плашках. Они позволяют печатать диакритические знаки, которые есть во французском, немецком, испанском, белорусском и других языках. Например, писать на французском символы «é», «è», «î», «ç», не переключаясь на французскую раскладку
Как вводить комбинирующиеся символы. Их вводят с Alt+Shift, и после появления символа нажимают букву, которая в результате образует символ с диактрическим знаком
Раскладка бесплатная. Доступна для Windows и macOS. В остальных системах её можно включить в настройках клавиатуры в пункте «Включить дополнительные типографские символы»
Скачать: ilyabirman.ru/typography-layout
40-минутная видеоинструкция Илья Бирмана о том, как пользоваться типографской раскладкой: ilyabirman.ru/meanwhile/all/typography-layout-video
Плакат типографской раскладки, который помогает запомнить расположение символов: ilyabirman.ru/typography-layout/poster
#awd_tool
🙂️️ Как отличать сгенерированные ИИ изображения
Перевод статьи Кристины Коротенко, в которой она рассказывает, как отличить реальное изображение от созданного ИИ. Она рекомендует обращать внимание на слияние элементов, странные волосы и руки, искажённый текст на картинке, пустые глаза, чрезмерно гладкие текстуры и другое
awdee.ru/how-to-spot-ai-generated-images
#awd_article #awd_ml #awd_neuralart
🙂️️️️️️ Лучшие аналоги Figma
В статье подробно рассматриваем несколько альтернатив:
— Pixso
— Lunacy
— Penpot
— Mockplus
— Adobe 😆
— Sketch для Mac
awdee.ru/luchshie-analogi-figma
#awd_tool #awd_webtool #awd_figma
🙂️️️️️️ Шпаргалка по типам визуализации данных
«Визуальный словарь» от Financial Times — плакат с вариантами визуализации данных в зависимости от типа взаимных отношений между элементами этих данных. Плакат векторный, при желании можно распечатать и повесить на стену
#awd_infographic #awd_free_download via ft.com/vocabulary