Эффекты фильтрации SVG. Часть 3. Эффект постеризации изображения при помощи feComponentTransfer

Автор: admin от 12-02-2019, 14:40, посмотрело: 154

В третьей части серии вы узнаете, как работает feComponentTransfer и как можно постеризовать изображения при помощи этого мощного примитива SVG-фильтра.



Эффекты фильтрации SVG. Часть 3. Эффект постеризации изображения при помощи feComponentTransfer

Категория: Веб-разработка

 

Эффекты фильтров SVG: контурный текст при помощи feMorphology

Автор: admin от 10-02-2019, 14:05, посмотрело: 146

Во второй части серии об SVG-фильтрах Sara Soueidan знакомит нас с фильтром feMorphology и приводит несколько примеров его использования для создания интересных эффектов.



Эффекты фильтров SVG: контурный текст при помощи feMorphology

Категория: Веб-разработка

 

10 советов по дизайну интерфейса

Автор: admin от 23-07-2018, 18:45, посмотрело: 265

Привет, Хабр! Представляю вашему вниманию перевод статьи "10 Tips to Designing Perfect Forms".



10 советов по дизайну интерфейса


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



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

Категория: Веб-разработка

 

10 мелких ошибок в дизайне, которые мы допускаем до сих пор

Автор: admin от 4-07-2018, 09:40, посмотрело: 186

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



10 мелких ошибок в дизайне, которые мы допускаем до сих пор



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



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

— Дж. Нильсен

Категория: Веб-разработка

 

Прокрутка и внимание (исследование 2018 года)

Автор: admin от 7-06-2018, 19:15, посмотрело: 178

Предлагаю вашему вниманию перевод статьи Therese Fessenden — Scrolling and Attention. Статья посвящена новому исследованию использования прокрутки при просмотре сайтов. Предыдущее исследование было проведено в 2010 году, перевод статьи по нему так же был выложен на Хабре.



Прошу прощения за возможные неточности в переводе :)
Резюме: Люди скроллят вертикально больше, чем раньше, но новые eye-tracking исследования показывают, что они всё ещё смотрят на «первый экран» больше, чем на остальные.



Шаблоны человеческого поведения довольно стабильны, и гайдлайны юзабилити лишь изредка меняются по прошествии времени. Но один шаблон поведения, который всё же изменился с ранних времён веб-дизайна — это использование прокрутки. Изначально, люди редко скроллили вертикально; но в 1997 году, когда длинные страницы стали обычным явлением, они стали использовать прокрутку. Однако, пользователей всё ещё больше всего интересовала информация на «первом экране»; и даже в недавнем 2010 году наши eye-tracking исследования показали, что 80% времени пользователи тратят, просматривая именно «первый экран» страницы.



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

Категория: Веб-разработка

 

JSFiddle — новая версия

Автор: admin от 5-06-2018, 19:40, посмотрело: 190

Привет!



Сегодня, я хочу поговорить об одном полезном инструменте — jsfiddle. Сейчас мало кто из разработчиков не знает о его существовании, поскольку jsfiddle очень прост в использовании и достаточно функционален. Но, возможно, кто-то из вас откроет для себя что-то новое, прочитав эту статью. Давайте знакомиться.

jsFiddle — одна из самых популярных сред веб-разработки (работающая в веб-браузере), позволяющая редактировать и запускать код, написанный на HTML, javascript и CSS, который будет называться «фиддлом». Есть возможность использовать библиотеки для javascript, такие как jQuery.



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

Категория: Веб-разработка

 

Дизайн-система. Определение понятия

Автор: admin от 21-03-2018, 21:50, посмотрело: 244

Дизайн-система. Определение понятия


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

Категория: Программирование » Веб-разработка

 

Использование CSS-сетки при проектировании пользовательских интерфейсов

Автор: admin от 28-02-2018, 12:55, посмотрело: 301

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



Использование CSS-сетки при проектировании пользовательских интерфейсов


В материале, перевод которого мы сегодня публикуем, Джош Мариначчи рассказывает о том, как использовать CSS-сетку для проектирования макетов страниц. Речь пойдёт о страницах, которые способны реагировать на воздействия пользователя и на изменение их содержимого, но при этом всегда ведут себя так, как от них ожидается, в частности — при прокрутке их содержимого.

Категория: Программирование » Веб-разработка

 

Конвертирование из Sketch в PSD

Автор: admin от 22-01-2018, 12:45, посмотрело: 704

Конвертирование дизайн-макетов из формата .Sketch в .PSD


Конвертирование из Sketch в PSD

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

К сожалению, пользоваться этой артиллерией могут лишь обладатели компьютеров на платформе MAC OS. Продукты Adobe являются доминирующим инструментом для веб-дизайнеров, работающих под ОС Windows, но сильно уступают перед «Sketch». Исходя из этого, вопрос конвертации макета для просмотра на обоих операционных системах актуален как никогда.

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

Категория: Программирование » Веб-разработка

 

Клуб создателей отечественных дизайн-систем

Автор: admin от 26-12-2017, 14:55, посмотрело: 243

В этом году многие отечественные компании показали свои наработки по дизайн-системам. Особенно активизировались к осени - каждый месяц кто-то да анонсировал свою дизайнерско-технологическую платформу. Мы с Юрием Ветровым давно работаем над дизайн-системами и решили придать импульс их развитию в России — запустили сайт-коллекцию Design Systems Club.



Клуб создателей отечественных дизайн-систем

Категория: Программирование » Game Development