Зайнятий народженням

tl;dr: Наглядна історія розробки користувацького інтерфейсу Ліза/Макінтош

Інтерфейс користувача Macintosh розроблявся не відразу; насправді це був результат майже п’яти років експериментів і розробок в Apple, починаючи з графічних процедур, які Білл Аткінсон почав писати для Lisa наприкінці 1978 року. Як і у будь-якому еволюційному процесі, на його шляху було безліч фальстартів і безперспективних починань. Шкода, що вони, як правило, губляться для історії, оскільки ми можемо багато чому у них навчитися.
На щастя, головний розробник користувацького інтерфейсу, Білл Аткінсон, був завзятим фотографом, і він завбачливо задокументував поступовий розвиток призначеного для користувача інтерфейсу Lisa (який більш-менш став призначеним для користувача інтерфейсом Mac після декількох налаштувань) за допомогою серій фотографій. Поруч з комп’ютером він тримав фотоапарат Polaroid, і кожен раз, коли призначений для користувача інтерфейс досягав нового рубежу, він робив знімки, які він збирав до блокноту з вкладними аркушами. Я дуже радий можливості відтворити та коментувати їх тут, оскільки вони пропонують захоплююче закулісне уявлення про те, як створювався революційний користувальницький інтерфейс Mac.
Зображення масштабуються таким чином, що вони легко вміщуються на типовому екрані, але ви можете клікнути по ним, щоб побачити більш докладні версії з більш детальною інформацією.

Перший знімок у блокноті Білла - з попереднього його проекту, безпосередньо перед початком роботи над Lisa: Apple II Pascal. Високопродуктивні графічні процедури, які Білл написав для Apple II Pascal восени 1978 року, призвели до його початкової роботи над Lisa.

Фотографії в центрі та праворуч, зроблені навесні 1979 року, були відтворені на фактичній системі Lisa Display із роздільною здатністю 720 на 360 пікселів, яка залишалася незмінною протягом усього часу поставки продукту. Лізи ще не існувало; це було зроблено на прототипі карти для Apple II. На середньому зображенні показані самі перші символи, які коли-небудь відображались на екрані Lisa; зверніть увагу на символи змінної ширини. Крайнє праве зображення має більш пропорційний текст про систему відображення Lisa, що відображається шрифтом, який Білл розробив вручну.

Ліве зображення ілюструє перші графічні примітиви, які Білл написав для LisaGraf навесні 1979 р. (який зрештою був перейменований на QuickDraw у 1982 р.), відтворюючи лінії та прямокутники, заповнені однобітовими патернами розміром 8x8. Сила і гнучкість шаблонів проілюстровані на крайньому правому кадрі, які були нашою дешевою заміною кольору, що було занадто дорого (при необхідному розширенні) на початку вісімдесятих.

На середньому малюнку зображений початковий користувальницький інтерфейс Lisa, заснований на ряді «програмних клавіш», відображених у нижній частині екрану, які будуть змінюватися при виконанні користувачем завдання. Вони були натхнені роботою у HP, звідки прийшли деякі з ранніх розробників Lisa.

Ось ще деякі демо-версії початкових графічних процедур. Білл зробив лінійний малюнок на диво швидко з алгоритмом, який будував «плити» з декількох пікселів за один доступ до пам’яті. Крайній правий малюнок показує, як непрямокутні області також можуть бути заповнені узором.

Ось кілька відсканованих зображень, що демонструють вражаючу для того часу роздільну здатність Лізи, яку Білл відсканував за допомогою модифікованого факсимільного апарату. Він завжди допрацьовував алгоритм напівтонування, який відображав сірі шкали у візерунки монохромних точок. Білл зробив їх версії для Apple II, які Apple поширювала на демонстраційних дисках, але ці версії Lisa з більш високою роздільною здатністю були набагато більш вражаючими.

На лівому та середньому малюнках зображена перша програма ескізів, ранній предок MacPaint, яка дозволяла малювати за допомогою миші малюнки з візерунками та різноманітними формами пензлів. Я думаю, що це, можливо, дещо не в тій послідовності, зроблено на початку 1980 року. На крайньому правому зображенні показано остаточний інтерфейс на основі програмних клавіш, який ось-ось кардинально зміниться …

