Веб-браузер позволяет создавать интерфейсы для своих нужд

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

Browser is an empowering playground for folk interaction design

"Folk" interaction design is modifying digital (or media) environment to your taste just like you decorate your house or make simple tools. Use browser to build local, fast and rich interfaces in simple HTML + vanilla JS without any server or frameworks.

Материальность медиа требует доменных знаний и может быть любой

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

source: x_source_sciutto2022_folk-browser-interfaces

Народные интерфейсы требует простых строительных блоков

Демократизация «народных» интерфейсов требует простых строительных блоков.

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

@sciutto2022 добавляет, что чтобы сделать «народные» интерфейсы более доступными, нужны простые и интуитивно понятные строительные блоки, как «свет» и «камера» в Blender. Веб-разработка как общий язык для этого — слишком сложна технически.

source: x_source_sciutto2022_folk-browser-interfaces

Цикл колба может углубить обратную связь между знанием и его интерфейсом

Цикл Колба:

concrete experience → concrete realization → abstract theory → concrete experimentation → …

Ты получаешь опыт через конкретный пример, что-то понимаешь (огонь = горячо), потом узнаёшь теорию, почему так произошло, а потом экспериментируешь.

Эксперимент — важная часть процесса, она добавляет «фана» и подпитывается любопытством.

На практике это может выглядеть так:

1. ты что-то изучаешь и хочешь понять глубже → делаешь модель / динамическую репреезентацию
2. замечаешь интересные свойства этой репрезентации, которые не видел при работе с ней в виде текста
3. размышляешь, с чем связаны эти свойства с точки зрения теории → вычленяешь новые, более глубокие параметры
4. модифицируешь прототип…

• parent: tools-for-thought.1b1a — deepeining domain knowledge with its interface representation creates feedback loop

Abstracted HTML+JS grammar can be primitives for folk interfaces

Higher-level HTML abstraction mixed with JS can be primitives like "camera" and "lighting" in Blender. We can build the grammar around affordances (what one wants to do) or/and grammar.

• parent: tools-for-thought.1a — народные интерфейсы требуют простых строительных блоков

Персональные медиа для мышления

Что хочу выяснить

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

Источники

• x_source_appleton2023_tools-for-thought
• [[x_source_kaliski2019_end-user-programming]]
• [[x_source_chang2024_we-are-all-folk-programmers]]
• [[x_source_appletom2023_folk-interfaces]]
• [[x_source_sciutto2022_folk-browser-interaces]]
• x_source_appleton2024_home-cooked-software
• x_source_appleton2023_tools-for-thought
• [[x_source_;sciutto2022_folk-browser-interfaces]]
• x_source_appleton2024_home-cooked-software
• x_source_kleppmann2019_local-first-software
• x_source_appleton2021_visual-programming
• x_source_appleton-library
• x_source_kaliski2022_programmable-ink
• x_source_dynamicland-book-recommendations
• x_source_litt2022_potluck-dynamic-docs
• [[x_source_lindenbaum2022_programmable-ink]]
• x_source_victor2013_media-for-thinking-the-unthinkable
• x_source_victor2012_learnable-programming
• x_source_keer2021_folk-wisdom-about-visual-programming
• x_source_sherugar2024_direct-manipulation
• x_source_krouse2019_whole-code-catalog
• x_source_reese2025_visual-programming-codex
• x_source_sloan2020_home-cooked-app
• x_source_appleton-library
• x_source_victor2024_dynamicland-intro
• x_source_victor2016_hypercard-in-real-world
• x_source_victor2011_ladder-of-abstraction
• x_source_victor2013_future-of-programming
• x_source_victor2011_rant-on-interaction-design
• x_source_victor2006_magic-ink
• [[x_source_x_concept_explorable-explanation]]
• x_source_tutorials-on-explorable-explanations
• x_source_reed2024_spatial-canvases-as-integration-domain
• x_source_malleable-systems
• x_source_folkjs
• x_source_webstrates_computational-media
• x_source_varv_reprogrammable-interface-as-data-declaration
• x_source_rheingold_2000_tools-for-thought
• x_source_rizwan2023_folk-practices
• x_source_lee2021_self-made-tools
• x_source_litt2021_bring-your-own-client
• x_source_matuschak2020_growing-ideas
• x_source_metamuse_hci
• x_source_feeling-of-computing_jan2025
• x_source_🔥cosma2018_paper-programs
• x_source_janpaul-posma-portfolio
• x_source_feeling-of-comp_bret-victor
• x_source_🔥tldraw_for-building-canvases
• x_source_🔥ink-and-switch_to-pick-cool-articles
• x_source_engler1995_exterminate-os-abstractions
• x_source_dereciewics2010_solitude-and-leadership
• x_source_matuschak2019_transformative-tft
• x_source_nielsen2018_augmenting-long-term-memory
• x_source_nielsen2016_thought-as-technology
• x_source_onduygu-portfolio
• x_source_onduygu2014_map-of-lhilosophy
• [[x_source_dynamicland-people]]
• x_source_tabfs_tabs-as-folders
• x_source_wadler2014_propositions-as-types
• x_source_browne2004_sterelny-critique

