- Biuro Rachunkowe DOCTAX

01 Charakter projektu io-core

io-core jest modularnym silnikiem szablonów internetowych, frameworkiem interfejsu użytkownika oraz bazową platformą do budowy aplikacji webowych, dashboardów, paneli administracyjnych, generatorów dokumentów, blogów i narzędzi automatyzacji. Projekt pełni rolę „starter kit” wielokrotnego użytku, umożliwiającego szybkie i spójne tworzenie nowych projektów – zarówno komercyjnych, jak i wewnętrznych.

io-core jest traktowany jako rdzeń cyfrowej infrastruktury Damiana Wojciechowskiego. Ma stanowić wspólne zaplecze dla marek takich jak DOCTAX, ONLYFANSTAX, W Bilansie Rzeczy, Echo Intuicji oraz dla systemów generatorów dokumentów, narzędzi księgowych, paneli klienta i narzędzi automatyzujących procesy.

Projekt łączy warstwę wizualną (design system), warstwę techniczną (architektura CSS, komponenty, workflow kompilacji) oraz warstwę aplikacyjną (logika, dashboardy, kreatory, formularze, automatyzacje).

Starter kit dla nowych projektów

Wspólny rdzeń dla marek i aplikacji

Spójność wizualna i architektoniczna

Skalowalność i łatwa rozbudowa

02 Zakres io-core i główne elementy

io-core obejmuje cały zestaw elementów niezbędnych do zbudowania nowoczesnych aplikacji i stron:

System projektowania: Glass System + Palette System
Biblioteka komponentów UI: przyciski, karty, formularze, panele, widżety
Architektura CSS: @layer, tokeny, zmienne, warstwy stylów
Struktura layoutów: strony, dashboardy, panele administracyjne, kreatory
Narzędzia i utils: formattery, helpers, composables, struktury stanów
Workflow kompilacji: bundling, optymalizacje, lazy loading, prefetch
Moduły logiki: wzorce do rozbudowy funkcjonalności aplikacji
Szablony automatyzacji: formularze, procesy, integracje API

CEL BIZNESOWY

Wspólny fundament dla wszystkich projektów

Każdy nowy projekt – generator umów, panel klienta, blog, narzędzie księgowe – nie powinien powstawać od zera. io-core zapewnia gotowe wzorce, komponenty i layouty, dzięki którym nowe projekty stają się konfiguracją istniejących klocków zamiast pełnego „greenfield”.

CEL TECHNICZNY

Spójność architektury i estetyki

Io-core wymusza powtarzalne standardy: te same komponenty, te same zasady stylów, te same wzorce logiki. Ułatwia to utrzymanie, refaktoryzację, onboarding nowych funkcji oraz rozwój projektów w czasie.

03 Glass System i Palette System

3.1. Glass System – warstwowy system szkła

Glass System to główny filar warstwy wizualnej io-core. Definiuje sposób używania przezroczystości, rozmyć, krawędzi, ramek i cieni w komponentach i layoutach.

poziomy intensywności: light, medium, strong
wielowarstwowe szkło: glass-layer-1, glass-layer-2, deep-glass
warianty tła: jasne, ciemne, gradientowe, tintowane
style ramek: delikatne, wyraźne, akcentowe, „neonowe”
presety komponentowe: glass-card, glass-header, glass-toggle, glass-nav, glass-form
spójne cienie i refleksy dla efektu „czytelnej głębi”
interakcje hover/active/press zgodne z minimalnym glassmorphism

System jest rozszerzalny – można dodawać nowe presety, intensywności i warianty dla różnych aplikacji (np. blog, panel klienta, generator dokumentów).

3.2. Palette System – system palet i tokenów

Palette System odpowiada za spójne zarządzanie kolorami w całym ekosystemie io-core.

palety tematyczne: Emerald, Blue, Amethyst, Gold, Sand, Slate, Obsidian i inne
każda paleta ma tryb jasny i ciemny oraz warianty tonalne (soft, balanced, vivid, deep)
tokeny kolorów: UI (surface, outline, accent, border, overlay), RGB i HSL
zmiana palety na poziomie <html>/<body> poprzez klasy
integracja z Glass System – border, tint, warstwa szkła powiązana z paletą

Przykładowy schemat użycia tokenów:

 :root {
   --palette-primary-rgb: 16, 185, 129;
   --palette-surface-soft: rgba(var(--palette-primary-rgb), 0.06);
   --palette-border-subtle: rgba(var(--palette-primary-rgb), 0.22);
   --palette-accent-solid: rgba(var(--palette-primary-rgb), 0.95);
 }

Glass System i Palette System są traktowane jako żywe systemy – mogą być rozszerzane, modyfikowane i dopasowywane do nowych aplikacji i marek.

04 Architektura CSS, komponenty i layouty

4.1. Architektura CSS

Architektura CSS w io-core ma być skalowalna, przewidywalna i utrzymywalna. Kluczowe założenia:

użycie @layer do porządkowania kaskady stylów
tokeny i zmienne CSS jako główne źródło wartości (kolory, promienie, odstępy)
minimalizowanie specificity i agresywnego nadpisywania
wydzielone moduły stylów dla komponentów
system utilities i klas pomocniczych
wyraźny podział: style globalne → utilities → komponenty → ewentualne overrides

4.2. Biblioteka komponentów UI

