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

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

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

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

Автор проекта: @kirillgreen
Download Telegram
🙂 11 оттенков размытия

Продуктовый дизайнер Иван Емелюшкин написал статью о том, как дизайнеру передавать элементы с размытием разработчику, чтобы на выходе получить предсказуемый результат

В статье автор:
— Рассказал, как сделать размытие на Android
— Перечислил все 11 размытий на iOS с указанием особенностей каждого
— Затронул тему стилей текста и заливок для иконок на iOS
— Объяснил, как правильно передавать информацию о размытии разработчику

В конце статьи вы найдёте шаблон со всеми размытиями в Figma, чтобы быстро применять их в своих дизайн-проектах

awdee.ru/11-ways-of-blurring

#awd_article #awd_web #awd_ui #awd_figma
Please open Telegram to view this post
VIEW IN TELEGRAM
🙂 11 оттенков размытия

Продуктовый дизайнер Иван Емелюшкин написал статью о том, как дизайнеру передавать элементы с размытием разработчику, чтобы на выходе получить предсказуемый результат

В статье автор:
— Рассказал, как сделать размытие на Android
— Перечислил все 11 размытий на iOS с указанием особенностей каждого
— Затронул тему стилей текста и заливок для иконок на iOS
— Объяснил, как правильно передавать информацию о размытии разработчику

В конце статьи вы найдёте шаблон со всеми размытиями в Figma, чтобы быстро применять их в своих дизайн-проектах

awdee.ru/11-ways-of-blurring

#awd_article #awd_web #awd_ui #awd_figma
Please open Telegram to view this post
VIEW IN TELEGRAM
This media is not supported in your browser
VIEW IN TELEGRAM
На сайте daylightcomputer.com очень кайфово применили скролл, чтобы показать суть и пользу устройства

#awd_web #awd_site
Тренд: вёрстка лендингов в одну колонку

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

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

Примеры, которые я нашёл:
alexandersandberg.com/balance
spoil.me
sfcompute.com
supertape.com (почти, но не совсем)

Если знаете другие примеры, присылайте в комментарии

#awd_web #awd_trend #awd_site
Мини-тренд в веб-дизайне: гигантский логотип в подвале сайта

#awd_trend #awd_web
Как правильно реализовать эффект матового стекла на сайтах

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

Джош Комо написал кайфовую статью с разбором всех таких недостатков и, главное, с примерами его грамотной реализации в CSS

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

В статье есть фрагменты готового кода и интерактивные примеры

В общем, читайте, добавляйте в закладки и отправляйте своим технологам: joshwcomeau.com/css/backdrop-filter

#awd_article #awd_web