Веб-дизайн *

Всем привет! Меня зовут Артём Плаксин, я незрячий специалист по цифровой доступности и работаю в ВК. Почитать о моей работе в офисе вы можете в одном из постов этого блога, а сегодня я хочу поговорить о практической стороне доступности. Этот пост посвящён доступности изображений, выводимых через теги <img> и <svg>.

Вы узнаете:

• Как понять, нужна ли подпись (альтернативный текст) к картинке.

• Какие подписи будут too much.

• Как адаптировать картинки, которым нужна подпись.

• И, наконец, как адаптировать картинки, которым не нужна подпись.

В последнее время вышло так, что я по неведомой причине стал часто заниматься популяризацией Marko.js, декларативного и реактивного языка разметки, который разрабатывается eBay. С одной стороны, это связано с тем, что Marko незаслуженно часто обходят стороной, хотя он позволяет делать из коробки многое из того, что не получится сделать на мейнстримовых фреймворках. С другой стороны, это действительно классно, когда можно использовать обычный HTML, при необходимости расширяя его синтаксисом Marko (вроде условных операторов и циклов). Одним словом, если вы еще не видели, что это такое - посмотрите, возможно, вам это очень понравится.

Когда у меня возникла необходимость разработать несколько внутрикорпоративных ресурсов, которые облегчали бы повседневную менеджерскую работу, я решил взять за основу некоторые свои разработки, в том числе компоненты, написанные на Marko, и максимально переиспользовать их. Так на свет появился Heretic - фреймворк, основанный на Marko.js, Node.js, Fastify, Bulma, MongoDB и других продуктах. Он позволяет за минимальные сроки разворачивать сайты, панели управления, различные сервисы и (теоретически) вообще все, что угодно :-)

У нас было 24 компонента кнопок, 4 типа селектов, 10 стилей типографики, палитра Google Material и три запроса на темизацию интерфейсов от «Перекрёстка», «Пятёрочки» и Х5.

Меня зовут Георгий, работаю в Х5 с 2019 года. Проектировал UX/UI для b2b веб-сервисов с высокой насыщенностью данных: таблицы, карточки, формы, дашборды. А с 2021 года занимаюсь дизайн-менеджментом.

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

Как менялись цвета на сайтах с начала века до наших дней? Правда ли, что веб бесповоротно потемнел? Почему веб-дизайнеры больше не любят зеленый? Об истории изменений, текущих и будущих тенденциях в небольшой статье-исследовании.

Если никто не подведёт итог под историей Macromedia Flash, она рискует затеряться в хламе IT-подвала. Напомню, что “волшебный” плагин Flash player стоял практически на всех компьютерах мира. И в какой-то момент именно эта технология была лучшей для анимации, игр и мультимедиа. В этой статье я расскажу историю технологии и добавлю историю от лица разработчика: что мы создавали, как работали,  плюсы минусы самой платформы и ключевые события. Ну и главное, почему Flash взлетела до массового распространения, а потом потерпела поражение и осталась в прошлом. И ответить на вечный вопрос “Кто виноват?” Иная версия вопроса: Зачем Стив Джобс убил Flash? Спойлер, Джобс не виноват.

Привет, я Артем, копирайтер-маркетолог для проектов о здоровье. Постоянно пишу много текстов о медицине и биологии, и мне часто нужны картинки соответствующей тематики. Воровать нехорошо, на стоковых сайтах можно найти далеко не всё, а на дизайнера у клиентов не всегда предусмотрен бюджет. Поэтому недавно решил взять себе в помощники популярную нейросеть Midjourney. Провел эксперимент и попросил ее нарисовать некоторые медицинские, биологические объекты. Смотрите, что получилось (можно ли показывать слабонервным – решайте сами).

PURE Score (Pragmatic Usability Rating by Experts). Дословно – это практический метод оценки юзабилити экспертом. Christian Rohrer из NN Groupe приводит такое определение: это метод оценки юзабилити, при котором эксперты по юзабилити (UX-дизайнер или ресечер) присваивают дизайну одну или несколько количественных оценок на основе набора критериев, а затем объединяют их в окончательную оценку для более легкого представления.

За свою карьеру я прошёл путь от тотального чайника до главного дизайнера и только господь Бог знает, что творилось в моих проектах.

