Все потоки
Поиск
Написать публикацию
Обновить
56.65

Веб-дизайн *

Дизайн спасет мир

Сначала показывать
Порог рейтинга
Уровень сложности

Как за год перезапустить онлайн-банк для бизнеса, влюбить в него клиентов и повысить продажи. Опыт продакт-лида

Время на прочтение7 мин
Количество просмотров1.3K

Как за год перезапустить онлайн-банк для бизнеса, влюбить в него клиентов и повысить продажи. Опыт продакт-лида 

Привет! Меня зовут Альберт Геворкян, я Product Lead в МТС Финтех. Здесь поделюсь опытом, как за время моей работы радикально обновился онлайн‑банк для бизнеса, доля продаж через платформу выросла на 25 п.п., а удовлетворённость клиентов — на 50%.

Читать далее

Новости

Nano Banana для дизайнеров: как работать, не отходя от Figma

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров7K

Привет, Хабр! Меня зовут Алина Сидоренко, я лид-дизайнер в компании Friflex. В этой статье я расскажу, как быстро генерировать и редактировать изображения без фотошопа (и даже не выходя из Figma) с помощью нейросети Nano Banana. Это модель редактирования и генерации изображений внутри ИИ-помощника Gemini от Google, которая позволяет точечно менять отдельные элементы на фото и при этом не разрушать всю сцену.

Читать далее

HTML мёртв, да здравствует HTML

Уровень сложностиПростой
Время на прочтение12 мин
Количество просмотров13K

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

Энтузиасты будут говорить вам, что доступ к нативным веб-API через WASM — это решённая задача, достаточно лишь минимального клея JS.

Но никто не задаёт вопрос, зачем нам вообще нужно получать доступ к DOM. Это лишь один из вариантов. В этой статье мне бы хотелось объяснить, почему уже настало время отправить DOM и всевозможные API на радугу, а также поделиться некоторыми идеями о том, как это сделать.

Не буду притворяться, что знаю о браузерах всё. Сегодня уже никто не знает всего, в этом-то и проблема.

Читать далее

Как добиться успешного успеха в IT? История моего возвышения… Глава 4

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров2.1K

В предыдущей главе мы столкнулись с вселенским западлом, но умело преодолели его и вышли в Всемирную Сеть. Dialing...

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

Назад, в темные века интернета...

Как я попала на стажировку продуктовым дизайнером в Яндекс и как к ней готовилась

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров4K

Привет! Меня зовут Рената, сейчас я работаю продуктовым дизайнером в Авто.ру, до этого работала в Яндекс Путешествиях, где и проходила моя стажировка. Параллельно учусь в Центральном университете и менторю начинающих дизайнеров, помогаю получить первую стажировку

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

Читать далее

UX/UI портфолио. Часть 5: Культура отвратительных образцов

Время на прочтение5 мин
Количество просмотров2.8K

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

За год изучения вопроса и погружения в тематику посмотрел большое количество текстов и видео. Если все эти материалы сжать в одну эмоцию, то это однозначно будет «страдание». Дизайнеры страдают… Недавно попалось видео в котором молодая дизайнерка рассказывала трагическую и поучительную историю своего трудоустройства, сравнимую по накалу страстей ни много ни мало с самим Гамлетом. Фабула: заказчики дураки, а я в белом пальто стою красивая. Ну, и конечно, не обошлось без советов космического масштаба и космической же глупости…

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

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

Читать далее

UX на дофамине: как система вознаграждения влияет на поведение пользователя

Уровень сложностиСредний
Время на прочтение5 мин
Количество просмотров1.2K

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

Привет, Хабр! Меня зовут Роман Горшков, и я арт-директор в Битрикс24. Я работаю с комплексным B2B-продуктом, у которого множество пользовательских сценариев. И это та среда, где любое лишнее движение стоит времени и денег бизнеса, а внимание аудитории и так рассеивается между звонками, чатами и отчётами.

В этой статье я хочу отделить рабочие дофаминовые стимулы от манипулятивных приёмов и показать, как именно нейромеханики внимания можно применять в B2B-системах.

Читать далее

Отправиться на тот цвет: CSS Color 4. Как добавить яркие краски в серые веб-будни

Уровень сложностиПростой
Время на прочтение11 мин
Количество просмотров2.3K

Привет! Меня зовут Антон Романов, я старший Angular-разработчик в Т-Банке, занимаюсь платежными формами T-Pay QR.

Поведаю о цветовых пространствах спецификации CSS Color 4, объясню их уникальность и специфику, расскажу о сценариях применения и плюсах, которые можно от этого получить.

Пропустим классическое вступление про устройство глаза, светочувствительные палочки и колбочки (там ничего нового, свежих релизов не было). Перейдем сразу к CSS, добро пожаловать под кат!

Читать далее

Как проектировать интерфейсы по азиатски: холистически и беспощадно

Уровень сложностиПростой
Время на прочтение18 мин
Количество просмотров3K

Почему западные интерфейсы стремятся к минимализму и упрощению, а азиатские, напротив, демонстрируют переизбыток информации?

Почему в азиатских культурах, особенно в Восточной Азии, пользователи привыкли к большому объему визуального контента и считают важным иметь доступ ко всей необходимой информации сразу, а небольшое количества информации или выбора может вызвать недоверие?

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

Давайте попробуем разобраться и посмотрим на примерах, как свойства культуры проявляются в интерфейсах.

Читать далее

Книга: «Дизайн в масштабе. Создание устойчивой дизайн-системы»

Время на прочтение5 мин
Количество просмотров3.2K