Dynamicland roots

https://dynamicland.org/2024/Roots/

https://bookshop.org/book/9781477325766
https://bookshop.org/book/9780521292429
https://archive.org/details/in.gov.ignca.12550
https://bookshop.org/book/9780674699069
https://www.routledge.com/Orality-and-Literacy-30th-Anniversary-Edition/Ong/p/book/9780415538381
https://bookshop.org/book/9780521299558
https://en.wikipedia.org/wiki/The_Educated_Mind
https://www.edwardtufte.com/book/envisioning-information/
https://en.wikipedia.org/wiki/Understanding_Comics
https://mitpress.mit.edu/9780262581462/cognition-in-the-wild/
https://bookshop.org/book/9780143117469
https://bookshop.org/book/9780679740476
https://en.wikipedia.org/wiki/A_Pattern_Language
https://en.wikipedia.org/wiki/The_Oregon_Experiment
https://en.wikipedia.org/wiki/How_Buildings_Learn
https://bookshop.org/book/9780226113470
https://bookshop.org/book/9780679764892
http://www.newmediareader.com/
https://bookshop.org/book/9780125232708
https://bookshop.org/book/9781783083442
https://worrydream.com/refs/Nelson_T_1974_-_Computer_Lib,_Dream_Machines.pdf
https://en.wikipedia.org/wiki/Literary_Machines
https://bookshop.org/book/9781541675124
https://worrydream.com/refs/Allen-Conn_2003_-_Powerful_Ideas_in_the_Classroom.pdf
https://www.rheingold.com/texts/tft/
https://en.wikipedia.org/wiki/Sketchpad
https://dougengelbart.org/content/view/201/
https://dl.acm.org/doi/book/10.1145/61975
https://worrydream.com/refs/Krasner_1983_-_Smalltalk-80_Bits_of_History,_Words_of_Advice.pdf
https://archive.org/details/humaninterfacewh0000bolt
https://worrydream.com/refs/Bolt_1979_-_Spatial_Data_Management.pdf
https://worrydream.com/refs/Kim_1988_-_Viewpoint,_Toward_a_Computer_for_Visual_Thinkers.pdf
https://en.wikipedia.org/wiki/Seeing_Like_a_State
https://mitpress.mit.edu/9780262546799/simulation-and-its-discontents/
https://bookshop.org/book/9780143036531
https://bookshop.org/book/9780679745402
https://archive.org/details/illich-conviviality
https://web.stanford.edu/dept/SUL/sites/mac/primary/docs/satori/
https://bookshop.org/book/9781732265110
https://bookshop.org/book/9780804738712
https://worrydream.com/refs/Piumarta_2010_-_Points_of_View.pdf
https://bookshop.org/book/9781849901154

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Folk-browser-interfaces

LINK

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking
• related: x_source_sloan2020_home-cooked-app

Текст о том, что вместо «второго мозга» каждому из нас нужно «продолжение первого», адекватное нашим задачам, стилю мышления и работы.

1. Ошибочно приравнивать расширение наших способностей к одному из возможных способ репрезентации информации — базам данных и/или связанным кускам данных

• дискурс tools for thought это white collar knowledge work — x_source_appleton2023_tools-for-thought

2. Расширение возможностей мозга — это культурные практики, а не объективный алгоритм — x_source_appleton2023_tools-for-thought

3. Дизайн инструментов должен обладать телезисом — быть адекватным цели его использования — Папанек

