Skip to content
zsh — farkas-garage

Design-Diplom. Fullstack-Code. Eine Person.

Frontend- und Fullstack-Entwickler mit Kommunikationsdesign-Diplom (Note 1,4). PHP/Symfony, Angular, Figma. Seit 2015 baue ich Websites und Software, zuletzt für die TA Bildungszentrum GmbH und einen US-Kunden.

  • 10+Jahre Design & Web
  • 1,4Diplomnote Kommunikationsdesign
  • 6Case Studies · 5 Live-Demos
scroll to run
Constantino Carneiro-Fernández
● verfügbarRegensburg · Remote · umzugsbereit
Projekte · 06

Vier Werkzeuge für den Desktop, zwei Apps fürs Telefon.

entworfen & in Code gebaut
Projekt 01 · OT/IT-Security-Monitoring

IronGrid 2.0

Ein Dashboard, das 19 reale Hosts in fünf Zonen in Sekunden lesbar macht.

RolleUI/UX · Frontend
WerkzeugeFigma · HTML/CSS
Umfang8 Screens · Mobile
Jahr2026
SuricataWazuhDebOpsModbus TCP
SYSTEM ONLINE · 19 HOSTS
IronGrid 2.0 Netzwerktopologie
Live-DemoEreignisse laufen ein, PENTEST wird getrennt markiert

Alert-Feed · simuliert

Tipp: auf einen PENTEST-Eintrag warten. Er wird getrennt gezählt, nicht als Alarm gemeldet.

ZeitQuelleEreignisSchwere
CRITICAL 0WARNING 0PENTEST 0
Projekt 02 · Lernsimulator für SPS

RELAIS

SPS lernen wie ein Spiel, ohne die Realität zu verbiegen.

RolleUX/UI · Frontend
WerkzeugeHTML/CSS · SVG
Umfang6 Screens · Lernmodus
Jahr2026
KontaktplanAWLHMISVG
CPU RUN · ZYKLUS 26 MS
RELAIS Editor
Live-DemoTaster drücken, Kontaktplan und AWL reagieren

Selbsthaltung: Start, Stopp, Not-Aus

Tipp: Start drücken, dann Not-Aus. Die Selbsthaltung fällt ab, im AWL kippt das VKE.

Oszilloskop · A4.0
AWL · Netzwerk 1
UE0.0
OA4.0
UNE0.1
UNE0.2
=A4.0
Motor A4.0 0
Projekt 03 · Farb- und Bildbearbeitung · macOS

TONAL

Grading wie im Schnittraum, für ein einzelnes Bild.

RolleUX/UI · Prototyp
WerkzeugeHTML/CSS · Canvas · SVG
Umfang3 Screens · Live-Scopes
StatusIn Entwicklung
CanvasCIE 1931Node-GraphSoft-Proof
METAL · 3 SCOPES LIVE
TONAL Color-Ansicht
Live-DemoRegler bewegen, Vektorskop und Parade rechnen live

Scopes aus echten Pixeln

Tipp: Sättigung auf 0 stellen und zusehen, wie das Vektorskop in die Mitte kollabiert.

Vektorskop
RGB-Parade
Projekt 04 · Kundenprojekt · White-Label

Security Monitor

Ein Code, jede Marke: Theme-Tokens zur Laufzeit.

RolleFullstack · UI/UX
StackAngular · Symfony · PostgreSQL
Umfang4 Ansichten · 3 Mandanten
ZeitraumJun–Jul 2026
AngularSymfonyPostgreSQLTheme-Tokens
LIVE · 3 MANDANTEN
Security Monitor Übersicht
Projekt 05 · Mobile · Konzeptstudie

DB Navigator Rescue

Wenn die Reise bricht, repariert die App sie.

RolleUX/UI · Konzept
PlattformiOS · 390×844
Umfang21 Screens · 5 Zustände
StatusKonzeptstudie 2026
FigmaiOSRescue-ModusWallet
ICE 847 · +6 MIN · IM BLICK
Alles in Ordnung
Rescue-Modus
Live-DemoRegler bewegen

Was wäre bei … Minuten Verspätung?

Tipp: den Regler auf 15 Minuten ziehen und beobachten, was mit dem Anschluss in Frankfurt passiert.

+6 min
051015202530

Anschluss Frankfurt
Ankunft Hamburg
Fahrgastrechte
Modus
Projekt 06 · Produktkonzept & App-Design

KFIT

Vom Instagram-Video zur Routine, die man verfolgen, protokollieren und verbessern kann.

RolleUX/UI · Produktkonzept
PlattformPWA · iOS & Android
Umfang13 Screens · 2 Rollen
StatusKonzeptstudie 2026
FigmaPWAYouTubePostgreSQL
HYROX · WOCHE 3 VON 8
KFIT Übungsbibliothek und Session-Modus
Live-DemoRegler bewegen, die Kurve rechnet sofort

Session-Rechner: Puls, Zonen, Kalorien

Tipp: Intensität auf RPE 10. Die Kurve springt in Z5, die Kalorien folgen mit Verzögerung.

Geschlecht
Pulskcal kumuliertRekord
Kalorien0kcal
Ø Puls0bpm
Max. Puls0bpm
Zeit in Z4–Z50min
0:00

Simulation: der Puls folgt der Belastung mit Verzögerung (Aufwärmen, Intervalle 3/1,5 min, Ausklang). HFmax nach Tanaka (208 − 0,7 × Alter), Zielpuls nach Karvonen, Kalorien nach Keytel et al. 2005.

So arbeite ich

Verstehen. In Code prototypen. Prüfen.

„Ein klickbarer Entwurf ist ehrlicher als ein Bild: Er zeigt, was das System kann und wo es scheitert.“

01

Verstehen, bevor ich zeichne

Welche Daten gibt es wirklich, wer schaut darauf, in welcher Situation?

Beispiel 19 reale Hosts, echte IP-Zonen, ein echter Angriffs-Testfall.
02

In Code prototypen

Statt statischer Mockups baue ich Oberflächen in HTML, CSS und SVG, mit echten Zuständen.

Beispiel TONAL: Waveform und CMYK-Auszüge aus den echten Pixeln.
03

Prüfen und aufschreiben

Jede Case Study endet mit Entscheidungen, einer Iteration und dem, was noch fehlt.

Beispiel RELAIS: „RUN/STOP/MRES“ lief aus dem Modul, gelöst durch Weglassen.
Lebenslauf

Ein Beruf, zwei Hälften: Entwurf und Umsetzung.

Erst Kommunikationsdesign (Diplom, Düsseldorf, Note 1,4) und Agenturjahre in Interface- und Webdesign, dann Webentwicklung. Heute entwerfe und baue ich Oberflächen selbst, zuletzt Fullstack für die TA Bildungszentrum GmbH (PHP, Symfony, Twig) und einen US-Kunden (Angular, Symfony).

Abseits vom Bildschirm: ein Ultraschall-Radar auf Arduino mit Gate-Treibern und MOSFET-Halbbrücken, Rust auf Codeforces, und Schnee, so viel wie möglich.

FigmaAdobe XDHTML/CSS/SVGJavaScriptAngularPHP · SymfonyTwigPostgreSQLDockerGitAnsible / DebOpsGrafanaJava
Deutsch C1EnglischSpanisch
Lebenslauf
  • 2026
    Maheri Consulting (USA)
    Freelance Fullstack: Security Monitoring Dashboard · Angular, Symfony, PostgreSQL
  • 2025 – 2026
    TA Bildungszentrum GmbH
    Junior Fullstack: PHP 8.4, Symfony, Twig · Website 4.0
  • 2022 – 2025
    Höhere Berufsausbildung Webentwicklung
    DAW · EQF Level 5 · Klassensprecher
  • 2016 – 2018
    Hesse Design GmbH
    Designer, Düsseldorf / Shanghai: Web, Interfaces
Say hi

Offen für Frontend-, Fullstack- und UX-Rollen: Regensburg, remote oder deutschlandweit, umzugsbereit.

ccf.szilard@gmail.com
E-Mail kopiert