File size: 10,436 Bytes
509902e
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html>
<html lang="fa-IR" dir="rtl">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>خدمات — SuperNova</title>
	<meta name="description" content="خدمات تخصصی سوپرنوا: فول‌استک وب، موبایل، هوش مصنوعی، و DevOps - طراحی و توسعه محصولات دیجیتال مقیاس‌پذیر">
	<link rel="icon" type="image/x-icon" href="/favicon.ico">
	<link rel="canonical" href="https://supernova.com/services/">
	<link rel="alternate" hreflang="fa-IR" href="https://supernova.com/services/">
	<link rel="alternate" hreflang="en" href="https://supernova.com/en/services/">
	<link rel="preconnect" href="https://fonts.googleapis.com">
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
	<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
	<script src="https://cdn.tailwindcss.com"></script>
	<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
</head>
<body class="bg-deep-space text-text-primary">
	<a href="#main" class="sr-only focus:not-sr-only">رفتن به محتوا</a>
	
	<header class="fixed top-0 w-full z-50 bg-surface/80 backdrop-blur-md border-b border-muted/30">
		<nav class="container mx-auto px-4 md:px-6 py-4 flex items-center justify-between">
			<a href="/" class="font-serif text-2xl font-bold text-accent">SuperNova</a>
			<ul class="hidden md:flex items-center space-x-8" style="flex-direction: row-reverse;">
				<li><a href="/" class="text-text-secondary hover:text-accent transition">خانه</a></li>
				<li><a href="/about/" class="text-text-secondary hover:text-accent transition">درباره</a></li>
				<li><a href="/projects/" class="text-text-secondary hover:text-accent transition">پروژه‌ها</a></li>
				<li><a href="/blog/" class="text-text-secondary hover:text-accent transition">بلاگ</a></li>
				<li><a href="/careers/" class="text-text-secondary hover:text-accent transition">همکاری</a></li>
				<li><a href="/contact/" class="bg-accent text-deep-space px-4 py-2 rounded-lg hover:bg-opacity-90 transition">مشاوره</a></li>
			</ul>
		</nav>
	</header>

	<main id="main" class="pt-20">
		<!-- Hero -->
		<section class="py-20 md:py-32 bg-gradient-to-b from-surface to-deep-space">
			<div class="container mx-auto px-4 text-center">
				<h1 class="font-serif text-5xl md:text-6xl font-bold mb-6">طراحی‌شده برای دامنه جهانی</h1>
				<p class="text-xl text-text-secondary max-w-3xl mx-auto leading-relaxed">
					چهار سرویس تخصصی که به‌صورت هدفمند برای پیاده‌سازی ایده‌های بزرگ شما ساخته شده‌اند.
				</p>
			</div>
		</section>

		<!-- Services Grid (Full-Stack) -->
		<section class="py-20 md:py-32">
			<div class="container mx-auto px-4">
				<div class="grid lg:grid-cols-2 gap-16 items-center">
					<div>
						<h2 class="font-serif text-4xl font-bold mb-6">فول‌استک وب</h2>
						<h3 class="text-xl text-accent mb-4">توسعه جامع سمت سرور و کلاینت</h3>
						<ul class="space-y-3 text-text-secondary">
							<li class="flex items-start"><i data-feather="check-circle" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>معماری میکروسرویس و مدولار با Docker و Kubernetes</span></li>
							<li class="flex items-start"><i data-feather="check-circle" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>‌API GraphQL و REST مستند و آزمون‌شده</span></li>
							<li class="flex items-start"><i data-feather="check-circle" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>CI/CD چندمرحل‌ای با فلپری</span></li>
							<li class="flex items-start"><i data-feather="check-circle" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>‌Monitoring و Observability با Datadog & Sentry</span></li>
						</ul>
					</div>
					<div>
						<img src="http://static.photos/technology/1024x576/200" alt="سرور در محیط دیتا-سنتر" class="w-full rounded-2xl">
					</div>
				</div>
			</div>
		</section>

		<!-- Services Grid (Mobile) -->
		<section class="py-20 md:py-32 bg-surface/70">
			<div class="container mx-auto px-4">
				<div class="grid lg:grid-cols-2 gap-16 items-center">
					<div>
						<img src="http://static.photos/mobile/1024x576/201" alt="آیفون در دست" class="w-full rounded-2xl">
					</div>
					<div>
						<h2 class="font-serif text-4xl font-bold mb-6">موبایل کراس‌پلتفرم</h2>
						<h3 class="text-xl text-accent mb-4">React Native و Flutter برای iOS و Android</h3>
						<ul class="space-y-3 text-text-secondary">
							<li class="flex items-start"><i data-feather="smartphone" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>اکوسیستم React Native TypeScript بهینه برای عملکرد</span></li>
							<li class="flex items-start"><i data-feather="smartphone" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>برنامه رسمی Flutter با Call native modules (ETC.)</span></li>
							<li class="flex items-start"><i data-feather="layout" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>UI/UX مقیاس‌پذیر با طراحی اتمی و ری‌یوز</span></li>
							<li class="flex items-start"><i data-feather="upload" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>‌Deployment مخفی برای فروشگاه‌های Apple و Google (Beta)</span></li>
						</ul>
					</div>
				</div>
			</div>
		</section>

		<!-- Services Grid (AI/ML) -->
		<section class="py-20 md:py-32">
			<div class="container mx-auto px-4">
				<div class="grid lg:grid-cols-2 gap-16 items-center">
					<div>
						<h2 class="font-serif text-4xl font-bold mb-6">AI/ML</h2>
						<h3 class="text-xl text-accent mb-4">مدل‌سازی، وب سرویس و MLOps</h3>
						<ul class="space-y-3 text-text-secondary">
							<li class="flex items-start"><i data-feather="cpu" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>Deep Learning و عکس‌برداری پردازش تصویر با PyTorch</span></li>
							<li class="flex items-start"><i data-feather="message-square" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>‌NLP‌های متن پشتیبانی با OpenAI & Hugging Face</span></li>
							<li class="flex items-start"><i data-feather="git-branch" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>流水线 CI/CD مدل‌های آینده با Kubeflow و MLflow</span></li>
							<li class="flex items-start"><i data-feather="play" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>A/B تستینگ مدل با Canary & Rollback automatik</span></li>
						</ul>
					</div>
					<div>
						<img src="http://static.photos/science/1024x576/202" alt="شبکه‌ی عصبی نمایشی" class="w-full rounded-2xl">
					</div>
				</div>
			</div>
		</section>

		<!-- Services Grid (DevOps) -->
		<section class="py-20 md:py-32 bg-surface/70">
			<div class="container mx-auto px-4">
				<div class="grid lg:grid-cols-2 gap-16 items-center">
					<div>
						<img src="http://static.photos/industry/1024x576/203" alt="کنسول نرم‌افزار DevOps" class="w-full rounded-2xl">
					</div>
					<div>
						<h2 class="font-serif text-4xl font-bold mb-6">DevOps & SRE</h2>
						<h3 class="text-xl text-accent mb-4">زیرساخت‌های بهینه و سریع برای ماژول‌های جدید</h3>
						<ul class="space-y-3 text-text-secondary">
							<li class="flex items-start"><i data-feather="server" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>ساخت و راه‌اندازی Kubernetes EKS/GKE و self-hosted مدیریت شده</span></li>
							<li class="flex items-start"><i data-feather="layers" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>Platform Engineering IaC با Terraform & Pulumi</span></li>
							<li class="flex items-start"><i data-feather="activity" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>Incident Response و SLO مانیتور شدن با Prometheus/Grafana</span></li>
							<li class="flex items-start"><i data-feather="dollar-sign" class="w-5 h-5 ml-3 mt-1 text-accent flex-shrink-0"></i><span>Cost Optimization با تقسیم‌کننده workload & retention policy</span></li>
						</ul>
					</div>
				</div>
			</div>
		</section>

		<!-- CTA -->
		<section class="py-20 md:py-32 bg-gradient-to-r from-accent/10 to-accent-secondary/10">
			<div class="container mx-auto px-4 text-center">
				<h2 class="font-serif text-4xl font-bold mb-6">چه مناسب حضور شماست؟</h2>
				<p class="text-xl text-text-secondary mb-8 max-w-2xl mx-auto">بیایید با هم انتخاب بهترین مسیر را برای ایده‌تان بچینیم. کافی‌ست درددل فنی‌ها را بازگو کنید و ما حل می‌کنیم.</p>
				<div class="flex flex-col sm:flex-row gap-4 justify-center">
					<a href="/contact/" class="bg-accent text-deep-space px-8 py-4 rounded-xl text-lg font-semibold hover:bg-opacity-90 transition">مشاوره رایگان رزرو کنید</a>
					<a href="/projects/" class="border border-accent text-accent px-8 py-4 rounded-xl text-lg hover:bg-accent hover:text-deep-space transition">مشاهده portoliو واقعی ما</a>
				</div>
			</div>
		</section>
	</main>

	<footer class="bg-surface border-t border-muted/30 py-16">
		<div class="container mx-auto px-4 text-center">
			<div class="mt-8 pt-8 border-t border-muted/50 text-text-secondary">
				<p>&copy; 2024 SuperNova Studio - همه حقوق محفوظ است</p>
				<div class="mt-4 space-x-6" style="flex-direction: row-reverse;">
					<a href="/privacy/" class="hover:text-accent transition">حریم‌خصوصی</a>
					<a href="/terms/" class="hover:text-accent transition">شرایط استفاده</a>
					<a href="/accessibility/" class="hover:text-accent transition">دسترس‌پذیری</a>
					<a href="/cookie-policy/" class="hover:text-accent transition">کوکی‌ها</a>
				</div>
			</div>
		</div>
	</footer>

	<script>feather.replace()</script>
</body>
</html>