4. Agent-environment coupling: среда эволюционно расширяет нас ещё со времен плейстоцена — мы строим инструменты, которые помогают лучше думать, но это всегда зависит не от ситуативный, а не «объективных» критериев — sterelny2004

• пластичность
• entanglements [Sietz 2020](/Users/valerii/Literature/Seitz_2020_Argumentation Evolved.pdf)

5. важно понять суть своей работы, стать с ней одним целым. Для этого хорошо подходят простые инструменты. design.ixd.1 — простые инструменты дают больше контроля над результатами

An app can be a home-cooked meal

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Bret Victor — Learnable Programming

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Что хочу выяснить

Источники

• x_source_bhosale2024_privacy-friendly-apps-with-ollama

Direct Manipulation: Definition - NN/G

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Don't Use JS for That: Moving Features to CSS and HTML by Kilian Valkhof

Link

Что хочу узнать

• Могут ли новые html-элементы быть примитивами для народных интерфейсов — вроде tools-for-thought.1a — народные интерфейсы требуют простых строительных блоков
• Помогают ли простые элементы экономить энергию?

Как и где использовать

Идеи автора

Мои идеи

Вспоминается две важных мысли:

• как говорил нам Акош Чертан — что [[не нужно оптимизировать то, что не должно существовать]]. Вместо того, чтобы оптимизировать React, можно просто убрать необходимость его оптимизировать, переместив фичи «выше» по уровню онтологической зависимости.
• как писал Эдди Штерн, один из главных лейтмотивов йоги: уровень проблемы — это не уровень решения. В этом смысле переместить функции из языка программирования в условие его возможности (бразуер) — гениальная иллюстрация этой мысли.

project: x_research_sustainable-simple-web

Программа — это все, для чего можно сделать интерпретатор

06.10.2025 — 20:19
Программа — это все, для чего можно сделать интерпретатор. Брет Виктор говорит это в контексте DynamicLand, где нарисованные от руки символы могут обрести значение и стать программой, если есть подходящий интерпретатор.

Что такое интерпретатор? Это по сути мат. функция — отображение одного значения в другое.

Программа в значении Карла Герстнера и шире — среде креативного программирования, как я про неё узнавал — это алгоритм: автоматизированная последовательность операций.

За этим стоит проглядывает различение — программа как интерактивность vs. как автоматизация. Для чего они нужны? Интерактивность — вероятно, для понимания. Автоматизация — для освобождения когнитивных ресурсов и времени.

• ❓ Есть ли подобное различение в литературе? → поискать в scispace

source: x_source_victor2024_dynamicland-intro

Dynamicland intro

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

A Brief Rant on the Future of Interaction Design

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Bret Victor - The Future of Programming

Link

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking

Explorable explanations

Ресурсы

• https://ncase.me/improv-wip/
• https://github.com/blob42/awesome-explorables?tab=readme-ov-file#tools-and-resources
• https://ncase.me/nutshell/

project: x_research_personal-media-for-thinking

Bring your own client with Geoffrey Litt — Episode 34, Metamuse podcast — Muse

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Folk practices with Omar Rizwan — Episode 73, Metamuse podcast — Muse

Link

Идеи

🚧 [[x_concept_analog-hole]]

Analog hole — идея о том, что цифровые уловки типа DRM всегда можно обойти, как бы разрабы не старались. Например, подставить диктофон к динамику или перепечатать залоченный PDF. Как будто разрабы не учитывают реальность за пределами компьютера.

source: x_source_rizwan2023_folk-practices, 16:00-17:23

Омар Ризван разделяет визуальные вещи как данные (Screenmatcher) vs. как визуальный синтаксис (блоки if/else).

source: x_source_rizwan2023_folk-practices, 18-19

Манипулирование объектами на экране мышкой — bottleneck

19 — manipulating things on screen with mouse is a bottleneck (ipad is better), but it is a serious problem. ergonomics of visual programming is underdevelopd

49 — systems should give direct access to the media — not (x,y) coordinated and rgbvalues for a touchscreen but a heatmap.

related: x_source_engler1995_exterminate-os-abstractions

project: x_research_personal-media-for-thinking

60 • Magic Ink by Bret Victor

Link

Идеи автора

