@jjlmoya/utils-creative 1.20.0 → 1.22.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 +4 -2
- package/src/category/i18n/de.ts +1 -1
- package/src/category/i18n/ru.ts +1 -1
- package/src/data.ts +2 -1
- package/src/entries.ts +3 -1
- package/src/index.ts +3 -0
- package/src/layouts/PreviewLayout.astro +7 -2
- package/src/tests/diacritics_density.test.ts +118 -0
- package/src/tests/inverted_punctuation.test.ts +84 -0
- package/src/tests/locale_completeness.test.ts +2 -14
- package/src/tests/no_en_dash.test.ts +70 -0
- package/src/tests/pagespeed_best_practices.test.ts +198 -0
- package/src/tests/script_density.test.ts +94 -0
- package/src/tests/tool_validation.test.ts +2 -2
- package/src/tool/bead-pattern-generator/bibliography.astro +2 -12
- package/src/tool/bead-pattern-generator/bibliography.ts +5 -0
- package/src/tool/bead-pattern-generator/component.astro +2 -2
- package/src/tool/bead-pattern-generator/entry.ts +0 -1
- package/src/tool/bead-pattern-generator/i18n/de.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/en.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/es.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/fr.ts +5 -9
- package/src/tool/bead-pattern-generator/i18n/id.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/it.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/ja.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/ko.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/nl.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/pl.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/pt.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/ru.ts +8 -12
- package/src/tool/bead-pattern-generator/i18n/sv.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/tr.ts +4 -8
- package/src/tool/bead-pattern-generator/i18n/zh.ts +7 -11
- package/src/tool/dice-roller/bibliography.astro +3 -12
- package/src/tool/dice-roller/bibliography.ts +5 -0
- package/src/tool/dice-roller/entry.ts +0 -1
- package/src/tool/dice-roller/i18n/de.ts +12 -16
- package/src/tool/dice-roller/i18n/en.ts +12 -16
- package/src/tool/dice-roller/i18n/es.ts +11 -15
- package/src/tool/dice-roller/i18n/fr.ts +18 -22
- package/src/tool/dice-roller/i18n/id.ts +12 -16
- package/src/tool/dice-roller/i18n/it.ts +11 -15
- package/src/tool/dice-roller/i18n/ja.ts +9 -13
- package/src/tool/dice-roller/i18n/ko.ts +10 -14
- package/src/tool/dice-roller/i18n/nl.ts +12 -16
- package/src/tool/dice-roller/i18n/pl.ts +11 -15
- package/src/tool/dice-roller/i18n/pt.ts +12 -16
- package/src/tool/dice-roller/i18n/ru.ts +18 -22
- package/src/tool/dice-roller/i18n/sv.ts +12 -16
- package/src/tool/dice-roller/i18n/tr.ts +10 -14
- package/src/tool/dice-roller/i18n/zh.ts +16 -20
- package/src/tool/excuse-generator/bibliography.astro +2 -12
- package/src/tool/excuse-generator/bibliography.ts +3 -0
- package/src/tool/excuse-generator/entry.ts +0 -1
- package/src/tool/excuse-generator/i18n/de.ts +7 -9
- package/src/tool/excuse-generator/i18n/en.ts +2 -4
- package/src/tool/excuse-generator/i18n/es.ts +2 -4
- package/src/tool/excuse-generator/i18n/fr.ts +4 -6
- package/src/tool/excuse-generator/i18n/id.ts +2 -4
- package/src/tool/excuse-generator/i18n/it.ts +2 -4
- package/src/tool/excuse-generator/i18n/ja.ts +2 -4
- package/src/tool/excuse-generator/i18n/ko.ts +2 -4
- package/src/tool/excuse-generator/i18n/nl.ts +2 -4
- package/src/tool/excuse-generator/i18n/pl.ts +7 -9
- package/src/tool/excuse-generator/i18n/pt.ts +2 -4
- package/src/tool/excuse-generator/i18n/ru.ts +7 -9
- package/src/tool/excuse-generator/i18n/sv.ts +2 -4
- package/src/tool/excuse-generator/i18n/tr.ts +2 -4
- package/src/tool/excuse-generator/i18n/zh.ts +9 -11
- package/src/tool/fortune-cookie/bibliography.astro +2 -12
- package/src/tool/fortune-cookie/bibliography.ts +3 -0
- package/src/tool/fortune-cookie/component.astro +7 -10
- package/src/tool/fortune-cookie/entry.ts +0 -1
- package/src/tool/fortune-cookie/i18n/de.ts +6 -9
- package/src/tool/fortune-cookie/i18n/en.ts +6 -9
- package/src/tool/fortune-cookie/i18n/es.ts +2 -4
- package/src/tool/fortune-cookie/i18n/fr.ts +7 -10
- package/src/tool/fortune-cookie/i18n/id.ts +6 -9
- package/src/tool/fortune-cookie/i18n/it.ts +3 -6
- package/src/tool/fortune-cookie/i18n/ja.ts +2 -5
- package/src/tool/fortune-cookie/i18n/ko.ts +2 -5
- package/src/tool/fortune-cookie/i18n/nl.ts +6 -9
- package/src/tool/fortune-cookie/i18n/pl.ts +6 -9
- package/src/tool/fortune-cookie/i18n/pt.ts +6 -9
- package/src/tool/fortune-cookie/i18n/ru.ts +17 -20
- package/src/tool/fortune-cookie/i18n/sv.ts +6 -9
- package/src/tool/fortune-cookie/i18n/tr.ts +5 -8
- package/src/tool/fortune-cookie/i18n/zh.ts +7 -10
- package/src/tool/glitch-image-distorter/bibliography.astro +8 -0
- package/src/tool/glitch-image-distorter/bibliography.ts +4 -0
- package/src/tool/glitch-image-distorter/component.astro +393 -0
- package/src/tool/glitch-image-distorter/entry.ts +48 -0
- package/src/tool/glitch-image-distorter/glitch-image-distorter.css +233 -0
- package/src/tool/glitch-image-distorter/i18n/de.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/en.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/es.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/fr.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/id.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/it.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/ja.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/ko.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/nl.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/pl.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/pt.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/ru.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/sv.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/tr.ts +131 -0
- package/src/tool/glitch-image-distorter/i18n/zh.ts +131 -0
- package/src/tool/glitch-image-distorter/index.ts +9 -0
- package/src/tool/glitch-image-distorter/seo.astro +15 -0
- package/src/tool/synesthesia-painter/bibliography.astro +3 -12
- package/src/tool/synesthesia-painter/bibliography.ts +5 -0
- package/src/tool/synesthesia-painter/entry.ts +0 -1
- package/src/tool/synesthesia-painter/i18n/de.ts +14 -18
- package/src/tool/synesthesia-painter/i18n/en.ts +5 -9
- package/src/tool/synesthesia-painter/i18n/es.ts +4 -8
- package/src/tool/synesthesia-painter/i18n/fr.ts +10 -14
- package/src/tool/synesthesia-painter/i18n/id.ts +5 -9
- package/src/tool/synesthesia-painter/i18n/it.ts +2 -6
- package/src/tool/synesthesia-painter/i18n/ja.ts +4 -8
- package/src/tool/synesthesia-painter/i18n/ko.ts +4 -8
- package/src/tool/synesthesia-painter/i18n/nl.ts +4 -8
- package/src/tool/synesthesia-painter/i18n/pl.ts +14 -18
- package/src/tool/synesthesia-painter/i18n/pt.ts +5 -9
- package/src/tool/synesthesia-painter/i18n/ru.ts +17 -21
- package/src/tool/synesthesia-painter/i18n/sv.ts +5 -9
- package/src/tool/synesthesia-painter/i18n/tr.ts +4 -8
- package/src/tool/synesthesia-painter/i18n/zh.ts +15 -19
- package/src/tool/zalgo-generator/bibliography.astro +2 -12
- package/src/tool/zalgo-generator/bibliography.ts +5 -0
- package/src/tool/zalgo-generator/component.astro +1 -1
- package/src/tool/zalgo-generator/entry.ts +0 -1
- package/src/tool/zalgo-generator/i18n/de.ts +9 -13
- package/src/tool/zalgo-generator/i18n/en.ts +5 -9
- package/src/tool/zalgo-generator/i18n/es.ts +4 -8
- package/src/tool/zalgo-generator/i18n/fr.ts +9 -13
- package/src/tool/zalgo-generator/i18n/id.ts +5 -9
- package/src/tool/zalgo-generator/i18n/it.ts +4 -8
- package/src/tool/zalgo-generator/i18n/ja.ts +4 -8
- package/src/tool/zalgo-generator/i18n/ko.ts +4 -8
- package/src/tool/zalgo-generator/i18n/nl.ts +5 -9
- package/src/tool/zalgo-generator/i18n/pl.ts +9 -13
- package/src/tool/zalgo-generator/i18n/pt.ts +5 -9
- package/src/tool/zalgo-generator/i18n/ru.ts +9 -13
- package/src/tool/zalgo-generator/i18n/sv.ts +5 -9
- package/src/tool/zalgo-generator/i18n/tr.ts +5 -9
- package/src/tool/zalgo-generator/i18n/zh.ts +9 -13
- package/src/tools.ts +2 -0
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import { bibliography } from '../bibliography';
|
|
3
|
+
import type { GlitchImageDistorterLocaleContent } from '../index';
|
|
4
|
+
|
|
5
|
+
const slug = 'skapa-glitch-art-av-bilder';
|
|
6
|
+
const title = 'Glitch Bild Distorter';
|
|
7
|
+
const description = 'Förvandla dina bilder till glitch art med RGB-splits, scanlines, pixel sorting och animerade distorsioner. Ingen Photoshop behövs.';
|
|
8
|
+
|
|
9
|
+
const faq: GlitchImageDistorterLocaleContent['faq'] = [
|
|
10
|
+
{
|
|
11
|
+
question: 'Vad är glitch art?',
|
|
12
|
+
answer: 'Glitch art är en form av digital konst som skapas genom att manipulera digitala bilder eller data för att producera avsiktliga visuella fel. Dessa "glitchar" resulterar i fragmenterade färger, förvrängda former och oförutsägbara mönster som skapar en estetik av digital korruption och kaos.',
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
question: 'Kan jag använda mina egna bilder?',
|
|
16
|
+
answer: 'Ja! Du kan ladda upp vilken PNG-, JPG- eller WebP-bild som helst, dra och släppa den på duken, eller klistra in en bild direkt från urklipp med Ctrl+V. Du kan också använda exempelbilden.',
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
question: 'Vad gör de olika distorsionseffekterna?',
|
|
20
|
+
answer: 'Corruption separerar RGB-kanaler för en kromatisk aberrations-effekt. Interference lägger till monitor-liknande scanlines med valfri darrning. Pixel Sorting gör att ljusa pixlar "rinner" i en vald riktning. Static Noise lägger på klassiskt TV-brus.',
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
question: 'Kan jag animera glitch-effekten?',
|
|
24
|
+
answer: 'Absolut! Läget "Glitch Animate" applicerar mikro-slumpmässiga rörelser på parametrarna, vilket skapar en levande, flimrande effekt som loopar kontinuerligt. Du kan exportera detta som en animerad GIF eller WebP.',
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: 'Vilka format kan jag exportera?',
|
|
28
|
+
answer: 'Du kan ladda ner en högupplöst PNG för statiskt bruk, eller exportera som animerad GIF eller WebP om du aktiverat animationsläget. Perfekt för Instagram, Discord eller andra plattformar.',
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
question: 'Vad gör Chaos-knappen?',
|
|
32
|
+
answer: 'Knappen "Chaos Random" slumpar omedelbart alla reglagens värden, vilket skapar oväntade och ofta överraskande glitch-kombinationer. Det är perfekt för att utforska verktygets kreativa potential utan manuella justeringar.',
|
|
33
|
+
},
|
|
34
|
+
];
|
|
35
|
+
|
|
36
|
+
const howTo: GlitchImageDistorterLocaleContent['howTo'] = [
|
|
37
|
+
{ name: 'Ladda en bild', text: 'Dra och släpp en bild på duken, klistra in med Ctrl+V, ladda upp via filknappen eller klicka på "Använd exempelbild".' },
|
|
38
|
+
{ name: 'Justera reglagen', text: 'Använd reglagen för Corruption, Interference, Pixel Sort och Noise för att applicera olika glitch-effekter. Förhandsgranskningen uppdateras i realtid.' },
|
|
39
|
+
{ name: 'Aktivera animation', text: 'Slå på knappen "Glitch Animate" för att lägga till vibrationer och flimmer. Bilden kommer till liv med en dynamisk glitch-effekt.' },
|
|
40
|
+
{ name: 'Exportera ditt verk', text: 'Ladda ner som PNG för statisk konst, eller exportera som GIF/WebP om animation är aktiverad. Dela din glitch art på sociala medier!' },
|
|
41
|
+
{ name: 'Experimentera med Chaos', text: 'Klicka på knappen "Chaos Random" för att automatiskt upptäcka överraskande kombinationer av effekter.' },
|
|
42
|
+
];
|
|
43
|
+
|
|
44
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
45
|
+
'@context': 'https://schema.org',
|
|
46
|
+
'@type': 'FAQPage',
|
|
47
|
+
mainEntity: faq.map((item) => ({
|
|
48
|
+
'@type': 'Question',
|
|
49
|
+
name: item.question,
|
|
50
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
51
|
+
})),
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
const howToSchema: WithContext<HowTo> = {
|
|
55
|
+
'@context': 'https://schema.org',
|
|
56
|
+
'@type': 'HowTo',
|
|
57
|
+
name: title,
|
|
58
|
+
description,
|
|
59
|
+
step: howTo.map((step) => ({
|
|
60
|
+
'@type': 'HowToStep',
|
|
61
|
+
name: step.name,
|
|
62
|
+
text: step.text,
|
|
63
|
+
})),
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
67
|
+
'@context': 'https://schema.org',
|
|
68
|
+
'@type': 'SoftwareApplication',
|
|
69
|
+
name: title,
|
|
70
|
+
description,
|
|
71
|
+
applicationCategory: 'UtilitiesApplication',
|
|
72
|
+
operatingSystem: 'Web',
|
|
73
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
74
|
+
inLanguage: 'sv',
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
export const content: GlitchImageDistorterLocaleContent = {
|
|
78
|
+
slug,
|
|
79
|
+
title,
|
|
80
|
+
description,
|
|
81
|
+
faqTitle: 'Vanliga Frågor',
|
|
82
|
+
ui: {
|
|
83
|
+
title: 'Glitch Distorter',
|
|
84
|
+
description: 'Skapa glitch art på några sekunder.',
|
|
85
|
+
dragDropText: 'Dra en bild hit eller klicka för att ladda upp',
|
|
86
|
+
pasteHint: 'Tips: Du kan också klistra in en bild med Ctrl+V',
|
|
87
|
+
exampleImageBtn: 'Använd exempelbild',
|
|
88
|
+
corruptionLabel: 'Corruption (RGB-split)',
|
|
89
|
+
interferenceLabel: 'Interference (Linjer)',
|
|
90
|
+
tremorLabel: 'Darrning',
|
|
91
|
+
pixelSortLabel: 'Pixel Sorting',
|
|
92
|
+
pixelSortDirectionLabel: 'Riktning',
|
|
93
|
+
noiseLabel: 'Statiskt Brus',
|
|
94
|
+
animateBtn: 'Glitch Animation',
|
|
95
|
+
chaosBtn: 'Slumpmässigt Chaos',
|
|
96
|
+
downloadPngBtn: 'Ladda ner PNG',
|
|
97
|
+
downloadGifBtn: 'Ladda ner GIF',
|
|
98
|
+
undoBtn: 'Ångra',
|
|
99
|
+
redoBtn: 'Gör om',
|
|
100
|
+
footerText: 'Skapa korrumperad digital konst på mindre än 30 sekunder',
|
|
101
|
+
faqTitle: 'FAQ',
|
|
102
|
+
bibliographyTitle: 'Referenser'
|
|
103
|
+
},
|
|
104
|
+
seo: [
|
|
105
|
+
{ type: 'title', text: 'Vad är Glitch Art?', level: 2 },
|
|
106
|
+
{ type: 'paragraph', html: '<strong>Glitch art</strong> är en kreativ praktik som avsiktligt utnyttjar digitala fel, korrupta data och visuella artefakter för att producera estetiska resultat. Till skillnad från traditionell konst som strävar efter perfektion, firar glitch den oväntade skönheten i tekniska sammanbrott - fragmenterade färger och kaotiska mönster som uppstår ur fel.' },
|
|
107
|
+
{ type: 'title', text: 'Ursprung och digital estetik', level: 3 },
|
|
108
|
+
{ type: 'paragraph', html: 'Glitch-estetiken uppstod i början av 2000-talet när digitala konstnärer började experimentera med korrupta bildfiler och hårdvarufel. Konstnärer som <strong>Rosa Menkman</strong> lyfte glitch art till finkonst genom att undersöka de digitala artefakternas poetik. Estetiken hämtar inspiration från VHS-degradering, överföringsfel och det synliga "bruset" i digitala system.' },
|
|
109
|
+
{ type: 'title', text: 'Viktiga glitch-tekniker', level: 3 },
|
|
110
|
+
{ type: 'list', items: [
|
|
111
|
+
'<strong>RGB Splitting:</strong> Att förskjuta de röda, gröna och blå färgkanalerna för att skapa kromatisk aberration.',
|
|
112
|
+
'<strong>Scanlines:</strong> Att simulera horisontella linjer från gamla CRT-skärmar för en retro-effekt.',
|
|
113
|
+
'<strong>Pixel Sorting:</strong> Att sortera pixlar efter ljusstyrka och förskjuta dem för att skapa en "smältande" effekt.',
|
|
114
|
+
'<strong>Data Moshing:</strong> Att manipulera videocodec-data för att blanda bildrutor på oväntade sätt.',
|
|
115
|
+
'<strong>Bit Shifting:</strong> Direkt ändring av binärdata resulterar i dramatiska färgförändringar och distorsioner.',
|
|
116
|
+
]},
|
|
117
|
+
{ type: 'tip', title: 'Filosofin bakom Glitch', html: 'Glitch art utmanar idén om en "perfekt" digital representation. Genom att omfamna fel ifrågasätter vi teknikens tillförlitlighet och utforskar hur tekniken förmedlar vår uppfattning av verkligheten. Det är konst om systemfel och den skönhet som finns gömd i kaoset.' },
|
|
118
|
+
{ type: 'title', text: 'Samtida tillämpningar', level: 3 },
|
|
119
|
+
{ type: 'paragraph', html: 'Idag finns glitch-estetik överallt: skivomslag, musikvideor, mode och grafisk design. Det här verktyget demokratiserar skapandet av glitch art och låter vem som helst generera professionell digital korruption utan djupa tekniska kunskaper.' },
|
|
120
|
+
{ type: 'stats', items: [
|
|
121
|
+
{ value: '2000-talet', label: 'Glitch art uppstår', icon: 'mdi:history' },
|
|
122
|
+
{ value: '∞', label: 'Möjliga kombinationer', icon: 'mdi:shuffle-variant' },
|
|
123
|
+
{ value: '<30s', label: 'Tid att skapa', icon: 'mdi:flash' },
|
|
124
|
+
{ value: '3+', label: 'Exportformat', icon: 'mdi:download-multiple' },
|
|
125
|
+
], columns: 4 },
|
|
126
|
+
],
|
|
127
|
+
faq,
|
|
128
|
+
bibliography,
|
|
129
|
+
howTo,
|
|
130
|
+
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
131
|
+
};
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import { bibliography } from '../bibliography';
|
|
3
|
+
import type { GlitchImageDistorterLocaleContent } from '../index';
|
|
4
|
+
|
|
5
|
+
const slug = 'glitch-gorsel-bozucu';
|
|
6
|
+
const title = 'Glitch Görsel Bozucu';
|
|
7
|
+
const description = 'RGB ayırmaları, tarama çizgileri, piksel sıralama ve animasyonlu bozulmalarla görsellerinizi glitch sanatına dönüştürün. Photoshop gerekmez.';
|
|
8
|
+
|
|
9
|
+
const faq: GlitchImageDistorterLocaleContent['faq'] = [
|
|
10
|
+
{
|
|
11
|
+
question: 'Glitch sanatı nedir?',
|
|
12
|
+
answer: 'Glitch sanatı, dijital görselleri veya verileri manipüle ederek kasıtlı görsel hatalar üretme yoluyla oluşturulan bir dijital sanat formudur. Bu "glitch"ler; dijital bozulma ve kaos estetiği yaratan parçalanmış renkler, bozulmuş şekiller ve öngörülemeyen desenlerle sonuçlanır.',
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
question: 'Kendi görsellerimi kullanabilir miyim?',
|
|
16
|
+
answer: 'Evet! Herhangi bir PNG, JPG veya WebP görselini yükleyebilir, tuvale sürükleyip bırakabilir veya Ctrl+V ile panonuzdan doğrudan bir görsel yapıştırabilirsiniz. Ayrıca örnek görseli de kullanabilirsiniz.',
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
question: 'Farklı bozulma efektleri ne işe yarar?',
|
|
20
|
+
answer: 'Yozlaşma (Corruption), kromatik sapma efekti için RGB kanallarını ayırır. Parazit (Interference), isteğe bağlı titreme ile eski monitör benzeri tarama çizgileri ekler. Piksel Sıralama (Pixel Sorting), parlak piksellerin seçilen bir yönde "akmasını" sağlar. Statik Gürültü (Static Noise), klasik TV karıncalanması ekler.',
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
question: 'Glitch efektini canlandırabilir miyim?',
|
|
24
|
+
answer: 'Kesinlikle! "Glitch Canlandır" modu, parametrelere mikro rastgele hareketler uygulayarak sürekli döngüye giren canlı, titreşen bir efekt oluşturur. Bunu animasyonlu GIF veya WebP olarak dışa aktarabilirsiniz.',
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: 'Hangi formatlarda dışa aktarabilirim?',
|
|
28
|
+
answer: 'Statik kullanım için yüksek kaliteli bir PNG indirebilir veya animasyon modu etkinse animasyonlu GIF veya WebP olarak dışa aktarabilirsiniz. Instagram, Discord veya diğer platformlar için mükemmeldir.',
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
question: 'Kaos düğmesi ne işe yarar?',
|
|
32
|
+
answer: '"Rastgele Kaos" düğmesi, tüm kaydırıcı değerlerini anında rastgele hale getirerek beklenmedik ve genellikle şaşırtıcı glitch kombinasyonları oluşturur. Manuel ayarlama yapmadan yaratıcı potansiyeli keşfetmek için mükemmeldir.',
|
|
33
|
+
},
|
|
34
|
+
];
|
|
35
|
+
|
|
36
|
+
const howTo: GlitchImageDistorterLocaleContent['howTo'] = [
|
|
37
|
+
{ name: 'Görsel yükle', text: 'Tuvale bir görsel sürükleyip bırakın, Ctrl+V ile yapıştırın, dosya düğmesiyle yükleyin veya "Örnek görsel kullan"a tıklayın.' },
|
|
38
|
+
{ name: 'Sürgüleri ayarla', text: 'Farklı glitch efektleri uygulamak için Yozlaşma, Parazit, Piksel Sıralama ve Gürültü sürgülerini kullanın. Önizleme gerçek zamanlı güncellenir.' },
|
|
39
|
+
{ name: 'Animasyonu etkinleştir', text: 'Titreşimler ve parlamalar eklemek için "Glitch Canlandır" düğmesini açın. Görsel dinamik bir glitch efektiyle canlanacaktır.' },
|
|
40
|
+
{ name: 'Çalışmanı dışa aktar', text: 'Statik sanat için PNG olarak indirin veya animasyon etkinse GIF/WebP olarak dışa aktarın. Glitch sanatınızı sosyal medyada paylaşın!' },
|
|
41
|
+
{ name: 'Kaos ile deney yap', text: 'Beklenmedik efekt kombinasyonlarını otomatik olarak keşfetmek için "Rastgele Kaos" düğmesine tıklayın.' },
|
|
42
|
+
];
|
|
43
|
+
|
|
44
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
45
|
+
'@context': 'https://schema.org',
|
|
46
|
+
'@type': 'FAQPage',
|
|
47
|
+
mainEntity: faq.map((item) => ({
|
|
48
|
+
'@type': 'Question',
|
|
49
|
+
name: item.question,
|
|
50
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
51
|
+
})),
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
const howToSchema: WithContext<HowTo> = {
|
|
55
|
+
'@context': 'https://schema.org',
|
|
56
|
+
'@type': 'HowTo',
|
|
57
|
+
name: title,
|
|
58
|
+
description,
|
|
59
|
+
step: howTo.map((step) => ({
|
|
60
|
+
'@type': 'HowToStep',
|
|
61
|
+
name: step.name,
|
|
62
|
+
text: step.text,
|
|
63
|
+
})),
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
67
|
+
'@context': 'https://schema.org',
|
|
68
|
+
'@type': 'SoftwareApplication',
|
|
69
|
+
name: title,
|
|
70
|
+
description,
|
|
71
|
+
applicationCategory: 'UtilitiesApplication',
|
|
72
|
+
operatingSystem: 'Web',
|
|
73
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
74
|
+
inLanguage: 'tr',
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
export const content: GlitchImageDistorterLocaleContent = {
|
|
78
|
+
slug,
|
|
79
|
+
title,
|
|
80
|
+
description,
|
|
81
|
+
faqTitle: 'Sıkça Sorulan Sorular',
|
|
82
|
+
ui: {
|
|
83
|
+
title: 'Glitch Bozucu',
|
|
84
|
+
description: 'Saniyeler içinde glitch sanatı oluşturun.',
|
|
85
|
+
dragDropText: 'Bir görseli buraya sürükleyin veya yüklemek için tıklayın',
|
|
86
|
+
pasteHint: 'İpucu: Ctrl+V ile de bir görsel yapıştırabilirsiniz',
|
|
87
|
+
exampleImageBtn: 'Örnek görsel kullan',
|
|
88
|
+
corruptionLabel: 'Yozlaşma (RGB Ayırma)',
|
|
89
|
+
interferenceLabel: 'Parazit (Çizgiler)',
|
|
90
|
+
tremorLabel: 'Titreme',
|
|
91
|
+
pixelSortLabel: 'Piksel Sıralama',
|
|
92
|
+
pixelSortDirectionLabel: 'Yön',
|
|
93
|
+
noiseLabel: 'Statik Gürültü',
|
|
94
|
+
animateBtn: 'Glitch Canlandır',
|
|
95
|
+
chaosBtn: 'Rastgele Kaos',
|
|
96
|
+
downloadPngBtn: 'PNG İndir',
|
|
97
|
+
downloadGifBtn: 'GIF İndir',
|
|
98
|
+
undoBtn: 'Geri Al',
|
|
99
|
+
redoBtn: 'Yinele',
|
|
100
|
+
footerText: '30 saniyeden kısa sürede bozulmuş dijital sanat oluşturun',
|
|
101
|
+
faqTitle: 'FAQ',
|
|
102
|
+
bibliographyTitle: 'Referanslar'
|
|
103
|
+
},
|
|
104
|
+
seo: [
|
|
105
|
+
{ type: 'title', text: 'Glitch Sanatı Nedir?', level: 2 },
|
|
106
|
+
{ type: 'paragraph', html: '<strong>Glitch sanatı</strong>, estetik sonuçlar üretmek için dijital hataları, bozulmuş verileri ve görsel yapaylıkları kasıtlı olarak kullanan yaratıcı bir uygulamadır. Kusursuzluğu arayan geleneksel sanatın aksine glitch, teknolojik arızanın beklenmedik güzelliğini - hatadan doğan parçalanmış renkleri ve kaotik desenleri - yüceltir.' },
|
|
107
|
+
{ type: 'title', text: 'Kökenler ve Dijital Estetik', level: 3 },
|
|
108
|
+
{ type: 'paragraph', html: 'Glitch estetiği, 2000\'lerin başında dijital sanatçıların bozulmuş görüntü dosyaları ve donanım arızalarıyla denemeler yapmaya başlamasıyla ortaya çıktı. <strong>Rosa Menkman</strong> gibi sanatçılar, dijital yapaylıkların şiirselliğini araştırarak glitch sanatını güzel sanatlar statüsüne yükseltti. Estetik; VHS bozulması, iletim hataları ve dijital sistemlerin görünür "gürültü"sünden beslenir.' },
|
|
109
|
+
{ type: 'title', text: 'Temel Glitch Teknikleri', level: 3 },
|
|
110
|
+
{ type: 'list', items: [
|
|
111
|
+
'<strong>RGB Ayırma:</strong> Kromatik sapma oluşturmak için kırmızı, yeşil ve mavi renk kanallarını kaydırmak.',
|
|
112
|
+
'<strong>Tarama Çizgileri:</strong> Retro bir etki için eski CRT monitörlerini taklit eden yatay çizgiler simüle etmek.',
|
|
113
|
+
'<strong>Piksel Sıralama:</strong> Pikselleri parlaklığa göre sıralamak ve "erime" efekti yaratmak için kaydırmak.',
|
|
114
|
+
'<strong>Data Moshing:</strong> Kareleri beklenmedik şekillerde karıştırmak için video kodek verilerini manipüle etmek.',
|
|
115
|
+
'<strong>Bit Kaydırma:</strong> İkili verileri doğrudan değiştirmek, dramatik renk ve şekil bozulmalarıyla sonuçlanır.',
|
|
116
|
+
]},
|
|
117
|
+
{ type: 'tip', title: 'Glitch\'in Arkasındaki Felsefe', html: 'Glitch sanatı, "mükemmel" dijital temsil fikrine meydan okur. Hatayı kucaklayarak teknolojinin güvenilirliğini sorgular ve teknolojinin gerçeklik algımıza nasıl aracılık ettiğini keşfederiz. Bu, sistem arızası ve kaosun içine gizlenmiş güzellik hakkındaki sanattır.' },
|
|
118
|
+
{ type: 'title', text: 'Günümüzdeki Uygulamalar', level: 3 },
|
|
119
|
+
{ type: 'paragraph', html: 'Bugün glitch estetiği her yerde: albüm kapakları, müzik videoları, moda ve grafik tasarım. Bu araç, derin teknik bilgiye sahip olmadan herkesin profesyonel görünümlü dijital bozulmalar üretmesine olanak tanıyarak glitch sanatı oluşturmayı demokratikleştirir.' },
|
|
120
|
+
{ type: 'stats', items: [
|
|
121
|
+
{ value: '2000\'ler', label: 'Glitch sanatının doğuşu', icon: 'mdi:history' },
|
|
122
|
+
{ value: '∞', label: 'Olası glitch kombinasyonları', icon: 'mdi:shuffle-variant' },
|
|
123
|
+
{ value: '<30sn', label: 'Oluşturma süresi', icon: 'mdi:flash' },
|
|
124
|
+
{ value: '3+', label: 'Dışa aktarma formatı', icon: 'mdi:download-multiple' },
|
|
125
|
+
], columns: 4 },
|
|
126
|
+
],
|
|
127
|
+
faq,
|
|
128
|
+
bibliography,
|
|
129
|
+
howTo,
|
|
130
|
+
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
131
|
+
};
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import { bibliography } from '../bibliography';
|
|
3
|
+
import type { GlitchImageDistorterLocaleContent } from '../index';
|
|
4
|
+
|
|
5
|
+
const slug = 'glitch-image-distorter';
|
|
6
|
+
const title = '故障艺术生成器';
|
|
7
|
+
const description = '无需 Photoshop,即可通过 RGB 分离、扫描线、像素排序和动态扭曲,将您的照片转换成迷人的故障艺术作品。';
|
|
8
|
+
|
|
9
|
+
const faq: GlitchImageDistorterLocaleContent['faq'] = [
|
|
10
|
+
{
|
|
11
|
+
question: '什么是故障艺术 (Glitch Art)?',
|
|
12
|
+
answer: '故障艺术是一种通过操纵数字图像或数据来产生故意视觉错误的数字艺术形式。这些\"故障\"表现为色彩碎片化、形状扭曲和不可预测的模式,营造出一种数字损坏与混沌的独特美学。',
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
question: '我可以使用自己的图片吗?',
|
|
16
|
+
answer: '可以!您可以上传任何 PNG、JPG 或 WebP 格式的图片,将其拖放到画布上,或使用 Ctrl+V 直接从剪贴板粘贴图片。您也可以使用示例图片来体验该工具。',
|
|
17
|
+
},
|
|
18
|
+
{
|
|
19
|
+
question: '各种扭曲效果的作用是什么?',
|
|
20
|
+
answer: '\"损坏 (Corruption)\"分离 RGB 通道以产生色差效果。\"干扰 (Interference)\"添加类似旧监视器的扫描线,并可选择震颤效果。\"像素排序 (Pixel Sorting)\"使明亮的像素向选定方向\"流动\"。\"静态噪声 (Static Noise)\"叠加经典的电视雪花。',
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
question: '我可以让故障效果动起来吗?',
|
|
24
|
+
answer: '当然可以!\"故障动画\"模式会对参数应用微小的随机变动,产生一种持续循环的生动闪烁效果。您可以将其导出为动态 GIF 或 WebP 格式。',
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: '我可以导出什么格式?',
|
|
28
|
+
answer: '您可以下载高质量的 PNG 图片用于静态展示,如果启用了动画模式,则可以导出动态 GIF 或 WebP 格式。非常适合在 Instagram、Discord 等平台分享。',
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
question: '\"混沌\"按钮是做什么的?',
|
|
32
|
+
answer: '\"随机混沌\"按钮会立即随机化所有滑块的值,创造出意想不到且往往令人惊喜的故障组合。非常适合在不进行手动调整的情况下探索该工具的创意潜力。',
|
|
33
|
+
},
|
|
34
|
+
];
|
|
35
|
+
|
|
36
|
+
const howTo: GlitchImageDistorterLocaleContent['howTo'] = [
|
|
37
|
+
{ name: '加载图片', text: '将图片拖放到画布上,使用 Ctrl+V 粘贴,通过文件按钮上传,或点击\"使用示例图片\"立即开始。' },
|
|
38
|
+
{ name: '调整滑块', text: '使用损坏、干扰、像素排序和噪声滑块来应用不同的故障效果。预览会实时更新。' },
|
|
39
|
+
{ name: '启用动画', text: '开启\"故障动画\"按钮以添加振动和闪烁。图片将随动态故障效果变得栩栩如生。' },
|
|
40
|
+
{ name: '导出您的创作', text: '下载 PNG 用于静态艺术,或在启用动画时导出为 GIF/WebP。在社交媒体上分享您的故障艺术!' },
|
|
41
|
+
{ name: '尝试混沌模式', text: '点击\"随机混沌\"按钮,自动发现令人惊喜的故障效果组合。' },
|
|
42
|
+
];
|
|
43
|
+
|
|
44
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
45
|
+
'@context': 'https://schema.org',
|
|
46
|
+
'@type': 'FAQPage',
|
|
47
|
+
mainEntity: faq.map((item) => ({
|
|
48
|
+
'@type': 'Question',
|
|
49
|
+
name: item.question,
|
|
50
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
51
|
+
})),
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
const howToSchema: WithContext<HowTo> = {
|
|
55
|
+
'@context': 'https://schema.org',
|
|
56
|
+
'@type': 'HowTo',
|
|
57
|
+
name: title,
|
|
58
|
+
description,
|
|
59
|
+
step: howTo.map((step) => ({
|
|
60
|
+
'@type': 'HowToStep',
|
|
61
|
+
name: step.name,
|
|
62
|
+
text: step.text,
|
|
63
|
+
})),
|
|
64
|
+
};
|
|
65
|
+
|
|
66
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
67
|
+
'@context': 'https://schema.org',
|
|
68
|
+
'@type': 'SoftwareApplication',
|
|
69
|
+
name: title,
|
|
70
|
+
description,
|
|
71
|
+
applicationCategory: 'UtilitiesApplication',
|
|
72
|
+
operatingSystem: 'Web',
|
|
73
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
74
|
+
inLanguage: 'zh',
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
export const content: GlitchImageDistorterLocaleContent = {
|
|
78
|
+
slug,
|
|
79
|
+
title,
|
|
80
|
+
description,
|
|
81
|
+
faqTitle: '常见问题',
|
|
82
|
+
ui: {
|
|
83
|
+
title: '故障扭曲器',
|
|
84
|
+
description: '秒间创作故障艺术。',
|
|
85
|
+
dragDropText: '将图片拖到此处或点击上传',
|
|
86
|
+
pasteHint: '提示:您也可以使用 Ctrl+V 粘贴图片',
|
|
87
|
+
exampleImageBtn: '使用示例图片',
|
|
88
|
+
corruptionLabel: '损坏 (RGB 分离)',
|
|
89
|
+
interferenceLabel: '干扰 (扫描线)',
|
|
90
|
+
tremorLabel: '震颤',
|
|
91
|
+
pixelSortLabel: '像素排序',
|
|
92
|
+
pixelSortDirectionLabel: '方向',
|
|
93
|
+
noiseLabel: '静态噪声',
|
|
94
|
+
animateBtn: '故障动画',
|
|
95
|
+
chaosBtn: '随机混沌',
|
|
96
|
+
downloadPngBtn: '下载 PNG',
|
|
97
|
+
downloadGifBtn: '下载 GIF',
|
|
98
|
+
undoBtn: '撤销',
|
|
99
|
+
redoBtn: '重做',
|
|
100
|
+
footerText: '在 30 秒内创作损坏的数字艺术',
|
|
101
|
+
faqTitle: 'FAQ',
|
|
102
|
+
bibliographyTitle: '参考文献'
|
|
103
|
+
},
|
|
104
|
+
seo: [
|
|
105
|
+
{ type: 'title', text: '什么是故障艺术?', level: 2 },
|
|
106
|
+
{ type: 'paragraph', html: '<strong>故障艺术 (Glitch Art)</strong> 是一种创意实践,它刻意利用数字错误、损坏的数据和视觉伪影来产生审美结果。与追求完美的传统艺术不同,故障艺术赞美技术故障带来的意外之美-从错误中诞生的碎片化色彩和混沌模式。' },
|
|
107
|
+
{ type: 'title', text: '起源与数字美学', level: 3 },
|
|
108
|
+
{ type: 'paragraph', html: '故障美学出现于 2000 年代初期,当时数字艺术家开始尝试使用损坏的图像文件和硬件故障进行创作。像 <strong>Rosa Menkman</strong> 这样的艺术家通过调查数字伪影的诗学,将故障艺术提升到了美术的高度。这种美学从 VHS 降级、传输错误和数字系统可见的\"噪声\"中汲取灵感。' },
|
|
109
|
+
{ type: 'title', text: '关键故障技术', level: 3 },
|
|
110
|
+
{ type: 'list', items: [
|
|
111
|
+
'<strong>RGB 分离:</strong> 偏移红、绿、蓝颜色通道以产生色差。',
|
|
112
|
+
'<strong>扫描线:</strong> 模拟旧式 CRT 监视器的水平线,增添复古氛围。',
|
|
113
|
+
'<strong>像素排序:</strong> 按亮度等对像素进行排序并移动,产生\"融化\"效果。',
|
|
114
|
+
'<strong>Data Moshing:</strong> 操纵视频编解码数据,以意想不到的方式混合帧。',
|
|
115
|
+
'<strong>位移 (Bit Shifting):</strong> 直接修改二进制数据,产生剧烈的颜色和形状扭曲。',
|
|
116
|
+
]},
|
|
117
|
+
{ type: 'tip', title: '故障背后的哲学', html: '故障艺术挑战了\"完美\"数字表征的观念。通过拥抱错误,我们质疑技术的可靠性,并探索技术如何调节我们对现实的感知。它是关于系统故障以及隐藏在混沌中的美丽的艺术。' },
|
|
118
|
+
{ type: 'title', text: '当代应用', level: 3 },
|
|
119
|
+
{ type: 'paragraph', html: '如今,故障美学无处不在:专辑封面、音乐录影带、时尚和平面设计。该工具使故障艺术创作变得大众化,让任何人都可以在没有深厚技术知识的情况下生成看起来非常专业的数字损坏作品。' },
|
|
120
|
+
{ type: 'stats', items: [
|
|
121
|
+
{ value: '2000s', label: '故障艺术的兴起', icon: 'mdi:history' },
|
|
122
|
+
{ value: '∞', label: '无限的故障组合', icon: 'mdi:shuffle-variant' },
|
|
123
|
+
{ value: '<30s', label: '创作时间', icon: 'mdi:flash' },
|
|
124
|
+
{ value: '3+', label: '导出格式', icon: 'mdi:download-multiple' },
|
|
125
|
+
], columns: 4 },
|
|
126
|
+
],
|
|
127
|
+
faq,
|
|
128
|
+
bibliography,
|
|
129
|
+
howTo,
|
|
130
|
+
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
131
|
+
};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { ToolDefinition } from '../../types';
|
|
2
|
+
import { glitchImageDistorter } from './entry';
|
|
3
|
+
export * from './entry';
|
|
4
|
+
export const GLITCH_IMAGE_DISTORTER_TOOL: ToolDefinition = {
|
|
5
|
+
entry: glitchImageDistorter,
|
|
6
|
+
Component: () => import('./component.astro'),
|
|
7
|
+
SEOComponent: () => import('./seo.astro'),
|
|
8
|
+
BibliographyComponent: () => import('./bibliography.astro'),
|
|
9
|
+
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
---
|
|
2
|
+
import { SEORenderer } from '@jjlmoya/utils-shared';
|
|
3
|
+
import { glitchImageDistorter } from './index';
|
|
4
|
+
import type { KnownLocale } from '../../types';
|
|
5
|
+
|
|
6
|
+
interface Props {
|
|
7
|
+
locale?: KnownLocale;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
const { locale = 'es' } = Astro.props;
|
|
11
|
+
const content = await glitchImageDistorter.i18n[locale]?.();
|
|
12
|
+
if (!content) return null;
|
|
13
|
+
---
|
|
14
|
+
|
|
15
|
+
{content.seo?.length > 0 && <SEORenderer content={{ locale, sections: content.seo }} />}
|
|
@@ -1,17 +1,8 @@
|
|
|
1
1
|
---
|
|
2
2
|
import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
|
|
3
|
-
import {
|
|
4
|
-
import type { KnownLocale } from '../../types';
|
|
3
|
+
import { bibliography } from './bibliography';
|
|
5
4
|
|
|
6
|
-
|
|
7
|
-
locale?: KnownLocale;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
const { locale = 'es' } = Astro.props;
|
|
11
|
-
const content = await synesthesiaPainter.i18n[locale]?.();
|
|
12
|
-
if (!content || !content.bibliography || content.bibliography.length === 0) return null;
|
|
13
|
-
|
|
14
|
-
const { bibliography, bibliographyTitle = 'Bibliografía' } = content;
|
|
5
|
+
if (!bibliography || bibliography.length === 0) return null;
|
|
15
6
|
---
|
|
16
7
|
|
|
17
|
-
<SharedBibliography
|
|
8
|
+
<SharedBibliography links={bibliography} />
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
export const bibliography = [
|
|
2
|
+
{ name: 'Simner et al. (2006) - Synaesthesia: The prevalence of atypical cross-modal experiences', url: 'https://www.ncbi.nlm.nih.gov/pmc/articles/PMC1626536/' },
|
|
3
|
+
{ name: 'Eagleman et al. (2007) - A standardized test battery for the study of synesthesia', url: 'https://www.sciencedirect.com/science/article/pii/S0010945207000087' },
|
|
4
|
+
{ name: 'Kandinsky, W. - Concerning the Spiritual in Art (1911)', url: 'https://en.wikipedia.org/wiki/Concerning_the_Spiritual_in_Art' },
|
|
5
|
+
];
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import { bibliography } from '../bibliography';
|
|
2
3
|
import type { SynesthesiaPainterLocaleContent } from '../index';
|
|
3
4
|
|
|
4
5
|
const slug = 'synaesthesie-maler';
|
|
@@ -8,19 +9,19 @@ const description = 'Visualisieren Sie die Farbe von Wörtern gemäß der Graphe
|
|
|
8
9
|
const faq: SynesthesiaPainterLocaleContent['faq'] = [
|
|
9
10
|
{
|
|
10
11
|
question: 'Sehen alle Synästhetiker die gleichen Farben für jeden Buchstaben?',
|
|
11
|
-
answer: 'Nein. Synästhetische Farben sind für jede Person einzigartig. Es gibt statistische Tendenzen (A ist für viele oft rot), aber keine zwei Synästhetiker haben exakt die gleiche Palette. Dieses Tool verwendet die Farben, die in Populationsstudien am häufigsten gemeldet wurden, nicht die
|
|
12
|
+
answer: 'Nein. Synästhetische Farben sind für jede Person einzigartig. Es gibt statistische Tendenzen (A ist für viele oft rot), aber keine zwei Synästhetiker haben exakt die gleiche Palette. Dieses Tool verwendet die Farben, die in Populationsstudien am häufigsten gemeldet wurden, nicht die \"richtigen\".',
|
|
12
13
|
},
|
|
13
14
|
{
|
|
14
15
|
question: 'Kann ich durch die ständige Nutzung dieses Tools eine Synästhesie entwickeln?',
|
|
15
16
|
answer: 'Nicht im strikten neurologischen Sinne. Echte Synästhesie ist ein Merkmal des Nervensystems, keine erlernte Fähigkeit. Die wiederholte Verwendung von Farb-Buchstaben-Assoziationen kann jedoch starke assoziative Erinnerungen schaffen. Einige Studien deuten darauf hin, dass das Üben dieser Assoziationen das Textgedächtnis verbessern kann.',
|
|
16
17
|
},
|
|
17
18
|
{
|
|
18
|
-
question: 'Wozu dient der
|
|
19
|
-
answer: 'Der Aura-Modus simuliert, wie einige Synästhetiker beschreiben, dass sie Farben
|
|
19
|
+
question: 'Wozu dient der \"Aura\"-Modus?',
|
|
20
|
+
answer: 'Der Aura-Modus simuliert, wie einige Synästhetiker beschreiben, dass sie Farben \"schwebend\" oder \"leuchtend\" um Buchstaben herum sehen, anstatt in sie integriert. Er schafft ein atmosphärischeres und immersiveres visuelles Erlebnis, insbesondere auf dunklem Hintergrund.',
|
|
20
21
|
},
|
|
21
22
|
{
|
|
22
|
-
question: 'Hat der
|
|
23
|
-
answer: 'Es handelt sich um eine künstlerische Abstraktion. Er reduziert den Text auf seine
|
|
23
|
+
question: 'Hat der \"Punkte\"-Modus eine wissenschaftliche Grundlage?',
|
|
24
|
+
answer: 'Es handelt sich um eine künstlerische Abstraktion. Er reduziert den Text auf seine \"chromatische Essenz\", indem er die erkennbare Form der Buchstaben eliminiert. Das Ergebnis ähnelt chromatischen Datenvisualisierungen oder pointillistischen Gemälden und ermöglicht es Ihnen, die \"Farbsignatur\" eines Textes zu sehen, ohne dass die Bedeutung stört.',
|
|
24
25
|
},
|
|
25
26
|
{
|
|
26
27
|
question: 'Warum sind manche Buchstaben wie I und O weiß oder schwarz?',
|
|
@@ -32,7 +33,7 @@ const howTo: SynesthesiaPainterLocaleContent['howTo'] = [
|
|
|
32
33
|
{ name: 'Text schreiben', text: 'Klicken Sie in den Schreibbereich und beginnen Sie zu tippen. Jeder Buchstabe erscheint in der Farbe, die seiner statistischen synästhetischen Assoziation entspricht.' },
|
|
33
34
|
{ name: 'Visualisierungsmodus ändern', text: 'Verwenden Sie die Schaltflächen in der oberen rechten Ecke, um zwischen Buchstaben (farbiger Text), Punkten (Farbkreise) und Aura (leuchtende Buchstaben mit chromatischen Halos) zu wechseln.' },
|
|
34
35
|
{ name: 'Verschiedene Texte erkunden', text: 'Schreiben Sie Namen, Wörter in verschiedenen Sprachen oder Sätze, um deren einzigartige chromatische Palette zu entdecken. Lange Wörter erzeugen faszinierende visuelle Gradienten.' },
|
|
35
|
-
{ name: 'Löschen und neu beginnen', text: 'Verwenden Sie die Schaltfläche
|
|
36
|
+
{ name: 'Löschen und neu beginnen', text: 'Verwenden Sie die Schaltfläche \"Löschen\" in der unteren Leiste, um die Leinwand zu leeren und einen neuen Text zu erkunden.' },
|
|
36
37
|
];
|
|
37
38
|
|
|
38
39
|
const faqSchema: WithContext<FAQPage> = {
|
|
@@ -73,7 +74,6 @@ export const content: SynesthesiaPainterLocaleContent = {
|
|
|
73
74
|
title,
|
|
74
75
|
description,
|
|
75
76
|
faqTitle: 'Häufig gestellte Fragen',
|
|
76
|
-
bibliographyTitle: 'Geistes-Bibliographie',
|
|
77
77
|
ui: {
|
|
78
78
|
title: 'Synästhesie Maler',
|
|
79
79
|
description: 'Verwandeln Sie Ihre Worte in chromatische Kunst.',
|
|
@@ -88,35 +88,31 @@ export const content: SynesthesiaPainterLocaleContent = {
|
|
|
88
88
|
},
|
|
89
89
|
seo: [
|
|
90
90
|
{ type: 'title', text: 'Was ist Graphem Farb Synästhesie?', level: 2 },
|
|
91
|
-
{ type: 'paragraph', html: '<strong>Synästhesie</strong> ist ein neurologischer Zustand, bei dem die Stimulierung eines Sinnes automatisch eine Reaktion in einem anderen auslöst. Die am besten untersuchte und am weitesten verbreitete Variante ist die <strong>Graphem-Farb-Synästhesie</strong>: Die Betroffenen nehmen jeden Buchstaben oder jede Zahl mit einer intrinsischen, konstanten und lebendigen Farbe wahr. Es ist keine Fantasie oder Metapher; für einen Synästhetiker ist der Buchstabe
|
|
91
|
+
{ type: 'paragraph', html: '<strong>Synästhesie</strong> ist ein neurologischer Zustand, bei dem die Stimulierung eines Sinnes automatisch eine Reaktion in einem anderen auslöst. Die am besten untersuchte und am weitesten verbreitete Variante ist die <strong>Graphem-Farb-Synästhesie</strong>: Die Betroffenen nehmen jeden Buchstaben oder jede Zahl mit einer intrinsischen, konstanten und lebendigen Farbe wahr. Es ist keine Fantasie oder Metapher; für einen Synästhetiker ist der Buchstabe \"A\" rot, genauso wie Feuer heiß ist. Dieses Tool basiert auf einer <em>statistischen Palette</em>, die auf den am häufigsten gemeldeten Farben für jedes Graphem in Populationsstudien beruht.' },
|
|
92
92
|
{ type: 'title', text: 'Neurowissenschaft: Die Theorie der Kreuzaktivierung', level: 3 },
|
|
93
93
|
{ type: 'paragraph', html: 'Das am weitesten akzeptierte neurologische Modell für die Graphem-Farb-Synästhesie ist die <strong>Kreuzaktivierung</strong>. Die Bereiche des temporalen Kortex, die an der Erkennung von Buchstabenformen beteiligt sind (Gyrus fusiformis), liegen anatomisch direkt neben den Regionen, die Farben verarbeiten (Areal V4). Bei Menschen mit Synästhesie besteht eine stärkere strukturelle oder funktionelle Konnektivität zwischen diesen Regionen, sodass das Erkennen eines Buchstabens auch Farbpneuronen aktiviert. Die funktionelle Magnetresonanztomographie (fMRT) hat bestätigt, dass Synästhetiker beim Lesen von Text eine echte Aktivierung im Areal V4 zeigen, selbst wenn dieser einfarbig ist.' },
|
|
94
|
-
{ type: 'tip', title: 'Die drei Visualisierungsmodi', html: '<strong>Buchstaben:</strong> Der Originaltext, gefärbt nach Graphem. Ideal, um die
|
|
94
|
+
{ type: 'tip', title: 'Die drei Visualisierungsmodi', html: '<strong>Buchstaben:</strong> Der Originaltext, gefärbt nach Graphem. Ideal, um die \"chromatische Melodie\" eines ganzen Textes zu sehen. <strong>Punkte:</strong> Jedes Zeichen wird zu einem Kreis in seiner Farbe; der Text verschwindet und nur die Farbmusik bleibt. <strong>Aura:</strong> Buchstaben strahlen einen Halo in ihrer Farbe aus, als ob der Text mit seiner eigenen Energie leuchtet.' },
|
|
95
95
|
{ type: 'title', text: 'Statistik und Farbunivsersalien', level: 3 },
|
|
96
96
|
{ type: 'paragraph', html: 'Obwohl synästhetische Farben für jedes Individuum einzigartig sind, fanden Studien von Simner et al. (2006) und Eagleman et al. (2007) signifikante statistische Muster. Der Vokal <strong>A</strong> ist für die meisten tendenziell rot; <strong>O</strong> ist weiß oder schwarz; <strong>S</strong> erscheint in Türkis- oder Grüntönen; <strong>E</strong> erscheint als grün oder weiß. Interessanterweise sind Farb-Buchstaben-Assoziationen innerhalb einer Sprachkultur konsistenter als zwischen verschiedenen Kulturen, was auf eine Rolle des frühen Alphabetlernens hindeutet.' },
|
|
97
97
|
{ type: 'list', items: [
|
|
98
|
-
'<strong>Prävalenz:</strong> Etwa 4 % der Bevölkerung haben in gewissem Maße eine Graphem-Farb-Synästhesie, wobei neuere Studien diese Zahl auf 6
|
|
98
|
+
'<strong>Prävalenz:</strong> Etwa 4 % der Bevölkerung haben in gewissem Maße eine Graphem-Farb-Synästhesie, wobei neuere Studien diese Zahl auf 6-8 % beziffern, wenn subklinische Formen einbezogen werden.',
|
|
99
99
|
'<strong>Geschlechterunterschiede:</strong> Synästhesie ist bei Frauen 3- bis 6-mal häufiger als bei Männern, obwohl die Ursachen für diesen Unterschied noch nicht vollständig geklärt sind.',
|
|
100
100
|
'<strong>Vererbbarkeit:</strong> Sie hat eine klare genetische Komponente: Sie tritt gehäuft in Familien auf, wenn auch nicht immer mit der gleichen Art von Synästhesie.',
|
|
101
101
|
'<strong>Konsistenz:</strong> Im Gegensatz zu erlernten Assoziationen sind synästhetische Farben über die Zeit hinweg außerordentlich stabil. 10-Jahres-Follow-up-Studien zeigen eine über 90-prozentige Konsistenz bei Graphem-Farb-Assoziationen.',
|
|
102
102
|
'<strong>Berühmte Synästhetiker:</strong> Vladimir Nabokov, Wassily Kandinsky, Nikola Tesla und Billy Joel haben öffentlich synästhetische Erfahrungen beschrieben, die ihre Arbeit beeinflusst haben.',
|
|
103
103
|
]},
|
|
104
104
|
{ type: 'stats', items: [
|
|
105
|
-
{ value: '4
|
|
105
|
+
{ value: '4-8 %', label: 'Bevölkerung mit Synästhesie', icon: 'mdi:brain' },
|
|
106
106
|
{ value: '90 %+', label: 'Farbkonsistenz über 10 Jahre', icon: 'mdi:check-circle' },
|
|
107
|
-
{ value: '3
|
|
107
|
+
{ value: '3-6×', label: 'Häufiger bei Frauen', icon: 'mdi:gender-female' },
|
|
108
108
|
{ value: '26+10', label: 'Gefärbte Buchstaben & Ziffern', icon: 'mdi:alphabetical' },
|
|
109
109
|
], columns: 4 },
|
|
110
110
|
{ type: 'title', text: 'Kunst und Synästhesie: Wenn die Sinne verschmelzen', level: 3 },
|
|
111
|
-
{ type: 'paragraph', html: '<strong>Wassily Kandinsky</strong>, Begründer des abstrakten Expressionismus, erlebte sowohl Graphem-Farb- als auch Musik-Farb-Synästhesie: Er hörte Instrumente in Farben (Gelb war eine Trompete, tiefes Blau ein Cello) und nutzte diese Wahrnehmungen für seine Theorie der abstrakten Kunst. In der Musik komponierte <strong>Alexander Skrjabin</strong> <em>Prometheus: Das Poem des Feuers</em> mit einer Stimme für
|
|
111
|
+
{ type: 'paragraph', html: '<strong>Wassily Kandinsky</strong>, Begründer des abstrakten Expressionismus, erlebte sowohl Graphem-Farb- als auch Musik-Farb-Synästhesie: Er hörte Instrumente in Farben (Gelb war eine Trompete, tiefes Blau ein Cello) und nutzte diese Wahrnehmungen für seine Theorie der abstrakten Kunst. In der Musik komponierte <strong>Alexander Skrjabin</strong> <em>Prometheus: Das Poem des Feuers</em> mit einer Stimme für \"tastiera per luce\" (Lichtklavier), die dazu bestimmt war, den jeweiligen Noten entsprechende Farben zu projizieren.' },
|
|
112
112
|
{ type: 'tip', title: 'Farbpalette dieses Tools', html: 'Die Farbzuteilungen sind von den häufigsten statistischen Daten der wissenschaftlichen Literatur inspiriert. <strong>A → rot</strong>, <strong>E → grün</strong>, <strong>I → weiß/schwarz je nach Hintergrund</strong>, <strong>O → schwarz/weiß</strong>, <strong>U → bernsteinfarben</strong>. Konsonanten folgen weniger einheitlichen Mustern, aber der Kontrast zum Hintergrund wird immer priorisiert, um die Lesbarkeit zu gewährleisten.' },
|
|
113
113
|
],
|
|
114
114
|
faq,
|
|
115
|
-
bibliography
|
|
116
|
-
{ name: 'Simner et al. (2006) – Synaesthesia: The prevalence of atypical cross-modal experiences', url: 'https://www.ncbi.nlm.nih.gov/pmc/articles/PMC1626536/' },
|
|
117
|
-
{ name: 'Eagleman et al. (2007) – A standardized test battery for the study of synesthesia', url: 'https://www.sciencedirect.com/science/article/pii/S0010945207000087' },
|
|
118
|
-
{ name: 'Kandinsky, W. – Über das Geistige in der Kunst (1911)', url: 'https://de.wikipedia.org/wiki/Über_das_Geistige_in_der_Kunst' },
|
|
119
|
-
],
|
|
115
|
+
bibliography,
|
|
120
116
|
howTo,
|
|
121
117
|
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
122
118
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { WithContext, FAQPage, HowTo, SoftwareApplication } from 'schema-dts';
|
|
2
|
+
import { bibliography } from '../bibliography';
|
|
2
3
|
import type { SynesthesiaPainterLocaleContent } from '../index';
|
|
3
4
|
|
|
4
5
|
const slug = 'synesthesia-painter';
|
|
@@ -73,7 +74,6 @@ export const content: SynesthesiaPainterLocaleContent = {
|
|
|
73
74
|
title,
|
|
74
75
|
description,
|
|
75
76
|
faqTitle: 'Frequently Asked Questions',
|
|
76
|
-
bibliographyTitle: 'Mind Bibliography',
|
|
77
77
|
ui: {
|
|
78
78
|
title: 'Synesthesia Painter',
|
|
79
79
|
description: 'Transform your words into chromatic art.',
|
|
@@ -95,16 +95,16 @@ export const content: SynesthesiaPainterLocaleContent = {
|
|
|
95
95
|
{ type: 'title', text: 'Statistics and Color Universals', level: 3 },
|
|
96
96
|
{ type: 'paragraph', html: 'Although synesthetic colors are unique to each individual, studies by Simner et al. (2006) and Eagleman et al. (2007) found significant statistical patterns. The vowel <strong>A</strong> tends to be red for most; <strong>O</strong> is white or black; <strong>S</strong> appears in teal or green tones; <strong>E</strong> appears as green or white. Interestingly, color-letter associations are more consistent within a linguistic culture than across different cultures, suggesting a role for early alphabet learning.' },
|
|
97
97
|
{ type: 'list', items: [
|
|
98
|
-
'<strong>Prevalence:</strong> Approximately 4% of the population has grapheme-color synesthesia to some degree, though more recent studies raise this figure to 6
|
|
98
|
+
'<strong>Prevalence:</strong> Approximately 4% of the population has grapheme-color synesthesia to some degree, though more recent studies raise this figure to 6-8% when subclinical forms are included.',
|
|
99
99
|
'<strong>Gender bias:</strong> Synesthesia is 3 to 6 times more common in women than in men, though the causes of this difference are not yet fully explained.',
|
|
100
100
|
'<strong>Heritability:</strong> It has a clear genetic component: it tends to run in families, though not always with the same type of synesthesia.',
|
|
101
101
|
'<strong>Consistency:</strong> Unlike learned associations, synesthetic colors are extraordinarily stable over time. 10-year follow-up studies demonstrate over 90% consistency in grapheme-color associations.',
|
|
102
102
|
'<strong>Famous synesthetes:</strong> Vladimir Nabokov, Wassily Kandinsky, Nikola Tesla, and Billy Joel have publicly described synesthetic experiences that influenced their work.',
|
|
103
103
|
]},
|
|
104
104
|
{ type: 'stats', items: [
|
|
105
|
-
{ value: '4
|
|
105
|
+
{ value: '4-8%', label: 'Population with synesthesia', icon: 'mdi:brain' },
|
|
106
106
|
{ value: '90%+', label: 'Color consistency over 10 years', icon: 'mdi:check-circle' },
|
|
107
|
-
{ value: '3
|
|
107
|
+
{ value: '3-6×', label: 'More common in women', icon: 'mdi:gender-female' },
|
|
108
108
|
{ value: '26+10', label: 'Colored letters & digits', icon: 'mdi:alphabetical' },
|
|
109
109
|
], columns: 4 },
|
|
110
110
|
{ type: 'title', text: 'Art and Synesthesia: When the Senses Merge', level: 3 },
|
|
@@ -112,11 +112,7 @@ export const content: SynesthesiaPainterLocaleContent = {
|
|
|
112
112
|
{ type: 'tip', title: 'Color Palette of This Tool', html: 'The color assignments are inspired by the most common statistical data in scientific literature. <strong>A → red</strong>, <strong>E → green</strong>, <strong>I → white/black depending on background</strong>, <strong>O → black/white</strong>, <strong>U → amber</strong>. Consonants follow less uniform patterns, but contrast with the background is always prioritized to guarantee readability.' },
|
|
113
113
|
],
|
|
114
114
|
faq,
|
|
115
|
-
bibliography
|
|
116
|
-
{ name: 'Simner et al. (2006) – Synaesthesia: The prevalence of atypical cross-modal experiences', url: 'https://www.ncbi.nlm.nih.gov/pmc/articles/PMC1626536/' },
|
|
117
|
-
{ name: 'Eagleman et al. (2007) – A standardized test battery for the study of synesthesia', url: 'https://www.sciencedirect.com/science/article/pii/S0010945207000087' },
|
|
118
|
-
{ name: 'Kandinsky, W. – Concerning the Spiritual in Art (1911)', url: 'https://en.wikipedia.org/wiki/Concerning_the_Spiritual_in_Art' },
|
|
119
|
-
],
|
|
115
|
+
bibliography,
|
|
120
116
|
howTo,
|
|
121
117
|
schemas: [faqSchema as any, howToSchema as any, appSchema],
|
|
122
118
|
};
|