Существует популярное мнение, что UI — это про то, как выглядит интерфейс, а UX — про то, как он работает и как с ним взаимодействует пользователь. Есть разные интерпретации этой парадигмы. В образовательных учреждениях, у кого-то они более удачные, у кого-то менее, но даже в корректных трактовках, когда разбираешься с начинкой курса, все сводится к тому, что UI/UX-дизайнер — это проектировщик интерфейсов, а не «буквально всего», как завещал Дон Норман. 

Три примера UX Youtube, которые вообще не про UI.

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

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

Как это повлияет на веб-дизайнеров и пора ли им подыскивать новую профессию? Или нужно подойти с другой стороны, запрячь искусственный интеллект и использовать в своих целях? Разбираемся! 

В данной статье будет описано небольшое руководство по тому, как создать сайт на таком фреймворке как Cample.js. На момент написания статьи (версия 3.1.1), фреймворк уже более года находится в разработке. За это время был реализован минимальный функционал для создания современных веб-приложений.

В 2023 году слово «дизайнер» трактуется по-разному. Для одних — это специалист, который создает графику или работает с 3D, для других — человек, который занимается изучением клиентского опыта и созданием пользовательских сценариев, а для третьих — художник и деятель искусства. Работа звучит абсолютно по-разному, хотя и те и другие являются дизайнерами. Какие дизайнеры на IT-рынке бывают на сегодняшний день:

Знаете, однажды в какой-то статье я наткнулся на интересное высказывание, которое гласило, что фронтенд-разработчик может стать последним рубежом, который может предотвратить создание «неюзабельного» UI. И это чертовски меткое и выразительное высказывание, которое отчасти и привело меня к созданию этой статьи про базовые принципы UX, которые не помешало бы иметь на вооружении каждому фронтенд-разработчику.

Дизайн превью: Марина Четвертакова

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

ADI (Artificial Design Intelligence) – это технология, использующая искусственный интеллект (ИИ) для автоматизации дизайна и графики. Её можно применять не только в дизайне, но и в веб-дизайне, архитектуре, производстве и других областях. Основная идея заключается в ускорении и упрощении создания дизайн-проектов, делая их более эффективными и доступными.

Стоит отметить, что ADI – относительно новая технология с постоянно расширяющимися возможностями. Она позволяет исследовать и использовать ИИ для улучшения дизайна и сделать его более инновационным и эффективным. Искусственный интеллект также влияет на дизайн пользовательских интерфейсов (UI).

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

Tailwind CSS — как фреймворк для разработчиков довольно прост в понимании. По сути, он позволяет вам встраивать код CSS в ваш HTML код. Чтобы, как говорится в слогане Tailwind: «быстро создавать современные веб‑сайты, не покидая HTML». Таким образом, это избавляет разработчиков от необходимости контекстно переключаться с HTML на таблицу стилей CSS.

Собственная документация Tailwind указывает на распространенное возражение против такого подхода: «разве это не просто встроенные стили?» Те из вас, кто жил в 1990-х годах, наверняка помнят, что когда‑то, еще до того, как произошла революция CSS, им приходилось добавлять разметку стилей в свои HTML‑файлы. Но, по словам Tailwind, его подход «утилитарного класса» предлагает больше функциональности, чем встроенные стили, включая возможность создавать адаптивный дизайн (дизайн, адаптированный для мобильных устройств).

Таким образом, простота использования — особенно по сравнению с кодированием и последующим обслуживанием CSS‑файла — и возможность создавать свой стиль внутри HTML являются основными причинами, по которым многие разработчики любят Tailwind.

В своем посте Мэтт Рикард добавил в качестве ключевых преимуществ фреймворка следующие пункты:

Рано или поздно каждый продуктовый дизайнер сталкивается с вопросом: нужно ли ему уметь программировать? Есть краткий ответ: дизайнеру не обязательно уметь программировать, но давайте копнём глубже.

Под продуктовым дизайнером в статье имеется в виду дизайнер цифровых продуктов, UI/UX-дизайнер, и остальные подходящие названия, которые сейчас в ходу на рынке.

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

Безболезненное изменение кнопки оплаты

Мы улучшили систему оплаты, позволив пользователям выбирать способ оплаты непосредственно из корзины. Это удобно для пользователей и помогает увеличить продажи, так как предоставление большого количества вариантов оплаты может привести к отказам от покупки.