Рубрика «интерфейс пользователя»

image

Telegram выпустил очередное обновление. Оно включает новую версию функции «Люди рядом», которая позволяет находить тех, кто находится в радиусе 100 м — 6 км. Теперь ее можно использовать для знакомств.

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

image

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

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

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

  1. Структура и схема.
  2. Представление и доступность.
  3. Выбор используемых графиков.
  4. Усовершенствование контекста.

Часть 1. Структура и схема

Давайте для начала остановимся и зададим себе два вопроса: кто наша целевая аудитория и каковы её цели?

Знание своей целевой аудитории и её задач критически важно для остальной части работы. Если ваша ЦА — руководители разработки, которым нужно знать высокоуровневую информацию о функционировании системы, то нужные им данные будут сильно отличаться от тех, которые необходимы приходящему инженеру.

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

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

Четыре способа работы с текстом UI в Unity - 1

Пример спрайтового шрифта

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

Поэтому я приступил к каталогизации различных опций, которые предоставляет Unity при работе с текстом UI (в том числе недавно приобретённого Unity и встроенного в версию 2018.1 TextMesh Pro). Хотя мои знания типографики довольно узки (а тема эта, похоже, очень сложна), статья позволит вам понять, какие возможности существуют и как их можно использовать.
Читать полностью »

image

Разработчики видеоигр используют графику и текст для отображения необходимой информации, например, здоровья или очков. Это называется интерфейсом пользователя (user interface, UI).

UI в Unreal Engine 4 создаётся с помощью Unreal Motion Graphics (UMG). UMG позволяет удобно выстраивать UI, перетаскивая элементы UI, такие как кнопки и текстовые метки.

В этой части туториала вы научитесь следующему:

  • Создавать HUD-дисплей, на котором отображается счётчик и таймер
  • Отображать HUD на экране
  • Обновлять счётчик и таймер, чтобы отображать значения переменных

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

image

Привет, меня зовут Хисаёси Кидзима, я дизайнер UI и мехов для NieR:Automata. Игровой UI (интерфейс пользователя) часто остаётся незамеченным, поэтому я рад услышать, что фанаты нашли дневник разработчиков NieR:Automata и спросили о моей работе!

Когда директор NieR:Automata Йоко Таро работает над играми, он всегда чётко знает, чего хочет, и UI не стал исключением. Я хочу рассказать вам о моей работе над UI для NieR:Automata, а также о тех заданиях, которые мне давал Йоко-сан.
Читать полностью »

Недавно стал работать в R/3. Безусловно, мощная и полезная программа. Но ее юзабилити осталось в прошлом веке. Я как программист догадываюсь, как разрабатывали SAP R/3 для нашей компании.

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

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

— А давай сделаем элементы управления настолько необычными, чтобы никто не догадался, что, например, часть панели – это кнопка, а вот этот квадратик – это ссылка.

— А давай выведем все, какие только можно, кнопочки и поля на один экран, чтобы на анализ формы пользователь потратил весь свой мозг.
Читать полностью »

По UI мотивам недалёкого прошлого или визуализация системы с нуля - 1
Хочу поделиться с вами своим опытом разработки с нуля системы внутрикорпоративного менеджмента чатов и аудио/видео записей. Дело было поболее года назад. Забегая вперёд, хочу с огорчением сказать, что сейчас проект заморожен. Кризис ли, потеря веры в проект руководством или еще какие-то причины — мне неизвестно. Хотя коллектив был приятный, решать задачи было интересно и увлекательно. Я вообще люблю постановку задач в духе: “У нас есть вот такой набор данных, но мы не знаем как это должно выглядеть. Вот, возьми карандаш и изобрази нам чего-нибудь”. И сотрудничество с ними идеально попало под такой формат.Читать полностью »

С чего началось использование [x] в дизайне графических интерфейсовРаботая над интерфейсом Web-payment.ru — сайта о платежных системах, я стараюсь руководствоваться принципом KISS (keep it short and simple) — все должно быть понятно и очевидно. Немалую роль в дружественном взаимодействии пользователя и сайта играют привычные элементы управления. Например, крестик для закрытия окна. Последние несколько дней в интернете широко обсуждалась одна статья об истоках возникновения этого элемента пользовательского интерфейса и она даже привлекла внимание одного из первых разработчиков Windows 95, но об этом ниже.

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

Использование нажатия на [x] для того, чтобы закрыть тот или иной элемент превратилось в один из основных инстинктов, связанных с использованием компьютера и стало стандартом в дизайне веб-сайтов и компьютерных приложений. Может показаться, что вездесущий [x] всегда был частью интерфейсов, однако этот короткий и увлекательный экскурс в историю пользовательских графических интерфейсов показывает, что на самом деле дела обстоят иначе.

Итак, где и когда [х] впервые попал в лексикон интерфейсов?
Читать полностью »

Вступление

Интуитивный и удобный макет пользовательского интерфейса (GUI) для коммуникаторов и планшетных ПКОчень много существуют различных методологий и подходов к обеспечению удобства для пользователей при использовании того или иного интерфейса коммуникации человека с техническим устройством. Сейчас существует большое количество разнообразных коммуникационных интерфейсов: тактильные (кнопки/клавиатура, рычаги/джойстики/манипуляторы(«мышь» и т.п.), тач-скрины/-пады и т.д.) и не тактильные (основанные на жестах, акустические и т.д.). У всех них разное назначение и сферы применения.

В этой публикации мы поговорим о мобильных интерфейсах для навигации и работы с WEB-страницами и контентом. Также, постараемся вместе сделать что-то простое и интуитивно-понятное для большинства пользователей мобильных устройств, таких как коммуникаторы или планшеты с тач-скрин экранами (и/или аналогичными устройствами).
Читать полностью »

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


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