Fejlesztési és funkció terv
Koordinál
Horváth Szilveszter
Érintettek
Pelczer D., Katona Z., Pál Zs., Wéber-Bódis P.
A Vyzor egy Laravel 12 + Livewire 4 alapú, többfelhasználós web app PostgreSQL-lel. A Clarity feldolgozó és a GA4 integráció már él. A Page analyser (oldalelemzés) fejlesztés alatt. Az SEO/teljesítmény/tracking audit modulok továbbra is újak. A korábbi nyitott kérdések többsége megválaszolható a Vyzor docs/dev/ doksijai alapján — lásd §7.
A Vyzor egy hotel weboldal aktivitás-figyelő és optimalizáló webalkalmazás (Laravel 12 + Livewire 4 + PostgreSQL). Külső és belső adatforrásokból gyűjti a látogatói viselkedést és az oldal állapotát, majd ezekre építve riportokat és konkrét javaslatokat ad. Jelenleg három riport-flavor él: Clarity (UX/CRO audit Microsoft Clarity adatokból), Page analyser (URL alapú oldalelemzés, fejlesztés alatt) és GA4 (Google Analytics 4 Data API integráció). Bővítjük SEO-audit, teljesítmény-audit és tartalom-generáló modulokkal — a Morgens SEO szolgáltatás-bevezetésének technikai fegyvere lesz.
Piaci igény
Wellness Hotel Gyula 1M Ft/hó SEO ajánlatot kapott külsős cégtől — sok. Mi hotel-szaktudással olcsóbban, AI-val automatizálva akarjuk.
Módszertan megvan
Szabi csomagnet.hu esete bizonyította: a 3+1 pilléres SEO működik (kódszintű / on-site / tartalom / off-site).
Innovation minta
Ugyanaz a bevezetési minta mint a CBX-nél — Innovation csapat készíti elő, Advisory+Marketing+Web viszi.
Egyetlen szoftver
Szétszórt tool-ok helyett egy szoftver több modullal, Morgens-arculattal, partnereknek eladható.
Ez a doksi legfontosabb szekciója: milyen külső/belső forrás milyen adatot ad, és az melyik Vyzor funkciót hajtja meg.
| Adatforrás | Típus | Mit ad | Melyik funkció használja |
|---|---|---|---|
| Microsoft Clarity | külső SaaS API | session replay, heatmap, rage-click, scroll depth | Clarity feldolgozó meglévő ✓ |
| Heatmap CSV | felhasználói feltöltés | kattintási / scroll heatmap (Clarity export) | Clarity riportokhoz csatolható meglévő ✓ |
| Google Analytics 4 Data API | Google API (service account) | sessions, users, engagement, top pages, acquisition, devices, realtime, period compare | GA4 riport modul meglévő ✓ — function-calling AI tool |
| HTML scrape | saját (HtmlFetcherService) | tisztított szöveg + meta + headings + linkek | Page analyser fejlesztés alatt 🚧, később SEO audit, tracking audit |
| PageSpeed Insights | Google API | Lighthouse scorek, Core Web Vitals, Opportunities | Teljesítmény audit új |
| Google Search Console | Google API (OAuth2) | top kulcsszavak, impressziók, CTR, pozíció, indexelés | SEO tartalom modul új |
| Oldal tartalom | saját scrape | meglévő szöveg tisztítva | Tartalom átíró, GYIK generátor új |
| AI providerek | Laravel AI csomag | generált szöveg/kód/struktúra | Minden riport flavor meglévő ✓ — OpenAI default, Anthropic / Gemini / +11 további kapcsolható |
| Soro (trysoro.com) | 3rd party SaaS | long-tail kulcsszó, AI cikk, képgenerálás, belső link | Külső input teszt |
| Design extract | Pelczer saját skill | brand design leírás URL-ből | Landing generátor (külön tool, API-n át) |
Jelenlegi állapot: él. Pipeline: FetchClarity artisan command → Clarity Export API → ClarityInsight modell (JSON, dátumtartomány + max 3 dimenzió). Riport kérelemnél a ReportAnalyst AI agent megkapja a Clarity adatot + a választott CLARITY taggel ellátott AiContext presetet.
Adatlekérés:
routes/console.php), minden clarity_api_key-jel rendelkező projektrephp artisan app:fetch-clarity {project} --days=1ClarityFetchCounter tartja számonclarity_insights tábla (PostgreSQL), JSON metrikákkalRiport flavor: ha a Report nem tartalmaz page_url-t, akkor Clarity flavor-rel megy. Heatmap CSV csatolható (Clarity exportból feltöltött Heatmap rekord). Output: markdown a Report.content-ben.
Beépített Clarity preset-ek: Traffic Overview, Weekly Summary, Conversion Optimisation, Content Performance, Page Performance, Accessibility Review, Content Quality, SEO Audit, UX Issues, Device & Browser Analysis, Engagement Analysis. A presetek AiContext rekordok, tags: [clarity]-vel — admin UI-ból szerkeszthetők.
Mit csinál: URL kap → HtmlFetcherService letölti és tisztítja a HTML-t (extract: title, meta description / keywords, canonical, hreflang, OG tagek; szöveg konvertálása markdown-szerű struktúrára) → PageAnalyst AI agent kapja meg + a választott PAGE_ANALYSER taggel ellátott preset → markdown riport.
Jelenlegi állapot: működik, de scope-ja és preset-készlete még finomítás alatt. Ez a flavor a planning doksi eredeti „CRO landing elemző (URL alapján, 21 Reddit-alapú preset)" szándékát teljesíti — a megvalósítás a Reports modulon belül egy második flavor (page_url kitöltve → PageAnalyst), nem külön rendszer.
Implementációs részletek:
Http facade + regex (HtmlFetcherService::clean()) — nem Cheerio / nem BeautifulSoup. Headless browser nincs.page_url egyetlen mező)PAGE_ANALYSER taggel ellátott presetek hány darab és milyen tartalom — leképezhetők-e az eredeti „21 Reddit-alapú CRO prompt"-ra, vagy más irányba ment a scope?Mit csinál: projektenként konfigurált Google Analytics 4 property → live Data API lekérdezések → automatikus riport-kontextus + AI function-calling tool a drill-downhoz.
Architektúra (lásd Vyzor/docs/dev/ga-ai-reports.md):
Project.ga_property_id (encrypted) tárolja a properties/123… ID-t.GoogleAnalyticsQueryService): getTrafficOverview, getTopPages, getLandingPages, getAcquisitionBreakdown, getDeviceBreakdown, getGeoBreakdown, getEvents, getDailyTimeline, comparePeriod, realtime, custom reportGoogleAnalyticsTool — az AI menet közben mélyíthet (más dátumtartomány, top-N, channel-bontás)GA taggel ellátott preset → ReportAnalyst agent + ga-analyst-instructions system promptga-traffic-overview, ga-conversion-funnel, ga-audience-insights, ga-deploy-impact, ga-acquisition-channelsVerifikáció: php artisan app:ga:test {project} — traffic overview + top 5 pages + realtime check.
Mit csinál: URL kap → letölti a HTML-t → kinyeri a SEO-szempontból fontos struktúrát → prioritizált javaslatlistát ad.
Mit vizsgál:
<title> és <meta name="description"> — hosszúság, kulcsszó, duplikációalt attribútuma<meta name="robots">, <link rel="canonical">, hreflangAdatforrás: saját HTML scrape (regex/parser), kiegészítésként PSI API SEO kategóriája.
Output: táblázat + prioritizált javaslatok magyarul — pl. "A /szobak oldalon nincs H1 → fontossági sorrendben első helyen álló kulcsszóval add hozzá."
Mit csinál: PSI API mobile+desktop hívás URL-enként, Lighthouse scorek + Core Web Vitals + Opportunities kinyerése, riport.
Mit vizsgál:
Adatforrás: PageSpeed Insights API v5. API key szükséges (Google Cloud projekt → PSI API enable → credentials → API key). Napi 25k hívás ingyenes — bőven elég.
Output: scorecard színkóddal, CWV értékek státusszal ("jó / javítandó / rossz"), prioritizált opportunity-lista magyar fordítással.
Scoring küszöbök (Google hivatalos értékek alapján):
| Kategória | Performance | LCP | CLS | INP |
|---|---|---|---|---|
| Kritikus | < 50 | > 4s | > 0.25 | > 500ms |
| Közepes | 50–89 | 2.5–4s | 0.1–0.25 | 200–500ms |
| Rendben | 90+ | < 2.5s | < 0.1 | < 200ms |
Mit csinál: HTML-ből regex-szel detektálja a telepített tracking kódokat, jelzi ami hiányzik az alapcsomagból.
| Tracking | Detektálási minta |
|---|---|
| GTM konténer | GTM- prefix |
| GA4 | gtag vagy G- measurement ID |
| Meta Pixel | fbq( vagy facebook.com/tr |
| Google Ads | googleads.g.doubleclick.net vagy AW- |
| LinkedIn Insight | snap.licdn.com |
| TikTok Pixel | analytics.tiktok.com |
| Hotjar | static.hotjar.com |
| Microsoft Clarity | clarity.ms |
| Cookie consent | CookieBot, OneTrust stb. patternek |
Output: checklist ("mi van, mi hiányzik"), javaslatok a hiányokra. Nem kell headless browser — a tracking kódok 90%-ban a <head>-ben vannak.
Mit csinál: URL + kulcsszó(ak) input → oldal tartalma betöltve → Claude-dal SEO-kompatibilis átírás javaslat.
Mit ad ki:
Adatforrás: HTML scrape (csak szöveg rész), Claude API, opcionálisan GSC kulcsszó adatok.
Valószínűleg (a) és (b) MVP-re, (c) később.
Mit csinál: kulcsoldalhoz generál 10 kérdéses GYIK blokkot + JSON-LD FAQPage schema kódot.
Output:
<head>-be)Adatforrás: oldal tartalom + kulcsszó input → Claude API.
Mi az a Soro: trysoro.com — ~$39/hó külső SaaS. GSC-re csatlakozik, long-tail kulcsszavakat talál, blog cikket ír, képet generál, belső linkeket épít.
Státusz: Innovation csapat tesztel (Pelczer Dániel + 1 fő), Kikelet oldal a pilot.
Integrációs probléma: Soro zárt SaaS, az eddigi kutatás alapján nincs publikus API.
4 mérlegelhető opció (2026-04-17-es kutatásból):
Opció 1
Partnership megkeresés
API hozzáférés kérés Soro-tól. Ismeretlen kimenet, időigényes.
Opció 2
WordPress middleware
Soro WP plugin (soro-seo, API key) + saját WP "proxy" közt. MA működik.
Opció 3
Manuális / teszt fázis
Vyzor ne próbáljon API-ra menni, Soro-t kézzel használjuk.
Opció 4
Saját content engine
Claude API + DataForSEO (vagy GSC), teljes kontroll. Hosszabb fejlesztés, saját stack.
Mit csinál: a Morgens által verified property-knél a Google Search Console adatait húzza (utolsó 28 nap).
Kinyert adatok:
Felhasználás: bemenetet ad a tartalom briefelőnek + SEO audit riportot gazdagítja + content performance trackinghez alap.
Auth: OAuth2 service account (Google Cloud). Pál Zsuzsanna + Domián Dávid dolgoznak az advisory-szintű account management módszertanon.
Mit csinál: ahol Morgens-nek van GTM auth (saját konténerek), a Tag Manager API v2-n keresztül részletes tag audit.
Kinyert adatok: tagek listája (név, típus, firing trigger), triggerek és változók, verziók, publish history, aktív / szünetelő tagek, ütközések.
Auth: OAuth2 service account, konténerenként hozzá kell adni.
Kapcsolódás: a 3.6 Tracking/pixel audit modul kiegészítése — HTML scrape mindig megy, GTM API auth-tal mélyebb adatokat ad.
Ezek nem MVP-funkciók, de a 2-tool koncepcióból (Site Analyzer + SEO Autopilot) átvett irányok — jelzik merre tart a tool:
Pelczer Dániel saját tool-ja: URL alapú design extract + DESIGN.md alapú landing HTML generátor. Nem része Vyzor-nak, de a SEO kulcsszó-kutatás outputjából landing tud születni.
Integrációs kérdés: ha Vyzor kulcsszó-hiányt talál → külső tool-t meghívja API-n át, visszakap HTML-t, és azt ajánlja letétre. Technikai döntés a fejlesztéssel és Pelczer Dániellel közösen.
┌─────────────────────────────────────────────────────────────┐
│ INPUT │
│ URL(-ek) + kulcsszó(-k) + hotel partner azonosító │
└──────────────────────────┬──────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ VYZOR │
├─────────────────────────────────────────────────────────────┤
│ │
│ Data fetchers (input oldalról): │
│ ├── MS Clarity API ──→ Clarity riport (✓) │
│ ├── GA4 Data API ──→ GA riport (✓ + AI tool) │
│ ├── HTML scrape ──→ Page analyser (🚧) │
│ │ + jövőben SEO kód + Tracking │
│ ├── PSI API ──→ Teljesítmény (új) │
│ ├── GSC API (opc.) ──→ Tartalom + SEO tippek (új) │
│ └── Oldal szöveg ──→ Tartalom + GYIK (új) │
│ │
│ Processing (belső): │
│ ├── Scoring / prioritizáló logika │
│ └── AI agentek (Laravel AI: OpenAI default, │
│ Anthropic / Gemini / 11 további provider) │
│ │
│ Output generation: │
│ ├── Strukturált audit riport (UI / Google Docs / PDF) │
│ ├── Akciólista (prioritizált, magyarul) │
│ ├── Generált tartalom (átírt szöveg, meta, GYIK+schema) │
│ └── CRO elemzés (textuális + üzenet-átírási javaslat) │
└──────────────────────────┬──────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ FELHASZNÁLÓ (Morgens) │
│ Webes csapat (technikai javítások) │
│ Advisory (partner-kommunikáció, stratégia) │
│ Marketing (tartalom, kampány) │
└─────────────────────────────────────────────────────────────┘
PageAnalyser flavor és preset-készlet finomításaVyzor/docs/dev/tech.md és Vyzor/docs/dev/project-structure.md.| Réteg | Technológia | Megjegyzés |
|---|---|---|
| Backend | PHP 8.2+ + Laravel 12 | Moduláris monolit (app/Modules/Analytics, Ai, Reports, Projects, Users) |
| Frontend | Livewire 4 + Volt + Tailwind CSS 4 + Vite 7 | Sheaf UI komponensek (x-ui.*), Phosphor / Heroicons |
| Adatbázis | PostgreSQL 15 (prod), SQLite (dev) | Eloquent, JSON oszlopok metrikákhoz |
| Queue | Laravel queue, database driver | Aszinkron riport generálás (GenerateAiReport job) |
| AI | Laravel AI 0.4.3 | OpenAI default, Anthropic + Gemini + 11 további provider configolható (config/ai.php) |
| HTML parse | HtmlFetcherService (PHP regex + Http facade) | Nem Cheerio / nem BeautifulSoup. 2 MB body cap, 60k char prompt cap, headless browser nincs |
| Auth & jogosultság | 3 szerepkör (ADMIN / WEB / CUSTOMER), permission-alapú Gate | Projekt-szintű perms + collaborator pattern (lásd docs/dev/roles.md) |
| Lokalizáció | Hu / En, lang/hu.json | App default hu, kontextusoknak name_hu / description_hu |
| Output storage | PostgreSQL reports.content (markdown) | Riport-olvasó UI Marked + Highlight.js renderrel |
| Audit trigger | On-demand (UI) + Clarity ütemezett 4 óránként | A GA4 on-demand cache-elve (15p / 2h / 12h / 7d / 30s tier) |
| Multi-user | VAN (production-ready) | Projekt-tulajdonos + collaborator-ok |
| Rate limiting | Per-API (Clarity 10/nap/projekt, GA4 cache TTL) | PSI / GSC bevezetésénél követni kell |
| Magyarítás (jövőbeli PSI) | Mapping table a PSI audit title-höz | ~30 leggyakoribb audit fix fordítással |
| API | Státusz | Típus | Auth | Rate limit | Költség |
|---|---|---|---|---|---|
| Microsoft Clarity API | meglévő ✓ | REST | API token | 10/nap/projekt | Ingyenes (Clarity acct) |
| Google Analytics 4 Data API | meglévő ✓ | gRPC (PHP SDK) | service account JSON | 50k req/nap | Ingyenes (cache-elve) |
| OpenAI API | meglévő ✓ | REST | API key | Tier-függő | Token-alapú |
| Anthropic / Gemini / +11 további | configolható ✓ | REST | API key | Tier-függő | Token-alapú |
| PageSpeed Insights v5 | új | REST | API key (opc.) | 25k/nap | Ingyenes |
| Search Console API | új | REST | OAuth2 / SA | 1200 req/min | Ingyenes |
| Tag Manager API v2 | új | REST | OAuth2 / SA | 100 req/100s | Ingyenes |
| Soro | nyitott | zárt SaaS | — | — | ~$39/hó |
| WordPress REST API | tartalom-publikálás (későbbi) | REST | App password / OAuth | Szerver-függő | Ingyenes |
| Zadír CMS | tartalom-publikálás (későbbi) | saját | — | — | Belső |
Egyetlen Google Cloud projekt jelenleg a GA4 API-ra van kötve. A jövőbeli PSI / GSC / GTM API-k ugyanahhoz a Cloud projekthez köthetők; service account-ot a GSC property-khez és GTM konténerekhez külön-külön kell hozzáadni.
A Vyzor docs/dev/ mappa megválaszolja a 2026-04-21-es kritikus kérdéseket. Az alábbi lista mindegyik kérdést egy válasz vagy „még nyitott" címkével frissíti.
1 · válasz ✓
MS Clarity modul — FetchClarity command (4 óránként, max 10 / nap / projekt) → ClarityInsight JSON-tárolás (PostgreSQL), max 3 dimenzió. Riportnál CLARITY taggel ellátott AiContext preset + opcionális heatmap CSV → ReportAnalyst markdown riport. Részletek: Vyzor/docs/dev/project-structure.md.
2 · részben válasz
„CRO landing elemző" / Page analyser — A megvalósítás a Reports modul Page flavor-je: page_url mezős riport → HtmlFetcherService → PageAnalyst agent → markdown. Az eredeti „21 Reddit-alapú preset" konkrét listáját össze kell vetni a jelenleg PAGE_ANALYSER taggel ellátott seedelt presetekkel.
3 · válasz ✓
Wireframe-generátor — NINCS implementálva, jelenleg a roadmap-on sem szerepel. Visszahozni külön preset-tag + külön agent vagy tool kell hozzá; HTML/SVG generálást vagy külső wireframing tool integrációt igényel.
4 · válasz ✓
Vyzor jelenlegi stack — Laravel 12 + Livewire 4 + Volt SFC, PHP 8.2+, Tailwind 4 + Vite 7, PostgreSQL 15 (prod) / SQLite (dev), Laravel Queue (DB), Laravel AI (OpenAI default). Hosting: Docker. Részletek: Vyzor/docs/dev/tech.md.
5 · válasz ✓
Multi-URL futtatás — NEM, single-URL per Report. A reports.page_url egyetlen mező. Multi-URL audit (egész oldal scan) jövőbeli feature.
6 · válasz ✓
Audit history / storage — PostgreSQL, Eloquent: Report (markdown content + meta + életciklus), ClarityInsight, Heatmap, AiContext, Project + ProjectPermission. Nincs Sheets, nincs Drive — minden DB-ben.
7 · még nyitott
Kulcsszó-input új tartalom-modulokhoz — A ⚡ga-report-tab form-ban jelenleg nincs kulcsszó mező, csak preset / dátum / nyelv / custom prompt. Új SEO-irányú modulokhoz (3.7 Tartalom briefelő, 3.10 GSC) kell egy döntés: kézi mező / GSC-ből auto / mindkettő.
8 · még nyitott
Roadmap sorrend — a fejlesztés és a koordináció közös döntése. §5 frissített fázis-listája javaslatként szolgál: Page analyser kiérlelés → SEO audit → PSI → Tartalom briefelő + GYIK → GSC + SEO láthatóság → Soro modul.
Havas Pisti kérte, van Search Console adat.
Dev környezetben van (Pircsi szerint kijátszható az elemzés).
Tartalom van, GYIK+blog igény van.
docs/README.md — a Vyzor doksi-mappa térképe (usage / dev / plans)docs/usage/product-tour.md — felhasználói termékbemutató (modulok, navigáció, screenshotokkal)docs/dev/project-structure.md — moduláris monolit felépítés, namespace-ek, fájl-térképdocs/dev/tech.md — tech stack inventár (PHP, Laravel, Livewire, AI providerek)docs/dev/roles.md — szerepkörök, jogosultsági modell, collaborator patterndocs/dev/reports-ui.md — riport-oldalak újrahasználható komponenseidocs/dev/ga-ai-reports.md — a GA AI riport pipeline részletes leírásadocs/plans/google-analytics-future-work.md — GA modul halasztott / nem implementált pontjai és todo listadocs/plans/ai-agent-configurator.md — admin AI-konfigurátor UI tervdocs/plans/hotjar-analysis.md — Hotjar AI elemzés kutatás (külön n8n alapú irány)Következő lépés
§7 maradék nyitott pontjai (kulcsszó-input doctrine + roadmap-prioritás) — Szilveszterrel + Dániellel egyeztetés. A kódbeli részletekhez a Vyzor docs/ szolgál referenciaként.