Category: искусство

Неуспешно — без меня

Вышел очень хороший вдудь об Олеге Табакове. Рекомендую посмотреть весь выпуск. Хочу отметить отношение Олега к проектам, которые в театре называются спектаклями. Олег был заточен на успех, и говорил: «неуспешно — без меня»:


Плохой верстальщик

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

Реклама Системы Кадры

Плохой верстальщик же не может просто посмотреть на пнг и сделать, как нарисовано. Ему, блять, надо объяснить каждый отступ: «Вот тут 10 пикселей нарисовано, значит,  дорогой, надо сделать отступ 10 пикселей». И так по всему макету. 

Рисование таких картинок трата времени. Конечно, лучше взять нормального чувака, которые сразу всё сделает правильно. 

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

P. S. Многолетние наблюдения показали, что некоторые верстальщики просто не понимают, как сравнить две картинки. Реально на глаз делают вместо того, чтобы сделать скриншот и наложить на макет с прозрачностью. Таким помогает программа Pixel Perfect.

Расфлексил ванную

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

Рад сообщить, что вторая итерация закончена:


Плитки нужного размера не нашлось, поэтому поломанную закрыл мозаикой:


Шторка тоже нашлась в похожий квадратик:


В следующей итерации предстоит всё отмыть и проект закончен.

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

Их страница на Юду:
https://youdo.com/u1993036

Бюджет: 10000 ₽ за работу и примерно 5000 ₽ на материалы, которые я купил сам.

Умение «продать»

Вот насколько важно уметь «продать» свою работу:



Если бы художник рисовал обычным образом, максимум бы сказали: «ну, ок, прикольно». А так все разговоры о том, как они были удивлены и восхищены и до последнего момента думали, что это картошка. О том, что сама картина довольно примитивная, уже речь не идёт.

Фотошоп без палитры инструментов

Вот adrior наехал в прошлом посте:
Просто трендеть про то, что «всё отстой, не удобно, где вообще единороги?» — каждый горазд. Скажи, как бы ты реализовал инструменты в фотошопе?

Ну давайте тогда думать Фотошоп без модальных иструментов. Я начну.

Инструменты эти видать из обычного мира были позаимствованы. Вот есть доска:


С обычными инструментами как? Взял пилу — отпилил, взял дрель — просверлил, взял клей — приклеил, взял краску — покрасил. Это всё модальное до мозга костей. Пошел в сарай, вместо пилы взял дрель, приходишь — жопа, дрелью не отпилишь.

Если подумать, действия с доской состоят из двух частей. 1) выбираем место на деревяшке, 2) что-то с этим местом делаем. Действие зависит от инструмента. 
 
Чтобы не было модальности инструмент должен быть только один. Такой супер-мега швейцарский нож, который и пилит и сверлит и красит и всё что угодно делает. Тогда мы могли выбрать место на деревяшке, взять этот один иструмент, скомандовать ему: «пили!», — и он стал бы пилить. Или сверлить. Или красить.
 
В реальном мире такой инструмент хер сделаешь. Если сделают, скорее всего это будет какой-то гель с нанороботами. Полил на деревяшку гель, крикнул «пили» и роботы по молекулам разобрали древесину. :)
 
Зато на компе нехуй делать такую штуку замутить. Показал где надо что-то сделать.
 
 
 

А потом скомандовал:  пили! И он отпилил.

 

Перенесёмся в Фотошоп.
Со всеми инструментами мы работаем одинаково: нажали левую кнопку мыши, поводили курсором (или не поводили, то есть поводили на 0 пикселей), отпустили. То есть для каждого действия есть координата нажатия, путь курсора и координата отпускания. Назовем эту штуку элементарным объектом.

Дальше просто. У элементарного объекта может быть множество состояний. Каждое состояние эквивалентно инструменту.

То есть когда мы рисуем — мы не говорим программе что это. Сначала нарисовали элементарный объект, мышку отпустили, потом говорим (хоткеем или в палитре состояний объекта тыкаем иконочку) в каком состоянии его показать.

В теории круто, на практике не будет работать. Во-первых, все привыкли к инструментам. От Фотошопа отвыкнуть еще можно, но от реального мира с молотком и пилой невозможно. Второе, и главное, нет обратной связи. Когда я рисую круг я хочу круг видеть, а не ебучую красную полоску.

Окей, добавляем этой системе то, чего все хотят. То есть перед началом рисования объекта я могу указать состояние. То есть если я выбрал состояние квадрат, то новый элементарный объект рисуется в этом состоянии.

Но это же, блин, режим опять получается?! Получается как бы да. Но этот режим перенесся на сам объект. Это как бы призма через которую мы смотрим на элементарный объект. И призмы можно менять в любой момент времени. То есть круг может стать квадратом или треугольником, треугольник можно уменьшить и снова превратить в квадрат.

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




Сценарий
Рассмотрим типичный сценарий: Ты хочешь нарисовать квадрат. Хуйнул U. Нарисовал.

Дальше нужно круг, но ты забыл, что у тебя квадрат. Начинаешь рисовать, видишь — жопа, квадрат вместо круга рисуется. Прямо не отпуская мышки хуйнул O (или какой там хоткей?), квадрат стал кругом, ты его дотянул куда нужно. Готово.

Или не так. Ты опять же круг стал рисовать, а у тебя квадрат. Ты испугался, мышку бросил. У тебя создался квадрать. Ты O нажал, квадрат кругом стал, ты его смасштабировал как нужно. Готово.

Дальше в круге надо дырку резинкой протереть. Начинаем тереть... Бля, круг рисуется. Давим E. Там где мы уже навазюкали мышкой стирается. А если B нажать, то это закрашивается кистью.

Дальше вы :)

P. S.
Я думал, думал, я всё понял. Это Пунтосвитчер для Фотошопа получился. Точная копия, только в пунто два состояния (две раскладки), а в Фотошопе их куча.

Локус внимания

Пичаль, пичаль...

Выходит, что многие дизайнеры, которые знают слово «локус», не понимают что это такое.

Джеф вроде понятно объясняет:

2.3 Locus of Attention

You have a degree of control over making unconscious thoughts conscious, as you demonstrated when you brought the final character of your first name "into mind." You cannot deliberately make conscious thoughts unconscious, however. "Don't think about an elephant," a girl whispers to a boy, knowing that the boy cannot comply. But in a few moments, unless the conversation stays on elephants, the animal will fade into the boy's unconscious. When that happens, the boy is no longer paying attention to the thought of an elephant: The elephant is not his locus of attention.

I use the term locus because it means place, or site. The term focus, which is sometimes used in a similar connection, can be read as a verb; thus, it conveys a misimpression of how attention works. When you are awake and conscious, your locus of attention is a feature or an object in the physical world or an idea about which you are intently and actively thinking. You can see the distinction when you contemplate this phrase: "We can deliberately focus our attention on a particular locus." Whereas to focus implies volition, we cannot completely control what our locus of attention will be. If you hear a firecracker unexpectedly exploding behind you, your attention will be drawn to the source of the sound. Focus is also used to denote, among the objects on a computer display, the one that is currently selected. Your attention may or may not be on this kind of focus when you are using an interface. Of all the world that you perceive through either your senses or your imagination, you are concentrating on at most one entity. Whatever that one object, feature, memory, thought, or concept might be, it is your locus of attention. Attention, as used here, includes not only the case of actively paying attention but also the passive case of going with the flow, or just experiencing what is taking place.


Вот перевод (не самый лучший).

2.3. Локус внимания

Вы можете до некоторой степени контролировать превращение бессознательных мыслей в сознательные, в чем вы убедились, переместив знание последней буквы вашего имени в сознательную область. Однако вы не можете намеренно перевести сознательные мысли в бессознательную область. «Не думай о белом слоне», — шепчет девочка, зная, что мальчик не сможет не думать об этом слоне. Но через некоторое время, если разговор не останавливается на слонах, мысли мальчика об этом животном перейдут в бессознательное. Когда это произойдет, он больше не будет обращать внимание на мысль о слоне — слон перестанет быть локусом внимания.

Здесь я использую термин локус, поскольку он обозначает некоторое место или область. Термин фокус, который иногда используется в этом контексте, может вызвать неправильное представление о том, как работает внимание, потому что может быть понят как действие. Когда вы находитесь в бодрствующем и сознательном состоянии, вашим локусом внимания является какая-то деталь или объект окружающего мира или идея, о которой вы целенаправленно и активно думаете. Различие между фокусом и локусом внимания можно понять на примере следующего предложения: «Мы можем целенаправленно сфокусировать наше внимание на каком-либо локусе». Тогда как фокусировать означает волевое действие, мы, тем не менее, не можем полностью управлять содержанием локуса нашего внимания. Если вы слышите, как позади вас внезапно взорвалась петарда, ваше внимание будет направлено на источник звука. Слово фокус также используется при обозначении объекта, который в данный момент выбран на экране. Ваше внимание может быть — или не быть — направлено на такого рода фокус, когда вы пользуетесь тем или иным интерфейсом. Из всех объектов или явлений окружающего мира, которые вы воспринимаете с помощью своих чувств или воображения, в каждый момент времени вы можете сконцентрироваться только на одном. Чем бы ни был этот объект, деталь, воспоминание, мысль или понятие, он становится локусом вашего внимания. В данном случае имеется в виду не только то внимание, которое можно активно обращать на что-либо, но также и пассивное восприятие потока поступающей информации или простое — переживание происходящего.


Еще раз: «локус» — это место или объект, о котором мы думаем. То есть в локусе нельзя быть. Что-то может им являться.

Я и сам не сразу усвоил и, кажется, даже успел где-то написать неправильно. Но надо правильно термины использовать, раз уж используешь. 

Теперь берем свеженькую лекцию Тани Мисютиной.



Слово локус употребляется там два раза: 

Раз:
Но с тех пор как компьютеры начали завоевывать более широкую аудиторию, проблемы стали очевидны. Пользователи стали испытывать стресс, постоянные проблемы на рабочем месте, растерянность, ужас… И поэтому постепенно локус стал смещаться в сторону интересов пользователей.

Это как? Место стало перемещаться в сторону пользователей? Че за оборот речи такой? Если тут использовать «локус» (я вообще не уверен, что тут его можно использовать, потому что локус связан с текущей, кратковременной обработкой информации, но допустим), то надо писать так: «И поэтому постепенно интересы пользователей стали чаще становится локусом внимания производителей ПО.» Взрыв мозга слушателей обеспечен. За то  меньше вопросов в конце. :)


Два:
Но чем все таки хорош Photoshop – во-первых, здесь негативный эффект режимов сглаживается тем, что, как правило, курсор всегда показывает, в каком состоянии находится система, т.е. форма курсора соответствует вот этой иконочке, которая нарисована для обозначения инструментов. А так как курсор практически постоянно находится в локусе вашего внимания, когда вы работаете с Фотошопом, то вам очень сложно запутаться. Даже если иногда вы сделали случайно что-то не то, всегда есть Ctrl+Z, т.е. любую ошибку можно отменить.

Это вообще пиздец. Не может, блять, курсор находиться в локусе, он только стать им может. Невозможная языковая конструкция это.
 
С научной точки зрения тоже неправильно. Если бы курсор «постоянно» бы был локусом внимания (ессно Таня это и имела в виду, просто использовала термин неправильно), это бы значило, что человек о нем постоянно размышляет. Типа пристально смотрит на курсор и думает: ой какая стрелочка, вот тут контурочек, а внутри беленькое, а когда я мышкой двигаю, она тоже двигается, а если выделение включить, то тут крестик вместо стрелочки, ой, такой чёрненький, миленикий... И так все 8 часов рабочего времени, потому что «постоянно».
 
На самом деле, понятно, что всё не так. Локусом является работа. Мы рисуем и думаем о том, что рисуем. На курсор наплевать до тех пор, пока не возникнет модальная ошибка. То есть до тех пор, пока мы не начнём вместо кисти красить выделением. Вот в этот то момент курсор и станет локусом (Этот момент легко заметить по фразам вроде: «Чё, блять, за... А...» Вот между «за» и «а» и происходит переключение). А так как курсор обычно будет очень близко от предыдущего локуса, то переключение произойдет крайне быстро. Мы быстро всё поймём и включим кисть. 
 
Иногда даже может случится так, что мы чем-то вроде бокового зрения заметим, что с курсором что-то не то и включим нужный инструмент еще до совершения ошибки. Это становится возможным потому что курсор часто находится рядом с локусом, но никак не потому что он им является. 
 
Как бы там ни было, это классическая галимая модальная ошибка. И фотошоп и все остальные программы с палитрами инструментов нихуя не хорошие и в них легко запутаться. И все путаются. А то, что за годы (sic!) ежедневной работы человек научается реже ошибаться и быстро исправлять ошибку не означает, что палитры инструментов рулят.
 
И наличие анду, которое «всегда есть», в данном случае показывает всю пиздецовость ситуации. Потому что мы имеем систему, которая допускает модальные ошибки, и вместо борьбы с источником (с самим наличием режима) авторы сделали еще одну систему, которая позволяет исправить последствия модальности и почувствовать себя идиотом: «бля, я же забыл включить кисть!». Я! Я мудак, не фотошоп. 
 
Анду нужно для того, чтобы иметь возможность исправить ошибки человека «(тут луше красный, а не синий», «квадратик лучше смотрелся внизу, давай назад вернем его» и пр.), а не системы.
 
Модальность всегда говно, просто в случае с фотошопом еще никто не смог придумать (и реализовать) как можно без неё обойтись.
 
P. S.
Отмечу, что я с глубоким уважением отношусь к Тане и считаю её крутым дизайнером (гораздо лучшим, чем я) и хорошим человеком, а её лекцию я взял только потому что это самый свежий известный мне пример.  ;)

Стерильный серый

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

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


Стерильный





Подкрашенный




Стерильный



Подкрашенный




Всякие серые плашки почти всегда стоит подкрашивать, они выглядят гораздо лучше:



Подкрашенные плашки в
посте Артемия Лебедева.


Как известно, на цветовой палитре по модели HSB (Hue Saturation Brightness) по оси абсцисс отложена насыщенность, по оси ординат светлота, а оттенок изменяется отдельным параметром.

В палитре HSB  подкрашенные серые «живут» ближе к левому краю квадрата.




Василий Григорьевич Перов

Вот как зовут чувака, который нарисовал эту картину.

Охотники на привале, 1871

Кто бы мог подумать, такая простая фамилия?

Василий Григорьевич жил в 19-м веке (1833—1882). В своих картинах он показывал российский пиздец, творившийся вокруг него. Так он хотел обратить внимание на этот пиздец, что-то изменить. Естественно нихуя не вышло и к концу жизни он забил и стал рисовать сюжеты из библии и прочую хуету.



Автопортрет, 1851 (18 лет)
      
       Автопортрет, 1870 (37 лет)



Картины Василия Григорьевича доставили ужасно, особенно сюжеты.

Вот Сельский крестный ход на Пасхе, 1861. Ужраные в сопли священно служители вываливаются на улицу, чтобы пройтись по селу. Поп в совершенном говнище, раздавил пасхальное яичко и даже не заметил. Некоторых приходится возвращать к жизни водой. Остальным тоже похую. Вот чувак даже икону к верх ногами держит.





Проповедь в селе, 1861. Священник увещевает про помещика, котором, как видите совершенно по... спит человек короче. Тип с девкой справа зажимаются никого не стесняясь, сзади мужик торгуется с бабкой за ковер. Только девочка одна слушает. Подрастет и ей тоже будет на все насрать. Россия.





Из всех больше всего понравилось Чаепитие в Мытищах, близ Москвы, 1862. Как видно служанка жирного попа не только не подает нищим, а даже отталкивает ветерана войны. Попу насрать полностью.




Кайф картины в названии, оно все объясняет: Мальчик-мастеровой, засмотревшийся на попугая, 1865.





Холод не холод — дети хуячут бочку с водой. Тройка. Ученики-мастеровые везут воду, 1866.





Утопленница, 1867.





Обана, брателло! На железной дороге, 1868.




Невероятная картина (смотрите там есть крупная). Птицелов, 1870. Делуля обучает мальца, показывая как подзывать птичек.



Обратите внимание: мальчик не пионер (их еще не было) и не Волька из советской экранизации старика Хоттабыча. И дело происходит не в лесах Шира и подзывают они не Фродо. Хотя поверить, что это не так сложно.


Рыболов, 1871.




Вот жил такой старечёк, рыбку ловил, веселый наверно... Умер уже. Давным давно. Грустно.




Напоследок — портрет Достоевского Федора Михалыча, 1872. Любуйтесь :)

0 202e6 90fc6ecd XL

Проектирование интерфейсов

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

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

Заинтересованные лица (заказчики и пр.)
  • Предварительное видение продукта.
  • Бюджет и график продукта.
  • Технические возможности и ограничения.
  • Потребности бизнеса.
  • Представления заинтересованных лиц о пользователях.

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

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



Покупатели (не путать с пользователями)
  • Каковы цели в контексте приобретения продукта.
  • Что не устраивает в существующих решениях.
  • Каков процесс принятия решения при покупке подобных продуктов.
  • Роль покупателей в установке, обслуживании и управлении продуктом.
  • Каковы проблемы предметной области и особенности используемой терминологии.

Пользователи
  • Нужно понять каков контекст интеграции продукта в жизнь или рабочий процесс (когда, почему и как применяется продукт или его аналоги).
  • Какова осведомленность в предметной области. Что нужно знать пользователям (с точки зрения самих пользователей), чтобы делать работу.
  • Существующие задачи и виды деятельности.
  • Цели и мотивы использования продукта.
  • Ментальная модель. Как пользователь думает о своей работе и чего они ожидают от продукта.
  • Проблемы и сложности при работе с продуктом.