Интерфейсы *

Таблицы, трекер задач, отчётность и другие инструменты для организации командной работы мы собрали в одном сервисе — MWS Tables. Корпоративную почту с привычным интерфейсом мы выделили в отдельный сервис. Если же вам удобнее пользоваться программами в стиле FAR Manager и Mutt, эта статья поможет. Ведь культура текстовых интерфейсов (text-based user interface, TUI) никуда не делась. Мы собрали несколько таких инструментов для работы с почтой, документами и файлами. Поговорим про файловые менеджеры Ranger и vifm, вдохновленные редактором Vim, а также SC-IM для работы с таблицами в терминале.

Несомненно, появление концепции лайка открыло новую страницу в механизме feedback. Не только для крупных компаний, но и для мелких девчушек, которые гоняются за лайками от своих сверстников. Однако, в какой‑то момент времени, лайки стали тормозить развитие механизмов получения того самого feedback. Зачем что‑то выдумывать новое, если уже есть лайк, понятный даже макаке‑резус и регулярно повсеместно используемый? Концепция лайков противоречит количественной социологии? Да ну ее на фиг, эту социологию! Одним лайком сложно получить качественный feedback? Зато лайк это уже традиция — так еще наши прадеды делали, деды, отцы делали, и мы делать будем, и наши дети и правнуки, ну Вы поняли. В данной статье не только делается попытка поиска следующего за лайком механизма feedback. Но и приводится вместе с исходным кодом действующий компонент на React TypeScript. Если кому интересна тема поиска новых механизмов feedback, добро пожаловать под кат!

«Чувствуешь запах? Это напалм, сынок. Больше ничто в мире не пахнет так.
Я люблю запах напалма поутру», — говорит с экрана полковник Килгор из фильма «Апокалипсис сегодня». Но в этот момент зритель максимум может ощутить запах попкорна или чипсов — в зависимости от того, с чем он смотрит кино.

А теперь представьте: вместе с этой легендарной репликой в нос ударяет едкий запах бензина. Каково? Закрываешь глаза — и вот ты уже во Вьетнаме, в реве вертолётов, рядом с бравым воякой.

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

Застрял(а) между макетами и расплывчатым фидбеком вроде «что-то не то»? В этой статье — почему это нормально, как выглядит кривая развития дизайнера, чем полезен T-shaped подход и что помогает выйти за рамки интерфейсов, чтобы по-настоящему влиять на продукт.

Всем привет! Меня зовут Аля, и уже больше года я являюсь частью дизайн-команды t2.digital и работаю над интерфейсами мобильного приложения t2.

Когда я только пришла в компанию, первое, что бросилось в глаза, — как неудобно были организованы макеты в Figma. Рабочее пространство больше напоминало шкаф подростка, где вперемешку лежали чистая одежда и грязные носки, по классике у половины из них не было пары. Было трудно отыскать нужные экраны для задач и ещё сложнее определить их актуальность. В такие моменты важно говорить уверенно: да, было.

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

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

Итак, давайте по порядку, что это за правила.

Привет! Меня зовут Саша – я ведущий исследователь пользовательского опыта в операционных продуктах ecom.tech. На наших технологиях работают Самокат и Мегамаркет. В этой статье расскажу, как я оказалась на огромных складах и как мои исследования помогли разработать собственную систему управления склада. Внутри вас ждёт этнография, много тестирования и живые фото. Поехали!

Я уже двадцать лет проектирую интерфейсы. Делаю интерактивные прототипы, готовлю проектную документацию, вот это всё. Получается, я сочетаю в себе компетенции системного аналитика, UX-дизайнера и ещё всякого по мелочи.

Итак.

Правда №1: я не знаю объективного способа подтвердить, что с проектированием продукты делаются быстрее и дешевле, чем без него.

То есть, для меня это очевидно. Это логично и рационально. Но не проверить.

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

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

Правда №2: никто не читает…

Идея этой статьи родилась во время задушевных разговоров на кухне и за утренним кофе с коллегами. Началось все с вопроса: «Что ты сказал бы себе прошлому, чтобы релизы стали легче, а спринты прекраснее?» Конечно, в тот момент я ничего дельного не ответил, но, кажется, наконец‑то сформулировал идеальную фразу: «Настоящий разработчик, Слав, это не тот, кто с сияющим макбуком и вкусным смузи. Разработчик — тот, кто делает то, что нужно сделать. И в легаси покопаться приходится, и memory leak дебажить, а он всё равно делает, потому что так надо».

Привет, Хабр! Меня зовут Вячеслав Чащухин, я — разработчик в МойОфис. Занимаюсь мобильной версией Squadus — цифрового рабочего пространства для совместной работы и деловых коммуникаций.

Обращаю ваше внимание на то, что эта статья — не инструкция по решению всех проблем. Скорее, чек‑лист причин, которые, по моему мнению, чаще всего приводят к тем или иным проблемам. Поэтому в некоторых пунктах будут ссылки или упоминания возможных решений. Я объединил проблемы по группам. Если вы обнаружили в своем приложении подлагивания или не хотите их обнаружить в будущем, рекомендую пройтись по пунктам :)

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

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