39-40 [[x_concept_print-test]]

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

Короче, сжимать информацию визуально (information design) гораздо важнее, чем давать возможность взаимодействия.

• нужно прочитать все книжки Эдварда Тафти…
• visual display of quantitative information
• https://skillbox.ru/media/design/tufte-vdqi-1/
• https://skillbox.ru/media/design/tufte-book-1/
• https://skillbox.ru/media/design/tufte-vdqi-2/

Мои идеи

project: x_research_personal-media-for-thinking

A practical introduction to functional programming

Link

Идеи автора

Мои идеи

project: x_research_learnability-of-programming

Простые инструменты дают больше контроля над результатом

Дизайнер и архитектор [[Кен Айзекс]] писал, что более простые инструменты дают больше контроля над результатами [@isaacs1974, 5].

Ограничивая себя более простым инструментом и повысив свою чувствительность к нему, можно увидеть, как твои действия влияют на его работу механически («как инструмент может расширять, изменять или отрицать результат…»).

Иначе говоря, более простые инструменты дают более глубокие и удивляющие результаты.

• used: вам не нужен второй мозг

Link

Что с этим делать

Как/где использовать

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Воплощённые метафоры помогают понять абстракции

Воплощённые (embodied) метафоры — то есть метафоры, связанные с нашим ощущением пространства и физического мира — помогают понять абстракции, например, в программировании (которое называют «автоматизацией абстракций»). Эпплтон взяла эту идею у Лакоффа и Джонсона — [[x_source_lakoff1980_metaphors-we-live-by]].

❓Какие метафоры помогают глубже думать философу? Про это писал Деннет в [[x_source_dennet_intuition-pumps]].

• related:

  • tools-for-thought.1b1a — deepeining domain knowledge with its interface representation creates feedback loop:
    • ❓могут ли пространственные и телесные метафоры из области своего доменного знания углублять понимание и знание?
    • ❓как [[метод бисоциации]] (лобового столкновения разных идей) может углубить понимание, сталкивая пространственные метафоры из своей доменной области с проблемой?

• source: x_source_appleton2021_visual-programming

• project: x_research_personal-media-for-thinking

Вычленение идей из текстов создаёт границы и пространство между идеями

Когда вычленяешь идею, очерчиваешь её границу. Граница отделяет внутреннее и внешнее для идеи, помогает выделить её интенсию — атрибуты, составляющие её суть. Это делает возможным пространство между идеями и сравнение идей.

• ❓если есть [пространство понятий](/Users/valerii/Obsidian/!Notes/02-ideas/simple-system-test/04-files/!cognition.concepts.@aceves2024 - Mobilizing Conceptual Spaces How Word Embedding Models Can Inform Measurement and Theory Within Org.pdf), норм ли говорить про пространство идей?

[[сравнение — это обобщение]]

↓

[[обобщение — основной механизм познания]]

• [tenenbaum2011](/Users/valerii/Literature/Tenenbaum et al_2011_How to Grow a Mind.pdf)
• психология научения, первая статья

Это помогает лучше понять мысль.

Ближе всего — идея Варелы и Матурано: граница как акт различения, создающий структуру наблюдаемой системы. Однако также близки мысли Деррида и Хайдеггера: что различение создаёт инаковость.

Графическое программирование снижает градус абстракции

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

• related:

  • tools-for-thought.1a — народные интерфейсы требуют простых строительных блоков: чем проще и «ближе» строительные блоки для интерфейса, тем лучше. Drag&Drop + «близкие к телу» интеракционные примитивы (знакомые штуки, которые каждая из которых делает что-то конкретное) = неплохой старт. «Близкие к телу» лучше , потому что abstraction.2 — воплощённые метафоры помогают понять абстракции.

• source: x_source_appleton2021_visual-programming, 22:00-23:17

• project: x_research_personal-media-for-thinking

Жизнь состоит из эпох

Жизнь состоит из периодов — «эпох». Каждой из них характерен своя атмосфера, свои медиа и артефакты. Какую музыку вы слушали, какие фото сделали, о чём говорили с друзьями, что сделали?

Можно выделить несколько периодов в своей жизни, назвать их и сложить медиа и артефакты по ним.

Компьютер — это неотсортированный медиаархив

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

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

