Рубрика «UI»

Если вы варитесь в разработке и особенно в е-ком сегменте, значит в вашем таск-трекере точно появлялась задача в духе «сделай как на Wildberries, Ozon или Яндекс Маркете». 

Когда продакт-менеджер хочет показать свой обширный кругозор и «глобальное» видение рынка, туда же прицепом могли отправиться отдельные элементы из Taobao, Shein или Amazon (но это не точно). 

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

Читать полностью »

Практический разбор создания и развития собственной UI-библиотеки

Коротко: Собственная UI-библиотека — это не только набор React-компонентов. После появления нескольких проектов-потребителей на первый план выходят API, состояние, совместимость, зависимости, тестирование, документация и версионирование.

С чего всё начиналось

Когда в проекте начинает появляться всё больше одинаковых элементов интерфейса, рано или поздно возникает вопрос: зачем каждый раз создавать один и тот же Button, Input или Select?

Читать полностью »

HTML и CSS помогут вам сделать дружелюбный интерфейс! Вот моя коллекция простых лайфхаков - 1

Привет.

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

Читать полностью »

В январе 2025 года, после различных экспериментов с кодом для чатов, я захотел сделать свой красивый «идеальный» чат.

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

Всё это мне хотелось в мессенджере с людьми, а с LLM как и в сотнях других приложений для общения с ИИ‑персонажами. Но в каждом я видел какой‑то изъян, которого не должно было быть в моём приложении.

Читать полностью »

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

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

Читать полностью »

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

Регистрация

Как только пользователь проходит регистрацию и подтверждает почту, он ожидает, что попадет на ту же самую страницу, откуда начал регистрацию. Это базовый принцип UX, заключающийся в предсказуемости. Однако пользователя переносит на техническую страницу, которая явно неуместна в данном пути пользователя:

Скрин приветствия

Я не начинал с идеи написать «убийцу JavaScript». Честно говоря, такие заявления обычно только мешают думать.

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

Читать полностью »

Введение

Казалось, что DatePicker от Cloude сразу был готов в prod, но:

Я запустил NVDA, переключился клавишей Tab по нашему новому DatePicker'у, и фокус выскочил за пределы диалогового окна. В Читать полностью »

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

Как облегчить дорогу? 

Чем лучше машина, тем хуже кажется дорога

Чем лучше машина, тем хуже кажется дорога

Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js