31242
Журнал о дизайне и для дизайнеров. Вдохновение, обучение, инструменты. Чат канала: @awdeechat Сайт: https://awdee.ru По рекламе: @design_manager_bot Автор проекта: @kirillgreen
Упаковка коллекции чая Trés французской марки Sans & Sans
В переводе с французского trés — три, что означает три вида чая в одной коробке. Каждая баночка окрашена в отдельный цвет, а сочетание геометрических фигур «подсказывает» номер напитка, что в целом отражает идею выбора и классификации чая в коллекции
Классный пример баночек, которые будут красиво выглядеть не только на полках магазинов, но и на кухне
Больше картинок: awdee.ru/packaging-of-the-tres-tea-collection-by-french-brand-sans-sans
#awd_pack via behance.net/gallery/121950639/Trs
Ретрофутуристичный 3D-дизайн Вадима Садовского из Атланты
Больше картинок: awdee.ru/retrofuturistic-3d-design-by-atlanta-based-vadim-sadovsky
#awd_illustration #awd_3D via behance.net/Vadimsadov77f2
Иллюстрации Гражины Грей из Литвы
Больше изображений: awdee.ru/illustrations-by-grazina-grey-from-palanga
#awd_illustration via dribbble.com/Grei
🙂 Ритм на экране
Перевод статьи Кристофера Батлера об управлении вниманием пользователя при сканировании сайта. В ней автор, опираясь на исследования, рассказывает о том, какой части страницы люди уделяют больше внимания при просмотре. Он объясняет, как информационная архитектура убеждает пользователей задержать внимание на контенте. А также отвечает на вопрос, почему люди быстро прокручивают первый экран ещё до полной загрузки страницы
В конце он даёт несколько практических советов о способах восприятия информации (вдумчивое чтение, быстрое сканирование), выравнивании, повторении и работе свободного пространства
awdee.ru/the-rhythm-of-your-screen
#awd_article #awd_ui
🙂️️️️ Консистентность в дизайне
Перевод статьи Tubik Studio о том, что такое консистентность в дизайне, в чём её особенности, на какие типы она делится и как спроектировать цифровой продукт, чтобы он выглядел консистентным
Консистентность — свойство продукта, при котором он взаимодействует с пользователем одним и тем же или похожим образом, независимо от точки соприкосновения или канала коммуникации. В контексте UX «консистентность» означает, что подобные элементы выглядят и функционируют одинаково, и таким образом снижают когнитивную нагрузку и делают взаимодействия более интуитивными
Consistency можно переводить как «согласованность» или «последовательность». Это будет верный, но неполный перевод. Потому что в контексте интерфейсов слово consistency содержит дополнительные оттенки смысла. Поэтому в этой статье мы переводим его как «консистентность»
awdee.ru/consistency-in-design
#awd_article #awd_ux
🙂 Выходим на глобальный рынок: адаптация интерфейса под арабскую локализацию
Фёдор Миронов, дизайнер интерфейсов студии CleverPumpkin, написал статью о том, как правильно локализовать сайт или приложение с учётом особенностей арабского языка. В статье он детально рассказал, как адаптировать тексты, изображения, иконки, инпуты и другие элементы интерфейса в контексте RTL (Right-To-Left)
awdee.ru/going-global-adapting-the-interface-for-arabic-localization
#awd_article #awd_ui
Как мы создавали навигацию Левашовского хлебозавода
Ребята из студии брендинга DEZA написали статью о том, как создавали систему навигации и логотип для Левашовского хлебозавода в Санкт-Петербурге. В ней они рассказали обо всех этапах работы, трудностях, с которыми они столкнулись, и показали, что в итоге получилось
awdee.ru/how-we-created-the-navigation-of-levashov-bread-factory
#awd_logo #awd_article
Генеративный постер Оди
Любой статический дизайн можно оживить с помощью программирования. Например, превратить логотип Оди в интерактивный постер, который двигается вместе с мышью. Работает прямо в браузере, попробуйте!
Такая техника называется генеративным дизайном. Вместо того, чтобы создавать графику вручную, дизайнер описывает свои идеи с помощью кода и получает множество вариативных решений. Можно, например, сгенерировать тысячу логотипов и выбрать лучший из них.
Сетка — это канал, в котором Иван Дианов и Адам Арутюнов учат дизайнеров программировать: постят бесплатные уроки по генеративному дизайну и веб-разработке, вебинары с экспертами, рассказы о техниках, инструментах и приёмчиках.
Подписывайтесь, чтобы стать первыми специалистами в новом направлении!
@setka_design
Реклама ИП Арутюнов А.Е., ИНН 616618181949
🙂️️ Что такое тренд Bento UI и как начать его использовать
Перевод статьи Луизы Норт о том, как появился дизайн-тренд Bento UI, почему стал популярным и как делать макеты в таком стиле
Также рекомендуем посмотреть сайт BentoGrids, который демонстрирует примеры применения Bento UI в дизайне интерфейсов
awdee.ru/what-is-the-bento-ui-trend-and-how-to-start-using-it
#awd_article #awd_ui
22 сентября Тинькофф проведет #FFDD2D Design Conf — прозрачную конфу о дизайне в продуктовых компаниях.
Ждем всех, кому интересен диджитал-дизайн. Поговорим о будущем дизайна, неидеальных процессах и работе с бренд-медиа.
Можно подключиться к трансляции конференции. Регистрация открыта до 19 сентября. Торопитесь, пока есть места: https://u.tinkoff.ru/design.conf.2023
Реклама АО «Тинькофф Банк», ИНН 7710140679
Упаковка кофе американской кофейни Sola Coffee Co.
Многослойность, геометрические формы и эксперименты с вёрсткой вносят разнообразие в дизайн и делают его нескучным
Больше картинок: awdee.ru/the-packaging-of-the-coffee-of-the-american-coffee-house-sola-coffee-co
#awd_pack #awd_identity via thedieline.com/blog/2023/8/2/studio-mpls-designs-type-forward-branding-and-packaging-for-sola-coffee-co
Этикетки серии аргентинских вин Dilema
Нечасто встретишь хороший пример серийности в вине, но это как раз тот случай :–)
Больше картинок: awdee.ru/labels-of-the-dilema-series-of-argentine-wines
#awd_pack via thedieline.com/blog/2022/10/7/a-complete-rebranding-for-dilema-wines
Концепт айдентики бара Wild Legs
В основе стиля — элементы коллажа, силуэтные иллюстрации и игривая типографика
Больше картинок: awdee.ru/wild-legs-bar-identity-concept
#awd_identity via dprofile.ru/case/30849/wild-legs-winefood
IF Kica — бесплатный акцидентный широкий гротеск с кириллицей
Доступно 3 начертания: Light, Regular и Bold. Содержит заглавные и прописные литеры, цифры, знаки препинания и специальные символы. В составе кириллица, гречица и латиница
Хорошо подойдёт для обложек, плакатов и веб-дизайна
Доступен бесплатно для личных проектов, коммерческая лицензия стоит 24 €
Скачать: iframefonts.gumroad.com/l/kica-display-font
Больше картинок: awdee.ru/if-kica-is-a-free-accidental-wide-grotesque-with-cyrillic-characters
#awd_font #awd_free_download
Премьерные плакаты Театра Эрлангена
Больше плакатов: awdee.ru/theater-erlangen-premiere-posters
#awd_poster via neuegestaltung.de/clients/theater-erlangen-premieren-plakate
Видео, которое стоит посмотреть каждому дизайнеру взаимодействия
Перевод статьи Юлии Ку о революционной презентации Дугласа Энгельбарта, на которой он впервые представил совершенно новые концепции взаимодействия пользователя с компьютером. На презентации, которая прошла в 1968 году, Дуглас показал такие разработки, как компьютерная мышь, графический интерфейс, гипертекст, видеоконференции и даже редактор для совместной работы в режиме реального времени
В статье автор представила основные тезисы презентации. Она также объяснила, почему это выступление стало поворотным моментом в истории взаимодействия человека с компьютером и его однозначно стоит посмотреть всем дизайнерам взаимодействия
📼 Полная запись оригинальной презентации: youtube.com/watch?v=yJDv-zdhzMY
📼 Короткая версия: youtube.com/watch?v=B6rKUf9DWRI
awdee.ru/a-video-every-interaction-designer-should-watch
#awd_article #awd_retro
Если вы думаете о том, чтобы расширить дизайн-компетенции — приходите на курс Практикума по созданию мобильных приложений. Вы научитесь делать приложения не только для смартфонов, но и для TV, умных часов и других платформ. А в конце положите большой проект в портфолио.
Курс для продолжающих, так что основы заново проходить не придётся. Учёба идёт 3 месяца по 10 часов в неделю — можно совмещать с работой.
Что будет на курсе: • Углубленное прототипирование, дизайн-системы, гайдлайны iOS и Android. • Удобная теория в онлайн-тренажёре, который доступен 24/7. • Практика на большом проекте на протяжении всего обучения. • Преподаватель-сеньор, который проверяет проект каждые две недели. Ему можно задать вопросы напрямую — в чате.
Записывайтесь на курс и расширяйте компетенции.
Промосайт учебника о дизайне шрифтов Blaze Type
Классный способ презентовать книгу о шрифтовом дизайне — построить стиль лендинга на монохромных экспериментах с типографикой
learntype.eu
Больше скриншотов: awdee.ru/blaze-type-font-design-tutorial-promotional-site
#awd_web #awd_site
Концепт кофейной упаковки Bean So Good
В предверии Лунного Нового года 2022 китайские дизайнеры разработали концепт праздничной упаковки зёрен и готового кофе
Главными героями в ультраминималистичном дизайне стали милые котики в стиле граффити, символизирующие год Тигра
Больше картинок: awdee.ru/cny-coffee-collection-year-of-the-tiger
#awd_pack via behance.net/gallery/130359895/Bean-So-Good-CNY-Coffee-Collection-Year-of-the-Tiger
FlowMapp — онлайн-сервис для создания интерактивных карт сайта, флоучартов и кликабельных прототипов
Поддерживает командную работу, экспорт проекта и историю редактирования. Также внутри можно хранить референсы. Есть библиотека шаблонов
Ограниченная версия — бесплатная, цена платных тарифов стартует от 8,8 $ в месяц при годовой оплате
flowmapp.com
Больше картинок: awdee.ru/flowmapp
#awd_tool #awd_webtool
🙂 10 лет в дизайне и 12 уроков, которые я из них усвоил
Британский дизайнер Томми Тонер создавал сайты и мобильные приложения для таких компаний, как Jaguar, eBay, Formula 1, BBC, Audi, Google, Nike, Sony, HSBC, American Express, Shell и многих других. Мы перевели его статью о 12 уроках, которые он вынес из своего 10-летнего опыта работы в дизайне
Коротко о том, что внутри:
1. Карьера дизайнера — марафон, а не спринт
2. Не всё то золото, что блестит
3. Не делайте дизайн вслепую
4. Инструменты ничего не значат
5. Бренд и UX — две стороны одной медали
6. Будущее — гибрид
7. Ваши пет-проекты имеют значение
8. Восприятие — всё, но кого оно волнует
9. Агентства никогда не заменят внутренние дизайн-команды, и наоборот
10. Дизайнеры могут участвовать в бизнес-процессах, но это необязательно
11. Учитывайте эмоции, но не теряйте прагматизма
12. Поднимите планку своей уникальности
awdee.ru/a-decade-in-design-and-12-lessons-its-taught-me
#awd_article #awd_career
Human Generator — бесплатный онлайн-генератор реалистичных фотографий людей
Можно загрузить собственную фотографию и менять её, или создать изображение несуществующего человека. Чтобы получить более точный результат, есть текстовые промты. Можно настраивать такие параметры, как пол, возраст, цвет кожи, национальность, поза, комплекция, одежда, задний план и многие другие
Инструмент выпустила команда Icons8
Бесплатно для некоммерческих проектов. За коммерческие тарифы с платной лицензией — от 17 $ в месяц при годовой оплате
generated.photos/human-generator
Больше примеров: awdee.ru/human-generator-is-a-free-online-generator-of-realistic-photos-of-people
#awd_tool #awd_webtool
🙂 Проектируем карточки товаров в листинге: 230 гайдлайнов
Станислав Хрусталёв проанализировал около 200 приложений из сферы e-com и написал, как сделать карточки в листинге товаров понятными, наглядными и функциональными
Статья состоит из следующих разделов:
— Layout листинга
— Выделение карточек в листинге
— Фото товара
— Слайдер
— Page control
— Название и подписи
— Маркеры
— Варианты товара
— Цена и скидки
— Рейтинг и отзывы
— Кнопка корзины
— Кнопка избранного
— Реакция карточки на касание
Все гайдлайны автор по традиции сопроводил информативными примерами актуальных приложений
awdee.ru/designing-product-cards-in-a-listing-230-guidelines
#awd_article #awd_ux #awd_cx
Сайт агентства Move с подходом mobile first
Из визуальных штук хочется отметить неожиданные цветовые сочетания, акцидентную типографику и уместные декоративные элементы
moveagency.com/en
#awd_web #awd_site
Что делает тень реалистичной
Перевод треда Дэна Холлика о том, как появляется тень в реальной жизни и как с этими знаниями создавать красивые тени. В конце он даёт ссылку на Figma-плагин, который помогает настраивать реалистичные тени в пару кликов
awdee.ru/what-makes-a-shadow-realistic
#awd_article #awd_color
🙂 Что должно быть на сайте медицинских услуг: гайд из 31 пункта
CX-дизайнер Адам Григорян спроектировал с десяток сайтов для стоматологий, офтальмологических клиник и многопрофильных медцентров. На базе результатов исследований, данных трафика, опросов аудитории, информации из отделов продаж он рассказал о нюансах дизайна сайтов для таких учреждений
На примерах автор объяснил:
— Какую информацию включать в форму заявки
— Стоит ли использовать онлайн-чат на сайте
— Когда указывать стоимость услуг
— Показывать ли фотографии «До/После»
— Какие отзывы и где публиковать в первую очередь
— На какую информацию о персонале клиенты обращают внимание
— Какие данные стоит добавлять в Яндекс.Справочник, чтобы увеличить присутствие в поисковой выдаче
awdee.ru/what-should-be-on-a-medical-services-website-a-31-point-guide
#awd_article #awd_cx
Недавно вышли «Рейтинги рунета 2023»
Это полезнейшая штука для всех, кто выбирает диджитал-подрядчиков для дизайна, разработки, рекламы, интеграций и так далее
На ratingruneta.ru вы найдёте списки лучших в своём деле компаний: веб-дизайн и разработка, мобильные приложения, SEO, таргет, брендинг, креатив, PR... Всего 22 категории, представлены все популярные диджитал-услуги. 925 компаний из 101 города
В этом году команда улучшила методику подсчёта, теперь в ней более 40 параметров. Методика открыта, вы всегда можете понять, почему компания занимает свою строчку в рейтинге. К работе над методикой команда привлекает сильных экспертов. То есть это не наша фантазии, как должно быть, а опыт экспертов, наложенный на данные
На сайте есть фильтры для подбора подрядчика по городу, цене, услугам, опыту работы в отрасли, умению работать с нужным типом продукта или платформой, умению работать с бизнесом определённого размера и площадками и так далее
Оцените сами и поделитесь с коллегами:
ratingruneta.ru
ratingruneta.ru
ratingruneta.ru
Реклама. ООО «Проактивити». erid: Kra23nCFG
Сайт маркетингового агентства The Thirty7
Стиль сайта построен на контрастах — сочетании гротеска и антиквы, красного и чёрного, минималистичного оформления и динамичных визуальных эффектов
thethirty7.com
Больше скриншотов: awdee.ru/website-of-marketing-agency-the-thirty7
#awd_web #awd_site
Два варианта айдентики московской пекарни Любовь Пирогова
В заведении готовят пироги на песочном тесте, а в начинках сочетают необычные ингредиенты — например, говядину и пиво гиннесс, куриные желудочки и вяленые томаты, грушу и горгонзолу, абрикосы и рикотту
Компания существует уже 7 лет, и её основатели решили сделать ребрендинг. В ходе проекта они работали с разными студиями, которые в общей сложности создали более 20 концептов айдентики пекарни. Но в итоге остановились на концепции, которую предложила студия Repina Branding. В ней главным элементом стиля стал «край надломленного пирога», который хорошо дополняют цветные паттерны и минималистичный округлый логотип
А мы хотим показать вам ещё один вариант айдентики пекарни от студии Max, который клиенты отклонили. Дизайнеров вдохновило творчество любимого художника основателей бренда — Анри Матисса. Именно его контрастные шейпы легли в основу концепции. Так появились абстрактные текстурные паттерны и логотип с рукописным текстом, который символизирует подпись художника в углу картины
Утверждённый вариант студии Repina Branding: vc.ru/design/817637-pirog-kak-art-obekt-kak-my-razrabotali-novyy-firmennyy-stil-pekarni-lyubov-pirogova
Отклонённый вариант студии Max: vc.ru/design/802998-kak-my-upakovali-brend-chut-ne-vzyalis-za-holst-s-maslom-i-pri-chem-tut-matiss
Больше картинок: awdee.ru/two-variants-of-moscow-bakerys-identity-lubov-pirogova
А вам какой вариант больше нравится? Какой вариант вы бы выбрали на месте клиента?
#awd_identity #awd_pack
Трёхмерные абстракции студии DeepYellow
Больше картинок: awdee.ru/tryohmernye-abstraktsii-studii-deepyellow
#awd_3D via instagram.com/deep_shape