Решить эту проблему можно с помощью «народного» интерфейса x_concept_folk-interfaces — канваса или способа группировать файлы по смыслу, семантически.

• related: x_source_engler1995_exterminate-os-abstractions — операционные системы слишком сильно абстрагируют физические ресурсы компьютера, создавая условия для «захламления»: файловая система это не физическое пространство, а одна большая абстракция

Code Lauren - Game programming for beginners

Link

Идеи автора

Мои идеи

project: x_research_learnability-of-programming

Engler — Exterminate OS abstractions (1995)

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Лестница абстракции преодолевает проблему information hiding для глубокого понимания

Абстракции — в коде, теории или где либо — неизбежно скрадывают механизм работы элемента. А именно механизм помогает глубоко понять устройство элемента (будь то код, физическая система или текст). Возникает [[проблема information hiding]].

🚧 — связать с механистической философией Carl Craver, Glennan — добавить источники

Однако лестница абстракции Виктора — [[x_concept_ladder-of-abstraction]] — позволяет преодолеть эту проблему, постепенно давая пользователю возможность углубиться в механические детали. Это похоже на [[x_concept_progressive-disclosure]].

• project: x_research_personal-media-for-thinking

source: x_source_appleton2021_visual-programming

Ошибки в программировании часто вызваны непониманием устройства абстракций кода

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

Дело не в синтаксисе, а в репрезентации устройства системы, которую нужно выразить с помощью синтаксиса языка. Чтобы программировать было проще, нужно видеть и понимать проектируемую систему и её поведение. В этом смысле круто иметь модель этой системы.

• source: x_source_appleton2021_visual-programming

• related:

  • [[x_source_🔥victor2012_learnable-programming]]: Брет Виктор показывает и объясняет, как может выглядеть программирование, где видно проектируемую систему
  • https://www.newline.co/choc/ — простой редактор, воплощающий идеи Виктора

• project: x_research_personal-media-for-thinking

• parent: abstraction.1 — графическое программирование снижает градус абстракции
  parent: abstraction.1 — графическое программирование снижает градус абстракции

Программирование может быть инструментом интимности с медиа

Программирование необязательно использовать только для создания систем и автоматизации. Оно также может служить инструментом интимности с медиа — (цифровой) материей нашего времени: изображениями, видео, аудио.

«Народные» интерфейсы на базе браузера и JavaScript могут дать пользователям прямой доступ к данным и медиа.

• source: x_source_sciutto2022_folk-browser-interfaces

• parent: p1.idea_tools-for-thought.1 — веб-браузер позволяет создавать интерфейсы для своих нужд

Augmenting Long-term Memory

Link

Что с этим делать

Как/где использовать

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Error 406 - Not Acceptable

Link

Что с этим делать

Как/где использовать

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Простота end-user programming противоречит тренировке навыка computational thinking

Есть важное напряжение между простотой и «знакомостью» примитивов для «сборки» кода и тренировкой вычислительного мышления, которую прививает синтаксис. Оно заключается в том, что синтаксис, несмотря на свою сложность — это тоже "powerful representation", потому что сжимает много информации.

• ❓нужно ли вычислительное мышление, чтобы понимать, как текут данные в системе?
• project: x_research_personal-media-for-thinking

source: x_source_appleton2021_visual-programming

Репрезентация поведения системы как синтаксис и как UI не противоречат друг другу

Брет Виктор в показал в [[x_source_🔥victor2012_learnable-programming]] что абстракция в виде синтаксиса и визуальная репрезентация движения данных в коде не обязательно должны быть взаимоисключающими.

• ❓Как именно он это показал?

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

Компилятор, «собирающий» высокоуровневый код вроде JavaScript или Python, интерпретирует синтаксис и выполняет программу. Поскольку [[tools-for-thought.2 — программа - это что угодно, для чего можно сделать интерпретатор]], нужен просто новый интерпретатор, собирающий тот же машинный код из других блоков.

• ❓Как связаны машинный код и репрезентации в виде синтаксиса и UI?
  • Что первично, что от чего зависит, не мыслим ли мы изначально в категориях синтаксиса?
  • Движение между кодом и UI — двустороннее: можно собирать модель из блоков (как в Scratch) или же моделировать систему в синтаксисе и по ходу видеть её поведение. Это одно и то же?