… у користувальницький інтерфейс миші/вікна. Очевидно, це найбільший єдиний стрибок у всьому наборі світлин, і місце, де я найбільше бажаю, щоб Білл датував їх. Спокусливо сказати, що зміна була спричинена відомим візитом Xerox PARC, який відбувся в середині грудня 1979 року, але Білл вважає, що вікна передували цьому, хоча він точно сказати не може.

На зображені зліва показані різні шрифти в перекриваючих вікнах, але у нас ще не було диспетчера вікон, тому їх не можна було перетягувати. У середньому вікні відображається перше спливаюче меню, яке схоже на SmallTalk, як і простий чорний рядок заголовка. Правий малюнок показує, що ми ще не відмовились від програмних клавіш.

На даний момент весна 1980 року, і справи починають відбуватися швидко. На крайньому лівому зображенні показаний найраніший вибір тексту з використанням іншої техніки виділення, на якому ми зупинилися. Він також показує “панель команд” внизу екрану, і що ми почали використовувати немодальні команди (зробити вибір, а потім виконати дію, а не навпаки).

Середнє зображення показує першу панель прокрутки ліворуч замість праворуч, перш ніж були додані кнопки прокрутки стрілки. Вона також має назву стилю вкладок в папці, який буде зберігатися деякий час перед тим, як бути видалений (Білл каже, що в той момент, він плутав документи та папки). На правій фотографії показано, що ми застосували метод зворотного виділення тексту.

До літа 1980 року ми відмовились від програмних клавіш. Ліве фото показує, що ми продовжували редагувати текст за допомогою миші, разом із першою появою буфера обміну, який на той момент називали “кошиком для сміття”. Пізніше це було названо “кишенька”, перш ніж нарешті ми зупинилися на “буфері обміну”. Існувала також смуга прокрутки у стилі Smalltalk, де поле прокрутки пропорційне розміру документа. Зверніть увагу, що є також два набори стрілок, оскільки одна смуга прокрутки дивно керує як горизонтальною, так і вертикальною прокруткою.

На наступному зображенні видно, що ми поставили пропорційне поле прокрутки для більш простого, фіксованого розміру, оскільки ми боялися, що користувачі не зрозуміють пропорційність. Він також вперше показує текстовий курсор I-Beam . На цьому етапі ми, нарешті, зупинилися на однокнопочній миші після довгих, затяжних внутрішніх дебатів.

На самому правому зображенні показано, як Білл грається зі сплайнами, які є кривими, визначеними кількома контрольними точками, що перетягуються. В результаті QuickDraw не став використовувати сплайни, але картинка все-таки примітна першою появою “ковпачка” (невеликий, перетягуваний, прямокутний варіант для точки).

Зараз осінь 1980 року. Середня картинка показує, як ми експериментуємо з відкритими та закритими вікнами, які врешті-решт були відхилені (але це повернулося у 1990-х і сьогодні так чи інакше є в більшості систем). Крайній правий малюнок показує зміну розміру першого вікна шляхом перетягування сірого контуру, хоча неясно, як було ініційовано зміну розміру.

Середнє зображення показує, що вікна можуть бути змінені шляхом перетягування сірого контуру. Ми хотіли перетягнути ціле вікно, як це роблять сучасні користувальницькі інтерфейси сьогодні, але в ті часи процесори були недостатньо швидкими. Наскільки мені відомо, NeXTStep була першою системою, яка зробила це по-сучасному.

На крайньому правому зображенні показано перше випадаюче меню з рядком меню у верхній частині вікна, а не у верхній частині екрана, що, як і раніше, робить Windows. До цього моменту ми також відмовилися від використання однієї смуги прокрутки як для горизонтальної, так і для вертикальної прокрутки; це виглядає дуже схоже на те, що і тепер поставляється Mac з 1984 року.

Цей набір зображень ілюструє робочий стіл Лізи, приблизно в кінці 1980 року, із заголовком у формі вкладки, за яким слідує рядок меню, прикріплений до вікна. Вікна можуть бути зменшені до вкладок на робочому столі. Ми також змінили назву буфера обміну на “кишенька”, старий набірний термін.

Ліве зображення згадує перше використання подвійного кліку миші, щоб відкрити і закрити вікна. Середній малюнок є справжнім проривом, розмістивши рядок меню у верхній частині екрана замість верхньої частини кожного вікна. Панель меню містить меню “активної теки”, яка є верхнім вікном. До цього моменту значок зростання знайшов свій шлях у нижній правий кут, на перетині горизонтальної та вертикальної смуг прокрутки, які зависли. Це перша фотографія, на якій дійсно можна впізнати Macintosh.

Зараз початок 1981 року і все починає налагоджуватися. На лівому зображенні показане вікно зі смугами прокрутки, які виглядають майже як ті, що поставляються. Середня папка ілюструє комбіновані режими, які використовувалися програмою електронної таблиці Лізи. Зображення праворуч містить перший вигляд діалогового вікна, яке на той момент проходило по всій довжині екрана, трохи нижче рядка меню.

Тепер, коли основна структура вікон стабілізувалася, Білл знову звернув увагу на графічні підпрограми. Він більше працював над програмою Sketch (попередник MacPaint); малюнок сніговика зліва - це підказка, що зараз зима 1981 року. Він додав алгоритмічні стилі тексту до графіки, додавши стилі жирного шрифту (на фото справа), а також курсив, контур і тінь (Білл сфотографував інші стилі, які я опускаю, щоб заощадити місце).

Бад Тріббл тепер жив у будинку Білла, і йому, як правило, спав вдень і працював всю ніч, тому Білл намалював діаграму фаз ліворуч із програмою ескізів. На середньому малюнку зображені швидкі овали, які були додані до LisaGraf як базовий тип навесні 1981 року, використовуючи розумний алгоритм, який не вимагав множення. За ними швидко пішли прямокутники із закругленими кутами, або “круглі прямокутники”, проілюстровані праворуч, які запропонував Стів Джобс (див. “Круглі прямокутники всюди!).

До травня 1981 року призначений для користувача інтерфейс Lisa починає зміцнюватися. На лівій фотографії показані документи різних типів з можливістю прокрутки в перекривних вікнах, при цьому все ще є вкладки папок для заголовків. На середньому зображенні показано, як округлі елементи почали проникати в різні елементи призначеного для користувача інтерфейсу, такі як меню, забезпечуючи більш складний вид, особливо в поєднанні з падаючими тінями. На правій фотографії показано, як меню можуть бути як графічними, так і текстовими.

Команда Лізи була стурбована тим, що закриті вкладки вікон закриті іншими вікнами на робочому столі, тому Білл додав стандартне меню в крайньому лівому куті, яке називається “лоток”, яке може відображати та приховувати відкриті вікна. Середні та праві зображення показують прототип, який Білл створив для графічного редактора Lisa (який з часом перетворився на MacDraw), щоб продемонструвати, що режими іноді можуть бути корисними; це була перша програма для вибору режимів з графічною палітрою, яка з часом стала основним інтерфейсом користувача MacPaint.

Останньою серйозною зміною в інтерфейсі користувача Lisa став перехід до файлового менеджера, який базується на значках у березні 1982 року. Крайнє ліве зображення було раннім макетом, зробленим в графічному редакторі з використанням дворівневої ієрархії; вибір значка у верхній панелі відображає його вміст в нижній. На середній фотографії Білл дійшов до чогось дуже подібного до дизайну доставки, укомплектованого кошиком для сміття внизу праворуч. (див. Шахраї Розінга) Зауважте, що вкладка папки у вікнах зараз зникла, замінивши її прямокутним рядком заголовка, який частково інвертується при виділенні.

Нарешті, Білл перейменував “LisaGraf” на “QuickDraw” навесні 1982 р., оскільки він хотів, щоб назва підходила і для Macintosh. Він додав дві відповідні функції для задоволення зростаючих потреб програм Lisa: зображення та масштабування. Зображення були способом запису графічних операцій у структуру даних для подальшого відтворення; це стало основою як нашої архітектури друку, так і вирізання та вставки графіки. Оскільки зображення можна було намалювати у прямокутник довільного розміру, це змусило Білла також додати функції масштабування растрових зображень.

Більшість користувачів та розробників сприймають користувальницький інтерфейс лише як завершене ціле, тому вони схильні сприймати його як статичний і незмінний, хоча насправді ці фотографії показують, що він завжди змінювався, оскільки ми отримували більше досвіду та вирішували більше областей застосування. Користувальницький інтерфейс ніколи не буває достатньо гарним, і, хоча узгодженість програм є важливою перевагою, найкращі розробники продовжуватимуть впроваджувати інновації, коли зіткнуться з новими проблемами або, можливо, коли вони просто бачать набагато кращий спосіб щось досягти. Як завжди, Боб Ділан сказав це найкраще, коли в 1965 році написав: “Він не зайнятий тим, що народжується, він зайнятий смертю”.