Jak vytvořit vlastní nástroj? – Visualbook Demo

Jak vytvořit vlastní nástroj?

Na této stránce

Co je vlastní online nástroj

Stránka manuálu, která něco umí — ne jen popisuje pravidlo, ale rovnou podle něj pracuje.

Poznámka

Nástroj běží přímo ve stránce manuálu, v izolovaném rámu. Nepotřebuje vlastní hosting, doménu ani údržbu navíc.

Brand manuál nemusí být jen popis pravidel. Může obsahovat i malé webové aplikace, které s pravidly rovnou pracují — vygenerují grafiku podle palety značky, ukážou živou sazbu textu nebo ověří, jestli zvolená dvojice barev splňuje kontrast.

Takovému nástroji říkáme vlastní online nástroj. Je to obyčejná HTML stránka: designér ji připraví (sám, s pomocí AI nebo z hotové open source knihovny), nahraje ji do manuálu a tím vzniká plnohodnotná stránka se stejnou hlavičkou, navigací i typografií jako zbytek manuálu.

Výhoda je v tom, že nástroj zůstává u značky, ne v cizí aplikaci. Když se změní paleta nebo písmo, upraví se na jednom místě a všichni, kdo manuál otevřou, pracují okamžitě s aktuální verzí.

Jak nástroj vznikne

Tři kroky bez programátora: založit stránku, nahrát soubory, hotovo.

Tip

Nástroj může být i jednosouborový. Když si vystačí s jedním HTML, je hotovo po prvním nahrání.

Postup má tři kroky a nevyžaduje programátora ani nasazení na server.

1. Založení stránky. V administraci vznikne nová stránka typu Vlastní nástroj — dostane název, popisek na kartu a zařadí se do struktury manuálu jako každá jiná stránka.

2. Nahrání souborů. Na stránku se nahraje hlavní HTML soubor a k němu volitelně další soubory: styly, skripty, obrázky, písma nebo knihovny. Klidně celý export z generátoru nebo hotová open source komponenta.

3. Hotovo. Stránka se vygeneruje okamžitě a nástroj je funkční na vlastní adrese v manuálu. Dá se přepnout mezi zakomponovanou variantou — nástroj sedí v layoutu manuálu pod hlavičkou stránky — a celoobrazovkovou, která je vhodná pro nástroje potřebující hodně plochy.

Úpravy probíhají stejně: nahraje se nová verze souboru a změna je vidět hned.

Import souborů

Ukázka, jak naimportovat soubory vlastního nástroje.

K čemu se nástroje hodí

Od generátorů grafiky přes živé ukázky sazby až po drobné kontrolní pomůcky — pár typických situací, kdy se vlastní nástroj vyplatí.

Generátor grafiky pro klienta

Vzory na pozadí, ilustrační tvary, obálky příspěvků na sociální sítě nebo podklady pro prezentace — vše rovnou v barvách značky. Kdokoli z týmu si vygeneruje grafiku, která odpovídá manuálu, aniž by musel otevřít grafický program.

Živá ukázka sazby na webu

Stránka, kde se dá měnit velikost písma, proklad, délka řádku i barva textu a hned vidět, jak sazba působí. Vedle náhledu může rovnou stát CSS, které vývojář zkopíruje do projektu. Mnohem přesnější než statický obrázek s popisky.

Kontrolní pomůcky

Kontrast dvojice barev, minimální velikost loga v dané šířce, ochranná zóna nebo převod barev mezi HEX, RGB a CMYK. Drobnosti, které se v manuálu popisují těžko, ale jako nástroj se ovládají za pár vteřin.

Konfigurátory a sestavovače podkladů

Vizitka, e‑mailový podpis, popisek produktu nebo banner: uživatel vyplní údaje, nástroj složí hotový výstup ve správném layoutu a nabídne ho ke stažení. Ušetří to kolečko požadavků na grafické oddělení.

Cokoli, co značka zrovna potřebuje

Seznam ikon s vyhledáváním, kalkulačka rozměrů tiskovin, slovníček tone of voice, generátor náhledových obrázků. Protože jde o běžné HTML, není nástroj ničím omezený — vzniká přesně na míru tomu, s čím tým opravdu pracuje.

Pravidla si přečte i AI

Nástroj není jen pro lidi. Přes MCP konektor si jeho pravidla přečte i AI asistent — a tvoří podle nich dál.

Tip

Pravidla stačí napsat běžnou větou. Asistent je dostane jako text, nemusí se prokousávat kódem nástroje.

Ke každé stránce s nástrojem patří pole Specifikace pravidel pro AI. Napíšete do něj vlastními slovy pravidla, kterými se nástroj řídí — povolené barvy, rozsahy parametrů, zakázané kombinace, k čemu se výstup smí použít. Návštěvníci manuálu ho nikde nevidí; je to vzkaz pro asistenta.

Kromě toho si asistent umí stáhnout i samotné soubory nástroje, takže vidí i pravidla zapsaná přímo v HTML, ve stylech nebo ve skriptu.

Nástroj nemusí nic generovat

Jakmile se pravidla dají přečíst, přestává být podstatné, jestli nástroj něco vykresluje. Může to být stejně dobře sada pravidel, která si jen hezky stojí na vlastní stránce:

  • Online pravidla sazby. Velikosti písma, proklady, délka řádku, co se smí a co ne. Člověk si je prohlédne v prohlížeči, asistent podle nich napíše CSS.
  • Sestavovač příspěvků na sociální sítě. Formáty, bezpečné zóny, délky textů. Designér vidí náhled, asistent podle stejných pravidel připraví další várku příspěvků.
  • Generátor grafiky, konfigurátor, kontrolní pomůcka. Cokoli, co se vejde do jedné HTML stránky.

Je to tedy na designérovi. Co si navrhne a jaká pravidla k tomu napíše, podle toho pak pracuje jak tým, tak asistent.

Ukázky vytvořených nástrojů

Pět nástrojů přímo v tomto manuálu — čtyři generátory grafiky a jeden předpis sazby. Otevřete je a zkuste si je.