Революционные решения в UI/UX-дизайне Windows 10
Windows 10 представила революционные для экосистемы Microsoft решения в UI/UX-дизайне. Гибридное меню «Пуск» объединило классический интерфейс и живые плитки, нивелируя ошибки Windows 8. Впервые в Windows появился Task View с виртуальными рабочими столами, позволяющий организовывать задачи в отдельные пространства (аналогичные функции ранее были только в macOS/Linux). Дебют Fluent Design System добавил эффекты прозрачности (Acrylic) в приложениях «Почта» и «Календарь», динамическое освещение интерактивных элементов (Reveal Highlight) и анимацию, улучшив восприятие глубины интерфейса.
Continuum динамически адаптировал интерфейс под сценарии использования: при отсоединении клавиатуры в 2-в-1 устройствах активировался сенсорный режим с увеличенными элементами. Центр уведомлений интегрировал быстрые настройки (например, режим «Не беспокоить» и Night Light) и push-уведомления в единую панель. Улучшенный Snap Assist предлагал оптимальные расположения окон, а Snap Groups сохраняли связки приложений для многозадачности.
Системные настройки переехали в современное приложение с поисковой строкой и категориями, постепенно вытесняя Control Panel. Сквозной темный режим (настраиваемый глобально или для отдельных приложений) снизил нагрузку на глаза, а клавиатура с сенсорным вводом получила адаптивные макеты и панель эмодзи (Win + .). При этом, большинство настроек можно автоматически применить в момент установки, для этого создается Windows 10 загрузочная флешка, в которой при создании указываются нужные варианты интерфейса и дизайна системы.
Хотя Cortana и интеграция с Xbox позже утратили актуальность, фокус на гибкость (баланс между сенсорным и классическим управлением) и визуальную согласованность заложил основу для Windows 11. Для бизнеса ключевым остался Group Policy Editor, позволяющий кастомизировать интерфейс под корпоративные нужды — например, скрывать плитки или блокировать обновления интерфейса.
Кнопка на 300 миллионов
Как изменение кнопки увеличило годовой доход сайта на 300 миллионов долларов. Сложно представить форму проще: два поля, две кнопки и одна ссылка. Но оказывается, эта форма была препятствием, не позволяющим клиентам покупать товары в одном крупном интернет-магазине на сумму примерно 300 миллионов долларов в год. Хуже всего было то, что дизайнеры сайта даже не догадывались о том, что с этой формой есть проблемы.
Читать полностью: Кнопка на 300 миллионов
Не используйте предупреждения, если есть возможность отменить действие
Попадали ли вы в ситуацию, когда через секунду после того, как вы нажали «Да» в каком-нибудь окошке, вы понимали, что нужно было нажать «Нет». Да? Ну, тогда вы в хорошей компании – каждый хоть раз бывал в такой ситуации. На самом деле, это не ваша вина – это вина программного обеспечения. Почему? Да потому, что программы должны знать, что у нас есть привычки. Программы должны знать, что после того, как человек десять раз подряд нажмет «Да», он, скорее всего, нажмет его и в одиннадцатый. Даже если и не собирался этого делать.
Читать полностью: Не используйте предупреждения, если есть возможность отменить действие
Вопрос на 3 миллиарда
Amazon позволяет делать лучшими как положительные, так и отрицательные отзывы и благодаря этому и те и другие легко находить.
Далее...
Удобные формы с помощью jQuery
Иногда легко определить, что пользователь вводит неправильные данные. В адресе электронной почты не может быть русских символов.
Далее...
Почему дизайнеры терпят неудачи
На прошлой неделе я анонсировал исследование вопроса о том, почему дизайнеры ошибаются...
Далее...
Процесс разработки сайта
Три наших персонажа: программист, дизайнер и клиент.
Шаг 1: Обсуждение
Естественно, любой проект начинается со встречи с клиентом. На первой встрече вам нужно определить основные направления работы – какой продукт необходимо сделать, какими функциями он будет обладать, какие потребуются материалы (тексты, изображения и т.д.).
Читать полностью: Процесс разработки сайта
Визуальная коммуникация в контекстно-зависимых полях
Контекстно-зависимые поля требуют от пользователя ввести дополнительную информацию в зависимости от первоначального выбора, чтобы завершить заполнение формы. В статье Selection-Dependent Inputs (Контекстно-зависимые поля) я описал ряд способов решения этого вопроса. В каждом из этих решений визуальная часть необходима, чтобы помочь пользователям понять, как их первоначальный выбор связан с последующими вопросами, на которые им нужно ответить. Когда визуальная коммуникация отсутствует, форма становится вксьма запутанной.