Веб-дизайн *

Увидели скриншот интерфейса — и сразу захотелось вставить свои пять копеек? Не спешите с критикой.

Вот один из комментариев к моему редизайну интерфейса для радиоприёмника:

— Как говорится, а теперь сравните размер шрифта, контрастность и читаемость в исходном интерфейсе и в новом. Учитывайте мелкий размер экрана. Да, новый интерфейс "красивее", но экран монитора и дисплей устройства — это две большие разницы (с).

А вот другой — от друга, которому я показывал концепт за неделю до публикации:

— Ну у меня всё ещё вытекают глаза, но стало лучше.

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

В силу личной специфики (я чаще работаю не над веб-страницами, а над интерфейсами для десктопных и мобильных приложений, которые пишу на HTML/CSS), я долго избегал рабочие процессы сложнее, чем «отредактировал CSS-файл и сохранил его», и открыл для себя CSS-препроцессинг довольно поздно, но… В наши дни он, в общем-то, ничуть не устарел, и актуален не меньше, чем раньше. Так что, если вы пишете CSS (а не генерируете его) для чего угодно (SPA, приложения, лендинги, веб-аппы и т.д.), но до сих пор не пользуетесь LESS или SASS — приглашаю под кат, где я, стараясь не опускаться до уровня «очередной-пересказ-учебника», немного расскажу о принципах LESS, инструментах, его текущем состоянии и поделюсь своими техниками и приёмами (с примерами). А если вы не пишете CSS, но знакомы с традиционными языками программирования, всё равно добро пожаловать: я провожу параллели между ними и LESS, а заодно рассказываю об очень полезных принципах проектирования от Алана Кея.

Карта карьерного развития в дизайне,  в виде путешествия по «землям» и «территориям» профессионального роста. Предположительно Facebook

Самый заинтересованный человек в своём профессиональном росте — ты сам. Поэтому важно чётко понимать, куда двигаться и как это делать осознанно. Сегодня разберёмся, что такое компетенции, какие они бывают и как развивать их с умом. Поговорим о том, как сфокусироваться только на тех навыках, которые действительно открывают возможности для роста, и как прокачать их максимально эффективно. А ещё узнаем, что такое матрица компетенций и посмотрим, как с ней работают ведущие компании в России и за рубежом.

Почему опасно знать свой продукт слишком хорошо

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

Параллельно вспоминаю свои собеседования год назад.
Если вакансия была из e-commerce, спрашивали, есть ли у меня опыт в e-commerce. Если из B2B — интересовались, работала ли я с B2B-интерфейсами. Если это CRM — уточняли, сталкивалась ли я с CRM-системами.
Каждый раз — этот логичный вопрос, ибо чем ближе предыдущий опыт, тем быстрее адаптация и выше шанс дать результат.
Но внутри эти вопросы вызывали удивление. Не потому, что мне нечего было ответить. А потому что в них слышался намёк: «ты — дизайнер чего-то». Дизайнер дашбордов. Дизайнер маркетплейсов. Дизайнер финтеха.

Всем привет! Я Женя Белодед, ex-арт-директор в Студии Райт. К нам пришел клиент — CSI, разработчик IT-решений для автоматизации ритейла. Его запрос — обновить интерфейс касс самообслуживания CSI K, которыми будут пользоваться покупатели в 90 торговых сетях России и СНГ.

Сегодня о важности проектирования в контексте и о том, как окружение интерфейса и его эргономика все меняют. Спойлер: без факапов не обошлось, но они сделали нас сильнее! Погнали!

Текст — это не просто набор букв. Это мощный инструмент, который влияет на восприятие дизайна, удобство чтения и даже доверие пользователей. Хотите, чтобы ваш сайт или печатные материалы выглядели профессионально? Тогда давайте разберём основы типографики простыми словами.

В данной статье разберем:

- Важность подбора правильного шрифта

- Как выбрать шрифты?

- Где искать шрифты?

- Размер и расстояние – основа удобства

- Контраст и цвет текста

- Ошибки, которые портят типографику и как их избежать

Мой веб-сайт — это путешествие по волнам памяти. Я не хочу сказать, что нужно прекратить современную веб-разработку. На моём веб-сайте используются технологии, которые в обсуждаемые на нём времена были ещё недоступны. Он работает на мобильных (протестировано в Firefox для Android), отсутствует только фоновое изображение.

Свой первый веб-сайт я создал где-то в начале 2000-х, и как и большинство веб-сайтов того времени, он был очень простым. Это неудивительно, учитывая то, что большинство (включая и меня) писали такие веб-сайты в Блокноте, что накладывало ограничения на сложность. Можно было выбрать или Блокнот, или какой-то из WYSIWYG-редакторов, которые привязывали к себе тем, что сгенерированный ими HTML было бы совершенно невозможно поддерживать без них, а если вносить изменения вручную, то это вполне могло поломать всё в редакторе.

Тогда не было iPhone, почти не было SEO, а JavaScript, как и CSS, использовать было совсем необязательно.

Цветопередача первых ЖК-экранов была плохой, поэтому лучше было выбирать цветовую схему с высокой контрастностью.

Оптимальным разрешением было 1024×768 (или 1280×1024, если вы могли себе это позволить), однако стоило и обеспечить работоспособность размеров окна и панелей в 800×600. Вам же не нужно, чтобы контент выходил за левый или правый край экрана?

Если в команде каждый делает всё, а пользовательские исследования – это «когда-нибудь потом», статья для вас. Я делюсь опытом, как мы наладили процесс discovery в маленькой команде без ресерчера и бюджета. Как шаблоны, хранилище знаний и короткие инсайты на ревью спринта изменили культуру команды. И почему для меня Research Ops – это не должность, а привычка думать вместе с пользователем.

Больше не нужно несколько часов составлять воркфлоу для ComfyUI или Forge, чтобы сгенерировать стиль по промпту и референсу.

Теперь можно настроить одну модель и с помощью текстовой подсказки можно получить то, что ты хочешь!

Формат JPEG появился в 1992 году и стал де-факто стандартом хранения фотографий в интернете. Спустя более 30 лет появляются всё более эффективные и продвинутые альтернативы: WebP, AVIF, JPEG XL и другие. Однако даже в 2025 году JPEG продолжает доминировать. Почему так происходит, несмотря на очевидные преимущества новых форматов? В этой статье мы проведем обзор форматов и разберёмся в причинах.

Привет, я Саша Равинская, контент-дизайнер в QIC digital hub. В этой статье я поделюсь опытом того, как в ограниченных условиях успевать делать текучку, работать над редполитиками, внедрять новые инструменты и менять процессы в командах, чтобы  успевать жить после работы. Думаю, это может пригодиться не только коллегам-писателям, но и тем, кто вынужден в условиях ограниченных ресурсов выполнять большие  объемы задач.

Сфера дизайна выглядит привлекательно: курсы обещают лёгкий старт в IT, «золотые горы» и работу мечты, а сами задачи кажутся лайтовыми. Я осваиваю эту профессию уже второй год. В статье — мои неочевидные и, возможно, неудобные мысли о текущем состоянии рынка как в найме, так и на фрилансе. Спойлер: на мой взгляд, дело не только в работодателях.

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

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

Но не все дизайнеры строят карьеру через мемы, созвоны и внутреннюю влюблённость в команду. Кто-то просто делает работу. Странно, да?

Привет, Хабр! Меня зовут Александр, я разработчик и, как многие в IT, стараюсь уравновешивать сидячую работу спортом — в моем случае, это велосипед и бег. И, как многие спортсмены-любители, я пользуюсь Strava.

В этой статье я хочу провести вас «под капот» моего проекта и показать на реальных фрагментах кода, как с помощью Python, щепотки NumPy и капли JavaScript можно построить собственный мощный инструмент для анализа спортивных данных. Это история не только про код, но и про философию открытых данных и желание сделать профессиональные инструменты доступными для всех.

Продолжаем развивать интерфейс дисплея Guition на ESPHome с использованием LVGL. Изначально планировалось просто добавить пару виджетов, но в процессе работы появилась идея кардинально изменить структуру проекта: сделать виджеты подключаемыми, вынести сущности в переменные для шаблонизации и максимально упростить использование прошивки для конечного пользователя.

В книге «Законы простоты » Джон Маэда (из MIT) предлагает десять законов для баланса простоты и сложности в бизнесе, технологиях и дизайне — руководящие принципы для того, чтобы нуждаться в меньшем и на самом деле получать больше.

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

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

Именно здесь на сцену выходят UX (User Experience) и UI (User Interface) — два фундаментальных направления дизайна, которые, как инь и ян, дополняют друг друга, но решают принципиально разные задачи.

В данной статье разберем:

- UX-дизайн = логика, удобство и функциональность

- Тепловая карта (heatmap) — цифровой детектор лжи для вашего сайта

- Современные тренды UX-дизайна

- UI-дизайн: визуальная магия цифровых продуктов

- Современные тренды UI - дизайна

- Как UX и UI дизайн дополняют друг друга

Использование WAI-ARIA как основы архитектуры UI-компонентов даёт неожиданные преимущества:

Ускоряет разработку — у вас есть готовые паттерны для большинства случаев

Упрощает рефакторинг — чёткая структура кода позволяет легко вносить изменения

Улучшает коммуникацию — единая терминология помогает в общении с дизайнерами

Повышает качество — вы не забудете про важные детали вроде focus management

Повышает конкурентноспособность - продукт не столкнется с государственным или иным регулированием

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

Если долго копать продукт, можно докопаться до вещей, которые там не просто "остались" — они живут, плодятся и воспроизводятся как норма. Не потому что нужны. А потому что так удобно системе, а не пользователю.

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