---
title: "Pojďme znovu vynalézt kolo: článek za 30 sekund"
description: "UI experiment, který šetří čas čtenářů: krátká shrnutí článku ke čtení i poslechu. Návrhy od AI jsem přepsal a nahrávky připravil předem."
url: "https://petarzayakov.com/cs/blog/clanek-za-30-sekund/"
language: "cs"
---

[všechny články](https://petarzayakov.com/cs/blog/)

# Pojďme znovu vynalézt kolo: článek za 30 sekund

UI experiment, který šetří čas čtenářů: krátká shrnutí článku ke čtení i poslechu. Návrhy od AI jsem přepsal a nahrávky připravil předem.

28\. října 2026 1 min čtení

-   UI experimenty
-   AI nástroje
-   Webová API

**Strojový překlad** Článek je strojově přeložený z angličtiny a může obsahovat nepřesnosti. Přečtěte si [anglický originál](https://petarzayakov.com/blog/lets-invent-the-wheel-article-in-30-seconds/).

Říká se, že nemá smysl znovu vynalézat kolo. Když potřebujete dodat produkt, platí to. Když se chcete něco naučit, vlastní pokus dá víc. V téhle sérii zkouším malé nápady na UI a zapisuju si krátké poznámky: nápad, jak jsem ho postavil a co jsem se naučil. Ukázku si můžete vyzkoušet na konci.

## Nápad

-   ne každý si najde pět nebo deset minut na celý článek; dvě minuty nebo půl minuty už ano
-   co kdybyste si sami vybrali délku shrnutí a rozhodli se, jestli ho chcete číst, nebo poslouchat?
-   shrnutí si můžete poslechnout na procházce, při čekání na autobus nebo při vaření
-   čas ušetří i autor: nemusí shrnutí sám namlouvat
-   za finální podobou shrnutí si musím stát já

## Realizace

-   AI navrhla shrnutí na 30 sekund a na 2 minuty; obě jsem pak přepisoval, dokud nevystihovala přesně to, co jsem chtěl říct
-   skript na mém počítači poslal každé hotové shrnutí do ElevenLabs a uložil nahrávku i časování slov
-   při poslechu se nevolá ElevenLabs ani jiná AI služba: stránka přehrává předem připravené zvukové soubory
-   slova se zvýrazňují ve chvíli, kdy zazní, takže můžete při poslechu sledovat text a kdykoli na čtení navázat
-   ovládání ze zamčené obrazovky i ze sluchátek funguje, telefon tak může zůstat v kapse

## Výsledek

-   verze na 30 sekund funguje, jen když má článek jednu jasnou myšlenku
-   mluvené shrnutí potřebuje krátké věty a příklady s kontextem; odrážky v něm nefungují
-   kontrola shrnutí trvala déle než jejich vygenerování a právě v ní je hodnota
-   nahraný hlas zní mnohem přirozeněji než vestavěná řeč prohlížeče, každá změna textu ale znamená novou nahrávku
-   tento přístup se hodí pro články, které se mění málokdy, ne pro stránky aktualizované každý den
-   shrnutí čtenáři ušetří čas, jen když si za ním někdo stojí, a o tom je i článek [Vytvářet hodnotu je dnes důležitější než kdy dřív](https://petarzayakov.com/cs/blog/vytvaret-hodnotu/)

## Použité technologie

-   [ElevenLabs Text to Speech s časovými značkami](https://elevenlabs.io/docs/api-reference/text-to-speech/convert-with-timestamps) vytvoří nahrávku a ke každému znaku vrátí čas, kdy zazní
-   [CSS Custom Highlight API](https://developer.mozilla.org/en-US/docs/Web/API/CSS_Custom_Highlight_API) zvýrazní vyslovená slova bez úprav HTML
-   [Media Session API](https://developer.mozilla.org/en-US/docs/Web/API/Media_Session_API) přidává ovládání ze zamčené obrazovky a ze sluchátek

## Ukázka

Interaktivní ukázka: vyberte délku a shrnutí si přečtěte, nebo spusťte přehrávání. Nahrávky vznikly předem v ElevenLabs z textu, který vidíte. Při poslechu se nevolá žádná AI služba.

Napsal Petar Zayakov

Software engineer z Prahy se zaměřením na frontend. Stavím i full-stack produkty s backendem v Go.

[více o mně](https://petarzayakov.com/cs/o-mne/) [napište mi](https://petarzayakov.com/cs/kontakt/)

[předchozíPojďme znovu vynalézt kolo: obchod s asistentem](https://petarzayakov.com/cs/blog/vymyslime-obchod-agentni-nakupovani/)