Показаны сообщения с ярлыком UI. Показать все сообщения
Показаны сообщения с ярлыком UI. Показать все сообщения
На любое упрощение интерфейса люди отвечают повышением своей тупости, иногда кратно
Когда то я думал что люди рождённые в 1995-2000 года будут влёт разбираться в компъютерах и новых технологиях (потому что они окружают их с детства), а профессия эникейщика вообще вымрет...
Хрен там!!! На любое упрощение интерфейса люди отвечают повышением своей тупости, иногда кратно.
Управление должно быть интуитивным, прогнозируемым
Система должна знать, что вы хотите ещё до того как вы сами это поймёте.
Open-source реализации компонентов для работы с тегами
http://stackoverflow.com/a/2674466
Простой аккуратный вариант:
https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/
Варианты, где можно выбирать теги из списка:
Интересный пример работы с select2:
Примеры реализации на CSS:
Простой аккуратный вариант:
https://bootstrap-tagsinput.github.io/bootstrap-tagsinput/examples/
Варианты, где можно выбирать теги из списка:
- http://nicolasbize.com/magicsuggest/examples.html
- http://documentcloud.github.io/visualsearch/#demo
- https://select2.github.io/examples.html
Интересный пример работы с select2:
- http://stackoverflow.com/questions/21909391/how-to-let-jquery-select2-disable-one-option-dynamically
- http://jsfiddle.net/LrnbZ/2/
Примеры реализации на CSS:
- https://codepen.io/wbeeftink/pen/dIaDH
- http://dimox.net/beautiful-tags-for-a-website-using-only-css/
- http://stackoverflow.com/questions/33649331/how-to-create-a-tagging-style-with-css-html-and-jquery
Каким должен быть графический элемент интерфейса список?
Открыл для себя недавно профили в браузерах. Жутко полезная вещь. Раньше как дурак пользовался десятком браузеров для разных аккаунтов. Ну так вот в Chrome список профилей выстраивается по алфавиту и нельзя поставить рядом два связанных по смыслу профиля. Из этого я задумался, а каким вообще должен быть GUI список.
- Список должен позволять добавлять и удалять элементы из него.
- Список должен позволять копировать, вырезать и вставлять элемент из другого списка.
- Список должен позволять изменять элемент. Если у элемента есть имя, то должна быть возможность менять его.
- Список должен позволять выполнять сортировку. Нужна как автоматическая сортировка по возрастанию/убыванию, по параметрам, так и пользовательская произвольная сортировка.
- Список должен позволять выбирать один или несколько элементов и применять к выбранному количеству элементов любые операции, которые можно выполнить и над одним элементом. Например, массовое удаление или копирование элементов.
- Список должен поддерживать drag-and-drop функции. Например чтобы перемещать элементы между списками, или добавлять в список элемент из другого источника, или удалять элемент путем его выноса за рамки списка.
- Список должен помнить свое последнее состояние. Позицию на полосе прокрутки. Выбранные элементы. Очень неприятно, когда список обновляется и теряет своё состояние. Приходится снова крутить полосу прокрутки и искать элементы.
- Часто используемые элементе списка можно потихоньку поднимать наверх, а менее используемые опускать вниз.
- Список должен поддерживать поиск. Например поиск по имени или другим параметрам.
- Список должен поддерживать фильтрацию элементов.
Видите сколько пунктов. Один маленький список, а сколько всего надо реализовать, чтобы сделать его по-настоящему удобным для использования.
Например, в Chrome нельзя отсортировать список закладок по алфавиту, а иногда это нужно. А в Firefox это есть. Вроде бы мелочи, но очень сильно влияют на удобство использования.
Халявный Balsamiq Mockups
Не люблю устанавливать контрафактное ПО, потому что вместе с ним в довесок идет что-нибудь зловредное. Но для некоторых программ трудно найти бесплатную альтернативу. Например, годных инструментов прототипирования раз, два и обчелся. Один из таких инструментов это Balsamiq Mockups. Текущая версия 3.4.4. К счастью на rutracker.org я нашел подходящий ключ для регистрации. Так что никакие мутные крэки и патчеры не нужны.
Ошибка пилотирования разбившегося в Ростове «Боинга»
В распоряжении телеканала «Россия 1» оказалась расшифровка последних переговоров экипажа лайнера за минуту до столкновения с землей, на основании которого была смоделирована ситуация, которая привела к авиакатастрофе.
Мобильные UI-фреймворки
Если ты хотел сделать зарабатывающее мобильное приложение в 2010 году, то, в принципе, мог ограничиться iOS-платформой и забыть про Android, так как он был ущербно мал с точки зрения доли пользователей и вообще не существовал с точки зрения оборота внутренних покупок. Сейчас же игнорировать Android-платформу может только заядлый яблокофил, в связи с чем кросс-платформенные фреймворки становятся объектом пристального внимания.
За год в этой области произошло много интересного. Google в Android KitKat наконец сделала оптимизацию исполняемого кода и рендеринга веб-страниц внутри приложений. А Microsoft в октябре объявила о всесторонней поддержке Xamarin. Но самый крутой показатель роста интереса к фреймворкам можно наблюдать в вакансиях мобильных разработчиков, где появились места с названиями в духе «Xamarin-разработчик».
Фреймворки облегчают твою девелоперскую жизнь примерно так же, как и MBaaS, только на клиентской стороне. UI можно писать на чистом HTML5/CSS/JavaScript, чтобы потом показать в приложении в виде WebView-компонента (так делают Adobe PhoneGap и Sencha), можно писать на нестандартном JavaScript и CSS, чтобы потом скомпилировать в нативный код для каждой платформы (как в Appcelerator Titanium), а можно вообще отказаться от общего интерфейсного кода и шарить только бизнес-логику, написанную на C# (как в Xamarin). Плюсы и минусы каждого подхода понятны — JS-код в веб-компонентах исполняется обычно медленно, а UI, сделанный на PhoneGap без плагинов, будет выглядеть как в другой планеты. С другой стороны, супернативность, продвигаемая Xamarin, потребует от тебя умения писать на всех платформах и, кроме того, знания самого Xamarin. А в случае Titanium ты останешься на промежуточном решении.
Прототипирование пользовательских интерфейсов
Макет пользовательского интерфейса позволяет передать замысел автора о функциональности, не затрагивая вопросы графического дизайна.
Ниже представлен небольшой обзор desktop и SaaS инструментов для прототипирования пользовательских интерфейсов. Примечательно, что специальные инструменты часто оказываются лучше универсальных (Visio sucks!). В общем функциональности инструментов повторяют друг друга. Но некоторые инструменты пытаются как-то выделится предоставляя отдельный viewer для запуска интерактивных прототипов (Caretta GUI Design Studio) или возможность установить SaaS приложение на свой сервер (mockuptiger.com).
Несколько хороших практик в создании интерфейсов
1) Делайте подсветку текущего поля ввода (можно автоматически добиться выбором подходящего Look and Feel).
2) В ComboBox'ax используйте автодополнение.
2) В ComboBox'ax используйте автодополнение.
Подписаться на:
Сообщения (Atom)


