Ein klassisches Verschlüsselungs-Tool, das im Rahmen meiner Umschulung zum Fachinformatiker für Anwendungsentwicklung (FIAE) entstanden ist.
Dieses Projekt demonstriert nicht nur die logische Implementierung des Caesar-Algorithmus in JavaScript, sondern vor allem meine Initiative im Bereich Frontend-Design und Usability.
Die ursprüngliche Aufgabenstellung verlangte lediglich eine funktionale Umsetzung. Das vorgegebene Design entsprach jedoch nicht meinen Ansprüchen an Barrierefreiheit (Accessibility) und modernes UI-Design.
Aus Eigeninitiative habe ich das Frontend komplett überarbeitet (Refactoring), um eine bessere User Experience (UX) zu schaffen.
| Original (Schul-Standard) | Mein Refactoring (Glassmorphism) |
|---|---|
![]() |
![]() |
| Schlechter Kontrast, unklare Führung | Klarer Fokus, Modern CSS, Intuitive Bedienung |
- HTML5: Semantische Struktur.
- CSS3 (Modern): * Glassmorphism: Nutzung von
backdrop-filter: blur()und halbtransparenten Farben für einen modernen Cyber-Look.- Flexbox: Für responsive Zentrierung und Layout.
- Variables: Konsistentes Farbschema.
- JavaScript (Vanilla): * Modulare Funktionen für Verschlüsselung/Entschlüsselung.
- Event-Handling für Interaktionen.
- Dynamische DOM-Manipulation.
- UI/UX Design: Wie stark Farben und Abstände (Whitespace) die Bedienbarkeit beeinflussen.
- CSS Specificity: Gezieltes Überschreiben von Standard-Browser-Styles.
- Best Practices: Trennung von Logik (JS) und Design (CSS).
Der Caesar-Chiffre ist eine symmetrische Verschlüsselung, die nicht sicher ist und sehr leicht geknackt werden kann. Dieses Tool dient rein zu Bildungszwecken, um grundlegende kryptographische Konzepte zu verstehen.
Lars (Exoshiva) Fachinformatiker Anwendungsentwicklung in Ausbildung GitHub Profil