Привет, Хабр!

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

А недавно я подумал: а вдруг есть фронтендеры, которые хотят сделать ужасный интерфейс? Ну не любят они пользователей. Или хотят сделать пакость работодателю, который их обидел. Где им взять советы?

Надо помочь! Я собрал вредные HTML и CSS техники. Они супер простые, но очень действенные. Я уверен на сто процентов, что благодаря им интерфейс вашего проекта заставит пользователя вспомнить несколько «ласковых» слов.

Давайте посмотрим, что я вам подготовил.

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

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

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

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

Всем привет!
Меня зовут Катя Громова. Я работаю руководителем продуктового дизайна в Ozon Travel.

Сложно коротко рассказать о своём опыте — за что я только не отвечала в Travel. Мои основные обязанности — формирование единого визуала продукта и развитие продуктовой команды. Одним словом, делаю всё, чтобы пользователь возвращался к нам.

В этой статье я отвечу на следующие вопросы. Возможно ли вырасти от стажёра до руководителя в одной компании? Как сделать так, чтобы бизнес считался с дизайном? Что должен делать руководитель дизайн-команды? Или это всё простые истины, и вы уже заряжены на успех и готовы закрыть эту статью? Нет? Значит, пристегните ремни — и поехали!

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

Меня зовут Артём Говердовский, я дизайн-директор Домклик Сбера. Год назад я выпустил статью «Шаг за шагом: как добиться синхронности в дизайн-команде за 9 месяцев», где описал структуру нашего отдела, ключевые направления работы и процессы, которые мы выстроили. С тех пор команда и доверие к нам только растут, а значит, пора двигаться дальше. Сейчас мы фокусируемся на стратегических задачах: прокачиваем не только дизайн, но и влияние на продукт в целом. В этой статье подведём итоги 2024 года, расскажем о новых целях и планах, а также о ключевых инициативах, которые мы запускаем. Среди них:

Стратегические задачи дизайна: как сделать вклад дизайна в бизнес измеримым и системным, внедряя delivery-driven подход и ускоряя циклы обновлений.

Влияние на продукт: через анализ метрик дизайн-системы и единый Look & Feel продукта во всех точках контакта с пользователем.

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

Мы команда проектировщиков интерфейсов Экзона, а Экзон — это продукт для цифровизации строительства.

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

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

Привет, меня зовут Федоров Кирилл, я менеджер продукта компании Forecast NOW!. Мы делаем систему для прогнозирования спроса, автозаказа и управления запасами. В конце прошлого года мы выпустили новую версию с обновленным интерфейсом. В статье расскажу о том, почему решили менять интерфейс, как тестировали новые наработки и с какими сложностями столкнулись в процессе. 

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

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

Негативный эффект обманутого ожидания в UX/UI дизайне

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

Предлагаю начать с негативной стороны эффекта и рассмотреть ситуации, в которых у пользователя появляется раздражение от невозможности достичь своей цели и возникают вопросы «А что дальше?», «Как получить ожидаемый результат?».

Дизайн-ревью —достаточно важная вещь, которая требует внимания, когда фронтенд-разработчик сверстал новую фичу, блок или целую страницу. Вовсе не для pixel perfect, который «как задизайнили, так и сверстали» — пиксель в пиксель. Pixel perfect в десктопе — это чушь, потому что нельзя сверстать так, чтобы с разных браузеров (привет, Safari) и разрешений всё смотрелось идеально. Но ошибки, которые сразу бросаются в глаза, сразу подмечаю, структурирую и обсуждаю это с разработчиком, может, появились какие-либо ограничения и прочее. Поэтому никогда не жалею время на дизайн-ревью и через DevTools сам проверяю то, что сверстал разработчик.

Все инструменты и функциональность, о которых пойдёт речь в этой статье, можно найти в браузере в «Инструментах разработчика» (клавиша F12 / Ctrl + Shift + I (на Windows) или ⌘ + ⌥ + I (на Mac), или клик правой кнопкой мыши в любом месте страницы -> Выбор пункта меню — «Просмотр кода страницы» (или «Исходный код страницы») — это и есть DevTools).

Основной элемент для работы с девтулзами — «Инспектор» (Ctrl + Shift +C на Windows и ⌥+⌘+I на MacOS) — это инструмент поиска элементов на странице браузера.

Привет. Я занимаюсь реализацией UI в нашей небольшой команде, разрабатывающей игры. Долгое время занимался 3D-моделированием, моушн-дизайном, UX/UI-дизайном, построением дизайн-систем. Позже жизнь привела меня в игровую индустрию, где я применил предыдущие навыки.

Команда разрабатывала гиперказуальные игры, и на момент моего присоединения к ней происходила перестройка — переход от гиперказуальных игр к хардкорным проектам. Тогда рассматривались два варианта новых проектов: