Portfolio Update: Recrobot hinzugefügt, Blog-Beitrag entfernt, UI verbessert
- Neues Portfolio-Projekt: Recrobot (KI-gestütztes Recruiting Tool) - Portfolio-Projekt: Website mit KI hinzugefügt - Blog-Beitrag "Automatisierte Ad Creatives" entfernt - Gradient-Overlay von Portfolio-Karten entfernt - Projekt-Ordner für Cover-Bilder erstellt - Übersetzungen für alle drei Sprachen (DE, EN, SR) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 4.5
@@ -1,9 +1,9 @@
|
||||
export const meta = {
|
||||
site: {
|
||||
name: 'Damjan Savić',
|
||||
title: 'Damjan Savić - Senior Fullstack Developer & Digital Solutions Consultant | Cologne, Germany',
|
||||
subtitle: 'Enterprise Software Development, AI Integration & Cloud Architecture by Damjan Savić',
|
||||
description: 'Damjan Savić is a Senior Fullstack Developer and Digital Solutions Consultant based in Cologne, Germany. Specializing in Enterprise Software Development, Cloud-native solutions, and AI integration. Damjan Savić delivers custom solutions using Python, React, TypeScript, OLLAMA, and modern web technologies for digital transformation.',
|
||||
title: 'Damjan Savić | Fullstack, IoT & AI Developer',
|
||||
subtitle: 'Scalable Software Solutions with IoT and AI Integration',
|
||||
description: 'As a fullstack developer from Cologne, Damjan Savić specializes in building scalable software solutions with IoT and AI integration.',
|
||||
keywords: [
|
||||
'Damjan Savić',
|
||||
'Damjan Savic',
|
||||
|
||||
@@ -7,14 +7,24 @@ export const experience = {
|
||||
},
|
||||
positions: [
|
||||
{
|
||||
role: 'Consultant Digital Solutions & Developer',
|
||||
company: 'RITTER Gesellschaft für digitale Geschäftsprozesse mbH',
|
||||
period: '08/2023 - PRESENT',
|
||||
role: 'Process Automation Specialist',
|
||||
company: 'Everlast Consulting GmbH',
|
||||
period: '12/2024 - PRESENT',
|
||||
highlights: [
|
||||
'JTL WaWi, WMS and POS consulting & implementation',
|
||||
'Python-based automation solutions',
|
||||
'RFID systems and GUI development',
|
||||
'AI & Business Intelligence'
|
||||
'Developing AI agents with n8n and Zapier',
|
||||
'Building web scraping solutions',
|
||||
'RecroBot voice interview platform',
|
||||
'Migration from Power Automate to n8n'
|
||||
]
|
||||
},
|
||||
{
|
||||
role: 'Consultant Digital Solutions',
|
||||
company: 'Ritter Digital GmbH',
|
||||
period: '08/2023 - 11/2024',
|
||||
highlights: [
|
||||
'Backend services on dedicated servers',
|
||||
'AI integration via Power Automate',
|
||||
'RFID/IoT solutions with Zebra hardware'
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
@@ -1,11 +1,13 @@
|
||||
// src/i18n/locales/en/pages/home/hero.ts
|
||||
export const hero = {
|
||||
title: 'SENIOR FULLSTACK DEVELOPER & DIGITAL SOLUTIONS CONSULTANT',
|
||||
title: 'AI & AUTOMATION SPECIALIST',
|
||||
name: 'DAMJAN SAVIĆ',
|
||||
subtitle: 'ENTERPRISE SOFTWARE | AI INTEGRATION | CLOUD ARCHITECTURE',
|
||||
cta: 'WORK WITH DAMJAN SAVIĆ',
|
||||
subtitle: 'AI AGENTS | VOICE AI | PROCESS AUTOMATION',
|
||||
description: 'Building AI agents and automation solutions. From voice AI platforms to autonomous web agents.',
|
||||
currentRole: 'Currently @ Everlast Consulting GmbH',
|
||||
cta: 'GET IN TOUCH',
|
||||
image: {
|
||||
alt: 'Damjan Savić - Senior Fullstack Developer & Digital Solutions Consultant | Enterprise Software Expert'
|
||||
alt: 'Damjan Savić - AI & Automation Specialist | AI Agents, Voice AI & Process Automation'
|
||||
},
|
||||
social: {
|
||||
getInTouch: 'Get in touch',
|
||||
|
||||
@@ -3,34 +3,34 @@ export const skills = {
|
||||
title: 'Skills',
|
||||
skills: [
|
||||
{
|
||||
name: 'ERP',
|
||||
name: 'AI & LLMs',
|
||||
level: 90,
|
||||
description: 'Enterprise Resource Planning'
|
||||
description: 'GPT-4, Claude API, Vapi Voice AI'
|
||||
},
|
||||
{
|
||||
name: 'Automation',
|
||||
level: 85,
|
||||
description: 'n8n, Zapier, Power Automate'
|
||||
},
|
||||
{
|
||||
name: 'Python',
|
||||
level: 90,
|
||||
description: 'Backend, APIs, Automation'
|
||||
},
|
||||
{
|
||||
name: 'TypeScript',
|
||||
level: 85,
|
||||
description: 'React, Next.js, Node.js'
|
||||
},
|
||||
{
|
||||
name: 'Database',
|
||||
level: 85,
|
||||
description: 'Database development and administration'
|
||||
description: 'PostgreSQL, Supabase, MariaDB'
|
||||
},
|
||||
{
|
||||
name: 'E-Commerce',
|
||||
level: 95,
|
||||
description: 'Online commerce and platforms'
|
||||
},
|
||||
{
|
||||
name: 'Python',
|
||||
level: 80,
|
||||
description: 'Python programming language'
|
||||
},
|
||||
{
|
||||
name: 'React',
|
||||
name: 'DevOps',
|
||||
level: 75,
|
||||
description: 'Frontend development with React'
|
||||
},
|
||||
{
|
||||
name: 'Server',
|
||||
level: 70,
|
||||
description: 'Server administration'
|
||||
description: 'Docker, Vercel, Dedicated Servers'
|
||||
}
|
||||
],
|
||||
aria: {
|
||||
|
||||
@@ -24,6 +24,12 @@ export const portfolio = {
|
||||
},
|
||||
// Project details
|
||||
project: {
|
||||
loading: 'Loading project...',
|
||||
backToPortfolio: 'Back to Portfolio',
|
||||
notFound: {
|
||||
title: 'Project not found',
|
||||
description: 'The requested project could not be found.'
|
||||
},
|
||||
navigation: {
|
||||
back: 'Back to Portfolio',
|
||||
projectDetails: 'PROJECT DETAILS'
|
||||
|
||||
@@ -3,6 +3,8 @@ import { aiDataReader } from './projects/ai-data-reader';
|
||||
import kamenpro from './projects/kamenpro';
|
||||
import smartWarehouse from './projects/smart-warehouse';
|
||||
import powerPlatformGovernance from './projects/power-platform-governance';
|
||||
import websiteMitKi from './projects/website-mit-ki';
|
||||
import recrobot from './projects/recrobot';
|
||||
export const portfolio = {
|
||||
// Meta information for the portfolio page
|
||||
seo: {
|
||||
@@ -58,5 +60,7 @@ export const portfolio = {
|
||||
'kamenpro': kamenpro,
|
||||
'smart-warehouse': smartWarehouse,
|
||||
'power-platform-governance': powerPlatformGovernance,
|
||||
'website-mit-ki': websiteMitKi,
|
||||
'recrobot': recrobot,
|
||||
}
|
||||
};
|
||||
|
||||
@@ -0,0 +1,95 @@
|
||||
// src/i18n/locales/en/portfolio/projects/automated-ad-creatives.ts
|
||||
export const automatedAdCreatives = {
|
||||
meta: {
|
||||
slug: 'automated-ad-creatives',
|
||||
title: 'Automated Ad Creatives: AI-Powered Ad Creation',
|
||||
description: 'Development of a workflow for automated creation of Facebook Ad Creatives with Claude Opus 4.5 - without design software, entirely in chat',
|
||||
excerpt: 'From design template to finished ad: How AI revolutionizes ad creative creation.',
|
||||
date: '2024-12',
|
||||
category: 'AI & Automation',
|
||||
client: 'Personal Project',
|
||||
duration: '1 Day',
|
||||
url: '',
|
||||
repository: '',
|
||||
documentation: '',
|
||||
published: true,
|
||||
featured: true,
|
||||
technologies: ['Claude Opus 4.5', 'HTML/CSS', 'PNG Export', 'Prompt Engineering'],
|
||||
tags: ['AI', 'Automation', 'Facebook Ads', 'Marketing', 'No-Code'],
|
||||
videoUrl: 'https://www.tella.tv/video/automatisierte-ad-creatives-1kyw'
|
||||
},
|
||||
content: {
|
||||
intro: 'Programs like Illustrator, InDesign, Figma, or Canva can be complicated. This project shows how Facebook Ad Creatives can be created entirely in an AI chat - without design software, without programming knowledge.',
|
||||
|
||||
challenge: {
|
||||
title: 'The Challenge',
|
||||
description: 'Creating ad assets for Facebook campaigns traditionally requires:',
|
||||
points: [
|
||||
'Knowledge of design software (Illustrator, Figma, Canva)',
|
||||
'Time for learning and implementation',
|
||||
'Understanding of format requirements and best practices',
|
||||
'Iterations between design and marketing',
|
||||
'Budget for designers or design tools'
|
||||
]
|
||||
},
|
||||
|
||||
solution: {
|
||||
title: 'The Solution',
|
||||
description: 'An AI-powered workflow that handles the entire process in a chat window:',
|
||||
content: 'The complete workflow takes place in chat with Claude Opus 4.5. Alternatively, Gemini or ChatGPT also work.',
|
||||
points: [
|
||||
'Design template as visual reference for the AI',
|
||||
'HTML generation through natural language prompts',
|
||||
'Automatic conversion to PNG image files',
|
||||
'Integration of additional images via drag & drop',
|
||||
'Iterations through simple chat instructions'
|
||||
]
|
||||
},
|
||||
|
||||
technical: {
|
||||
title: 'Technical Implementation',
|
||||
description: 'The workflow in detail:',
|
||||
points: [
|
||||
'Step 1: Design template from Envato Elements as reference',
|
||||
'Step 2: Send prompt with image to Claude - HTML is generated',
|
||||
'Step 3: Export HTML to PNG',
|
||||
'Step 4: Integrate additional images via drag & drop'
|
||||
]
|
||||
},
|
||||
|
||||
tools: {
|
||||
title: 'Tools Used',
|
||||
items: [
|
||||
{ name: 'Claude Opus 4.5', purpose: 'AI for HTML generation and image export' },
|
||||
{ name: 'Envato Elements', purpose: 'Design templates as reference' },
|
||||
{ name: 'Unsplash', purpose: 'Free images for creatives' }
|
||||
]
|
||||
},
|
||||
|
||||
results: {
|
||||
title: 'Benefits of This Approach',
|
||||
description: 'The AI-powered workflow offers several advantages:',
|
||||
points: [
|
||||
'No design skills needed: AI handles the technical implementation',
|
||||
'Fast iterations: Changes in seconds through chat instructions',
|
||||
'Scalable: Any number of variants for A/B testing',
|
||||
'Cost-effective: No expensive design tools required',
|
||||
'Flexible: Also works with Gemini or ChatGPT'
|
||||
]
|
||||
},
|
||||
|
||||
useCases: {
|
||||
title: 'Use Cases',
|
||||
points: [
|
||||
'Performance Marketing: Quick creative tests without waiting',
|
||||
'E-Commerce: Product advertising at scale',
|
||||
'Startups: Professional ads without a design team',
|
||||
'Agencies: Efficient client work for ad creation'
|
||||
]
|
||||
},
|
||||
|
||||
conclusion: 'The workflow demonstrates how AI simplifies the creation of ad creatives. The result may not yet be at the level of a professional graphic designer - but for quick tests, initial drafts, or teams without design resources, this approach is a real alternative. The technology is evolving rapidly.'
|
||||
}
|
||||
};
|
||||
|
||||
export default automatedAdCreatives;
|
||||
@@ -0,0 +1,116 @@
|
||||
// src/i18n/locales/en/portfolio/projects/recrobot.ts
|
||||
export const recrobot = {
|
||||
meta: {
|
||||
slug: 'recrobot',
|
||||
title: "Recrobot - AI-Powered Recruiting Tool for Automated Screening Interviews",
|
||||
description: "Development of a modern Voice AI recruiting tool for automated job interviews with real-time transcription and GDPR compliance.",
|
||||
excerpt: "AI-based recruiting tool with Voice AI technology for automated screening interviews. Available 24/7, GDPR compliant, instant evaluation.",
|
||||
date: "2024-12",
|
||||
category: "AI & Automation",
|
||||
client: "Everlast Consulting",
|
||||
duration: "1 month",
|
||||
url: "https://recrobot.de",
|
||||
videoUrl: "https://www.tella.tv/video/recrobot-automatisierte-bewerbungsgesprache-8kub",
|
||||
repository: "",
|
||||
documentation: "",
|
||||
published: true,
|
||||
featured: true,
|
||||
technologies: ["Next.js", "React", "TypeScript", "Tailwind CSS", "shadcn/ui", "Lucide", "Zustand", "VAPI", "Claude AI", "Deepgram"],
|
||||
tags: ["Voice AI", "Recruiting", "HR Tech", "Automation", "Transcription"]
|
||||
},
|
||||
content: {
|
||||
intro: "Recrobot is a modern, AI-powered recruiting tool that automates initial screening interviews with applicants. The application uses Voice AI technology to conduct natural spoken interviews and create transcripts for the HR team.",
|
||||
|
||||
challenge: {
|
||||
title: "The Challenge",
|
||||
description: "Companies face significant challenges when conducting initial interviews with applicants.",
|
||||
points: [
|
||||
"Time-consuming scheduling coordination for screening interviews",
|
||||
"HR departments overwhelmed with routine conversations",
|
||||
"Long waiting times for applicants until first feedback",
|
||||
"Inconsistent interview quality due to different interviewers",
|
||||
"High administrative effort for documentation"
|
||||
]
|
||||
},
|
||||
|
||||
solution: {
|
||||
title: "The Solution",
|
||||
description: "An AI-based voice interview system with intelligent conversation management",
|
||||
content: "Recrobot enables applicants to conduct a screening interview anytime, anywhere - without scheduling coordination. The system conducts natural conversations, asks relevant questions, and automatically creates structured transcripts for the HR team.",
|
||||
points: [
|
||||
"24/7 availability for applicants worldwide",
|
||||
"Intelligent conversation management with natural speech recognition",
|
||||
"Instant evaluation in minutes instead of weeks",
|
||||
"Highest data protection standards and GDPR compliance",
|
||||
"Live transcription with speaker segmentation"
|
||||
]
|
||||
},
|
||||
|
||||
technical: {
|
||||
title: "Technical Implementation",
|
||||
description: "The solution is based on a modern tech stack with Voice AI integration:",
|
||||
points: [
|
||||
"Next.js and React for the frontend",
|
||||
"TypeScript for type-safe development",
|
||||
"Tailwind CSS and shadcn/ui for modern UI design",
|
||||
"Zustand for state management",
|
||||
"VAPI for Voice AI integration",
|
||||
"Claude Sonnet 4.5 as AI model for conversation management",
|
||||
"Deepgram for real-time transcription"
|
||||
],
|
||||
code: `// Voice AI Configuration
|
||||
const assistant = {
|
||||
name: "Recrobot",
|
||||
model: "claude-sonnet-4.5",
|
||||
firstMessage: "Hello, I am Recrobot from Everlast Consulting...",
|
||||
maxTokens: 300,
|
||||
temperature: 0.5,
|
||||
voice: {
|
||||
provider: "sonic-3",
|
||||
voice: "catia",
|
||||
language: "German Conversational Woman"
|
||||
},
|
||||
transcription: {
|
||||
provider: "deepgram"
|
||||
},
|
||||
speakingPlan: {
|
||||
waitSeconds: 1.2,
|
||||
onPunctuationSeconds: 0.1,
|
||||
onNoPunctuationSeconds: 1.5,
|
||||
onNumberSeconds: 0.5
|
||||
}
|
||||
};`
|
||||
},
|
||||
|
||||
implementation: {
|
||||
title: "User Flow",
|
||||
description: "The application process was optimized for maximum user-friendliness:",
|
||||
points: [
|
||||
"Applicant arrives at the landing page",
|
||||
"Fills out the form with personal data",
|
||||
"Client-side validation of inputs",
|
||||
"Creation of applicant data and store update",
|
||||
"Start of voice interview with microphone permission",
|
||||
"Real-time conversation with live transcription",
|
||||
"Download of structured transcript"
|
||||
]
|
||||
},
|
||||
|
||||
results: {
|
||||
title: "Results and Benefits",
|
||||
description: "Recrobot offers significant improvements in the recruiting process:",
|
||||
points: [
|
||||
"Dramatic time savings for HR departments",
|
||||
"Instant availability without scheduling coordination",
|
||||
"Consistent interview quality through standardized questions",
|
||||
"Structured transcripts with speaker segmentation",
|
||||
"GDPR-compliant data processing",
|
||||
"Scalable solution for any number of applicants"
|
||||
]
|
||||
},
|
||||
|
||||
conclusion: "Recrobot revolutionizes the recruiting process by combining Voice AI with intelligent conversation management. The solution enables companies to relieve their HR departments and offer applicants a modern, flexible application process. With real-time transcription and GDPR compliance, Recrobot sets new standards in HR tech."
|
||||
}
|
||||
};
|
||||
|
||||
export default recrobot;
|
||||
@@ -0,0 +1,80 @@
|
||||
// src/i18n/locales/en/portfolio/projects/website-mit-ki.ts
|
||||
export const websiteMitKi = {
|
||||
meta: {
|
||||
slug: 'website-mit-ki',
|
||||
title: 'Build Your Own Website with AI: From Zero to Finished Site',
|
||||
description: 'Step-by-step guide to building a professional website with Claude Code - GDPR compliant, multilingual, with portfolio and blog',
|
||||
excerpt: 'How to create a complete website in under an hour - without writing a single line of code yourself.',
|
||||
date: '2024-12',
|
||||
category: 'AI & Automation',
|
||||
client: 'Personal Project',
|
||||
duration: '30 Minutes',
|
||||
url: '',
|
||||
repository: '',
|
||||
documentation: '',
|
||||
published: true,
|
||||
featured: true,
|
||||
technologies: ['Claude Code', 'React', 'TypeScript', 'Vercel', 'GitHub', 'Vite'],
|
||||
tags: ['AI', 'Website', 'No-Code', 'Tutorial', 'Claude Code', 'Vercel'],
|
||||
videoUrl: 'https://www.tella.tv/video/baue-deine-website-noch-heute-mit-ki-8f7v'
|
||||
},
|
||||
content: {
|
||||
intro: 'A professional website without programming knowledge? With AI, this is possible today. This tutorial shows the complete process - from an empty project folder to a finished, hosted website.',
|
||||
|
||||
challenge: {
|
||||
title: 'The Challenge',
|
||||
description: 'The traditional path to your own website is often complicated and expensive:',
|
||||
points: [
|
||||
'Website builders like Wix, WordPress or Webflow incur monthly costs',
|
||||
'Custom development requires programming skills',
|
||||
'Designers and developers are expensive',
|
||||
'GDPR compliance and SEO optimization are complex',
|
||||
'Multilingual support and responsive design require additional effort'
|
||||
]
|
||||
},
|
||||
|
||||
solution: {
|
||||
title: 'The Solution',
|
||||
description: 'With AI, a complete website can be built in under an hour:',
|
||||
content: 'The complete workflow uses Claude Code for autonomous development, GitHub for versioning, and Vercel for free hosting.',
|
||||
points: [
|
||||
'GDPR-compliant implementation with cookie banner',
|
||||
'Multilingual support (German, English, more possible)',
|
||||
'Portfolio page with interactive projects',
|
||||
'Blog functionality for blog posts',
|
||||
'SEO optimization for better Google rankings',
|
||||
'Contact form for potential clients'
|
||||
]
|
||||
},
|
||||
|
||||
technical: {
|
||||
title: 'The Workflow',
|
||||
description: 'This is how the process works step by step:',
|
||||
points: [
|
||||
'Step 1: Create GitHub account and repository',
|
||||
'Step 2: Set up Vercel account for free hosting',
|
||||
'Step 3: Prepare local project folder with relevant documents',
|
||||
'Step 4: Open Claude Code and enter prompt with desired features',
|
||||
'Step 5: AI works autonomously and creates the complete website',
|
||||
'Step 6: Push project to GitHub and import in Vercel'
|
||||
]
|
||||
},
|
||||
|
||||
results: {
|
||||
title: 'Benefits of This Solution',
|
||||
description: 'AI-powered website development offers several advantages:',
|
||||
points: [
|
||||
'No programming skills required',
|
||||
'Minimal costs: Only AI subscription and optionally domain',
|
||||
'Better visibility through SEO optimization',
|
||||
'Full control: Code is on GitHub, hosting is free',
|
||||
'Quick changes possible via chat instructions',
|
||||
'Mobile-optimized, responsive design included'
|
||||
]
|
||||
},
|
||||
|
||||
conclusion: 'A complete, professional website can be built today in under an hour - without writing a single line of code yourself. The combination of AI development, free hosting, and versioning makes this solution interesting not only for developers, but for anyone who needs a professional web presence.'
|
||||
}
|
||||
};
|
||||
|
||||
export default websiteMitKi;
|
||||
@@ -1,8 +1,8 @@
|
||||
export const seoContent = {
|
||||
hero: {
|
||||
title: "Damjan Savić - Senior Fullstack Developer & Digital Solutions Consultant",
|
||||
subtitle: "Enterprise Software Development & AI Integration by Damjan Savić",
|
||||
description: "Damjan Savić is a Senior Fullstack Developer and Digital Solutions Consultant based in Cologne, Germany. With 10+ years of experience, Damjan Savić delivers enterprise software, cloud-native solutions, and AI-powered systems using Python, React, TypeScript, OLLAMA, and modern technologies.",
|
||||
title: "Damjan Savić | Fullstack, IoT & AI Developer",
|
||||
subtitle: "Scalable Software Solutions with IoT and AI Integration",
|
||||
description: "As a fullstack developer from Cologne, Damjan Savić specializes in building scalable software solutions with IoT and AI integration.",
|
||||
cta: {
|
||||
primary: "View Projects",
|
||||
secondary: "Work with Damjan Savić"
|
||||
|
||||
Reference in New Issue
Block a user