Привет, Хаброжители! Дизайнеры и разработчики организуют единую систему с компонентами, стилями и гайдлайнами для многократного использования, чтобы каждый раз не изобретать велосипед. Но превратить набор шаблонов в гибкую, надежную и масштабируемую систему — задача не из легких.

Эксперт по дизайн-системам Дэн Молл раскрывает проверенные стратегии, инструменты и ключевые концепции, показывая на реальных примерах, как выстроить дизайн-систему, которая будет работать в любой среде.

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

Читать далее

Leaflet, роутинг и тонна JavaScript: создаем свой планировщик маршрутов с нуля

Уровень сложностиСредний
Время на прочтение10 мин
Количество просмотров3.1K

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

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

Читать далее

Как прийти к мультиязычной дизайн-системе и выучить арабский

Уровень сложностиСложный
Время на прочтение5 мин
Количество просмотров1.4K

Что, если бы дизайн-система умела не просто менять язык, а адаптироваться под культуру, направление чтения, шрифты и даже знаки препинания? А если бы она делала это автоматически — без боли, костылей и ручной работы?

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

Читать далее

Создание интерактивного макета. Задача упаковки кругов в круг. Метод отжига

Уровень сложностиСредний
Время на прочтение16 мин
Количество просмотров2.5K

Я разработала интерактивный макет для создания композиций цветов. Проблема свелась к задаче упаковки кругов в круг и её автоматизированному решению методом отжига. Расскажу теорию и математически обосную практику с визуальными пояснениями.

Читать далее

Ближайшие события

Как мир вернулся в «классический веб» — взлет и падение эпохи мобильных приложений

Время на прочтение7 мин
Количество просмотров23K

Помните, одно время тематические площадки заполонили статьи вида: «Я устал от [плохих] приложений для изучения английского, поэтому сделал своё» или «Я устал от [неправильных] трекеров продуктивности, поэтому создал собственный»? В реалиях современных аппсторов заголовок можно сократить до: «Я устал».

Статистика говорит, что app fatigue is real. А мы в Beeline Cloud решили посмотреть, как менялось отношение к приложениям — от «эры пост-ПК» до настоящего времени.

Читать далее

Онбординг начинается не в продукте. Ошибка, которая стоит вам 50% активации

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров771

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

Привет! Меня зовут Богдан, я дизайн-директор в ВТБ. Перед тем, как мы продолжим разбираться с активацией и онбордингом подпишитесь на мой тг-канал https://t.me/designfintech — тут я делюсь полезными материалами по дизайн-менеджменту, коомуникации и продуктовым кейсам.

Читать далее

Как создать сложную 2D-анимацию в веб-разработке: пошаговый гайд

Время на прочтение7 мин
Количество просмотров3.8K

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

Меня зовут Маша, я дизайнер в Selectel. В этой статье расскажу, как создать сложную анимацию с использованием Lottie и After Effects. Будет полезно дизайнерам и начинающим разработчикам.

Читать далее

Lottie в интерфейсах: как мы оживляем 2ГИС с помощью анимаций

Уровень сложностиСредний
Время на прочтение10 мин
Количество просмотров3.2K

Анимация уже давно стала стандартным инструментом в дизайне и способна выполнять самые разные задачи: обеспечивает плавность и приятную отзывчивость — как в современных ОС (например, дизайн-система Android Material 3 или Apple, которые используют принципы Springs), транслирует голос бренда и становится частью айдентики (CashMoney, Instagram, Plex), добавляет продуктовым сценариям эмоциональность и значимость. Недавно и перед нашей командой встала задача «оживить» некоторые из них. 

Меня зовут Саша Гончаров, я моушен-дизайнер в 2ГИС. По просьбе продуктовых дизайнеров я подключился к работе над анимацией интерфейсов. В этой статье вместе с разработчиком Сергеем Львовым расскажем, на что стоит обращать внимание при создании интерфейсных анимаций, какие технические нюансы важно учитывать и как мы достигаем желаемых эффектов. Материал будет полезен моушен-дизайнерам, которые хотят работать с интерфейсами, а также разработчикам, интересующимся особенностями рендеринга объектов на карте.

Читать

Как создать дизайн-систему для сайта, если ты не дизайнер

Уровень сложностиПростой
Время на прочтение6 мин
Количество просмотров4K

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

Я разработчик в компании bpm (ранее “ЛАНИТ - Би Пи Эм”). Столкнувшись с хаосом в интерфейсах и постоянными правками, я решила изучить, как можно организовать процесс создания дизайн-системы самостоятельно. Результат вы видите в этой статье. Очень надеюсь, что описанные правила помогут вам сделать первые шаги в создании дизайна для вашего проекта.

Читать далее

Nano Banana от Google: генерация и редактирование изображений на новой архитектуре Gemini 2.5

Уровень сложностиСредний
Время на прочтение2 мин
Количество просмотров33K

26 августа 2025 года Google представила новую preview-модель под кодовым названием Nano Banana — это часть экосистемы Gemini 2.5 Flash Image, ориентированной на генерацию и редактирование изображений с помощью текстовых и мультимодальных запросов. Несмотря на шутливое название, перед нами — серьёзный инструмент с претензией на роль нового стандарта в визуальном ИИ.

Читать далее

История жизни одного макета. Как мы унифицировали правила работы с дизайном

Время на прочтение11 мин
Количество просмотров1.2K

Привет! Меня зовут Анна, я маркетолог команды цифровой трансформации Ареал.

Более чем за 20 лет работы у нас сложилась система шагов и правил для дизайн-процессов. Единые стандарты позволяют команде говорить на одном языке, вести прозрачный диалог с клиентами, быстро ориентироваться в стартовавшем или новом проекте.

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

Мы работаем в Figma, но систему можно организовать в любом редакторе.

Читать далее
1
23 ...

Вклад авторов