Об UI

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

У первых электрических (но ещё не электронных) компьютеров интерфейс был прост. Надо было нужные кабели повтыкать в нужные дырочки. Ну примерно как на первых телефонных станциях. «Барышня, соедините меня...» Барышня и соединяет. Буквально, проводом.

Перетыкание проводов быстренько заменили переключателями: тумблерами или поворотными. Ну и лампочки, конечно, как устройство вывода.

Потом наступила эпоха перфокарт и перфолент. Машина их ела и мигала лампочками в ответ. Сразу стало понятно, что дырявить эти дырочки вручную — гиблое дело (впрочем, наверняка всякое бывало). А печатные машинки, да и телеграф, уже тогда были. Ну и были телетайпы. Эти вполне себе клавиатуры тут же приспособили сначала для пробивания перфолент/карт, а потом и для непосредственного ввода данных уже в электронные компьютеры.

Те же телетайпы были ещё и принтерами. И компьютеры научились на них печатать. Вводим буковки, получаем буковки. Уже хорошо.

Что ещё осталось? Да, чтобы не тратить тонны бумаги, придумали подключать к компьютеру ЭЛТ экраны. Забавно, что в некоторых древних компьютерах ЭЛТ использовались как память (люминофор продолжает какое-то время светиться после облучения электронами). И уже тогда энтузиасты начали писать компьютерные игрушки, рисующие что-нибудь на этих ЭЛТ.

Клавиатура есть. Экран есть. Рисовать компьютеры пока могут только буковки. Но и этого достаточно. А ещё компьютеры были довольно дорогие и большие. Поэтому пользовались ими сразу несколько человек. Часто даже удалённо, через те же телетайпы. Это даже называлось многопользовательскими многотерминальными системами. Но у каждого человека была своя оболочка, принимающая его команды. Это был Unix. И это был интерфейс командной строки (короче говоря, CLI).

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

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

Хотелось чего-то более очевидного, наглядного и интуитивно понятного. Поэтому понятен бешенный успех того же Norton Commander. Технически это всё тот же текстовый интерфейс. Но визуально это что-то совсем другое. Это что-то, что наглядно представляет предметную область, в данном случае файлы.

Это что-то называется графическим (в случае Нортона — псевдографическим) пользовательским интерфейсом (он же GUI).

Графика, т.е. возможность отображать компьютером не только буковки, но и любое изображение, была очень важна. Те же ребята, что на малюсеньких круглых ЭЛТ первых компьютеров делали игрушки про полёты в космос, делали для этих же компьютеров и программы проектирования инженерных сооружений и расчёта их прочности. То, что позднее превратилось в целый класс ПО — CAD. Тут без графики ну просто совсем никак.

А ребята из Xerox в 70-е годы прошлого века баловства ради решили, что нарисовать можно не только балки и мосты, но обычные вещи, вроде рабочего стола (буквально, стола), папочек, листиков с документами и всё такое. На их беду к ним в гости зашёл некто Стив Джобс. И компьютеры фирмы Apple чуть ли не с самого начала имели GUI в качестве основного интерфейса взаимодействия с пользователем. PC с MS-DOS на этом фоне смотрелся бледновато. Microsoft со своими Windows подтянулись заметно позднее.

Что нам даёт GUI? Наглядность. Понятность. Возможность протыкать всё, что есть (меню), не запоминая заранее. Для простого смертного пользователя требуется гораздо меньше предварительной подготовки. Конечно, появились свои примитивы, которым всё же нужно учить. Окна, поля ввода, кнопки, меню. Надо же понимать, что в эти нарисованные прямоугольники можно тыкать.

Кстати, тыкать. GUI подарил нам указательное устройство. Как ни удивительно, вначале это было световое перо (или пистолет). Такая штуковина, которую нужно было наводить на экран. Но прижилась всё же мышка. Хоть она и привязана к конкретным координатам экрана только посредством указателя, и сам по себе манипулятор никаких координат не выдаёт.

Экран, клавиатура, мышка. Окна, меню, кнопки. Что дальше? Дальше случился Web (он же WWW).

