truncgit/citrus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add Artificial Intelligence service page and update homepage card link

Browse Source
This commit is contained in:
Ümit Tunç
2026-05-23 23:48:54 +03:00
parent 72c1234b5c
commit a61c80ee3d
6 changed files with 723 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/partials/header-yapay-zeka.blade.php
+89
View File
@@ -0,0 +1,89 @@
{{-- Yapay Zeka sayfası: center-nav transparent position-absolute navbar-light caret-none --}}
<header>
<nav class="navbar navbar-expand-lg center-nav transparent position-absolute navbar-light caret-none">
<div class="container xl:!flex-row lg:!flex-row !flex-nowrap items-center">
<div class="navbar-brand w-full">
<a href="{{ url('/') }}">
<img src="{{ asset('assets/img/truncgil-yatay.svg') }}" alt="{{ setting('site_name', config('app.name')) }}" width="134" height="43" fetchpriority="high" decoding="async">
</a>
</div>
<div class="navbar-collapse offcanvas offcanvas-nav offcanvas-start">
<div class="offcanvas-header xl:!hidden lg:!hidden flex items-center justify-between flex-row p-6">
<a href="{{ url('/') }}">
<img class="!h-[2.2rem]" src="{{ asset('assets/img/truncgil-yatay-dark.svg') }}" alt="{{ setting('site_name', config('app.name')) }}" width="134" height="43" decoding="async">
</a>
<button type="button" class="btn-close !text-white" data-bs-dismiss="offcanvas" aria-label="{{ __('Close') }}"></button>
</div>
<div class="offcanvas-body xl:!ml-auto lg:!ml-auto flex flex-col !h-full">
@include('components.custom.menu')
<div class="offcanvas-footer xl:!hidden lg:!hidden !mt-auto">
<div>
<a href="mailto:{{ setting('contact_email') }}" class="link-inverse">{{ setting('contact_email') }}</a>
<br>
<a href="tel:{{ setting('contact_phone') }}">{{ setting('contact_phone') }}</a>
<br>
@php $social_media = json_decode(setting('social_links'), true) ?? []; @endphp
<nav class="nav social social-white !mt-4">
@if(!empty($social_media['Twitter']))
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="{{ $social_media['Twitter'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('Twitter') }}"><i class="uil uil-twitter before:content-['\ed59'] !text-white text-[1rem]" aria-hidden="true"></i></a>
@endif
@if(!empty($social_media['Facebook']))
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="{{ $social_media['Facebook'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('Facebook') }}"><i class="uil uil-facebook-f before:content-['\eae2'] !text-white text-[1rem]" aria-hidden="true"></i></a>
@endif
@if(!empty($social_media['Instagram']))
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="{{ $social_media['Instagram'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('Instagram') }}"><i class="uil uil-instagram before:content-['\eb9c'] !text-white text-[1rem]" aria-hidden="true"></i></a>
@endif
@if(!empty($social_media['Youtube']))
<a class="!text-[#cacaca] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem] m-[0_.7rem_0_0]" href="{{ $social_media['Youtube'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('YouTube') }}"><i class="uil uil-youtube before:content-['\edb5'] !text-white text-[1rem]" aria-hidden="true"></i></a>
@endif
</nav>
</div>
</div>
</div>
</div>
<div class="navbar-other w-full !flex !ml-auto">
<ul class="navbar-nav !flex-row !items-center !ml-auto">
<li class="nav-item hidden xl:!flex lg:!flex">
@include('components.custom.language-selector')
</li>
<li class="nav-item hidden xl:!block lg:!block">
@php $social_media = json_decode(setting('social_links'), true) ?? []; @endphp
<nav class="nav social social-muted justify-end text-right">
@if(!empty($social_media['Twitter']))
<a class="m-[0_0_0_.7rem] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="{{ $social_media['Twitter'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('Twitter') }}"><i class="uil uil-twitter before:content-['\ed59'] text-[1rem] !text-[#5daed5]" aria-hidden="true"></i></a>
@endif
@if(!empty($social_media['Facebook']))
<a class="m-[0_0_0_.7rem] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="{{ $social_media['Facebook'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('Facebook') }}"><i class="uil uil-facebook-f before:content-['\eae2'] text-[1rem] !text-[#4470cf]" aria-hidden="true"></i></a>
@endif
@if(!empty($social_media['Instagram']))
<a class="m-[0_0_0_.7rem] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="{{ $social_media['Instagram'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('Instagram') }}"><i class="uil uil-instagram before:content-['\eb9c'] text-[1rem] !text-[#d53581]" aria-hidden="true"></i></a>
@endif
@if(!empty($social_media['Youtube']))
<a class="m-[0_0_0_.7rem] text-[1rem] transition-all duration-[0.2s] ease-in-out translate-y-0 hover:translate-y-[-0.15rem]" href="{{ $social_media['Youtube'] }}" target="_blank" rel="noopener noreferrer" aria-label="{{ t('YouTube') }}"><i class="uil uil-youtube before:content-['\edb5'] text-[1rem] !text-[#c8312b]" aria-hidden="true"></i></a>
@endif
</nav>
</li>
<li class="nav-item xl:!hidden lg:!hidden">
<button class="hamburger offcanvas-nav-btn" type="button" data-bs-toggle="offcanvas" data-bs-target=".offcanvas-nav" aria-label="{{ t('Menüyü aç') }}"><span></span></button>
</li>
</ul>
</div>
</div>
</nav>
</header>
<script>
document.addEventListener('DOMContentLoaded', function () {
var offcanvases = document.querySelectorAll('.offcanvas-nav');
var hamburgers = document.querySelectorAll('.hamburger.offcanvas-nav-btn');
if (offcanvases.length > 0 && hamburgers.length > 0) {
offcanvases.forEach(function (oc) {
oc.addEventListener('show.bs.offcanvas', function () {
hamburgers.forEach(function (h) { h.classList.add('is-active'); });
});
oc.addEventListener('hide.bs.offcanvas', function () {
hamburgers.forEach(function (h) { h.classList.remove('is-active'); });
});
});
}
});
</script>
resources/views/templates/home/services-cards.blade.php
+1 -1
View File
@@ -7,7 +7,7 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] solid-mono text-[#e668b3] text-fuchsia !mb-3"><path class="fill-primary" d="M152 0H29.33A29.32 29.32 0 000 29.33v165.33A29.32 29.32 0 0029.33 224h78.72l2.35-13.12a29.71 29.71 0 018.11-15.68l62.83-62.72V29.33A29.33 29.33 0 00152 0zM42.67 42.67h42.67a10.67 10.67 0 110 21.33H42.66a10.67 10.67 0 010-21.33zM96 149.33H42.67a10.67 10.67 0 110-21.33H96a10.67 10.67 0 110 21.33zm42.67-42.66h-96a10.67 10.67 0 010-21.34h96a10.67 10.67 0 110 21.34z"></path><path class="fill-secondary" d="M133.63 256a8 8 0 01-7.89-9.38l5.67-32.06a8 8 0 012.22-4.27l79.2-79.2c9.73-9.75 19.28-7.12 24.51-1.89l13.2 13.2a18.69 18.69 0 010 26.4l-79.2 79.2a7.83 7.83 0 01-4.27 2.22l-32 5.67a10.71 10.71 0 01-1.44.11zm32.05-13.65z"></path></svg>
<h4>{!! t('Yapay Zeka') !!}</h4>
<p class="!mb-2 flex-1 min-h-[4.5rem]">{!! t('Yapay zeka teknolojilerini kullanarak işlerinizi otomatikleştirebiliriz.') !!}</p>
<a href="#" class="more hover !text-[#e668b3] focus:!text-[#e668b3] hover:!text-[#e668b3]">{!! t('Daha fazla bilgi edin') !!}</a>
<a href="{{ route('page.show', ['slug' => 'yapay-zeka']) }}" class="more hover !text-[#e668b3] focus:!text-[#e668b3] hover:!text-[#e668b3]">{!! t('Daha fazla bilgi edin') !!}</a>
</div>
<!--/.card-body -->
</div>
resources/views/templates/services/yapay-zeka.blade.php
+526
View File
@@ -0,0 +1,526 @@
@extends('layouts.site', ['header' => 'partials.header-yapay-zeka', 'footer' => 'partials.footer'])
@php
$pageHero = $pageHero ?? \App\Support\PageTemplateHero::resolveForPage($page ?? null, 'services.yapay-zeka');
$socialLinks = setting('social_links');
$sameAs = [];
if ($socialLinks) {
$links = is_string($socialLinks) ? json_decode($socialLinks, true) : $socialLinks;
if (is_array($links)) {
foreach ($links as $platform => $url) {
if (!empty($url)) {
$sameAs[] = $url;
}
}
}
}
if (empty($sameAs)) {
$sameAs = [
"https://www.facebook.com/truncgil",
"https://www.instagram.com/truncgil",
"https://www.linkedin.com/company/truncgil-technology"
];
}
@endphp
@push('head')
@if($pageHero)
@if(!empty($pageHero['from_upload']))
<link rel="preload" as="image" href="{{ $pageHero['image'] }}" fetchpriority="high">
@elseif(!empty($pageHero['webp']))
<link rel="preload" as="image" href="{{ asset($pageHero['webp']) }}" type="image/webp" fetchpriority="high">
@endif
@endif
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "ProfessionalService",
"@id": "{{ url()->current() }}#organization",
"name": "{{ setting('site_name', 'Trunçgil Teknoloji') }}",
"image": "{{ setting('site_logo') ? (str_starts_with(setting('site_logo'), 'http') ? setting('site_logo') : asset('storage/' . ltrim(setting('site_logo'), '/'))) : asset('assets/img/logo.png') }}",
"url": "{{ url('/') }}",
"telephone": "{{ setting('contact_phone', '+902244431620') }}",
"priceRange": "$$$",
"address": {
"@type": "PostalAddress",
"streetAddress": "{{ setting('contact_address', 'Ulutek Teknoloji Geliştirme Bölgesi, Görükle Kampüsü, No: 104') }}"
},
"sameAs": {!! json_encode($sameAs, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE) !!}
},
{
"@type": "Service",
"@id": "{{ url()->current() }}#service",
"serviceType": "Artificial Intelligence Development",
"provider": {
"@id": "{{ url()->current() }}#organization"
},
"name": {!! json_encode(t('Yapay Zeka ve Derin Öğrenme Geliştirme Hizmeti')) !!},
"description": {!! json_encode(t('PyTorch ve TensorFlow ile veri modellemeden Edge AI yayınına kadar tam teşekküllü yapay zeka, LoRA fine-tuning ve makine öğrenmesi sistemleri geliştiriyoruz.')) !!},
"areaServed": [
{
"@type": "AdministrativeArea",
"name": "Bursa"
},
{
"@type": "AdministrativeArea",
"name": "Türkiye"
},
{
"@type": "AdministrativeArea",
"name": "Global"
}
],
"hasOfferCatalog": {
"@type": "OfferCatalog",
"name": "Yapay Zeka Hizmetleri",
"itemListElement": [
{
"@type": "Offer",
"itemOffered": {
"@type": "Service",
"name": "LLM Fine-Tuning (LoRA/QLoRA)"
}
},
{
"@type": "Offer",
"itemOffered": {
"@type": "Service",
"name": "Computer Vision & Edge AI"
}
},
{
"@type": "Offer",
"itemOffered": {
"@type": "Service",
"name": "Data Pipeline Optimization"
}
}
]
}
}
]
}
</script>
@endpush
@push('styles')
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
<style>
.ai-dev-section .material-symbols-outlined {
font-family: 'Material Symbols Outlined' !important;
font-weight: normal !important;
font-style: normal !important;
line-height: 1 !important;
letter-spacing: normal !important;
text-transform: none !important;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-smoothing: antialiased;
font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.ai-dev-section .accordion-wrapper .card-header button.collapsed {
color: #343f52 !important;
}
.ai-dev-section .accordion-wrapper .card-header button:hover,
.ai-dev-section .accordion-wrapper .card-header button {
color: #e31e24 !important;
}
/* Technology Card Micro-animations */
.ai-card {
transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s ease;
}
.ai-card:hover {
transform: translateY(-8px) scale(1.03);
box-shadow: 0 1.25rem 2.5rem rgba(227, 30, 36, 0.12) !important;
}
/* Header adjustments to overlay the gradient */
body:has(.ai-dev-hero) > header {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 1030;
background: transparent !important;
}
body:has(.ai-dev-hero) > header .navbar.transparent:not(.fixed):not(.navbar-clone) {
background: transparent !important;
box-shadow: none !important;
}
.bg-gradient-ai {
background: linear-gradient(180deg, #f3f0ff 0%, rgba(255, 255, 255, 0) 100%) !important;
}
.btn-soft-ai {
background-color: #f3f0ff !important;
color: #6a1b9a !important;
}
.matrix-table {
border-radius: 12px;
overflow: hidden;
box-shadow: 0 0.25rem 1.75rem rgba(30, 34, 40, 0.05);
border: 1px solid rgba(0,0,0,0.05);
}
.matrix-table th {
background-color: #f8f9fa;
color: #343f52;
font-weight: 700;
text-transform: uppercase;
font-size: 0.85rem;
}
.matrix-table td, .matrix-table th {
padding: 1.25rem;
vertical-align: middle;
}
.matrix-table tbody tr:not(:last-child) {
border-bottom: 1px solid rgba(0,0,0,0.05);
}
.matrix-table tbody tr:hover {
background-color: #fcfcfc;
}
</style>
@endpush
@section('content')
@php
$contactUrl = route('page.show', ['slug' => 'iletisim']);
@endphp
{{-- Hero Section --}}
<section class="wrapper bg-gradient-ai ai-dev-hero relative overflow-hidden">
<div class="container pt-24 xl:pt-32 lg:pt-32 md:pt-32 pb-[4.5rem] xl:pb-32 lg:pb-32 md:pb-32">
<div class="flex flex-wrap mx-[-15px] !text-center">
<div class="xl:w-10/12 lg:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto ai-dev-hero-text" data-cues="zoomIn" data-group="welcome" data-interval="-200">
<h1 class="xl:!text-[2.6rem] !text-[calc(1.375rem_+_1.5vw)] !leading-[1.15] font-bold !mb-4">
{!! t('Yapay Zeka ve Derin Öğrenme') !!} <br/><span class="text-gradient gradient-7">{!! t('Ekosistemine Hükmedin') !!}</span>
</h1>
<p class="lead !text-[1.2rem] leading-normal md:!px-5 xl:!px-20 xxl:!px-10 !mb-7">
{!! t('PyTorch ve TensorFlow ile ham verinin işlenmesinden modelin production ortamına alınmasına kadar olan tüm döngüyü yöneten yüksek performanslı Yapay Zeka sistemleri inşa ediyoruz.') !!}
</p>
</div>
</div>
<div class="flex justify-center" data-cues="slideInDown" data-group="join" data-delay="900">
<span><a href="#detaylar" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:!bg-[#c4191f] hover:!border-[#c4191f] hover:!text-white active:!bg-[#a61217] !rounded-[50rem] mx-2 font-semibold shadow-[0_10px_20px_-10px_rgba(227,30,36,0.5)] transition-all duration-300">{!! t('Teknolojileri İnceleyin') !!}</a></span>
<span><a href="{{ $contactUrl }}" class="btn btn-lg btn-outline-primary !text-[#e31e24] !bg-white border-[#e31e24] hover:!text-white hover:!bg-[#e31e24] hover:!border-[#e31e24] active:!bg-[#e31e24] active:!text-white !rounded-[50rem] !border-[#e31e24] mx-2 font-semibold shadow-[0_10px_20px_-10px_rgba(30,34,40,0.15)] transition-all duration-300">{!! t('Bize Ulaşın') !!}</a></span>
</div>
<div class="flex flex-wrap mx-[-15px] !mt-[3.5rem]" data-cue="fadeIn" data-delay="1600" data-duration="400">
<div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto text-center">
<figure class="m-0 p-0 inline-block">
<img src="{{ asset('assets/img/gsap/yapay-zeka.webp') }}" class="max-w-full h-auto rounded-lg shadow-2xl" alt="{{ t('Trunçgil Teknoloji Yapay Zeka') }}" />
</figure>
</div>
</div>
</div>
</section>
{{-- Tech Detail Section --}}
<section id="detaylar" class="wrapper !bg-[#ffffff] ai-dev-section">
<div class="container pt-[4.5rem] pb-[4.5rem] xl:pt-24 xl:pb-24 lg:pt-24 lg:pb-24 md:pt-24 md:pb-24">
<div class="flex flex-wrap mx-[-15px] !text-center">
<div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !relative" data-cues="slideInUp" data-group="tech-header" data-duration="400">
<h2 class="!text-[0.8rem] !leading-[1.35] !tracking-[0.02rem] uppercase !text-[#74788d] !mb-3">{!! t('Teknik Altyapı') !!}</h2>
<h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-semibold !leading-[1.2] !mb-12 lg:!px-5 xl:!px-0 xxl:!px-6">
{!! t('Modellemeden Üretime') !!} <span class="text-gradient gradient-7">{!! t('İki Dev Motor') !!}</span>
</h3>
<p class="mb-10 text-muted">{!! t('Derin öğrenme ekosisteminde PyTorch ve TensorFlow, veri hatlarından dağıtık eğitime kadar sistem mimarilerini şekillendiren en güçlü kütüphanelerdir.') !!}</p>
</div>
</div>
<div class="flex flex-wrap mx-[-15px] mt-10">
{{-- Data Pipeline --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
<div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
<div class="flex items-center mb-4">
<span class="material-symbols-outlined !text-[2rem] text-[#e31e24] mr-3">schema</span>
<h4 class="!text-[1.25rem] font-bold mb-0">{!! t('1. Veri Modelleme ve Giriş Hattı') !!}</h4>
</div>
<p class="text-muted !text-[0.9rem] mb-4">{!! t('Derin öğrenme modellerinde performansın %70\'i verinin GPU/TPU birimlerine ne kadar efektif beslendiğiyle (throughput) ilişkilidir. Her iki kütüphane de asenkron veri işlemek için optimize edilmiştir:') !!}</p>
<ul class="pl-4 mb-0 text-[0.85rem]">
<li class="mb-2"><strong>PyTorch (<code class="bg-[#f1f5f9] px-1 rounded">torch.utils.data</code>):</strong> <code class="bg-[#f1f5f9] px-1 rounded">Dataset</code> ve <code class="bg-[#f1f5f9] px-1 rounded">DataLoader</code> soyutlamaları. Özel veri okuma için sihirli metotlar (<code class="bg-[#f1f5f9] px-1 rounded">__len__</code>, <code class="bg-[#f1f5f9] px-1 rounded">__getitem__</code>) ezilir. RAM/GPU transferi <code class="bg-[#f1f5f9] px-1 rounded">num_workers</code> ile paralelleştirilir.</li>
<li><strong>TensorFlow (<code class="bg-[#f1f5f9] px-1 rounded">tf.data</code>):</strong> Tamamen veri akış grafiği mantığı. Diskteki büyük veriler için <strong>TFRecord</strong> yapıları. <code class="bg-[#f1f5f9] px-1 rounded">.prefetch(tf.data.AUTOTUNE)</code> ile darboğaz önleme mekanizmaları.</li>
</ul>
</div>
</div>
{{-- Model Architecture --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
<div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
<div class="flex items-center mb-4">
<span class="material-symbols-outlined !text-[2rem] text-[#6a1b9a] mr-3">architecture</span>
<h4 class="!text-[1.25rem] font-bold mb-0">{!! t('2. Model Yapılandırma ve Mimari Tasarım') !!}</h4>
</div>
<p class="text-muted !text-[0.9rem] mb-4">{!! t('Modellerin katman katman örüldüğü ve fonksiyonların tanımlandığı aşamadır. İki çerçevenin felsefi ayrımı burada netleşir:') !!}</p>
<ul class="pl-4 mb-0 text-[0.85rem]">
<li class="mb-2"><strong>PyTorch (Dinamik Grafik):</strong> <strong>Eager Execution</strong> esasıyla satır satır işletilir. <code class="bg-[#f1f5f9] px-1 rounded">nn.Module</code> sınıflarında veri akışı <code class="bg-[#f1f5f9] px-1 rounded">forward</code> fonksiyonunda manuel yönetilir. Python <code class="bg-[#f1f5f9] px-1 rounded">pdb</code> ile hata ayıklama kolaylığı.</li>
<li><strong>TensorFlow / Keras 3 (Statik ve Esnek):</strong> Keras 3 ile backend olarak TF, PyTorch veya JAX seçilebilir. JIT derleme için <code class="bg-[#f1f5f9] px-1 rounded">@tf.function</code> dekoratörüyle C++ grafik optimizasyonu.</li>
</ul>
</div>
</div>
{{-- Training & Gradients --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
<div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
<div class="flex items-center mb-4">
<span class="material-symbols-outlined !text-[2rem] text-[#2563eb] mr-3">model_training</span>
<h4 class="!text-[1.25rem] font-bold mb-0">{!! t('3. Model Eğitimi & Dağıtık Öğrenme') !!}</h4>
</div>
<p class="text-muted !text-[0.9rem] mb-2"><strong>Gradiyen Hesaplama:</strong></p>
<ul class="pl-4 mb-4 text-[0.85rem]">
<li><strong>PyTorch (Autograd):</strong> <code class="bg-[#f1f5f9] px-1 rounded">loss.backward()</code> ile gradyan zinciri hesaplanır. Her döngüde <code class="bg-[#f1f5f9] px-1 rounded">optimizer.zero_grad()</code> ile gradyanların sıfırlanması kritiktir.</li>
<li><strong>TensorFlow:</strong> Açık bağlam yöneticisi (<code class="bg-[#f1f5f9] px-1 rounded">tf.GradientTape</code>) içinde gradyanlar hesaplanıp optimizer'a beslenir.</li>
</ul>
<p class="text-muted !text-[0.9rem] mb-2"><strong>Dağıtık Eğitim:</strong></p>
<p class="text-[0.85rem] mb-0">{!! t('Büyük modelleri GPU\'lara sığdırmak için PyTorch <strong>DDP/FSDP</strong> (Ring-AllReduce) kullanırken, TensorFlow <strong>MirroredStrategy</strong> mimarisi ile kod değiştirmeden eğitimi ölçeklendirir.') !!}</p>
</div>
</div>
{{-- Fine-Tuning & PEFT --}}
<div class="md:w-6/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full mb-8" data-cue="slideInUp">
<div class="card h-full !border-[#e2e8f0] border-solid border shadow-sm !rounded-[1rem] p-8 ai-card">
<div class="flex items-center mb-4">
<span class="material-symbols-outlined !text-[2rem] text-[#059669] mr-3">tune</span>
<h4 class="!text-[1.25rem] font-bold mb-0">{!! t('4. İnce Ayar (PEFT) ve Tuning') !!}</h4>
</div>
<p class="text-muted !text-[0.9rem] mb-4">{!! t('Milyarlarca parametreli (LLM/Vision) modelleri devasa donanım maliyetleri olmadan özel görevlere uyarlıyoruz:') !!}</p>
<ul class="pl-4 mb-4 text-[0.85rem]">
<li class="mb-2"><strong>LoRA (Low-Rank Adaptation):</strong> Orijinal model dondurulur, değişim matrisi düşük boyutlu iki matris ($A \times B$) olarak eğitilir. Parametre sayısı %99 azalır.</li>
<li class="mb-2"><strong>QLoRA (Quantized LoRA):</strong> Ağırlıklar 4-bit (NF4) hassasiyete sıkıştırılıp VRAM %75 düşürülürken adaptörler 16-bit eğitilir.</li>
</ul>
<p class="text-[0.85rem] mb-0"><strong>Hiperparametre Tuning:</strong> {!! t('Ray Tune veya Optuna ile ASHA erken durdurma algoritmaları entegre edilerek optimum parametreler taranır.') !!}</p>
</div>
</div>
</div>
{{-- Deployment Matrix --}}
<div class="flex flex-wrap mx-[-15px] mt-10">
<div class="w-full flex-[0_0_auto] !px-[15px] max-w-full" data-cue="slideInUp">
<div class="text-center mb-6">
<h4 class="!text-[1.5rem] font-bold">{!! t('5. Sistemler ve Yaygınlaştırma (Deployment) Mimarileri') !!}</h4>
<p class="text-muted">{!! t('Eğitim sonrası modellerin düşük gecikmeli (low latency) ve ölçeklenebilir çıkarım (inference) sunması için altyapı matrisimiz.') !!}</p>
</div>
<div class="table-responsive">
<table class="table matrix-table w-full text-left">
<thead>
<tr>
<th>{!! t('Aşama / İhtiyaç') !!}</th>
<th>PyTorch Ekosistemi</th>
<th>TensorFlow Ekosistemi</th>
</tr>
</thead>
<tbody>
<tr>
<td class="font-semibold">{!! t('Model Derleme & Optimizasyon') !!}</td>
<td><strong>TorchScript</strong> (C++ runtime çevirisi) veya <strong>PyTorch 2.x <code>torch.compile</code></strong> (Inductor compiler altyapısı).</td>
<td><strong>XLA (Accelerated Linear Algebra)</strong> derleyicisi grafikleri optimize eder, operasyonları birleştirir.</td>
</tr>
<tr>
<td class="font-semibold">{!! t('Büyük Ölçekli Sunum (Production)') !!}</td>
<td><strong>TorchServe</strong> veya NVIDIA Triton Inference Server.</td>
<td><strong>TensorFlow Serving</strong>: Dinamik versiyonlama, A/B testi, gRPC/REST desteği.</td>
</tr>
<tr>
<td class="font-semibold">{!! t('Mobil ve Uç Cihazlar (Edge AI)') !!}</td>
<td><strong>ExecuTorch</strong>: Gelişmiş gömülü sistemler ve mobil çalışma zamanı.</td>
<td><strong>LiteRT / TensorFlow Lite</strong>: 8-bit quantization ve pruning destekli olgun ekosistem.</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</section>
{{-- Capabilities Section --}}
<section class="wrapper bg-soft-primary ai-dev-section">
<div class="container pt-[4.5rem] pb-[4.5rem] xl:pt-24 xl:pb-24 lg:pt-24 lg:pb-24 md:pt-24 md:pb-24">
<div class="flex flex-wrap mx-[-15px] !text-center">
<div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !relative" data-cues="slideInUp" data-group="cap-header" data-duration="400">
<h2 class="!text-[0.8rem] !leading-[1.35] !tracking-[0.02rem] uppercase !text-[#74788d] !mb-3">{!! t('Neler Yapıyoruz?') !!}</h2>
<h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-semibold !leading-[1.2] !mb-12 lg:!px-5 xl:!px-0 xxl:!px-6">
{!! t('Trunçgil Teknoloji') !!} <span class="text-gradient gradient-7">{!! t('Yapay Zeka Yetkinlikleri') !!}</span>
</h3>
</div>
</div>
<div class="flex flex-wrap mx-[-15px]" data-cues="slideInUp" data-group="cap-cards" data-interval="-150" data-duration="400">
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
<div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
<div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
<div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
<span class="material-symbols-outlined !text-[1.8rem]">smart_toy</span>
</div>
<h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Özel LLM İnce Ayarı') !!}</h4>
<p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Llama, Mistral ve Qwen gibi açık kaynak Büyük Dil Modellerini kurumsal bilgi tabanınıza QLoRA ile maliyet-efektif olarak eğitiyoruz.') !!}</p>
</div>
</div>
</div>
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
<div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
<div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
<div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
<span class="material-symbols-outlined !text-[1.8rem]">visibility</span>
</div>
<h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Bilgisayarlı Görü (Vision)') !!}</h4>
<p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Nesne tespiti, otonom kalite kontrol ve yüz tanıma sistemlerini yüksek performanslı edge cihazlar veya bulut GPU ağlarında koşturuyoruz.') !!}</p>
</div>
</div>
</div>
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
<div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
<div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
<div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
<span class="material-symbols-outlined !text-[1.8rem]">router</span>
</div>
<h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Edge AI Çözümleri') !!}</h4>
<p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('LiteRT ve ExecuTorch mimarileriyle yapay zeka çıkarım gücünü mobil uygulamalara ve düşük güç tüketen uç cihazlara (IoT) taşıyoruz.') !!}</p>
</div>
</div>
</div>
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
<div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
<div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
<div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
<span class="material-symbols-outlined !text-[1.8rem]">hub</span>
</div>
<h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Yüksek Hızlı Veri Hatları') !!}</h4>
<p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Büyük verileri asenkron işleyip modellerinizi besleyecek yüksek throughput (tf.data) mimarileri ve veri ambarları kuruyoruz.') !!}</p>
</div>
</div>
</div>
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
<div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
<div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
<div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
<span class="material-symbols-outlined !text-[1.8rem]">recommend</span>
</div>
<h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Öneri & Karar Sistemleri') !!}</h4>
<p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Collaborative filtering ve derin öğrenme ile kullanıcı davranışlarını öngören kişiselleştirilmiş e-ticaret ve analiz motorları geliştiriyoruz.') !!}</p>
</div>
</div>
</div>
<div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] !mt-6 max-w-full">
<div class="card h-full !shadow-sm border-0 flex flex-col justify-between !rounded-[1.2rem] overflow-hidden ai-card">
<div class="card-body !p-8 flex-[1_1_auto] flex flex-col text-center items-center">
<div class="icon btn btn-circle btn-lg btn-soft-purple pointer-events-none !mb-4 w-12 h-12 !inline-flex !items-center !justify-center !leading-none !rounded-full">
<span class="material-symbols-outlined !text-[1.8rem]">storage</span>
</div>
<h4 class="!text-[1.15rem] !font-bold !mb-2">{!! t('Production Mimarisi') !!}</h4>
<p class="!text-[0.85rem] !mb-0 text-muted flex-1">{!! t('Geliştirilen modelleri TF Serving veya Triton Server ile Kubernetes ortamında zero-downtime ve düşük gecikme ile ölçekliyoruz.') !!}</p>
</div>
</div>
</div>
</div>
</div>
</section>
{{-- FAQ Section --}}
<section class="wrapper !bg-[#ffffff] ai-dev-section">
<div class="container pt-[4.5rem] pb-[4.5rem] xl:pt-24 xl:pb-24 lg:pt-24 lg:pb-24 md:pt-24 md:pb-24">
<div class="flex flex-wrap mx-[-15px]">
<div class="xl:w-11/12 xxl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
<div class="!relative !mb-12 text-center" data-cues="slideInUp" data-group="faq-header" data-duration="400">
<h2 class="!text-[0.8rem] uppercase !text-[#74788d] !mb-3 !leading-[1.35]">{!! t('Sık Sorulan Sorular') !!}</h2>
<h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.2] xl:!text-[2rem] !mb-0 lg:!px-8 xl:!px-12">
{!! t('Yapay Zeka Projeleri İçin') !!} <span class="text-gradient gradient-7">{!! t('Merak Edilenler') !!}</span>
</h3>
</div>
<div class="flex flex-wrap mx-[-15px]">
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mb-0" data-cues="slideInUp" data-group="faq-list-1" data-interval="-150" data-duration="400">
<div id="accordion-ai-1" class="accordion-wrapper">
<div class="card accordion-item !mb-5 !shadow-sm">
<div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-1">
<button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-1" aria-expanded="false" aria-controls="collapse-ai-1">
{!! t('Özel dil modeli (LLM) eğitimi maliyetli midir?') !!}
</button>
</div>
<div id="collapse-ai-1" class="collapse" aria-labelledby="heading-ai-1" data-bs-target="#accordion-ai-1">
<div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
<p>{!! t('Eskiden devasa bütçeler gerektiren bu işlemler, LoRA ve QLoRA (Quantization) teknikleri sayesinde dramatik olarak ucuzlamıştır. Modeli tamamen yeniden eğitmek yerine sadece belirli parametreleri güncelleyerek maliyetleri %99 oranında düşürüyoruz.') !!}</p>
</div>
</div>
</div>
<div class="card accordion-item !mb-5 !shadow-sm">
<div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-2">
<button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-2" aria-expanded="false" aria-controls="collapse-ai-2">
{!! t('Veri gizliliğini nasıl sağlıyorsunuz?') !!}
</button>
</div>
<div id="collapse-ai-2" class="collapse" aria-labelledby="heading-ai-2" data-bs-target="#accordion-ai-1">
<div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
<p>{!! t('Kurumsal verilerinizi dış API\'lara göndermek yerine açık kaynaklı modelleri (Llama vb.) doğrudan kendi sunucularınızda (On-Premise) barındırarak %100 veri gizliliği garanti ediyoruz.') !!}</p>
</div>
</div>
</div>
</div>
</div>
<div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full" data-cues="slideInUp" data-group="faq-list-2" data-interval="-150" data-delay="300" data-duration="400">
<div id="accordion-ai-2" class="accordion-wrapper">
<div class="card accordion-item !mb-5 !shadow-sm">
<div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-3">
<button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-3" aria-expanded="false" aria-controls="collapse-ai-3">
{!! t('Edge AI (Uç Cihazlarda Yapay Zeka) nerede kullanılır?') !!}
</button>
</div>
<div id="collapse-ai-3" class="collapse" aria-labelledby="heading-ai-3" data-bs-target="#accordion-ai-2">
<div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
<p>{!! t('İnternet bağlantısının olmadığı fabrikalarda (kalite kontrol), mobil uygulamalarda anlık yüz tanıma ve güvenlik sistemlerinde modellerin buluta gitmeden cihaz üzerinde koşturulması için LiteRT ve ExecuTorch mimarileri kullanılır.') !!}</p>
</div>
</div>
</div>
<div class="card accordion-item !mb-5 !shadow-sm">
<div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !rounded-[0.4rem] !bg-inherit" id="heading-ai-4">
<button class="!text-[#343f52] !text-[0.9rem] font-semibold hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapse-ai-4" aria-expanded="false" aria-controls="collapse-ai-4">
{!! t('PyTorch mu TensorFlow mu tercih etmeliyim?') !!}
</button>
</div>
<div id="collapse-ai-4" class="collapse" aria-labelledby="heading-ai-4" data-bs-target="#accordion-ai-2">
<div class="card-body p-[0_1.25rem_.25rem_2.35rem] !text-[0.85rem] text-muted">
<p>{!! t('İkisi de güçlü motorlardır. Ar-Ge, LLM ve inovatif denemeler için genelde PyTorch; devasa veri hatları, statik grafik optimizasyonları ve mobil entegrasyonlar için TensorFlow tercih edilir. Projenize uygun seçimi birlikte yapıyoruz.') !!}</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
{{-- Footer Call to Action --}}
<section class="wrapper image-wrapper bg-full bg-image bg-overlay bg-overlay-light-500 bg-content relative z-0" data-image-src="{{ asset('assets/img/photos/bg22.png') }}" style="background-image: url('{{ asset('assets/img/photos/bg22.png') }}');">
<div class="container py-[4.5rem] xl:py-24 lg:py-24 md:py-24 !relative" style="z-index: 2;">
<div class="flex flex-wrap mx-[-15px] !text-center">
<div class="xl:w-11/12 xxl:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
<h2 class="!text-[0.8rem] !tracking-[0.02rem] !leading-[1.35] uppercase text-gradient gradient-7 !mb-3">{!! t('Geleceği Birlikte İnşa Edelim') !!}</h2>
<h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] !mb-7 lg:!px-[7rem] xl:!px-[7rem]">
{!! t('Yapay Zeka ekosistemiyle işinizi bir adım öne taşımaya hazır mısınız?') !!}
</h3>
<a href="{{ $contactUrl }}" class="btn btn-lg btn-gradient gradient-7 rounded-full shadow-lg">{!! t('Projeyi Başlatın') !!}</a>
</div>
</div>
</div>
</section>
@endsection