Jak umělou inteligenci začleňujeme do designérské praxe

6 praktických tipů jak na AI

AI vtrhla do našich firemních procesů. Křivka adopce AI je ve všech IT oborech extrémně strmá. Od prvních nejistých kroků se rychle stala věcí, na kterou se můžeme pracovně spolehnout. Takhle zatím funguje pro nás ve Švejda–Goldmann:

1. Průběžná revize designérského procesu
2. Pomoc se startem projektů
3. Transkripce a sumarizace textu
4. Programování
5. Manipulace s obrazy
6. Kód a prototypování

Revize procesů

Máme poměrně pevně namodelovaný design-proces, kterého se držíme a při konkrétním klientském projektu pak už jen určujeme optimální cestu a volíme vhodné metody a techniky.

Aby proces nebyl rigidní, každý týden ho procházíme, dáváme si feedback na metody — překonaných se zbavujme, hledáme a vymýšlíme nové.

Obecně AI dobře odpovídá na obecné dotazy. Proto nám výborně pomáhá se sylaby, přípravou školení a koncepcí jednotlivých metodik. Dáme jí k dispozici např. strukturu námi navržené metody a necháme se navést na obohacení o nové oblasti.

Iniciační dotazy a heuristika

Při začátku projektu víme málo o problematice zákazníka a musíme se dobře ptát. Pro naše klienty sestavujeme iniciační dotazníky, které je necháme vyplnit a pak je společně procházíme a vyhodnocujeme.

Příklad obecných dotazů, se kterými vstupujeme do projektů

Pomocí AI obohacujeme otázky a klienty navedeme na nové odpovědi. ChatGPT nakrmíme výsledky od klientů a připravíme ho:

I am a web designer working on a new project for a client focused 
on healthy eating. 
The website will be dedicated to promoting a healthy 
lifestyle and will include a variety of components, such as blog 
posts discussing healthy eating habits and recipes, as well as 
an online store featuring a range of healthy foods. 
The target audience for the site is anyone interested in improving their 
health through diet and nutrition.

a detailně se ptáme:

What I want you to answer is: 
What are the possible pain points of the website? 
How can I monetize the website?
Who are my competitors? 
...

Výsledky pak znovu procházíme s klienty a získáváme tak relevantní informace.

Podobně naučíme chat to, co jsme zjistili naší jinou metodou, heuristickým skenem. Heuristická analýza spočívá v předpokládání obvyklých problematických jevů na základě předchozí zkušenosti. V tomto případně nám výsledky poskytují spíše feedback na heuristiku samotnou. Přivedou nás tak na nové oblasti, na které zaměřujeme svoji pozornost. Tady AI pomáhá podobně jako detektor lži. Sám detektor nemá hodnotu důkazu, ale vyšetřovatele navede.

Transkripce, sumarizace

Při mnoha technikách běžně klienty nahráváme — a přehráváme si a přepisujeme nahrávky, zpracováváme je do srozumitelných dokumentů a analýz.

Hodně času jsme byli zvyklí trávit úpravami nahraných záznamů — Audacity.

Nově pomocí rest-api Whisper — OpenAI děláme strojovou transkripci.

(Credit 💜 Na tuto techniku nás přivedl Lukáš Pulda, který pomocí Whisperu pracuje analyticky se zákaznickými hovory)

Pro obsluhu rest-api používáme klient Insomnia

Samotná transkripce bývá stále poněkud málo čitelná pro lidský mozek. Plná chyb a špatně pochopených slov. Mohlo by se zdát, že je to slepá cesta.

Ukázka strojově převedeného záznamu výzkumné schůzky.

Nicméně po vhodně zvoleném promptu mohou být náhle výsledky přestrukturovány v užitečný zápis a stát se podkladem k další okamžité práci:

Ukázka strojově přeformátovaného zápisu

Programování

Nejsme programátoři, ale např. jednoduché unix shellové scripty pro chod kanceláře si píšeme sami. Nově jsme v tom efektivnější, protože GPT-4 dokáže například napsat i jednoduché funkce:

Write a simple zsh script to parse csv from a file. 
Print to screen. Don't show the value in the second column as a value, 
show it as a progressbar.

Po pár úpravách máme uspokojivě fungující script, který bychom jinak formátovali neúměrně dlouho.

Podobně například máme zpracován generátor předvyplněných URL hodnot do google formuláře apod.

Generování obrázků

Generování obrázků zkouší každý :) Je to nejvíce viditelný výstup OpenAI. Ale jak ho přesně používáme pro naši práci?

Nobileho polární výprava zachraňovaná ledoborcem Krasin — generováno pomocí Open AI Dall-e-2

Manipulace s obrazy

Klient potřeboval hero-image pro svou webovou stránku. Fotku měl hezkou, nicméně kompozičně ne úplně vhodnou.

Vlevo je původní fotografie.

Pomocí Dall-e jsme vygenerovali neexistující zbytek fotky napravo tak, aby nám vyhovovala naležato pro webovou stránku.

Prototypy a generování HTML a CSS

Pro funkční single-pages, které chcete spustit do půl hodiny, protoypy a testování je ideální postupovat v několika krocích.

Základní struktura

Já osobně jsem velký fanoušek markdownu, zapisuju si v něm poznámky i osobní věci. Proto často začínáme v něm. Třeba takto:

# Imagine you're a language user. 
## Design a simple website structure where 
- I introduce myself, 
- describe my method 
- and contact me. 
- Show it in markdown code.

Podobnými příkazy upravujeme strukturu, dokud nejsme spokojeni.

That looks good. Convert it to html.

Kód už máme. Pak následuje přidání nějakého vizuální stylu.

Tip 👍Podobně jako při jakémkoliv jiném MVP postupujeme po krocích, která nám samy o sobě k něčemu jsou, i kdybychom pak už postupovali jiným postupem.

Proto se zeptáme třeba na barvy:

Well done! Let's pick a color palette that suits language learning. 
What do you suggest?

Výsledkem může být:

Vybraná barevná paleta

Výsledek pak můžu použít např. jako vstup do Figmy, pokud bychom se rozhodli s AI už dál nepokračovat.

Pomocí následujícího promptu aplikuji vybrané barvy na vlastnosti. Zároveň dostanu primitivní vizuální a typografický styl.

These colors look good. Do use these CSS colors for the HTML code above. 
Use google fonts. Create properties in CSS only for elements that 
are actually used on the page.

Bez velkého úsilí máme základní fungující stránku se stylem. Pro rychlé prototypování nebo jednoduchou a rychlou produkci je nástroj Open AI už teď velmi účinný.

Zajímá vás dál, jak využíváme umělou inteligenci k revoluci v designu?

AI transformuje svět designu a přináší nečekané způsoby využití. Pokud máte zájem se o této fascinující oblasti dozvědět více nebo diskutovat o možnostech spolupráce, neváhejte nás kontaktovat.

Těšíme se na to, jak společně můžeme objevovat nové možnosti, které AI v designu nabízí, a jak budeme společně tvořit budoucnost designu.

Napište nám, jak používáte AI pro svoji práci vy.

Jsme internetoví designéři. Pomáháme firmám s re-startem digitálních produktů: webdesignem, aplikacemi, zlepšením konverze, stručnými užitečnými průzkumy. #webdesign #UX Švejda Goldmann.