Олександр Колодько. Про дизайн, міста та дизайн у містах
Норвезька студія Snøhetta придумали цікаве інженерне рішення для плитки, яке дозволяє варіювати проміжок між верхніми поверхнями.
Це дозволяє пропускати більше води й вологи там де треба, і робити щільніше поверхню у місцях проходу. Плитка складається з двох частин:
Та і взагалі це доволі красиво виглядає.
Продовжую експерименти написання простих скриптів з допомогою ChatGPT. Тут перша частина зі скриптами для Adobe Illustrator.
Перше, що захотілося зробити, це перенести скрипт з Ілюстратора в Індизайн (хоч скрипти й схожі, але у програм всередині різна специфіка).
Тож спочатку я спробував подібними до попередніх запитами згенерувати скрипт. Але з 5-6 спроб робочого коду не вийшло. Тому далі я знайшов у спільноті Адоб шматок коду схожий на те, що мені треба.
Але для його використання для різних накреслень і шрифтів не вистачало масиву значень на початку та циклу його виконання. Тому я скопіював код і попросив ChatGPT додати мені ці модулі. І за кілька уточнень вийшло робоче рішення.
Далі зробив ще одну версію, попросивши додати виклик модального вікна, в яке можна ввести руками потрібні назви шрифтів. І він мені це теж зробив:
Завантажити скрипти:
Окрім зміни шрифтів, попросив придумати скрипт, для заміни одних стилів на інші та ще попросив додати вікно, в якому ці назви можна ввести. Отримав такий скрипт.
А далі попросив замість полів для введення тексту зробити спадні списки зі всіма наявними стилями у документі. Але скрипт сходу не запрацював, але його можна об’єднати з попередніми.
У мене є потреба періодично зберігати поруч з Гугл Документом також і PDF, який я потім можу відправити. При збереженні через меню документів сам документ у мене завантажується у Downloads, як і решта файлів. Але потім мені потрібно знову завантажувати PDF у ту саму теку на драйв. Не складно, але це витрата часу.
Шукав приклади скриптів, які б могли зберігати PDF у ту саму теку, але робочих не знайшов. І от попросив ChatGPT запропонувати мені такий скрипт. І з першого разу отримав робочий варіант:
function onOpen() {
var ui = DocumentApp.getUi();
ui.createAddonMenu()
.addItem(’Convert to PDF’, ’convertDocToPDF’)
.addToUi();
}
function convertDocToPDF() {
var docFile = DocumentApp.getActiveDocument().getId();
var doc = DriveApp.getFileById(docFile);
var pdfFile = DriveApp.createFile(doc.getAs(’application/pdf’)).setName(doc.getName() + «.pdf»);
var parentFolder = doc.getParents().next();
pdfFile.makeCopy(parentFolder);
pdfFile.setTrashed(true);
}
Також ChatGPT описав інструкцію, як цей скрипт опублікувати, щоб він працював не тільки у конкретному документі, але це виявилось не так просто, як зробити скрипт 😅.
Колись для транслітерації назв зробили разом з програмістами простий сайт з простим JS, якій заміняв літери на інші за певними правилами. Потім з цього створили скрипти для AI та ID. А потім я стикнувся з такою з задачею у Фігмі, але робочих рішень не знайшов. Щось покрутив, але кинув, бо моїх знань було недостатньо.
І от спробував згодувати цю задачу ChatGPT. Взяв увесь наявний скрипт, як приклад, і попросив придумати, як з цього скрипту зробити скрипт для Фігми. Спочатку запропонований код транслітерував всі тексти на сторінці. Через уточнення він це робив для виділеного тексту, а якщо не виділений, то вже для всього.
І у першому варіанті цей код навіть працює, транслітерує, лишилось тільки допиляти для виключень і різних випадків. Далі вже можна туди додати якийсь інтерфейс за потреби. Тест вважаю вдалим.
Про грепи (або регулярні вирази, або regex) розповідав у лекції і все хотів написати детальну статтю зі всіма посиланнями, які назбирав, але все не знаходив час. GREP дуже потужна штука, але в неї був дуже високий поріг входу, щоб розуміти як будувати потрібні правильні вирази.
І от тепер з ChatGPT цей поріг можна вважати зниженим, бо він дуже гарно конструює навіть складні вирази.
Наприклад, давайте в Індизайні після всіх прийменників додамо нерозривні пробіли у всьому тексті через GREP-стилі. Для цього потрібно знайти у тексті всі прийменники. Тож створюємо стиль для символів без перенесень (no break) та питаємо у ChatGPT список всіх прийменників у вигляді регулярного виразу.
Він розуміє українську і віддає згенерований вираз вже у потрібній формі. Єдине що цей regex не зовсім підійде у Індизайн, тому уточнюємо що це має бути саме GREP для Індизайну і отримуємо робочий запит.
Так само можна конструювати грепи, які знаходять прізвища та ініціали, одиниці вимірювання, дати та місяці, номери телефонів у різних видах тощо. Далі потім знайдені дані (одразу всі, в усьому тексті) можна або переформатовувати або задавати їм потрібний стиль.
Регулярні вирази — дуже технічно-орієнтований інструмент. Тому тепер до цього інструменту є людино-орієнтований інтерфейс, який трансформує ваш запит у зрозумілу машині форму.
Також в лекції згадував, що також у автоматизації дуже допомагають різні консольні команди (cli, command line interface), які заточені на певні дії. З ними така сама ситуація — щоб ними користуватись, потрібно розбиратись в прикладах та документації, що теж техно-орієнтованість.
Тому тут можна теж ChatGPT використовувати, як посередника для пошуку потрібної команди з потрібними параметрами. Наприклад, маємо купу скріншотів зроблених автоматично з різницею у 4-5 секунд, з яких хочемо зробити скрінкаст.
Для роботи з відео є потужна програма ffmpeg, яка працює з командного рядка. Тож попросив ChatGPT запропонувати команду для ffmpeg, яка б об’єднала картинки у відео. З першого разу отримуємо варіант, який на 100% працює та робить відео з заданою кількістю кадрів, які можна скоригувати.
ffmpeg -framerate 30 -pattern_type glob -i ’/path/to/folder/*.jpg’ -c:v libx264 -pix_fmt yuv420p /path/to/output.mp4
Таким чином не потрібні ніякі додаткові програми, для створення відео з картинок: за допомогою Автоматора робимо скріншоти, а через ffmpeg отримуємо відео.
Так само можна пошукати запити і на інші задачі з відео, наприклад, перезберегти з певною компресією чи зміною розміру, або прискоренням.
Раніше я шукав налаштування команд на Stackoverflow, а зараз швидше спитати у ChatGPT. Приклади запитів.
Компресія відео з ffmpeg
До попереднього пункту: для створення скрінкасту у мене був скрипт, який робив скріншот екрану і клав у потрібну теку в Дропбоксі, а потім зі скріншотів збиралося відео.
Зараз Дропбокс змінив і виходить старий скрипт некоректно працює. Йти шукати у документації до AppleScript як змінити шлях було б довго. Тому скопіював наявний скрипт і попросив замінити шлях збереження скріншотів у теку /Desktop.
Ще попросив зробити скрипт для швидкого збереження артборду у TIFF з заданим DPI. Отримав отакий варіант, який видавав помилку. Знайшов у спільноті Адоба відповідь зі схожою частиною, та побачив що один з параметрів замість IBM має називатись IBMPC, замінив, запрацювало. Тобто весь скрипт робочий, але помилка була в одному з параметрів. Завантажити скрипт.
Деякі системи хоч і доступні всім, але поріг входу в них занадто високий. Але ChatGPT і тут зможе допомогти його подолати.
У OpenStreetMap (карта/база даних, які відкриті для всіх) зберігається величезна база геоданих, доступ до яких не суперпростий. І в OSM є мова запитів Overpass, яка дозволяє вивантажувати / запитувати якусь певну частину тих даних. Так от Overpass супер-неінтуітивна мова, і тут Chat GPT допомагає перекласти запит з людської на машинну.
І це я скористався лише безкоштовною версією ChatGPT (модель GPT 3.5), і вже відчув, що стаю продуктивнішим ніби маю ще один механізований маніпулятор на додачу до рук, який розуміє що я хочу зробити та робить це швидше,
Тепер спробую модель Codex (Github Copilot), яка створювалась як раз для написання коду, а також GPT4. Напишу потім, що з цього вийшло.
Також хотів проілюструвати цю думку згенерувавши картинку людини з ще оною механізованою рукою, накшталт, технодесандників з Вархаммеру, але з 20 спроб у Midjourney v4 мого задуму не вийшло ¯\_(ツ)_/¯
?
₴
Якщо вам було цікаво та корисно, можете пригостити мене кавою ☕️: картка Монобанку: 4441114450427339 або через сайт.
Знайшов для себе цікавий кейс застосування ChatGPT — створення простих скриптів для Ілюстратора.
У лекції про дизайн-конвеєр я розповідав, що можна дуже прискорити роботу автоматизуючі окремі дії. І тут дуже допомагають екшени та різного роду скрипти. Але екшени покривають точно не всі функції, а поріг входу у скрипти доволі високий.
Так от, нейромережа може допомогти створювати прості скрипти (до об’ємних вони поки не доросли).
Наприклад, є задача: маємо купу інфографіки для звіту двома мовами. І в усіх картинках треба поміняти шрифт на інший та замінити кому на крапку у числах (45,5% → 45.5%).
У картинках використовуються різні накреслення, тож просто все виділити і поміняти не підходить. Треба йти в Find/Replace font і там вручну задавати зміну кожного накреслення. Довго. Те саме заміною символів: Find and Replace, ввести символи, замінити, підтвердити. Довго.
Спочатку, як завжди, пошукав у гуглі відповідь, бо можливо хтось вже писав такий код. Сходу не знайшов щось робоче.
Тож далі я запитав у ChatGPT, щоб він описав скрипт, який би замінював один шрифт на інший. Вийшов скрипт, який міняє шрифт, але робить все одним накресленням. Другим запитом я уточнив, щоб і накреслення враховувалось. Перевірив — працює. Тож у кожному документі просто запускався скрипт і все саме мінялось.
На цю задачу можна було залучити програміста, який на цьому розуміється, але з конкретною простою задачею навіть безплатний ChatGPT впорався непогано.
Далі можна ще допиляти скрипт додати заміну кількох шрифтів на інші. І ось, ще один службовий інструмент у вас є.
Авжеж, не весь код працює або не враховує якісь крайні ситуації. Але через кілька уточнень можна спробувати трохи іншу версію.
Ось вам приклад цього скрипта, який я частково докрутив: https://www.dropbox.com/s/5c26qlafyo225sq/Font%20Replacer.jsx?dl=0
На початку у масиві вказуються назви старого і нового шрифтів та їхні накреслення. Також можна вказати декілька змін для різних шрифтів і накреслень.
{
«oldFontName» : «Daikon», // Назва старого шрифта
«oldFontWeight» : «Bold», // Накреслення старого шрифта
«newFontName» : «DM Sans», // Назва нового шрифта
«newFontWeight» : «Bold» // Накреслення нового шрифта
},
Не обов’язково треба вивчати кодування для програм Адоб, буде достатньо розуміння, що ви хочете отримати в результаті. Чим простіша і точкова задача, тим буде простіше поставити питання нейромережі й отримати більш-менш робоче рішення.
І замість витрачання на часу на ручне клацання в інтерфейсі, можна створювати такі скрипти. Для своєї задачі я зекономив десь пів години, але чим більше картинок, тим більша буде й економія.
Цікаво, як з такою задачею впрорається анонсований вчора GPT-4. Уявіть плагін, який би працював безпосередньо в Ілюстраторі, в який можна написати задачу і він видаватиме робочий скрипт, який можна запускати одразу у редакторі.
Я покористувався різними сервісами, то спочатку замислився: на початку комп’ютерам треба було писати певні команди у командному рядку, а тепер знову потрібно писати команди, але вже у браузері.
Прийшов до висновку, що те, що зараз називається ШІ, це скоріше ще більш верхньорівнева мова програмування. Ти просиш мережу/модель щось зробити, у певному вигляді, з певними параметрами, і вона робить (точніше намагається якомога точніше передбачити бажаний результат). Так само, як інші програми, тільки інтерфейс став ще більш доступний.
Тому, мені здається, немає чого переживати за втрату роботи. Інструменти ШІ суттєво підвишують продуктивність у всякій не дуже цікавій рутинній роботі, наприклад: треба щось, на кшталт, тигра в акварельному стилі, і ти маєш або малювати, або замовляти, або шукати у пошуку чи на стоках.
Так само як базове вміння програмувати допомагає автоматизовувати. Людині ж лишається головне — придумувати сенси і концепції, на що поки інструменти ШІ не здатні.
P. S. Ще про саме поняття ШІ сподобалась цитата Макса Кідрука:
Я як міг ретельно розібрався з ChatGPT та Midjourney, і вже втомлююся повторювати — це не штучний інтелект. Поняття штучного інтелекту настільки поширилося, що фахівці були змушені впровадити новий термін — «штучний інтелект людського рівня». Те, що є зараз, — це просунуті програми, оптимізовані під виконання певних завдань, які імітують діяльність людини. Він вже давно існує — це машинний переклад, це пошуковики, розпізнавання облич у соцмережах. І є справжній штучний інтелект людського рівня — самоусвідомлена машина.
Після того, як я опублікував відео про генератори, мене попросили зробити такий інструмент для створення табличок Природного заповідного фонду України для дерев. Зробив першу ітерацію:
g.wayfinding.systems/pzfu
Новий стиль заповідників розробляла студія happy, дуже велика і змістовна робота. В основі стилю був зроблений патерн, який повторює текстуру дерева. І на цих табличках він також використовується.
У матеріалах з брендбука ця текстура зроблена однією великою картинкою, щоб потім дизайнер міг на свій розсуд її вставляти у макети та обирати зручний ракурс. У макетах, які мені дали як приклад, текстура для всіх табличок однакова. Але мені хотілося не просто відтворити, а зробити так, щоб для кожної таблички цей патерн був унікальним.
Перша думка була — треба на основі алгоритму якось генерувати подібні лінії. Але я не маю достатньо знань, що створити потрібний алгоритм.
Але трохи подумав, як можна обійтись тією однією текстурою. Придумав такий підхід:
Таким чином маючи одну фіксовану текстуру можна отримати безліч комбінацій. Хоча підхід неідеальний: при певних параметрах текстура занадто сильно з’їжджає в якийсь з боків.
За допомогу окрема подяка dnipro.design, Ігорю та Максиму Крижановським.