Визуализация данных делает похожие вещи: представляет один и тот же источник данных в разных видах. Например, Notion умеет показывать одну и ту же базу данных несколькими способами — календарь, галерея, таблица и т.д.

• source: x_source_appleton2021_visual-programming, 33:00-34:00

• project: x_research_personal-media-for-thinking

• parent: abstraction.1a — ошибки в программировании часто вызваны непониманием устройства абстракций кода
  parent: abstraction.1a — ошибки в программировании часто вызваны непониманием устройства абстракций кода

End-user Programming

LINK

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking

Externalizing domain knowledge with folk interfaces can create feedback loop of deeper understanding

Externalizing domain knowledge with folk interfaces can create feedback loop of deeper understanding. You do it with useful interactions which can augment your understanding

Know → externalize (parametrize?) → experiment → understand more

• ❓что такое «понимание» и как измерить его глубину?

The key is to deeply pair one's domain knowledge with interactive power of folk interfaces.

• source: x_source_sciutto2022_folk-browser-interfaces

• parent: p1.idea_tools-for-thought.1b1 — материальность медиа требует доменных знаний

Folk interaction design

"Folk" interaction design is modifying digital (or media) environment to your taste just like you decorate your house or make simple tools as Ivan Illich suggested — [[tools-for-thought.1a — народные интерфейсы требуют простых строительных блоков]].

25.09.2025 — 20:37

• Всё больше прихожу к мысли, что «народные» интерфейсы — это, в первую очередь, медиа-архивы на основе канвасов. В них можно организовывать фотографии и аудио, чтобы документировать «эпохи» [[media-archives.1 — жизнь состоит из эпох]].

• Вторая важная мысль — чтобы делать такие интерфейсы, нужно глубоко понимать DOM API.

• related: x_research_personal-media-for-thinking
• source: x_source_sciutto2022_folk-browser-interfaces

Folk Interfaces

LINK

Что с этим делать дальше

Как/где использовать

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Home-Cooked Software and Barefoot Developers

https://maggieappleton.com/home-cooked-software

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Inkbase: Programmable Ink

Link

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking
• related:
  • x_source_kaliski2022_programmable-ink
  • x_source_appleton-library: ссылается на одну и ту же книжку — Bonnie Nardi's classic book "A Small Matter of Programming" calls attention to the spreadsheet as a remarkably successful end-user programming environment and insightfully breaks down the factors that make it work.

Local-first software: You own your data, in spite of the cloud

https://www.inkandswitch.com/essay/local-first/

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Potluck: Dynamic documents as personal software

https://www.inkandswitch.com/potluck/

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Programmable ink with James Lindenbaum and Szymon Kaliski — Episode 71, Metamuse podcast — Muse

LINK

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking
• related: x_source_kleppmann2019_local-first-software

Tools for Thought as Cultural Practices, not Computational Objects

LINK

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Visual programming with Maggie Appleton — Episode 37, Metamuse podcast — Muse

LINK

Идеи автора

• [[abstraction.1_method — графическое программирование снижает градус абстракции]]
• abstraction.2 — воплощённые метафоры помогают понять абстракции
• abstraction.1a — ошибки в программировании часто вызваны непониманием устройства абстракций кода
• [[abstraction.1a1 — репрезентация поведения системы как синтаксис и как UI не противоречат друг другу]]

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

Мои идеи

• abstraction.1b(c) — лестница абстракции преодолевает проблему information hiding для глубокого понимания
• [[простота end-user programming противоречит тренировке навыка computational thinking]]

• project: x_research_personal-media-for-thinking
• related: x_source_victor2012_learnable-programming — обсуждает x_research_learnability-of-programming

we-are-all-folk-programmers

LINK

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Frameworkless, Frictionless, Free by György Kovács

Link

Идеи автора

Мои идеи

project: x_research_sustainable-simple-web

GitHub - ivanreese/visual-programming-codex: Waypoints to the past and future of visual programming.

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Hacker News folk wisdom on visual programming – drossbucket

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Learnability of programming

Что хочу выяснить

Источники

• x_source_victor2012_learnable-programming
• x_source_appleton2021_visual-programming
• x_source_rose-cook_intro-to-functional-programming
• x_source_rose-cook_lisp-like_prototyping-environment