До Веба всё взаимодействие в Интернете было исключительно текстовым. Та же электропочта, Gopher... Веб тоже задумывался текстовым, но почти сразу же для него появился графический браузер — Mosaic. Ну и быстренько научились в HTML документы вставлять картинки.

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

А потом появился JavaScript. Сначала просто анимация, изменение страницы без перезагрузки. Потом докатились до Single Page Application. Браузеры посолидней стали. Железо десктопное подтянулось. И оказалось, что Web UI вполне может тягаться с десктопным GUI. И даже имеет некоторые преимущества. Браузер уже есть в каждой приличной системе, и приложение не нужно устанавливать. И обновляться оно будет само. И к облакам-серверам будет обращаться вполне естественным способом, через тот же HTTP.

Дошло до того, что появилась даже Chrome OS — операционная система, в которой есть только браузер и веб приложения.

Сейчас веб UI почти не уступает дестопному UI. Анимация, свестелки, перделки, даже 3D, всё есть. Десктоп ещё не умер окончательно, пожалуй, только по двум причинам. Веб приложениям всё ещё нужен Интернет, чтобы полноценно работать. Веб приложения потребляют значительно больше ресурсов, чем аналогичные по функциональности десктопные приложения.

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

Однако, с веб приложениями началась интересная тенденция. Упрощения. Десктопные приложения можно было делать узкоспециализированными, продавать конкретной аудитории, с которой можно брать деньги за обучение. В вебе аудитория потенциально не ограничена. Прийти и запустить ваше приложение может кто угодно. И надо бы, чтобы этот кто угодно не развернулся в ужасе, а проникся любовью и уважением к вашему продукту. Заработал маркетинг, начали всерьёз интересоваться пользователем. И оказалось, что кучи настроек и возможностей не нужны всем. Всем нужно, чтобы было просто и красиво. И интерфейсы стали проще и понятнее. А приложения часто стали менее функциональными.

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

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

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

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

Я честно думал, что эти сенсорные штучки не привносят ничего нового. Но потом я стал наблюдать, как моя доча, совершенно не умея читать, обращается с планшетом на Android. Её никто не учил им пользоваться. Но она сама ставит интересные ей игры, играет в них, и смотрит мультики. Да ещё и учит пользоваться планшетом бабушку. Сама. Значит, та самая интуитивная понятность интерфейса всё же достигла уровня, когда с интерфейсом могут справиться четырёхлетние дети.

Мобильный интерфейс должен быть ещё проще, ещё понятнее, ещё красивее, ещё удобнее чем десктопный или веб. Смартфоны теперь в каждом кармане. Потенциальная аудитория ещё больше, чем у веба. И если вы сможете дать пользователю возможность сделать что-то на два тыка быстрее, чем все конкуренты, вы сможете выиграть. Если, конечно, это будет красиво :) И если вы сможете сделать красивее и удобнее, но абсолютно то же самое, что у всех конкурентов, вы тоже сможете выиграть.

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

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

Кстати, заметили, происходит «мобилизация» веба. Так как мобильных пользователей больше, сайты стали упрощать интерфейс, укрупнять элементы управления, внедрять адаптивную вёрстку. Чтобы на экране телефона смотрелось прилично. А на десктопе как-нибудь перебьёмся.

Что дальше? На подходе у нас виртуальная реальность (она же VR), где пользователь полностью погружается в виртуальный мир. (Привет, «Газонокосильщик».) И так же на подходе дополненная реальность (она же AR), где пользователь видит виртуальные предметы или метки поверх своего обычного восприятия реальности. По мне, так существенная разница лишь в том, какая часть реальной реальности замещается виртуальной.

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

А вот пример Google Glass показал, что интерфейс может быть голосовым. А успех(?) таких устройств, как Amazon Echo и Google Home показывает, что сам по себе голосовой интерфейс, без других способов взаимодействия, тоже имеет ценность.

Каким должен быть голосовой интерфейс? Кто знает? Очевидно только, что никто не сможет надиктовать, скажем, программу на C. Так что ввод текста и чтение текста никуда не денутся.

UPD
Вот как раз у чуваков случился негативный опыт создания сложного Web UI и они перешли на десктоп. http://deplinenoise.files.wordpress.com/2017/03/webtoolspostmortem.pdf