Оди
35.1K subscribers
27.1K photos
1.3K videos
146 files
5.71K links
Журнал о дизайне и для дизайнеров. Вдохновение, обучение, инструменты.

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

По рекламе: @kgreenmedia
В реестре: vk.cc/cKf8V5

Автор проекта: @kirillgreen
Download Telegram
🙂 Проектируем карточки товаров в листинге: 230 гайдлайнов

Станислав Хрусталёв проанализировал около 200 приложений из сферы e-com и написал, как сделать карточки в листинге товаров понятными, наглядными и функциональными

Статья состоит из следующих разделов:
— Layout листинга
— Выделение карточек в листинге
— Фото товара
— Слайдер
— Page control
— Название и подписи
— Маркеры
— Варианты товара
— Цена и скидки
— Рейтинг и отзывы
— Кнопка корзины
— Кнопка избранного
— Реакция карточки на касание

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

awdee.ru/designing-product-cards-in-a-listing-230-guidelines

#awd_article #awd_ux #awd_cx
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥18👍52
This media is not supported in your browser
VIEW IN TELEGRAM
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
🔥214👍2🥱2💘2
Как мы создавали навигацию Левашовского хлебозавода

Ребята из студии брендинга DEZA написали статью о том, как создавали систему навигации и логотип для Левашовского хлебозавода в Санкт-Петербурге. В ней они рассказали обо всех этапах работы, трудностях, с которыми они столкнулись, и показали, что в итоге получилось

awdee.ru/how-we-created-the-navigation-of-levashov-bread-factory

#awd_logo #awd_article
18🔥9👍1
🙂 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
Please open Telegram to view this post
VIEW IN TELEGRAM
👍198🔥4💩3🤷‍♀1
🙂 Выходим на глобальный рынок: адаптация интерфейса под арабскую локализацию

Фёдор Миронов, дизайнер интерфейсов студии CleverPumpkin, написал статью о том, как правильно локализовать сайт или приложение с учётом особенностей арабского языка. В статье он детально рассказал, как адаптировать тексты, изображения, иконки, инпуты и другие элементы интерфейса в контексте RTL (Right-To-Left)

awdee.ru/going-global-adapting-the-interface-for-arabic-localization

#awd_article #awd_ui
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥102
FlowMapp — онлайн-сервис для создания интерактивных карт сайта, флоучартов и кликабельных прототипов

Поддерживает командную работу, экспорт проекта и историю редактирования. Также внутри можно хранить референсы. Есть библиотека шаблонов

Ограниченная версия — бесплатная, цена платных тарифов стартует от 8,8 $ в месяц при годовой оплате

flowmapp.com

Больше картинок: awdee.ru/flowmapp

#awd_tool #awd_webtool
🔥102
🙂️️️️ Консистентность в дизайне

Перевод статьи Tubik Studio о том, что такое консистентность в дизайне, в чём её особенности, на какие типы она делится и как спроектировать цифровой продукт, чтобы он выглядел консистентным

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

Consistency можно переводить как «согласованность» или «последовательность». Это будет верный, но неполный перевод. Потому что в контексте интерфейсов слово consistency содержит дополнительные оттенки смысла. Поэтому в этой статье мы переводим его как «консистентность»

awdee.ru/consistency-in-design

#awd_article #awd_ux
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12👍3
Концепт кофейной упаковки 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
👍21🔥42
🙂 Ритм на экране

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

В конце он даёт несколько практических советов о способах восприятия информации (вдумчивое чтение, быстрое сканирование), выравнивании, повторении и работе свободного пространства

awdee.ru/the-rhythm-of-your-screen

#awd_article #awd_ui
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥144
Media is too big
VIEW IN TELEGRAM
Промосайт учебника о дизайне шрифтов Blaze Type

Классный способ презентовать книгу о шрифтовом дизайне — построить стиль лендинга на монохромных экспериментах с типографикой

learntype.eu

Больше скриншотов: awdee.ru/blaze-type-font-design-tutorial-promotional-site

#awd_web #awd_site
👍16🔥62
Иллюстрации Гражины Грей из Литвы

Больше изображений: awdee.ru/illustrations-by-grazina-grey-from-palanga

#awd_illustration via dribbble.com/Grei
26🔥4👍2🐳1
Ретрофутуристичный нейроарт Вадима Садовского из Атланты

Изображения автор сделал при помощи Midjourney

Больше картинок: awdee.ru/retrofuturistic-3d-design-by-atlanta-based-vadim-sadovsky

#awd_illustration #awd_3D #awd_neuralart #awd_midjourney via behance.net/Vadimsadov77f2
🔥312👍1👎1
Видео, которое стоит посмотреть каждому дизайнеру взаимодействия