Komponenty UI są budowane na szczycie Glass System i Palette System. Typowe grupy komponentów:

Nawigacja: top-nav, side-nav, breadcrumbs, tabs
Karty i panele: cards, panels, widgets, summary-boxes
Formularze: pola, grupy, sekcje, walidacja, stany błędów
Elementy interaktywne: toggles, switches, przyciski, badge, chips
Warstwy UI: modale, drawery, toasty, kroki procesów

Komponenty powinny być izolowane, dobrze nazwane i reużywalne. io-core zakłada ich wielokrotne wykorzystanie w generatorach, panelach, blogach i narzędziach.

4.3. Struktura layoutów

io-core musi obsługiwać szereg typów layoutów:

klasyczne strony www i landing pages,
panele klienta i panele administracyjne,
dashboardy z widżetami i tabelami,
aplikacje wielostronicowe z nawigacją boczną,
kreatory dokumentów i formularze krok-po-kroku.

05 Aplikacje i moduły oparte na io-core

5.1. Generatory dokumentów

io-core jest fundamentem całej serii generatorów dokumentów, m.in.:

Generator Umów (W Bilansie),
Generator Uchwał,
Generator Regulaminów,
AML Form Creator,
Polityka Rachunkowości,
Protokół Zgromadzeń.

Kluczowe zasady dla generatorów:

modularna budowa sekcji i paragrafów,
wspólne źródła powtarzanych zapisów (DRY),
możliwość składania umów z presetów i przełączników,
obsługa eksportu (HTML, PDF, kopiowanie do edytora),
spójny UI dla wszystkich generatorów.

5.2. Blogi i warstwa contentowa

io-core ma obsługiwać blogi i serwisy treściowe m.in. dla:

DOCTAX,
ONLYFANSTAX,
W Bilansie Rzeczy,
Echo Intuicji.

Założenia:

komponenty dla wpisów, list artykułów, kategorii, tagów,
layouty zoptymalizowane pod czytelność,
wsparcie SEO (meta, schema, wewnętrzne linkowanie),
spójna typografia i styl nagłówków.

5.3. Asystent księgowego i automatyzacje

io-core ma obsługiwać narzędzia i moduły związane z księgowością, m.in.:

onboarding klienta,
narzędzia AML i oceny ryzyka,
moduły związane z KSeF, JPK, JPK-CIT (warstwa pomocnicza),
narzędzia do zarządzania procesami w DOCTAX i ONLYFANSTAX,
formularze inteligentne i konfiguratory usług.

Akcent pada na automatyzację powtarzalnych zadań, czytelną prezentację danych i uproszczenie pracy księgowej oraz komunikacji z klientami.

5.4. Moduł „DACH” – Digital Automation Core Hub

io-core ma być kompatybilny z nadrzędnym modułem DACH (Digital Automation Core Hub), który pełni rolę „parasola” dla wszystkich aplikacji:

centralne zarządzanie kontami, dostępami i konfiguracją,
automatyzacje cross-project (np. przepływ danych między generatorami a panelami),
panel super-admina,
wspólny routing, wspólne style, wspólna nawigacja.

06 Rola asystenta technicznego (Claude) w projekcie

Rola: Tech Lead / Architekt Systemów / Lider Refaktoryzacji

W kontekście io-core Claude pełni rolę technicznego lidera i architekta, który:

analizuje strukturę kodu, stylów i komponentów,
wykrywa niespójności, powielenia i antywzorce,
proponuje ulepszenia architektury, stylów, API komponentów,
pomaga projektować i wdrażać refaktoryzację,
wspiera planowanie roadmapy i identyfikację „hotspotów” w kodzie,
pracuje z repozytorium GitHub (commity, PR-y, pliki),
buduje spójne, wielokrotnego użytku moduły i presety.

Styl pracy: zwięźle, konkretnie, bez lania wody; preferowane wskazywanie najlepszego rozwiązania zamiast listy wszystkich możliwych opcji.

Język: jeśli pojawia się slang developerski lub skrótowce – proste, krótkie objaśnienie w zrozumiałej formie, bez utraty merytoryki.

07 Zasady projektowe, priorytety i kierunek rozwoju

7.1. Główne priorytety

Spójność: te same zasady designu, te same komponenty, wspólne tokeny.
Modularność: wszystko ma być dzielone na małe, reużywalne moduły.
DRY: brak powielania kodu i zapisów – „jedno źródło prawdy”.
Skalowalność: łatwość dodawania nowych generatorów, paneli, blogów, aplikacji.
Utrzymywalność: kod musi być możliwy do zrozumienia i poprawy po czasie.

7.2. Kierunek rozwoju

rozwijanie Glass System i Palette System o nowe presety, palety i intensywności,
konsolidacja stylów w oparciu o @layer i tokeny CSS,
stopniowa refaktoryzacja istniejących generatorów dokumentów do wspólnych modułów,
tworzenie szkieletów aplikacji: dashboardy, asystent księgowego, panele klienta,
rozbudowa modułu DACH jako nadrzędnego hubu automatyzacji.

Dokument ten stanowi archiwalną i referencyjną specyfikację projektu io-core. Może być wykorzystywany przy planowaniu kolejnych iteracji, pracy z asystentami AI, a także jako punkt odniesienia dla zmian w architekturze w przyszłości.