diff --git a/app/[locale]/(site)/about/page.tsx b/app/[locale]/(site)/about/page.tsx index 2fc8838..783a41a 100644 --- a/app/[locale]/(site)/about/page.tsx +++ b/app/[locale]/(site)/about/page.tsx @@ -1,15 +1,5 @@ import type { Metadata } from "next"; -import { - ArrowRight, - Blocks, - BriefcaseBusiness, - Compass, - Layers3, - MessageSquareMore, - Sparkles, - Workflow, -} from "lucide-react"; -import Image from "next/image"; +import { ArrowRight, BriefcaseBusiness, GraduationCap, Layers3, MapPin, Sparkles, Wrench } from "lucide-react"; import Link from "next/link"; import { getTranslations } from "next-intl/server"; @@ -17,10 +7,8 @@ import { Container } from "@/components/layout/container"; import { PageHero } from "@/components/layout/page-hero"; import { SiteLogo } from "@/components/layout/site-logo"; import { MotionFade } from "@/components/motion-fade"; -import { AppCard } from "@/components/ui/app-card"; import { Badge } from "@/components/ui/badge"; import { Button } from "@/components/ui/button"; -import { CardContent } from "@/components/ui/card"; import { getSiteSettings, getSiteSettingsMediaBindings } from "@/lib/app-config"; import { getLocalizedPath, resolveLocale } from "@/lib/locale"; import { buildLocalizedMetadata } from "@/lib/metadata"; @@ -56,61 +44,43 @@ export default async function AboutPage({ params: { locale } }: AboutPageProps) ]); const siteName = siteSettings.locales[localeKey].siteName; - const valueItems = [ + const workItems = [ { - icon: Compass, - title: t("valueA"), - text: t("valueAText"), + period: t("workOnePeriod"), + role: t("workOneRole"), + company: t("workOneCompany"), + text: t("workOneText"), }, { - icon: Layers3, - title: t("valueB"), - text: t("valueBText"), + period: t("workTwoPeriod"), + role: t("workTwoRole"), + company: t("workTwoCompany"), + text: t("workTwoText"), }, { - icon: MessageSquareMore, - title: t("valueC"), - text: t("valueCText"), + period: t("workThreePeriod"), + role: t("workThreeRole"), + company: t("workThreeCompany"), + text: t("workThreeText"), }, ]; - const processItems = [ + const educationItems = [ { - icon: Sparkles, - title: t("processOne"), - text: t("processOneText"), + title: t("educationOneTitle"), + place: t("educationOnePlace"), + text: t("educationOneText"), }, { - icon: Blocks, - title: t("processTwo"), - text: t("processTwoText"), - }, - { - icon: Workflow, - title: t("processThree"), - text: t("processThreeText"), + title: t("educationTwoTitle"), + place: t("educationTwoPlace"), + text: t("educationTwoText"), }, ]; - const statItems = [ - { - value: t("statOneValue"), - label: t("statOneLabel"), - text: t("statOneText"), - }, - { - value: t("statTwoValue"), - label: t("statTwoLabel"), - text: t("statTwoText"), - }, - { - value: t("statThreeValue"), - label: t("statThreeLabel"), - text: t("statThreeText"), - }, - ]; - - const highlightItems = [t("highlightOne"), t("highlightTwo"), t("highlightThree")]; + const skillItems = [t("skillOne"), t("skillTwo"), t("skillThree"), t("skillFour"), t("skillFive"), t("skillSix")]; + const toolItems = [t("toolOne"), t("toolTwo"), t("toolThree"), t("toolFour")]; + const focusItems = [t("focusOne"), t("focusTwo"), t("focusThree")]; return ( <> @@ -121,220 +91,236 @@ export default async function AboutPage({ params: { locale } }: AboutPageProps) description={t("intro")} /> - + -
- - +
+
+ + {t("storyEyebrow")} + + +

+ {t("storyTitle")} +

+ +
+
+

+ {t("storyTextOne")} +

+

+ {t("storyTextTwo")} +

+
+ +
+ {focusItems.map((item) => ( +
+ {item} +
+ ))} +
+
+ +
+ + +
+
+ +
-
- - - - {t("valuesEyebrow")} - -

- {t("valuesTitle")} -

-

- {t("valuesIntro")} -

- - +
+
+
+
+ + {t("experienceEyebrow")} + +

+ {t("experienceTitle")} +

+
+ +
- {valueItems.map((item) => { - const Icon = item.icon; - - return ( - - -
- -
-

{item.title}

+
+ {workItems.map((item, index) => ( +
+

+ {item.period} +

+

{item.role}

+

{item.company}

{item.text}

- - - ); - })} +
+ ))} +
+
+ +
+
+
+ + {t("educationEyebrow")} + +

+ {t("educationTitle")} +

+

+ {t("educationIntro")} +

+
+ +
+ +
+ {educationItems.map((item) => ( +
+

+ {item.place} +

+

{item.title}

+

{item.text}

+
+ ))} +
+
-
- - +
+
+
+
+ + {t("skillsEyebrow")} + +

+ {t("skillsTitle")} +

+

+ {t("skillsIntro")} +

+
+ +
+ +
+ {skillItems.map((item) => ( + + {item} + + ))} +
+
+ +
+
- {t("processEyebrow")} + {t("toolsEyebrow")} -

- {t("processTitle")} -

-

- {t("processIntro")} -

+ +
-
- {statItems.map((item) => ( - -

- {item.value} -

-

- {item.label} -

-

{item.text}

- - ))} -
- - +
+ {toolItems.map((item) => ( +
+ {item} +
+ ))} +
+
-
- {processItems.map((item, index) => { - const Icon = item.icon; - const isWide = index === 0; +
+
+ + {t("focusEyebrow")} + + +
- return ( - - -
- - 0{index + 1} - - -
-

{item.title}

-

- {item.text} -

- - - ); - })} +
+ {focusItems.map((item) => ( +
+ {item} +
+ ))} +
diff --git a/messages/ar.json b/messages/ar.json index 5427373..377946e 100644 --- a/messages/ar.json +++ b/messages/ar.json @@ -66,49 +66,58 @@ "title": "من أنا", "heroBadge": "خلّيني عرّفك عليّي", "heroTitle": "معلومات عني", - "intro": "أبني تجارب رقمية واضحة للعلامات والمنتجات والفرق، مع تركيز على الهوية والواجهة والبنية القابلة للتوسع.", - "storyEyebrow": "نبذة سريعة", - "storyTitle": "أحوّل الأفكار المبعثرة إلى حضور رقمي مرتب وواضح.", - "storyTextOne": "هذا النص مؤقت حالياً. الفكرة هنا إن الصفحة تعطي انطباع جاهز: مين أنا، كيف أشتغل، وكيف أقدر أبني تجربة متماسكة من أول الفكرة لآخر الإطلاق.", - "storyTextTwo": "حالياً وضعت محتوى وهمي قريب من النبرة النهائية، حتى يصير أسهل استبداله لاحقاً بمحتوى فعلي بدون الرجوع لتعديل التصميم من جديد.", - "highlightOne": "هوية أوضح ومسار استخدام أنظف.", - "highlightTwo": "واجهة منظمة ومحتوى أسهل بالتبديل.", - "highlightThree": "بنية مناسبة للتطوير المستقبلي.", + "intro": "لمحة سريعة عن خبرتي، دراستي، والمهارات والأدوات التي أستخدمها في شغلي اليومي.", + "storyEyebrow": "نبذة شخصية", + "storyTitle": "أشتغل على بناء حضور رقمي واضح، مرتب، وقابل للنمو.", + "storyTextOne": "أنا محمد، أركز على الواجهات، الهوية، وتنظيم التجربة بشكل يخلي المنتج أو الخدمة مفهومة من أول نظرة. أحب الشغل الذي يجمع بين الوضوح البصري والتنفيذ العملي بدون تعقيد زائد.", + "storyTextTwo": "هذه الصفحة صارت الآن مهيأة لتعرض قصتي المهنية بشكل مرن: أين عملت، ماذا درست، وما هي المهارات والأدوات التي أعتمد عليها يومياً. كل النصوص الحالية قابلة للتبديل بسهولة لاحقاً.", + "focusOne": "أهتم بالوضوح قبل الزخرفة.", + "focusTwo": "أفضل الأنظمة القابلة للتوسع والصيانة.", + "focusThree": "أشتغل بطريقة مباشرة وسريعة المراجعة.", "primaryCta": "تواصل معي", "secondaryCta": "شوف معرض الأعمال", - "logoEyebrow": "الهوية الحالية", - "logoText": "الشعار مأخوذ من إعدادات الموقع حتى تبقى الصفحة متطابقة مع الهوية الحالية.", - "galleryAltOne": "صورة وهمية رئيسية لقسم معلومات عني", - "galleryAltTwo": "صورة وهمية ثانوية لقسم معلومات عني", - "availabilityLabel": "الوضع الحالي", - "availabilityText": "متاح حالياً لاستقبال مشاريع جديدة، وهذه الجملة أيضاً placeholder قابل للتعديل.", - "statOneValue": "06+", - "statOneLabel": "سنوات تقريبية", - "statOneText": "رقم تجريبي ليوضح مكان الخبرة أو عدد السنوات بعد تعبئة المحتوى الحقيقي.", - "statTwoValue": "24", - "statTwoLabel": "مشاريع مختارة", - "statTwoText": "مكان مخصص لعدد المشاريع أو العملاء أو الإطلاقات حسب الصياغة النهائية.", - "statThreeValue": "03", - "statThreeLabel": "مسارات خدمة", - "statThreeText": "يمكن تحويل هذا الرقم لاحقاً إلى تخصصات أو منتجات أو مجالات عمل رئيسية.", - "valuesEyebrow": "طريقة الشغل", - "valuesTitle": "كيف أعمل", - "valuesIntro": "هذا القسم صار جاهز لعرض المبادئ الأساسية بشكل سريع وواضح بدل فقرة نصية طويلة.", - "valueA": "الاستراتيجية أولاً", - "valueAText": "أبدأ بتحديد الهدف، الجمهور، وحدود النطاق حتى ما يتحول التنفيذ إلى تخمين.", - "valueB": "أنظمة نظيفة", - "valueBText": "أبني مكونات قابلة للصيانة والتوسعة حتى يظل المشروع مرتب بعد الإطلاق.", - "valueC": "تعاون قريب", - "valueCText": "أفضل دورات قصيرة وملاحظات مباشرة حتى يظل القرار واضحاً والنتيجة أدق.", - "processEyebrow": "من البداية للنهاية", - "processTitle": "آلية العمل", - "processIntro": "قسم مرتب يشرح الرحلة بثلاث خطوات سريعة، وبإمكانك لاحقاً تعديله حسب طريقتك الفعلية.", - "processOne": "اكتشاف وتحديد الهدف", - "processOneText": "نجمع الصورة العامة، نحدد الأولويات، ونرتب المطلوب قبل أي قرار بصري أو تقني.", - "processTwo": "تصميم ونمذجة أولية", - "processTwoText": "أصيغ الاتجاه العام، أبني تصور واجهات، وأجهز أساس بصري يسهّل بقية التنفيذ.", - "processThree": "بناء واختبار وإطلاق", - "processThreeText": "بعد تثبيت الاتجاه، يتحول العمل إلى تنفيذ منظم، مراجعة سريعة، ثم إطلاق جاهز." + "snapshotEyebrow": "حالياً", + "snapshotTitle": "أبني من برلين", + "snapshotText": "أشتغل عن بعد ومع فرق مختلفة، مع تركيز على المواقع، الواجهات، والأنظمة الصغيرة المرنة.", + "locationTitle": "القاعدة الحالية", + "locationText": "برلين، ألمانيا، مع قابلية للعمل مع فرق محلية أو عن بعد.", + "experienceEyebrow": "أين اشتغلت", + "experienceTitle": "خبرتي العملية", + "workOnePeriod": "2024 - الآن", + "workOneRole": "Frontend Developer", + "workOneCompany": "استوديو رقمي أو شركة منتج", + "workOneText": "مكان مخصص لذكر آخر جهة عمل، طبيعة المسؤوليات، ونوع المشاريع التي اشتغلت عليها.", + "workTwoPeriod": "2022 - 2024", + "workTwoRole": "UI Designer", + "workTwoCompany": "وكالة أو فريق داخلي", + "workTwoText": "هنا يمكن ذكر دور سابق يوضح المزج بين التصميم والتنفيذ أو بين البراند والواجهات.", + "workThreePeriod": "قبل ذلك", + "workThreeRole": "Freelance / Contract Work", + "workThreeCompany": "عمل حر أو تعاونات مستقلة", + "workThreeText": "خانة مناسبة لإضافة مشاريع خاصة، تعاونات قصيرة، أو مراحل انتقالية مهمة في المسار.", + "educationEyebrow": "شو درست", + "educationTitle": "الخلفية الدراسية", + "educationIntro": "هذا القسم مخصص لوضع الدراسة الأكاديمية أو الدورات المركزة التي أثرت على طريقة التفكير والشغل.", + "educationOneTitle": "اسم التخصص أو الشهادة", + "educationOnePlace": "اسم الجامعة أو المعهد", + "educationOneText": "وصف قصير يوضح ما الذي درسته فعلياً، وكيف انعكس ذلك لاحقاً على شغلك أو على طريقة تحليلك للمشاريع.", + "educationTwoTitle": "دورات أو تدريب متخصص", + "educationTwoPlace": "منصة أو جهة تدريب", + "educationTwoText": "مكان مناسب لذكر أي دراسة مكملة، تدريب عملي، أو برنامج صقل مهارات أخذته لاحقاً.", + "skillsEyebrow": "مهاراتي", + "skillsTitle": "المهارات التي أركز عليها", + "skillsIntro": "كتلة واسعة لعرض المهارات الأساسية التي تريد إظهارها بشكل سريع وواضح وقابل للتحديث.", + "skillOne": "تصميم واجهات", + "skillTwo": "بناء Design Systems", + "skillThree": "Frontend Architecture", + "skillFour": "تحويل الأفكار إلى صفحات واضحة", + "skillFive": "تنظيم المحتوى والتسلسل البصري", + "skillSix": "التعاون السريع مع العملاء والفرق", + "toolsEyebrow": "أدواتي", + "toolOne": "Figma", + "toolTwo": "Next.js", + "toolThree": "Tailwind CSS", + "toolFour": "WordPress" }, "contactPage": { "title": "تواصل", diff --git a/messages/de.json b/messages/de.json index 8e98179..b7c86ec 100644 --- a/messages/de.json +++ b/messages/de.json @@ -66,49 +66,58 @@ "title": "Über mich", "heroBadge": "Mehr über mich", "heroTitle": "Über mich", - "intro": "Ich baue klare digitale Erlebnisse für Marken, Produkte und Teams, mit Fokus auf Identität, Interface Qualität und skalierbare Struktur.", - "storyEyebrow": "Kurzprofil", - "storyTitle": "Ich verwandle verstreute Ideen in einen klaren und strukturierten digitalen Auftritt.", - "storyTextOne": "Das ist vorerst Platzhaltertext. Ziel ist eine Seite, die fast fertig wirkt: wer ich bin, wie ich arbeite und wie aus einer Idee ein stimmiger Launch wird.", - "storyTextTwo": "Der aktuelle Inhalt ist bewusst nah an einer finalen Tonalität, damit echter Text später ohne neues visuelles Rework eingesetzt werden kann.", - "highlightOne": "Klarere Identität und sauberer Nutzerfluss.", - "highlightTwo": "Geordnete Oberfläche und leicht austauschbarer Content.", - "highlightThree": "Struktur vorbereitet für spätere Weiterentwicklung.", + "intro": "Ein schneller Überblick über meine Erfahrung, Ausbildung sowie die Skills und Tools, die ich in der täglichen Arbeit nutze.", + "storyEyebrow": "Persönlicher Überblick", + "storyTitle": "Ich baue digitale Präsenz, die klar, geordnet und bereit zum Wachsen ist.", + "storyTextOne": "Ich bin Mohamad und arbeite mit Fokus auf Interfaces, Identität und klar strukturierte Nutzererlebnisse. Mich interessiert Arbeit, die visuelle Klarheit mit praktischer Umsetzung verbindet.", + "storyTextTwo": "Diese Seite ist jetzt so aufgebaut, dass sie meine berufliche Geschichte flexibel zeigen kann: wo ich gearbeitet habe, was ich studiert habe und welche Skills und Tools ich am häufigsten nutze.", + "focusOne": "Klarheit vor Dekoration.", + "focusTwo": "Systeme, die skalieren und wartbar bleiben.", + "focusThree": "Direkte Zusammenarbeit mit schnellen Feedback Schleifen.", "primaryCta": "Kontakt aufnehmen", "secondaryCta": "Portfolio ansehen", - "logoEyebrow": "Aktuelle Identität", - "logoText": "Das Logo wird aus den Site Settings geladen, damit die Seite mit der aktuellen Markenbasis übereinstimmt.", - "galleryAltOne": "Primäres Platzhalterbild für die Über mich Seite", - "galleryAltTwo": "Sekundäres Platzhalterbild für die Über mich Seite", - "availabilityLabel": "Aktueller Status", - "availabilityText": "Aktuell offen für neue Projekte, und auch diese Zeile ist als Platzhalter für später gedacht.", - "statOneValue": "06+", - "statOneLabel": "Jahre grob", - "statOneText": "Ein Platzhalter für Erfahrung oder Jahre in der Praxis, sobald die echten Inhalte feststehen.", - "statTwoValue": "24", - "statTwoLabel": "Ausgewählte Projekte", - "statTwoText": "Ein flexibler Platz für Projekte, Kunden, Launches oder einen später stärkeren Nachweis.", - "statThreeValue": "03", - "statThreeLabel": "Leistungsfelder", - "statThreeText": "Später kann das in Spezialisierungen, Produktlinien oder Kernbereiche umgewandelt werden.", - "valuesEyebrow": "Arbeitsweise", - "valuesTitle": "Wie ich arbeite", - "valuesIntro": "Dieser Bereich ist jetzt so aufgebaut, dass die Grundprinzipien schnell erfassbar sind statt in einem langen Absatz zu verschwinden.", - "valueA": "Strategie zuerst", - "valueAText": "Ich beginne mit Ziel, Zielgruppe und Scope, damit die Umsetzung nicht in Vermutungen abgleitet.", - "valueB": "Saubere Systeme", - "valueBText": "Ich baue wartbare Komponenten und ein klares System, das nach dem Launch weiter wachsen kann.", - "valueC": "Enge Zusammenarbeit", - "valueCText": "Ich arbeite lieber in kurzen Schleifen mit direktem Feedback, damit Entscheidungen klar bleiben.", - "processEyebrow": "Von Start bis Launch", - "processTitle": "Mein Ablauf", - "processIntro": "Ein kompakter Drei Schritte Ablauf, der sich später mit deinem echten Prozess ersetzen lässt ohne den Bereich neu zu gestalten.", - "processOne": "Discovery und Zieldefinition", - "processOneText": "Wir ordnen das Gesamtbild, priorisieren die Anforderungen und klären das Ziel vor der visuellen oder technischen Arbeit.", - "processTwo": "Design und Prototyping", - "processTwoText": "Ich forme die Richtung, entwickle erste Interface Ideen und setze ein visuelles System für die Umsetzung auf.", - "processThree": "Build, Test und Launch", - "processThreeText": "Sobald die Richtung steht, geht die Arbeit in strukturierte Umsetzung, Review und Launch Vorbereitung über." + "snapshotEyebrow": "Aktuell", + "snapshotTitle": "Ich arbeite aus Berlin", + "snapshotText": "Ich arbeite remote und mit verteilten Teams, mit Fokus auf Websites, Interfaces und flexible kleine Systeme.", + "locationTitle": "Aktueller Standort", + "locationText": "Berlin, Deutschland, mit Offenheit für lokale und remote Zusammenarbeit.", + "experienceEyebrow": "Wo ich gearbeitet habe", + "experienceTitle": "Berufserfahrung", + "workOnePeriod": "2024 - heute", + "workOneRole": "Frontend Developer", + "workOneCompany": "Digital Studio oder Produktfirma", + "workOneText": "Hier kann die aktuelle oder letzte Position mit Verantwortung und Projektart eingetragen werden.", + "workTwoPeriod": "2022 - 2024", + "workTwoRole": "UI Designer", + "workTwoCompany": "Agentur oder internes Team", + "workTwoText": "Ein früherer Schritt, der die Verbindung zwischen Design und Umsetzung oder zwischen Branding und Interface Arbeit zeigt.", + "workThreePeriod": "Davor", + "workThreeRole": "Freelance / Contract Work", + "workThreeCompany": "Unabhängige Zusammenarbeit", + "workThreeText": "Ein guter Platz für freie Projekte, Kooperationen oder wichtige Übergangsphasen im Werdegang.", + "educationEyebrow": "Was ich studiert habe", + "educationTitle": "Ausbildung und Studium", + "educationIntro": "Dieser Bereich ist für Studium oder fokussierte Weiterbildungen gedacht, die meine Denkweise und Arbeitsweise geprägt haben.", + "educationOneTitle": "Studiengang oder Abschluss", + "educationOnePlace": "Universität oder Institut", + "educationOneText": "Eine kurze Beschreibung davon, was ich tatsächlich gelernt habe und wie es später meinen Blick auf Projekte beeinflusst hat.", + "educationTwoTitle": "Kurse oder spezialisiertes Training", + "educationTwoPlace": "Plattform oder Trainingsanbieter", + "educationTwoText": "Ein geeigneter Platz für ergänzende Weiterbildung, praxisnahes Training oder Programme zur Vertiefung meiner Skills.", + "skillsEyebrow": "Skills", + "skillsTitle": "Worauf ich mich konzentriere", + "skillsIntro": "Ein breiter Block für die wichtigsten Fähigkeiten, die schnell, klar und später leicht aktualisierbar gezeigt werden sollen.", + "skillOne": "Interface Design", + "skillTwo": "Design Systems", + "skillThree": "Frontend Architektur", + "skillFour": "Ideen in klare Seiten übersetzen", + "skillFive": "Content Struktur und visuelle Hierarchie", + "skillSix": "Schnelle Zusammenarbeit mit Kunden und Teams", + "toolsEyebrow": "Tools", + "toolOne": "Figma", + "toolTwo": "Next.js", + "toolThree": "Tailwind CSS", + "toolFour": "WordPress" }, "contactPage": { "title": "Kontakt", diff --git a/messages/en.json b/messages/en.json index d13717b..92d1311 100644 --- a/messages/en.json +++ b/messages/en.json @@ -66,49 +66,58 @@ "title": "About", "heroBadge": "A bit more about me", "heroTitle": "About me", - "intro": "I build clear digital experiences for brands, products, and teams, with focus on identity, interface quality, and scalable structure.", - "storyEyebrow": "Quick overview", - "storyTitle": "I turn scattered ideas into a clear and structured digital presence.", - "storyTextOne": "This is placeholder copy for now. The goal is to make the page feel nearly production-ready: who I am, how I work, and how I shape a cohesive experience from concept to launch.", - "storyTextTwo": "The current content is intentionally close to the final tone, so replacing it later with real copy should not require another visual rewrite.", - "highlightOne": "Sharper identity and cleaner user flow.", - "highlightTwo": "Organized interface and easy-to-update content.", - "highlightThree": "Structure prepared for future iteration.", + "intro": "A quick overview of my experience, education, and the skills and tools I rely on in day-to-day work.", + "storyEyebrow": "Personal overview", + "storyTitle": "I build digital presence that is clear, structured, and ready to grow.", + "storyTextOne": "I am Mohamad, focused on interfaces, identity, and shaping experiences that feel understandable from the first impression. I like work that connects visual clarity with practical execution.", + "storyTextTwo": "This page is now structured to present my professional story in a flexible way: where I worked, what I studied, and which skills and tools I use most often. The copy can be replaced easily later.", + "focusOne": "Clarity before decoration.", + "focusTwo": "Systems that scale and stay maintainable.", + "focusThree": "Direct work with fast review cycles.", "primaryCta": "Contact me", "secondaryCta": "View portfolio", - "logoEyebrow": "Current identity", - "logoText": "The logo is pulled from site settings so the page stays aligned with the current brand setup.", - "galleryAltOne": "Primary placeholder visual for the about page", - "galleryAltTwo": "Secondary placeholder visual for the about page", - "availabilityLabel": "Current status", - "availabilityText": "Available for new projects at the moment, and this line is also a placeholder ready for replacement.", - "statOneValue": "06+", - "statOneLabel": "Approx. years", - "statOneText": "A placeholder metric for experience or years in practice once the real content is ready.", - "statTwoValue": "24", - "statTwoLabel": "Selected projects", - "statTwoText": "A flexible slot for projects, clients, launches, or any stronger proof point later on.", - "statThreeValue": "03", - "statThreeLabel": "Service tracks", - "statThreeText": "This can later become specialties, product lines, or core work streams.", - "valuesEyebrow": "Work style", - "valuesTitle": "How I work", - "valuesIntro": "This section is now structured to present core principles quickly instead of relying on one long paragraph.", - "valueA": "Strategy first", - "valueAText": "I start by clarifying goals, audience, and scope so execution does not drift into guesswork.", - "valueB": "Clean systems", - "valueBText": "I build maintainable components and a clear system that can evolve after launch.", - "valueC": "Close collaboration", - "valueCText": "I prefer short loops and direct feedback so decisions stay sharp and momentum stays high.", - "processEyebrow": "From start to launch", - "processTitle": "My process", - "processIntro": "A compact three-step flow that can later be replaced with your exact process without redesigning the section.", - "processOne": "Discovery and goal definition", - "processOneText": "We frame the full picture, align priorities, and define the target before visual or technical work starts.", - "processTwo": "Design and prototyping", - "processTwoText": "I shape the direction, build interface concepts, and establish a visual system that supports implementation.", - "processThree": "Build, test, and launch", - "processThreeText": "Once the direction is locked, the work moves into structured implementation, review, and launch readiness." + "snapshotEyebrow": "Current", + "snapshotTitle": "Building from Berlin", + "snapshotText": "I work remotely and with distributed teams, focused on websites, interfaces, and flexible small systems.", + "locationTitle": "Current base", + "locationText": "Berlin, Germany, with flexibility to work with local and remote teams.", + "experienceEyebrow": "Where I worked", + "experienceTitle": "Work experience", + "workOnePeriod": "2024 - now", + "workOneRole": "Frontend Developer", + "workOneCompany": "Digital studio or product company", + "workOneText": "Use this slot for the latest role, the responsibilities, and the types of projects handled there.", + "workTwoPeriod": "2022 - 2024", + "workTwoRole": "UI Designer", + "workTwoCompany": "Agency or in-house team", + "workTwoText": "A previous role that shows the overlap between design and implementation or between branding and interface work.", + "workThreePeriod": "Before that", + "workThreeRole": "Freelance / Contract Work", + "workThreeCompany": "Independent collaborations", + "workThreeText": "A good place for personal projects, contract work, or key transition stages in the overall path.", + "educationEyebrow": "What I studied", + "educationTitle": "Educational background", + "educationIntro": "This block is meant for academic study or focused learning tracks that shaped the way I think and work.", + "educationOneTitle": "Degree or field of study", + "educationOnePlace": "University or institute", + "educationOneText": "A short description of what I actually studied and how it later influenced the way I approach projects.", + "educationTwoTitle": "Courses or specialized training", + "educationTwoPlace": "Platform or training provider", + "educationTwoText": "A good place for follow-up learning, hands-on training, or a program that sharpened my skills later on.", + "skillsEyebrow": "Skills", + "skillsTitle": "Skills I focus on", + "skillsIntro": "A wide block for listing the core skills you want to highlight in a quick and update-friendly way.", + "skillOne": "Interface design", + "skillTwo": "Design systems", + "skillThree": "Frontend architecture", + "skillFour": "Turning ideas into clear pages", + "skillFive": "Content structure and visual hierarchy", + "skillSix": "Fast collaboration with clients and teams", + "toolsEyebrow": "Tools", + "toolOne": "Figma", + "toolTwo": "Next.js", + "toolThree": "Tailwind CSS", + "toolFour": "WordPress" }, "contactPage": { "title": "Contact",