Перевод статьи Юлии Ку о революционной презентации Дугласа Энгельбарта, на которой он впервые представил совершенно новые концепции взаимодействия пользователя с компьютером. На презентации, которая прошла в 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
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥133
Упаковка коллекции чая 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
👍17🔥53
Афиши Государственного театра Майнца

Больше плакатов: awdee.ru/staatstheater-mainz-posters

#awd_poster via behance.net/gallery/177886395/Staatstheater-Mainz-Posters-(202021)
🔥337
Биография гениального исследователя цвета — Анри Матисса

На Лоско есть биографическая статья про творческий путь французского художника Анри Матисса

Отличительной особенностью его работ было то, что он акцентировал внимание на цвете. При этом Матисс пренебрегал формой и перспективой в пользу контраста и яркости. Он не использовал тени, упрощал фигуры, но при этом добавлял им объём за счёт применения насыщенных цветов

Матисс — основатель художественного течения фовизм, которое происходит от французского les fauves — дикие звери, дикари. Так критики называли его представителей за экспрессивные картины с небрежными мазками, яркими цветами и игнорированием правил композиции. Творчество фовистов бросало вызов условностям и не могло оставаться незамеченным

Несмотря на скандальный характер произведений Матисса он добился признания и известности. Его поддерживали богатые меценаты, среди которых — американская писательница Гертруда Стайн и русский купец Сергей Щукин

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

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

losko.ru/henri-matisse-biography

Больше картинок: awdee.ru/biography-of-the-brilliant-explorer-of-color-henri-matisse

#awd_retro #awd_person #awd_art #awd_summary
👍19🔥85
Ребрендинг французской социальной сети Yubo

Компания Yubo со штаб-квартирой в Париже появилась в 2015 году. В настоящее время число пользователей платформы составляет более 45 миллионов представителей поколения Z. Её отличительная особенность — прямые трансляции, в которых могут участвовать до 10 человек, и бесконечное количество зрителей

Миссия приложения — создать безопасное и весёлое виртуальное пространство, без давления в виде лайков. В приложении просто нет функции, позволяющей ставить лайки

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

Отдельный классный штрих в логотипе — лигатура «bo», которая отражает метафору коннекта друзей. Эту идею отлично поддерживает «голубое небо» на рекламных носителях — нечто, что нас объединяет независимо от того, насколько мы отличаемся друг от друга. Ну и эклектичный стиль, который проявляется в комбинации очень разных шрифтов и контрастных цветов

Больше картинок и видео: awdee.ru/rebranding-of-french-social-network-yubo

#awd_identity via underconsideration.com/brandnew/archives/new_logo_and_identity_for_yubo_by_koto.php
🔥133😎2
Айдентика французской Высшей школы дизайна Вильфонтена

Логотип объединяет две метафоры — планету, которая олицетворяет школу Вильфонтен, и глаз, отсылающий к острому, критичному и открытому взгляду на дизайн

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

Больше картинок: awdee.ru/identity-of-the-french-ecole-superieure-de-design-villefontaine

#awd_identity via behance.net/gallery/152949835/Villefontaine-Design-School-Visual-identity
16👎2👍1🔥1
Упаковка кошачьих кормов китайской марки HolyMoly

Довольно свежая идея — разместить яркие маленькие упаковки в прозрачный пластик с фотографией «орущего от голода» кота. А последний штрих — «ор» с эффектом текста в перспективе — делает дизайн более заметным

Больше картинок: awdee.ru/chinese-brand-holymoly-cat-food-packaging

#awd_pack via behance.net/gallery/179876895/HolyMoly-Rainbow-Cat-Food-Packaging-
🔥27🤩14👍63😁1
Айдентика бразильского архитектурно-интерьерного бюро Estúdio J-Ribeiro

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

Больше картинок: awdee.ru/the-identity-of-brazilian-architecture-and-interior-design-firm-estudio-j-ribeiro

#awd_identity via studiomateusaraujo.com.br/estudio-jribeiro
16🔥4
This media is not supported in your browser
VIEW IN TELEGRAM
Childhood memories — аниме со сценами из жизни в постсоветском пространстве

При помощи After Effects и Midjourney авторы сделали короткометражку в стиле мультфильмов Хаяо Миядзаки

При просмотре ролик полностью погружает в воспоминания: там и ковёр на стене, и свистящий на плите чайник, и «Чип и Дейл спешат на помощь» на экране старенького телика, и откусанная корочка хлеба по дороге домой и ещё много тёплых, ностальгических сцен

Отдельно хочется отметить прекрасно подобранное музыкальное сопровождение

Авторы — Дмитрий Алексеев и Сергей Козлов

📼 youtu.be/yKP2ZOzSQ0A?si=rLI9wheMF7AGUY-x

#awd_motion #awd_techno #awd_midjourney
Please open Telegram to view this post
VIEW IN TELEGRAM
💔5713❤‍🔥5👍4🔥3