@jjlmoya/utils-audiovisual 1.7.0 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -1
- package/src/category/i18n/de.ts +198 -0
- package/src/category/i18n/id.ts +198 -0
- package/src/category/i18n/it.ts +198 -0
- package/src/category/i18n/ja.ts +198 -0
- package/src/category/i18n/ko.ts +198 -0
- package/src/category/i18n/nl.ts +198 -0
- package/src/category/i18n/pl.ts +198 -0
- package/src/category/i18n/pt.ts +198 -0
- package/src/category/i18n/ru.ts +198 -0
- package/src/category/i18n/sv.ts +198 -0
- package/src/category/i18n/tr.ts +198 -0
- package/src/category/i18n/zh.ts +198 -0
- package/src/category/index.ts +31 -3
- package/src/tests/i18n_coverage.test.ts +36 -0
- package/src/tool/chromaticLens/i18n/de.ts +246 -0
- package/src/tool/chromaticLens/i18n/id.ts +246 -0
- package/src/tool/chromaticLens/i18n/it.ts +246 -0
- package/src/tool/chromaticLens/i18n/ja.ts +246 -0
- package/src/tool/chromaticLens/i18n/ko.ts +246 -0
- package/src/tool/chromaticLens/i18n/nl.ts +246 -0
- package/src/tool/chromaticLens/i18n/pl.ts +246 -0
- package/src/tool/chromaticLens/i18n/pt.ts +246 -0
- package/src/tool/chromaticLens/i18n/ru.ts +246 -0
- package/src/tool/chromaticLens/i18n/sv.ts +246 -0
- package/src/tool/chromaticLens/i18n/tr.ts +246 -0
- package/src/tool/chromaticLens/i18n/zh.ts +246 -0
- package/src/tool/chromaticLens/index.ts +15 -7
- package/src/tool/collageMaker/i18n/de.ts +233 -0
- package/src/tool/collageMaker/i18n/id.ts +233 -0
- package/src/tool/collageMaker/i18n/it.ts +233 -0
- package/src/tool/collageMaker/i18n/ja.ts +233 -0
- package/src/tool/collageMaker/i18n/ko.ts +233 -0
- package/src/tool/collageMaker/i18n/nl.ts +233 -0
- package/src/tool/collageMaker/i18n/pl.ts +233 -0
- package/src/tool/collageMaker/i18n/pt.ts +233 -0
- package/src/tool/collageMaker/i18n/ru.ts +233 -0
- package/src/tool/collageMaker/i18n/sv.ts +233 -0
- package/src/tool/collageMaker/i18n/tr.ts +233 -0
- package/src/tool/collageMaker/i18n/zh.ts +233 -0
- package/src/tool/collageMaker/index.ts +15 -6
- package/src/tool/exifCleaner/i18n/de.ts +277 -0
- package/src/tool/exifCleaner/i18n/fr.ts +1 -1
- package/src/tool/exifCleaner/i18n/id.ts +277 -0
- package/src/tool/exifCleaner/i18n/it.ts +277 -0
- package/src/tool/exifCleaner/i18n/ja.ts +277 -0
- package/src/tool/exifCleaner/i18n/ko.ts +277 -0
- package/src/tool/exifCleaner/i18n/nl.ts +277 -0
- package/src/tool/exifCleaner/i18n/pl.ts +277 -0
- package/src/tool/exifCleaner/i18n/pt.ts +277 -0
- package/src/tool/exifCleaner/i18n/ru.ts +277 -0
- package/src/tool/exifCleaner/i18n/sv.ts +277 -0
- package/src/tool/exifCleaner/i18n/tr.ts +277 -0
- package/src/tool/exifCleaner/i18n/zh.ts +277 -0
- package/src/tool/exifCleaner/index.ts +16 -8
- package/src/tool/imageCompressor/i18n/de.ts +242 -0
- package/src/tool/imageCompressor/i18n/en.ts +1 -1
- package/src/tool/imageCompressor/i18n/es.ts +1 -1
- package/src/tool/imageCompressor/i18n/id.ts +242 -0
- package/src/tool/imageCompressor/i18n/it.ts +242 -0
- package/src/tool/imageCompressor/i18n/ja.ts +242 -0
- package/src/tool/imageCompressor/i18n/ko.ts +242 -0
- package/src/tool/imageCompressor/i18n/nl.ts +242 -0
- package/src/tool/imageCompressor/i18n/pl.ts +242 -0
- package/src/tool/imageCompressor/i18n/pt.ts +242 -0
- package/src/tool/imageCompressor/i18n/ru.ts +242 -0
- package/src/tool/imageCompressor/i18n/sv.ts +242 -0
- package/src/tool/imageCompressor/i18n/tr.ts +242 -0
- package/src/tool/imageCompressor/i18n/zh.ts +244 -0
- package/src/tool/imageCompressor/index.ts +15 -7
- package/src/tool/printQualityCalculator/i18n/de.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/fr.ts +1 -1
- package/src/tool/printQualityCalculator/i18n/id.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/it.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/ja.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/ko.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/nl.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/pl.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/pt.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/ru.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/sv.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/tr.ts +261 -0
- package/src/tool/printQualityCalculator/i18n/zh.ts +261 -0
- package/src/tool/printQualityCalculator/index.ts +15 -7
- package/src/tool/privacyBlur/i18n/de.ts +238 -0
- package/src/tool/privacyBlur/i18n/id.ts +238 -0
- package/src/tool/privacyBlur/i18n/it.ts +238 -0
- package/src/tool/privacyBlur/i18n/ja.ts +238 -0
- package/src/tool/privacyBlur/i18n/ko.ts +238 -0
- package/src/tool/privacyBlur/i18n/nl.ts +238 -0
- package/src/tool/privacyBlur/i18n/pl.ts +238 -0
- package/src/tool/privacyBlur/i18n/pt.ts +238 -0
- package/src/tool/privacyBlur/i18n/ru.ts +238 -0
- package/src/tool/privacyBlur/i18n/sv.ts +238 -0
- package/src/tool/privacyBlur/i18n/tr.ts +238 -0
- package/src/tool/privacyBlur/i18n/zh.ts +238 -0
- package/src/tool/privacyBlur/index.ts +15 -7
- package/src/tool/subtitleSync/i18n/de.ts +241 -0
- package/src/tool/subtitleSync/i18n/fr.ts +5 -5
- package/src/tool/subtitleSync/i18n/id.ts +241 -0
- package/src/tool/subtitleSync/i18n/it.ts +241 -0
- package/src/tool/subtitleSync/i18n/ja.ts +241 -0
- package/src/tool/subtitleSync/i18n/ko.ts +241 -0
- package/src/tool/subtitleSync/i18n/nl.ts +241 -0
- package/src/tool/subtitleSync/i18n/pl.ts +241 -0
- package/src/tool/subtitleSync/i18n/pt.ts +241 -0
- package/src/tool/subtitleSync/i18n/ru.ts +241 -0
- package/src/tool/subtitleSync/i18n/sv.ts +241 -0
- package/src/tool/subtitleSync/i18n/tr.ts +241 -0
- package/src/tool/subtitleSync/i18n/zh.ts +241 -0
- package/src/tool/subtitleSync/index.ts +15 -7
- package/src/tool/timelapseCalculator/i18n/de.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/fr.ts +2 -2
- package/src/tool/timelapseCalculator/i18n/id.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/it.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/ja.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/ko.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/nl.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/pl.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/pt.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/ru.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/sv.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/tr.ts +169 -0
- package/src/tool/timelapseCalculator/i18n/zh.ts +169 -0
- package/src/tool/timelapseCalculator/index.ts +16 -8
- package/src/tool/tvDistance/i18n/de.ts +223 -0
- package/src/tool/tvDistance/i18n/id.ts +223 -0
- package/src/tool/tvDistance/i18n/it.ts +223 -0
- package/src/tool/tvDistance/i18n/ja.ts +223 -0
- package/src/tool/tvDistance/i18n/ko.ts +223 -0
- package/src/tool/tvDistance/i18n/nl.ts +223 -0
- package/src/tool/tvDistance/i18n/pl.ts +223 -0
- package/src/tool/tvDistance/i18n/pt.ts +223 -0
- package/src/tool/tvDistance/i18n/ru.ts +223 -0
- package/src/tool/tvDistance/i18n/sv.ts +223 -0
- package/src/tool/tvDistance/i18n/tr.ts +223 -0
- package/src/tool/tvDistance/i18n/zh.ts +223 -0
- package/src/tool/tvDistance/index.ts +15 -7
- package/src/tool/videoFrameExtractor/i18n/de.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/id.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/it.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/ja.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/ko.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/nl.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/pl.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/pt.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/ru.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/sv.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/tr.ts +235 -0
- package/src/tool/videoFrameExtractor/i18n/zh.ts +235 -0
- package/src/tool/videoFrameExtractor/index.ts +16 -8
|
@@ -0,0 +1,246 @@
|
|
|
1
|
+
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import type { ChromaticLensUI, ChromaticLensLocaleContent } from '../index';
|
|
3
|
+
|
|
4
|
+
const slug = 'chromatic-lens-online-renk-paleti-cikarma';
|
|
5
|
+
const title = 'Chromatic Lens: Online Renk Paleti Çıkarma';
|
|
6
|
+
const description = 'Herhangi bir görüntüden profesyonel renk paletlerini ücretsiz olarak çıkarın. Fotoğraflarınızdaki baskın renkleri matematiksel algoritmalar kullanarak belirleyin.';
|
|
7
|
+
|
|
8
|
+
const ui: ChromaticLensUI = {
|
|
9
|
+
dropTitle: "Renkleri Analiz Et",
|
|
10
|
+
dropSubtitle: "Kromatik DNA'sını çıkarmak için bir görüntüyü sürükleyin.",
|
|
11
|
+
processingLabel: "Palet çıkarılıyor...",
|
|
12
|
+
paletteTitle: "Çıkarılan Palet",
|
|
13
|
+
copyLabel: "HEX Kopyala",
|
|
14
|
+
copiedLabel: "Kopyalandı!",
|
|
15
|
+
colorCountLabel: "Renk sayısı",
|
|
16
|
+
changeImage: "Görüntüyü değiştir",
|
|
17
|
+
faqTitle: "Renk çıkarma hakkında sıkça sorulan sorular",
|
|
18
|
+
bibliographyTitle: "Kaynaklar ve teknik belgeler"
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
const faq: ChromaticLensLocaleContent['faq'] = [
|
|
22
|
+
{
|
|
23
|
+
question: "Renk çıkarma nasıl çalışır?",
|
|
24
|
+
answer: "En temsilci tonları bulmak için görüntü piksellerini RGB renk alanındaki yakınlıklarına göre gruplandıran 'Median Cut' algoritmasını kullanıyoruz.",
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: "Renkleri tasarım editörüme kopyalayabilir miyim?",
|
|
28
|
+
answer: "Evet, her renge tıkladığınızda HEX kodu otomatik olarak panonuza kopyalanır; Photoshop, Figma veya CSS'e yapıştırmaya hazırdır.",
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
question: "Hangi tür görüntüleri analiz edebilirim?",
|
|
32
|
+
answer: "Herhangi bir JPG, PNG veya WebP dosyası. İşleme yereldir, bu nedenle büyük görüntüler ağ verisi tüketmeden hızlı bir şekilde analiz edilir.",
|
|
33
|
+
},
|
|
34
|
+
];
|
|
35
|
+
|
|
36
|
+
const howTo: ChromaticLensLocaleContent['howTo'] = [
|
|
37
|
+
{
|
|
38
|
+
name: "Görüntüyü yükle",
|
|
39
|
+
text: "Kromatik ilham almak istediğiniz fotoğrafı yükleyin.",
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
name: "Hassasiyeti ayarla",
|
|
43
|
+
text: "Aracın kaç tane baskın renk belirlemesini istediğinizi seçin (3 ile 12 arası).",
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
name: "Sonucu analiz et",
|
|
47
|
+
text: "Palet, ilgili onaltılık (HEX) kodlarıyla birlikte anında görünecektir.",
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
name: "Kopyala ve kullan",
|
|
51
|
+
text: "Tonları kaydetmek ve tasarım projenize uygulamak için üzerlerine tıklayın.",
|
|
52
|
+
},
|
|
53
|
+
];
|
|
54
|
+
|
|
55
|
+
const bibliography: ChromaticLensLocaleContent['bibliography'] = [
|
|
56
|
+
{
|
|
57
|
+
name: "Median Cut Algorithm - Wikipedia",
|
|
58
|
+
url: "https://en.wikipedia.org/wiki/Median_cut",
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
name: "Tasarımcılar İçin Renk Teorisi",
|
|
62
|
+
url: "https://www.smashingmagazine.com/2010/01/color-theory-for-designers-part-1-the-meaning-of-color/",
|
|
63
|
+
},
|
|
64
|
+
];
|
|
65
|
+
|
|
66
|
+
const seo: ChromaticLensLocaleContent['seo'] = [
|
|
67
|
+
{
|
|
68
|
+
type: 'summary',
|
|
69
|
+
title: 'Akıllı Renk Paleti Çıkarma',
|
|
70
|
+
items: [
|
|
71
|
+
'Renk analizi için profesyonel Median Cut algoritması',
|
|
72
|
+
'Herhangi bir görüntüden 3-12 baskın rengi çıkarın',
|
|
73
|
+
'Doğrudan panoya kopyalanabilir HEX kodları',
|
|
74
|
+
'%100 yerel işleme - yaratıcılar için ideal'
|
|
75
|
+
]
|
|
76
|
+
},
|
|
77
|
+
{ type: 'title', text: 'Renk Paleti Çıkarma: Bilim ve Tasarım', level: 2 },
|
|
78
|
+
{ type: 'paragraph', html: 'Bir film karesinin neden bu kadar uyumlu göründüğünü hiç merak ettiniz mi? Bu bir tesadüf değil; iş başındaki renk teorisidir. Chromatic Lens, bu uyumu doğrudan pikselden çıkarmanıza ve tasarım projelerinizde kullanılabilir HEX kodlarına dönüştürmenize olanak tanır.' },
|
|
79
|
+
|
|
80
|
+
{ type: 'stats', items: [
|
|
81
|
+
{ value: 'Anında', label: 'Renk Analizi', icon: 'mdi:lightning-bolt' },
|
|
82
|
+
{ value: '%100', label: 'Yerel Gizlilik', icon: 'mdi:lock' },
|
|
83
|
+
{ value: 'RGB', label: 'Hassas Renk Alanı', icon: 'mdi:palette' }
|
|
84
|
+
], columns: 3 },
|
|
85
|
+
|
|
86
|
+
{ type: 'title', text: 'Median Cut Algoritması Açıklaması', level: 3 },
|
|
87
|
+
{ type: 'paragraph', html: 'Akıllı palet çıkarma, piksellerin basit bir rastgele örneklemesi değildir. Sadık bir temsil sağlayan özyinelemeli bir bölümleme tekniği olan Median Cut algoritmasını kullanır:' },
|
|
88
|
+
{ type: 'list', items: [
|
|
89
|
+
'<strong>Özyinelemeli Bölme:</strong> Görüntünün RGB \"renk küpü\" özyinelemeli olarak daha küçük kutulara bölünür.',
|
|
90
|
+
'<strong>Hacim Dengesi:</strong> Her bölüm, benzer hacimlere sahip aynı renk alanındaki pikselleri gruplandırmaya çalışır.',
|
|
91
|
+
'<strong>Ağırlıklı Ortalama:</strong> Her kutunun ortaya çıkan rengi, içerdiği tüm piksellerin ortalamasıdır.',
|
|
92
|
+
'<strong>Sadık Temsil:</strong> Baskın renkler, basit bir örneklemi değil, görüntünün gerçek görsel atmosferini yansıtır.'
|
|
93
|
+
], icon: 'mdi:check' },
|
|
94
|
+
|
|
95
|
+
{ type: 'card', title: 'Yaratıcı İş Akışı', html: 'Arayüzlerine, illüstrasyonlarına veya marka paletlerine uygulamak için bir fotoğrafın, filmin veya görsel referansın görsel özünü anında yakalamak isteyen web geliştiricileri, UX/UI tasarımcıları, dijital sanatçılar ve yaratıcılar için idealdir.' },
|
|
96
|
+
|
|
97
|
+
{ type: 'title', text: 'Dijital Tasarımda Kullanım Durumları', level: 3 },
|
|
98
|
+
{ type: 'comparative', items: [
|
|
99
|
+
{
|
|
100
|
+
title: 'UX/UI Tasarımcıları',
|
|
101
|
+
description: 'Uyumlu arayüzler oluşturmak için hero görsellerinden paletler çıkarın',
|
|
102
|
+
icon: 'mdi:palette',
|
|
103
|
+
points: [
|
|
104
|
+
'Uyumlu arka plan renkleri',
|
|
105
|
+
'Düğmeler ve ikincil öğeler',
|
|
106
|
+
'Otomatik olarak hesaplanan kontrast'
|
|
107
|
+
]
|
|
108
|
+
},
|
|
109
|
+
{
|
|
110
|
+
title: 'Web Geliştiricileri',
|
|
111
|
+
description: 'Doğrudan görsel referanslardan CSS stil sayfaları oluşturun',
|
|
112
|
+
icon: 'mdi:code-braces',
|
|
113
|
+
points: [
|
|
114
|
+
'HEX kodlarını doğrudan CSS\'e kopyalayın',
|
|
115
|
+
'SCSS/CSS\'de renk değişkenleri oluşturun',
|
|
116
|
+
'Önceden tasarım yapmadan uyumlu temalar'
|
|
117
|
+
],
|
|
118
|
+
highlight: true
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
title: 'Dijital Sanatçılar ve İllüstratörler',
|
|
122
|
+
description: 'Filmlerden, doğadan veya sanattan kromatik referanslar yakalayın',
|
|
123
|
+
icon: 'mdi:brush',
|
|
124
|
+
points: [
|
|
125
|
+
'Usta yapıtlardan referans paletleri',
|
|
126
|
+
'Sinematik renk çalışmaları',
|
|
127
|
+
'Anında görsel ilham'
|
|
128
|
+
]
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
title: 'Marka Uzmanları',
|
|
132
|
+
description: 'Rehber fotoğraflara dayalı görsel kimlikler geliştirin',
|
|
133
|
+
icon: 'mdi:tag-multiple',
|
|
134
|
+
points: [
|
|
135
|
+
'Görsellerden marka renklerini çıkarın',
|
|
136
|
+
'Profesyonel kromatik kılavuzlar oluşturun',
|
|
137
|
+
'Görsel tutarlılığı sağlayın'
|
|
138
|
+
]
|
|
139
|
+
}
|
|
140
|
+
], columns: 2 },
|
|
141
|
+
|
|
142
|
+
{ type: 'title', text: 'Uygulamalı Renk Teorisi', level: 3 },
|
|
143
|
+
{ type: 'table', headers: ['Renk Kavramı', 'Tanım', 'Pratik Uygulama'], rows: [
|
|
144
|
+
['Kromatik Uyum', 'Görsel olarak dengeli renk kombinasyonu', 'UI\'da tutarlı görsel kimlik'],
|
|
145
|
+
['Kontrast', 'Renkler arasındaki parlaklık farkı', 'Okunabilirlik ve görsel hiyerarşi'],
|
|
146
|
+
['Doygunluk', 'Bir tonun renk yoğunluğu', 'Profesyonellik (düşük) vs Enerji (yüksek)'],
|
|
147
|
+
['Renk Sıcaklığı', 'Sıcak renkler (kırmızılar) vs soğuk renkler (maviler)', 'Tasarımın duygusal psikolojisi'],
|
|
148
|
+
['Monokromatik Palet', 'Tek bir tonun varyasyonları', 'Zerafet ve minimalizm']
|
|
149
|
+
] },
|
|
150
|
+
|
|
151
|
+
{ type: 'proscons', items: [
|
|
152
|
+
{
|
|
153
|
+
pro: 'Çıkarmada matematiksel hassasiyet - yaklaşık bir görsel seçim değil',
|
|
154
|
+
con: 'Çok fazla piksele sahiplerse zar zor görünen renkler dahil edilebilir'
|
|
155
|
+
},
|
|
156
|
+
{
|
|
157
|
+
pro: 'Anında panoya kopyalama - iş akışıyla mükemmel entegrasyon',
|
|
158
|
+
con: 'Canvas API ile uyumlu modern bir tarayıcı gerektirir'
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
pro: 'Tam gizlilik - veri gönderimi olmadan %100 yerel analiz',
|
|
162
|
+
con: 'Önceki analizlerin geçmişi kaydedilmez'
|
|
163
|
+
},
|
|
164
|
+
{
|
|
165
|
+
pro: 'Herhangi bir dijital görüntü formatıyla uyumlu',
|
|
166
|
+
con: 'Son renkler görüntü sıkıştırmasına ve kalitesine bağlıdır'
|
|
167
|
+
}
|
|
168
|
+
], proTitle: 'Avantajlar', conTitle: 'Sınırlamalar' },
|
|
169
|
+
|
|
170
|
+
{ type: 'diagnostic', variant: 'success', title: 'Gerçekçi Renk Temsili', icon: 'mdi:check-circle-outline', badge: 'Gelişmiş Algoritma', html: 'Sadece rastgele piksellerden örnek alan araçların aksine, sistemimiz her tonun tüm piksel sayısını ağırlıklandıran Median Cut algoritmasını kullanır ve ortaya çıkan paletin orijinal görüntünün görsel atmosferini ve renk psikolojisini sadık bir şekilde yansıtmasını sağlar.' },
|
|
171
|
+
|
|
172
|
+
{ type: 'glossary', items: [
|
|
173
|
+
{
|
|
174
|
+
term: 'Median Cut',
|
|
175
|
+
definition: 'RGB alanını özyinelemeli olarak kutulara bölen, tek tip dağılım sağlayan renk niceleme algoritması. Tarihsel olarak GIF ve indeksli renk teknolojisinde kullanılmıştır.'
|
|
176
|
+
},
|
|
177
|
+
{
|
|
178
|
+
term: 'RGB Renk Alanı',
|
|
179
|
+
definition: 'Kırmızı, yeşil ve maviye dayalı renk modeli. Her renk bu üç değerin (0-255) kombinasyonu olarak temsil edilir. Dijital ekranlarda ve webde standarttır.'
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
term: 'HEX Kodu',
|
|
183
|
+
definition: 'Web\'de rengi temsil eden 6 haneli onaltılık gösterim (#RRGGBB): #FF0000 (kırmızı), #00FF00 (yeşil), #0000FF (mavi). CSS, Figma ve Adobe\'da evrenseldir.'
|
|
184
|
+
},
|
|
185
|
+
{
|
|
186
|
+
term: 'Renk Doygunluğu',
|
|
187
|
+
definition: 'Rengin yoğunluğu veya saflığı. Yüksek doygunluk = canlı renk; düşük doygunluk = grimsi renk. Tasarımın duygusal algısını etkiler.'
|
|
188
|
+
},
|
|
189
|
+
{
|
|
190
|
+
term: 'Kromatik Uyum',
|
|
191
|
+
definition: 'Görsel olarak hoş bir sonuç veren renklerin seçimi ve kombinasyonu. Monokromatik, tamamlayıcı, benzer veya üçlü olabilir.'
|
|
192
|
+
}
|
|
193
|
+
] },
|
|
194
|
+
|
|
195
|
+
{ type: 'message', title: 'Profesyonel Kromatik Analiz', ariaLabel: 'Renk analizi hakkında teknik bilgiler', html: 'Chromatic Lens, manuel görsel analizi algoritmik hassasiyete dönüştürür. Sadece renkleri çıkarmaz: Herhangi bir görüntünün duygusal ve görsel özünü yakalayarak doğrudan kullanıma hazır HEX kodları olarak panonuza koyar. Tam gizlilik, analiz hacminde sınır yok.' },
|
|
196
|
+
|
|
197
|
+
{ type: 'title', text: 'Görsel İlhamdan Tasarım', level: 3 },
|
|
198
|
+
{ type: 'paragraph', html: 'En iyi renk paleti, referansınızın görsel niyetini yakalayan palettir. Chromatic Lens, eskiden manuel bir süreç olan gözlemleme, analiz etme ve not etme aşamalarını otomatikleştirir. Artık sadece bir görüntüyü sürükleyin ve saniyeler içinde profesyonel HEX kodları alın.' }
|
|
199
|
+
];
|
|
200
|
+
|
|
201
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
202
|
+
'@context': 'https://schema.org',
|
|
203
|
+
'@type': 'FAQPage',
|
|
204
|
+
mainEntity: faq.map((item) => ({
|
|
205
|
+
'@type': 'Question',
|
|
206
|
+
name: item.question,
|
|
207
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
208
|
+
})),
|
|
209
|
+
};
|
|
210
|
+
|
|
211
|
+
const howToSchema: WithContext<HowTo> = {
|
|
212
|
+
'@context': 'https://schema.org',
|
|
213
|
+
'@type': 'HowTo',
|
|
214
|
+
name: title,
|
|
215
|
+
description,
|
|
216
|
+
step: howTo.map((step) => ({
|
|
217
|
+
'@type': 'HowToStep',
|
|
218
|
+
name: step.name,
|
|
219
|
+
text: step.text,
|
|
220
|
+
})),
|
|
221
|
+
};
|
|
222
|
+
|
|
223
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
224
|
+
'@context': 'https://schema.org',
|
|
225
|
+
'@type': 'SoftwareApplication',
|
|
226
|
+
name: title,
|
|
227
|
+
description,
|
|
228
|
+
applicationCategory: 'UtilitiesApplication',
|
|
229
|
+
operatingSystem: 'Web',
|
|
230
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
231
|
+
inLanguage: 'tr',
|
|
232
|
+
};
|
|
233
|
+
|
|
234
|
+
export const content: ChromaticLensLocaleContent = {
|
|
235
|
+
slug,
|
|
236
|
+
title,
|
|
237
|
+
description,
|
|
238
|
+
ui,
|
|
239
|
+
seo,
|
|
240
|
+
faqTitle: "Sıkça Sorulan Sorular",
|
|
241
|
+
faq,
|
|
242
|
+
bibliographyTitle: "Referanslar",
|
|
243
|
+
bibliography,
|
|
244
|
+
howTo,
|
|
245
|
+
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
246
|
+
};
|
|
@@ -0,0 +1,246 @@
|
|
|
1
|
+
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import type { ChromaticLensUI, ChromaticLensLocaleContent } from '../index';
|
|
3
|
+
|
|
4
|
+
const slug = 'chromatic-lens-color-palette-extraction-online';
|
|
5
|
+
const title = 'Chromatic Lens: 在线色彩探针与调色盘提取工具';
|
|
6
|
+
const description = '免费从任何图像中提取专业的调色盘。使用数学算法识别照片中的主导色彩。';
|
|
7
|
+
|
|
8
|
+
const ui: ChromaticLensUI = {
|
|
9
|
+
dropTitle: "解析色彩",
|
|
10
|
+
dropSubtitle: "拖入图像以提取其色彩 DNA。",
|
|
11
|
+
processingLabel: "正在提取调色盘...",
|
|
12
|
+
paletteTitle: "提取的调色盘",
|
|
13
|
+
copyLabel: "复制 HEX",
|
|
14
|
+
copiedLabel: "已复制!",
|
|
15
|
+
colorCountLabel: "色彩数量",
|
|
16
|
+
changeImage: "更改图像",
|
|
17
|
+
faqTitle: "关于色彩提取的常见问题",
|
|
18
|
+
bibliographyTitle: "资源与技术文档"
|
|
19
|
+
};
|
|
20
|
+
|
|
21
|
+
const faq: ChromaticLensLocaleContent['faq'] = [
|
|
22
|
+
{
|
|
23
|
+
question: "色彩提取是如何工作的?",
|
|
24
|
+
answer: "我们使用“中位切分”(Median Cut)算法。该算法根据图像像素在 RGB 色彩空间中的接近程度进行分组,从而找到最具代表性的色调。",
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: "我可以将颜色复制到我的设计编辑器吗?",
|
|
28
|
+
answer: "是的,通过点击每种颜色,HEX 代码将自动复制到您的剪贴板,方便您将其粘贴到 Photoshop、Figma 或 CSS 中。",
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
question: "我可以解析哪些类型的图像?",
|
|
32
|
+
answer: "支持任何 JPG、PNG 或 WebP 文件。解析过程在本地完成,因此即使是大图像也能快速解析,且不消耗网络流量。",
|
|
33
|
+
},
|
|
34
|
+
];
|
|
35
|
+
|
|
36
|
+
const howTo: ChromaticLensLocaleContent['howTo'] = [
|
|
37
|
+
{
|
|
38
|
+
name: "上传图像",
|
|
39
|
+
text: "上传您想要从中提取色彩灵感的照片。",
|
|
40
|
+
},
|
|
41
|
+
{
|
|
42
|
+
name: "调整精度",
|
|
43
|
+
text: "选择您希望工具识别的主导色彩数量(从 3 到 12 种)。",
|
|
44
|
+
},
|
|
45
|
+
{
|
|
46
|
+
name: "解析结果",
|
|
47
|
+
text: "调色盘将立即显示,并附带相应的十六进制 (HEX) 代码。",
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
name: "复制并使用",
|
|
51
|
+
text: "点击色调以保存它们并将其应用到您的设计项目中。",
|
|
52
|
+
},
|
|
53
|
+
];
|
|
54
|
+
|
|
55
|
+
const bibliography: ChromaticLensLocaleContent['bibliography'] = [
|
|
56
|
+
{
|
|
57
|
+
name: "中位切分算法 - 维基百科",
|
|
58
|
+
url: "https://zh.wikipedia.org/wiki/%E4%B8%AD%E5%80%BC%E5%88%87%E5%88%86%E7%AE%97%E6%B3%95",
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
name: "设计师色彩理论",
|
|
62
|
+
url: "https://www.smashingmagazine.com/2010/01/color-theory-for-designers-part-1-the-meaning-of-color/",
|
|
63
|
+
},
|
|
64
|
+
];
|
|
65
|
+
|
|
66
|
+
const seo: ChromaticLensLocaleContent['seo'] = [
|
|
67
|
+
{
|
|
68
|
+
type: 'summary',
|
|
69
|
+
title: '智能色彩探针与提取',
|
|
70
|
+
items: [
|
|
71
|
+
'专业的 Median Cut 色彩解析算法',
|
|
72
|
+
'从任何图像中提取 3-12 种主导色彩',
|
|
73
|
+
'HEX 代码可直接克隆到剪贴板',
|
|
74
|
+
'100% 本地处理 - 创意人士的理想选择'
|
|
75
|
+
]
|
|
76
|
+
},
|
|
77
|
+
{ type: 'title', text: '色彩提取:科学与设计的交汇', level: 2 },
|
|
78
|
+
{ type: 'paragraph', html: '您是否曾纳闷为什么一张电影截图看起来如此和谐?这并非巧合,而是色彩理论在起作用。Chromatic Lens 让您可以直接从像素中提取那种和谐美,并将其转换为可在您的设计项目中使用的 HEX 代码。' },
|
|
79
|
+
|
|
80
|
+
{ type: 'stats', items: [
|
|
81
|
+
{ value: '即时', label: '色彩解析', icon: 'mdi:lightning-bolt' },
|
|
82
|
+
{ value: '100%', label: '本地隐私', icon: 'mdi:lock' },
|
|
83
|
+
{ value: 'RGB', label: '精准色彩空间', icon: 'mdi:palette' }
|
|
84
|
+
], columns: 3 },
|
|
85
|
+
|
|
86
|
+
{ type: 'title', text: '中位切分算法详解', level: 3 },
|
|
87
|
+
{ type: 'paragraph', html: '智能调色盘提取并非简单的随机采样。它使用中位切分(Median Cut)算法,这是一种确保忠实呈现的递归切分技术:' },
|
|
88
|
+
{ type: 'list', items: [
|
|
89
|
+
'<strong>递归细分:</strong> 图像的 RGB “色彩立方体”被递归地细分为更小的方块。',
|
|
90
|
+
'<strong>体积平衡:</strong> 每个分区都力求将色彩空间中体积相似的像素归为一类。',
|
|
91
|
+
'<strong>加权平均:</strong> 每个方块最终产生的颜色是其包含的所有像素的平均值。',
|
|
92
|
+
'<strong>忠实呈现:</strong> 主导色彩反映了图像真实的视觉氛围,而不仅仅是简单的样本。'
|
|
93
|
+
], icon: 'mdi:check' },
|
|
94
|
+
|
|
95
|
+
{ type: 'card', title: '创意工作流', html: '非常适合网页开发者、UX/UI 设计师、数字艺术家以及希望立即捕捉照片、电影或视觉参考的视觉精髓并将其应用于界面、插画或品牌配色方案的创意人士。' },
|
|
96
|
+
|
|
97
|
+
{ type: 'title', text: '数字设计中的应用场景', level: 3 },
|
|
98
|
+
{ type: 'comparative', items: [
|
|
99
|
+
{
|
|
100
|
+
title: 'UX/UI 设计师',
|
|
101
|
+
description: '从画轴图像中提取配色以创建具有凝聚力的界面',
|
|
102
|
+
icon: 'mdi:palette',
|
|
103
|
+
points: [
|
|
104
|
+
'和谐的背景色',
|
|
105
|
+
'按钮和次要元素配色',
|
|
106
|
+
'自动计算的对比度'
|
|
107
|
+
]
|
|
108
|
+
},
|
|
109
|
+
{
|
|
110
|
+
title: '网页开发者',
|
|
111
|
+
description: '直接根据视觉参考创建 CSS 样式表',
|
|
112
|
+
icon: 'mdi:code-braces',
|
|
113
|
+
points: [
|
|
114
|
+
'将 HEX 直接复制到 CSS',
|
|
115
|
+
'SCSS/CSS 中的颜色变量',
|
|
116
|
+
'无需预先设计即可实现配色统一的主题'
|
|
117
|
+
],
|
|
118
|
+
highlight: true
|
|
119
|
+
},
|
|
120
|
+
{
|
|
121
|
+
title: '数字艺术家与插画师',
|
|
122
|
+
description: '从电影、大自然或艺术作品中获取色彩参考',
|
|
123
|
+
icon: 'mdi:brush',
|
|
124
|
+
points: [
|
|
125
|
+
'从大师作品中提取参考配色',
|
|
126
|
+
'电影色彩研究',
|
|
127
|
+
'即时的视觉灵感'
|
|
128
|
+
]
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
title: '品牌专家',
|
|
132
|
+
description: '基于指导性照片开发视觉识别系统',
|
|
133
|
+
icon: 'mdi:tag-multiple',
|
|
134
|
+
points: [
|
|
135
|
+
'从图像中提取品牌色彩',
|
|
136
|
+
'制作专业的色彩指南',
|
|
137
|
+
'确保视觉一致性'
|
|
138
|
+
]
|
|
139
|
+
}
|
|
140
|
+
], columns: 2 },
|
|
141
|
+
|
|
142
|
+
{ type: 'title', text: '应用色彩理论', level: 3 },
|
|
143
|
+
{ type: 'table', headers: ['色彩概念', '定义', '实际应用'], rows: [
|
|
144
|
+
['色彩和谐', '视觉上平衡的色彩组合', 'UI 中具有凝聚力的视觉身份'],
|
|
145
|
+
['对比度', '色彩之间的亮度差异', '可读性和视觉层级'],
|
|
146
|
+
['饱和度', '色调的色彩强度', '专业感(低饱和)对比 活力感(高饱和)'],
|
|
147
|
+
['色温', '暖色(红系)对比 冷色(蓝系)', '设计的感性心理学'],
|
|
148
|
+
['单色配色', '单一色调的变化', '高雅与极简主义']
|
|
149
|
+
] },
|
|
150
|
+
|
|
151
|
+
{ type: 'proscons', items: [
|
|
152
|
+
{
|
|
153
|
+
pro: '精准的数学提取 - 而非大约的视觉选择',
|
|
154
|
+
con: '如果包含大量像素,极不明显的颜色也可能被选中'
|
|
155
|
+
},
|
|
156
|
+
{
|
|
157
|
+
pro: '即时复制到剪贴板 - 与工作流完美集成',
|
|
158
|
+
con: '需要支持 Canvas API 的现代浏览器'
|
|
159
|
+
},
|
|
160
|
+
{
|
|
161
|
+
pro: '完全隐私 - 100% 本地解析,不提交任何数据',
|
|
162
|
+
con: '不保存之前的解析历史'
|
|
163
|
+
},
|
|
164
|
+
{
|
|
165
|
+
pro: '兼容任何数字图像格式',
|
|
166
|
+
con: '最终色彩效果取决于图像的压缩程度和质量'
|
|
167
|
+
}
|
|
168
|
+
], proTitle: '优势', conTitle: '局限性' },
|
|
169
|
+
|
|
170
|
+
{ type: 'diagnostic', variant: 'success', title: '真实的色彩呈现', icon: 'mdi:check-circle-outline', badge: '先进算法', html: '与简单随机采样像素的工具不同,我们的系统使用中位切分算法,对每个色调的完整像素计数进行加权,确保生成的调色盘能忠实地反映原始图像的视觉氛围和色彩心理。' },
|
|
171
|
+
|
|
172
|
+
{ type: 'glossary', items: [
|
|
173
|
+
{
|
|
174
|
+
term: '中位切分',
|
|
175
|
+
definition: '色彩量化算法,通过递归地将 RGB 空间细分为方块来确保均匀分布。历史上曾用于 GIF 和索引色彩技术。'
|
|
176
|
+
},
|
|
177
|
+
{
|
|
178
|
+
term: 'RGB 色彩空间',
|
|
179
|
+
definition: '基于红、绿、蓝的色彩模型。每种颜色表示为这三个数值(0-255)的组合。数字屏幕和网页的标准。'
|
|
180
|
+
},
|
|
181
|
+
{
|
|
182
|
+
term: 'HEX 代码',
|
|
183
|
+
definition: '网页上表示颜色的 6 位十六进制记法(#RRGGBB):#FF0000(红)、#00FF00(绿)、#0000FF(蓝)。在 CSS、Figma 和 Adobe 软件中通用。'
|
|
184
|
+
},
|
|
185
|
+
{
|
|
186
|
+
term: '色彩饱和度',
|
|
187
|
+
definition: '颜色的强度或纯度。高饱和度 = 鲜艳;低饱和度 = 偏灰。影响设计的感性认知。'
|
|
188
|
+
},
|
|
189
|
+
{
|
|
190
|
+
term: '色彩和谐',
|
|
191
|
+
definition: '选择和组合色彩以产生视觉上愉悦的结果。可以是单色、补色、类比色或三等分配色。'
|
|
192
|
+
}
|
|
193
|
+
] },
|
|
194
|
+
|
|
195
|
+
{ type: 'message', title: '专业的色彩解析', ariaLabel: '关于色彩解析的技术信息', html: 'Chromatic Lens 将手动视觉解析转化为算法精度。它不仅提取色彩:它捕捉任何图像的感性与视觉精髓,并将其作为即用型 HEX 代码直接放在您的剪贴板上。完全隐私,不限解析量。' },
|
|
196
|
+
|
|
197
|
+
{ type: 'title', text: '源自视觉灵感的设计', level: 3 },
|
|
198
|
+
{ type: 'paragraph', html: '最好的调色盘是能捕捉到参考物视觉意图的调色盘。Chromatic Lens 将过去需要手动操作的过程(观察、解析、记录)自动化了。现在,只需拖入一张图像,即可在几秒钟内获得专业的 HEX 代码。' }
|
|
199
|
+
];
|
|
200
|
+
|
|
201
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
202
|
+
'@context': 'https://schema.org',
|
|
203
|
+
'@type': 'FAQPage',
|
|
204
|
+
mainEntity: faq.map((item) => ({
|
|
205
|
+
'@type': 'Question',
|
|
206
|
+
name: item.question,
|
|
207
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
208
|
+
})),
|
|
209
|
+
};
|
|
210
|
+
|
|
211
|
+
const howToSchema: WithContext<HowTo> = {
|
|
212
|
+
'@context': 'https://schema.org',
|
|
213
|
+
'@type': 'HowTo',
|
|
214
|
+
name: title,
|
|
215
|
+
description,
|
|
216
|
+
step: howTo.map((step) => ({
|
|
217
|
+
'@type': 'HowToStep',
|
|
218
|
+
name: step.name,
|
|
219
|
+
text: step.text,
|
|
220
|
+
})),
|
|
221
|
+
};
|
|
222
|
+
|
|
223
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
224
|
+
'@context': 'https://schema.org',
|
|
225
|
+
'@type': 'SoftwareApplication',
|
|
226
|
+
name: title,
|
|
227
|
+
description,
|
|
228
|
+
applicationCategory: 'UtilitiesApplication',
|
|
229
|
+
operatingSystem: 'Web',
|
|
230
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
231
|
+
inLanguage: 'zh',
|
|
232
|
+
};
|
|
233
|
+
|
|
234
|
+
export const content: ChromaticLensLocaleContent = {
|
|
235
|
+
slug,
|
|
236
|
+
title,
|
|
237
|
+
description,
|
|
238
|
+
ui,
|
|
239
|
+
seo,
|
|
240
|
+
faqTitle: "常见问题",
|
|
241
|
+
faq,
|
|
242
|
+
bibliographyTitle: "参考资料",
|
|
243
|
+
bibliography,
|
|
244
|
+
howTo,
|
|
245
|
+
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
246
|
+
};
|
|
@@ -16,10 +16,6 @@ export interface ChromaticLensUI {
|
|
|
16
16
|
|
|
17
17
|
export type ChromaticLensLocaleContent = ToolLocaleContent<ChromaticLensUI>;
|
|
18
18
|
|
|
19
|
-
import { content as es } from './i18n/es';
|
|
20
|
-
import { content as en } from './i18n/en';
|
|
21
|
-
import { content as fr } from './i18n/fr';
|
|
22
|
-
|
|
23
19
|
export const chromaticLens: AudiovisualToolEntry<ChromaticLensUI> = {
|
|
24
20
|
id: 'lente-cromatica',
|
|
25
21
|
icons: {
|
|
@@ -27,9 +23,21 @@ export const chromaticLens: AudiovisualToolEntry<ChromaticLensUI> = {
|
|
|
27
23
|
fg: 'mdi:eye-outline',
|
|
28
24
|
},
|
|
29
25
|
i18n: {
|
|
30
|
-
es: async () => es as unknown as ChromaticLensLocaleContent,
|
|
31
|
-
en: async () => en as unknown as ChromaticLensLocaleContent,
|
|
32
|
-
fr: async () => fr as unknown as ChromaticLensLocaleContent,
|
|
26
|
+
es: async () => (await import('./i18n/es')).content as unknown as ChromaticLensLocaleContent,
|
|
27
|
+
en: async () => (await import('./i18n/en')).content as unknown as ChromaticLensLocaleContent,
|
|
28
|
+
fr: async () => (await import('./i18n/fr')).content as unknown as ChromaticLensLocaleContent,
|
|
29
|
+
de: async () => (await import('./i18n/de')).content as unknown as ChromaticLensLocaleContent,
|
|
30
|
+
it: async () => (await import('./i18n/it')).content as unknown as ChromaticLensLocaleContent,
|
|
31
|
+
pt: async () => (await import('./i18n/pt')).content as unknown as ChromaticLensLocaleContent,
|
|
32
|
+
id: async () => (await import('./i18n/id')).content as unknown as ChromaticLensLocaleContent,
|
|
33
|
+
ja: async () => (await import('./i18n/ja')).content as unknown as ChromaticLensLocaleContent,
|
|
34
|
+
ko: async () => (await import('./i18n/ko')).content as unknown as ChromaticLensLocaleContent,
|
|
35
|
+
nl: async () => (await import('./i18n/nl')).content as unknown as ChromaticLensLocaleContent,
|
|
36
|
+
pl: async () => (await import('./i18n/pl')).content as unknown as ChromaticLensLocaleContent,
|
|
37
|
+
ru: async () => (await import('./i18n/ru')).content as unknown as ChromaticLensLocaleContent,
|
|
38
|
+
sv: async () => (await import('./i18n/sv')).content as unknown as ChromaticLensLocaleContent,
|
|
39
|
+
tr: async () => (await import('./i18n/tr')).content as unknown as ChromaticLensLocaleContent,
|
|
40
|
+
zh: async () => (await import('./i18n/zh')).content as unknown as ChromaticLensLocaleContent,
|
|
33
41
|
},
|
|
34
42
|
};
|
|
35
43
|
|