Library of Maggie Appleton

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Media for Thinking the Unthinkable

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Privacy-Friendly Applications with Ollama, Vector Functions, and LangChainJS by Pratim Bhosale

https://tube.cadence.moe/watch?v=5beXUcNXTSo

Идеи автора

Мои идеи

project: x_research_data-privacy

Что хочу выяснить

Как «обжить» интернет, чтобы он был как шалашик, который ты строишь сам — для себя и для близких людей?

• Как сделать его локальным (для сообщества), простым, понятным, приватным, доступным людям с особенностями и экологически устойчивым?

Источники

• x_source_kovacs2024_frameworksless
• x_source_valkhof2024_moving-features-from-js-to-html
• x_source_kwet2024_digital-degrowth

The Whole Code Catalog

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Zhu — Patterns-of-Hypertext-Augmented-Sensemaking

PDF link

Ключевые идеи

Мои мысли

project: x_research_personal-media-for-thinking

Hypercard in the World

Link

Идеи автора

✅ [[tools-for-thought.3 — HyperCard и системы Брета Виктора начинались с медиа и добавляли вычисление потом]]

What I want to emphasize here is that Hypercard in the World, and subsequent systems, started with media, and then added computation.

https://youtu.be/uI7J3II59lc?t=251

Многие проекты берут «компьютер» и шире — вычисление — за начальную точку и пытаться создать медиа из компьютера . Проекты Брета Виктора, в частности "HyperCard in real world" и системы, последовавшие за ним, берут медиа за стартовую точку. Медиа здесь — канал информации со своими афордансами (как я это понимаю), например, книга, картина, post-it. Это некий материал.

Однако чтобы лучше понять, что именно Виктор имеет в виду, говоря о медиа, стоит посмотреть x_source_dynamicland-book-recommendations.

🚧 [[media — чтобы начинать с медиа, нужно понимать природу своего материала]]
Начинать с медиа и добавлять вычисление при необходимости — хорошее motto. Однако оно требует необычного сегодня подхода — близкого знакомства со своим материалом и понимания его свойств. Это требует своего рода цифровых версий «материаловедения» и «сопротивления материалов». Однако тот факт, что большая часть умственной работы сегодня — цифровая, скорее следствие того, что исторически вычисление ставили выше, чем медиа и понимание своего материала.

Попытка стать продуктивнее заведомо провальна, если расчитывает на приложение (вычисление), а не отталкивается от природы работы и её ограничений. Поняв ограничения материала, можно добавить вычисление, а не наоборот.

• ❓Как понять, что служит твоим материалом для работы?
  • Мохой-Надь внимательно работал с материалами — можно посмотреть его

• related:
  • tools-for-thought.1b — программирование может быть инструментом интимности с медиа: Кристобаль Шутто говорит о программировании как в первую очередь инструменте работы с медиа, а не строительства автоматизированных систем. Если Виктор начинает с медиа и идёт к программированию (точнее, к «вычислению» в широком смысле), то Шутто — переосмысляет программирование.
• project: x_research_personal-media-for-thinking

Magic Ink: Information Software and the Graphical Interface

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Tutorials | Explorable Explanations

Link

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking
• related: x_concept_explorable-explanation

Up and Down the Ladder of Abstraction

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

folkjs

Link

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking

Howard Rheingold — Tools for thought

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Malleable Systems Collective

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Michael Kwet — Digital Degrowth (2024)

Link

Идеи автора

Мои идеи

project: x_research_sustainable-simple-web

Spatial Canvases: Towards an Integration Domain for HCI, with Orion Reed

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Varv | Varv

Link

Что хочу узнать

• Насколько сложно создать свой интерфейс под задачу?
• Насколько быстро и сложно такая система позволяет создать интерфейс?

где и как и использовать

• в моём курсе-лабе по поиску и подбору своих инструментов — как площадку площадку

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking
• related:
  • x_concept_folk-interfaces: в varv можно делать «народные» интерфейсы для своих нужд
  • [[x_concept_malleable-software]]: пример подвижного настраиваемого софта

Webstrates | Webstrates

Link

Что хочу выяснить

• Что такое malleable software?
• Как можно использовать связанные сервером клиенты чтобы углубить понимание?

Как и где использовать

• ❓ можно ли использовать webstrates, чтобы использовать cosma как гугл-док — одновременно вместе? А главное — что это даст, если в самой косме нет state, и она не может ничего сохранять?

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Growing ideas with Andy Matuschak — Episode 12, Metamuse podcast — Muse

Link

Идеи автора

🚧 [[кардинально новые способы репрезентации требуют глубокой доменной экспертизы]]

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

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

source: x_source_matuschak2020_growing-ideas, 17-19

related:

• tools-for-thought.1b1a — deepeining domain knowledge with its interface representation creates feedback loop:
  • инструмент не должен отвлекать от доменной экспертизы, а быть его медиумом
  • новые мощные репрезентации рождаются, когда мы углубляем свою доменную экспертизу — нужно работать над своей экспертизой и думать о трех вещах:
    • что является материалом для меня — идеи, факты, изображения, формулы, нотация и тд
    • идеальная система — так, которая не существует, но чья функция выполняется:
      • ❓ Репрезентация имеет функцию или/и набор аффордансов действия, которые несёт с собой

21-23 — У музыкантов и атлетов есть «намеренная практика»: даже известный гастролирующий пианист тренируется ежедневно — у работников умственного труда такого нет. Ну запишу я идею в заметки, а дальше что? Но запланирую время, чтобы «подумать» над ней, а дальше что? Нет конкретного алгоритма развития идея — выращивания (или выхаживания) их, пока они не «подрастут» и не «окрепнут».

26-28 — Редко стоящие идеи возникают с первой сессии: вот пришла, кажется, классная идея над которой хочется подумать, ты выделил на неё время и ни к чему стоящему не пришёл. Однако часто, как говорит Матусчак, одной сессии недостаточно. Полезная практика для этого — возвращаться к одной идее через время, например, две недели. И, возможно, на 5-6 раз начнёт проявляться что-то стоящее. Проблема, по словами Матусчака, в том, что это очень сложно менеджерить.
→ в статье x_source_dereciewics2010_solitude-and-leadership автор говорит похожую вещь: что нужно «отсоединить» себя от чужих мнений, чтобы прийти к чему-то оригинальному, потому что после первой сессии работы над идеей часто то, что остаётся — это чужие идеи
→→ я учил людей в курсе «система письма» собирать тексты из чужих идей, а это совсем неправильно, получается. Потому что вычленить идеи из чужих текстов — это только самое начало работы. Это «сбор данных». Нужно брать эти «данные» и думать над ними — но как это делать, я не учил.

29-30 — Энди описывает работу с PDF в LiquidText: круто, что можно поместить несколько документов на один холст, где можно выделять и делать скрины важных частей. Однако проблема в том, что нужно заранее понять, к какйо проблеме относятся документы, и их не получится соединить с другими проблемами. В этом смысле, иметь один общий канвас/пространство для источников и идей из них лучше, потому что решает эту проблему

30:50 — idea collider: механика, когда даются две рандомных заметки и тебе НУЖНО написать третью, синтезируя те две. Это очень похоже на технику биссоциации и идеи Артура Кестлера.

Как «мариновать» идеи? Это гораздо более важный вопрос, чем «как хранить идеи».

42-44 — Интервальное повторение можно использовать не только чтобы припомнить новую информацию, но и чтобы применить. Энди приводит пример вопросов-уравнений в Quantum Country.
→ Это переложение таксономии Блума: чтобы обрести экспертизу, нужно сначала припоминать, потом понимать, объяснять и мочь применить.

Мои идеи

project: x_research_personal-media-for-thinking

Human-Computer Interaction — Episode 06, Metamuse podcast — Muse

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Self-made tools with Linus Lee — Episode 42, Metamuse podcast — Muse

Link

Идеи автора

Мои идеи

• project: x_research_personal-media-for-thinking
• related: x_concept_folk-interfaces

January 2025

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

JP's exposition

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

tldraw • build whiteboards in React with the tldraw SDK

Link

Что с этим делать дальше

Как/где использовать

• можно сделать кастомный холст как в [[x_source_🚧🔥reed2024_spatial-canvases-as-integration-domain]]

project: x_research_personal-media-for-thinking

Ink & Switch

Link

Идеи автора

Мои идеи

project: x_research_personal-media-for-thinking

Kay1989_User-Interface-Personal-View

PDF link