Mjulk

<div data-tn style="display:none">Namenskonzept</div> <style> .mjulk-ks-container { background: #150D0C; color: #F1EBC9; font-family: Trispace, sans-serif; padding: 32px; border-radius: 0; max-width: 100%; } .mjulk-ks-section { margin-bottom: 24px; } .mjulk-ks-title { font-family: Trispace, sans-serif; font-size: 24px; font-weight: 600; margin-bottom: 16px; } .mjulk-ks-subtitle { color: rgba(241,235,201,0.55); font-size: 14px; margin-bottom: 12px; } .mjulk-ks-derivation { background: #1C1C1C; border: 1px solid #2A2020; border-radius: 0; padding: 20px; margin-top: 12px; } .mjulk-ks-lang { font-family: Trispace, sans-serif; font-size: 12px; color: rgba(241,235,201,0.55); text-transform: uppercase; margin-bottom: 8px; } .mjulk-ks-word { font-size: 28px; font-weight: 600; margin-bottom: 8px; } .mjulk-ks-meaning { color: rgba(241,235,201,0.7); font-size: 14px; } .mjulk-ks-connection { margin-top: 16px; padding-top: 16px; border-top: 1px solid #2A2020; } @media(max-width:767px){[class*='-grid'],[class*='-pillars'],[class*='-phases'],[class*='-row'],[class*='-flow'],[class*='-metrics'],[class*='-principles'],[class*='-cards'],[class*='-deliverables'],[class*='ux-'],[class*='vis-'],[class*='faz-']{grid-template-columns:1fr!important;flex-direction:column!important}[class*='-mb']{min-height:500px!important}[class*='-mb-img']{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:320px!important;margin:8px auto!important;display:block!important}h2{font-size:22px!important}h3{font-size:16px!important}[class$='-container'],[class*='-wrap'],[class*='-content']{padding:20px 12px!important;max-width:100%!important;overflow-x:hidden!important}} </style> <div class="mjulk-ks-container"> <div class="mjulk-ks-section"> <div class="mjulk-ks-title">Namensherkunft & Innovation</div> </div> <div class="mjulk-ks-derivation"> <div class="mjulk-ks-lang">Schwedisch</div> <div class="mjulk-ks-word">Mjölk</div> <div class="mjulk-ks-meaning">Milch - Skandinavische Sprachherkunft symbolisiert nordische Naturverbundenheit und Qualität</div> <div class="mjulk-ks-connection"> <div class="mjulk-ks-lang">Interpretation</div> <div style="font-size: 14px; line-height: 1.6; margin-top: 8px;">Die Bezeichnung "Mjulk" verbindet das skandinavische Sprachgefühl mit der Innovation von Pilzmilch. Sie signalisiert nordische Klarheit, natürliche Herkunft und handwerkliche Qualität – zentrale Werte der Marke.</div> </div> </div> </div>

<div data-tn style="display:none">Markenrecherche</div> <style> .mjulk-ra-container { background: #150D0C; color: #F1EBC9; font-family: Trispace, sans-serif; padding: 32px; border-radius: 0; max-width: 100%; } .mjulk-ra-title { font-family:Trispace,sans-serif; font-size: 24px; font-weight: 600; margin-bottom: 8px; } .mjulk-ra-subtitle { color: rgba(241,235,201,0.55); font-size: 14px; margin-bottom: 24px; } .mjulk-ra-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; } .mjulk-ra-card { background: #1C1C1C; border: 1px solid #2A2020; border-radius: 0; padding: 16px; transition: all 0.3s ease; } .mjulk-ra-card:hover { border-color: #3A3030; box-shadow: 0 4px 12px rgba(241,235,201,0.08); } .mjulk-ra-card-name { font-weight: 600; margin-bottom: 8px; } .mjulk-ra-card-feature { color: rgba(241,235,201,0.55); font-size: 12px; line-height: 1.5; } @media(max-width:767px){[class*='-grid'],[class*='-pillars'],[class*='-phases'],[class*='-row'],[class*='-flow'],[class*='-metrics'],[class*='-principles'],[class*='-cards'],[class*='-deliverables'],[class*='ux-'],[class*='vis-'],[class*='faz-']{grid-template-columns:1fr!important;flex-direction:column!important}[class*='-mb']{min-height:500px!important}[class*='-mb-img']{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:320px!important;margin:8px auto!important;display:block!important}h2{font-size:22px!important}h3{font-size:16px!important}[class$='-container'],[class*='-wrap'],[class*='-content']{padding:20px 12px!important;max-width:100%!important;overflow-x:hidden!important}} </style> <div class="mjulk-ra-container"> <div class="mjulk-ra-title">Marktanalyse pflanzlicher Milchalternativen</div> <div class="mjulk-ra-subtitle">Wettbewerbslandschaft und Positionierung</div> <div class="mjulk-ra-grid"> <div class="mjulk-ra-card"> <div class="mjulk-ra-card-name">Oatly</div> <div class="mjulk-ra-card-feature">Hafermilch-Fokus, provokative Marketing-Strategie, junge Zielgruppe, globale Präsenz</div> </div> <div class="mjulk-ra-card"> <div class="mjulk-ra-card-name">Alpro</div> <div class="mjulk-ra-card-feature">Breites Produktportfolio, Soja & Mandel, etablierte Marke, Premium-Positioning</div> </div> <div class="mjulk-ra-card"> <div class="mjulk-ra-card-name">Minor Figures</div> <div class="mjulk-ra-card-feature">Kokosmilch-Spezialist, Café-Segment, hochwertige Ästhetik, Design-fokussiert</div> </div> <div class="mjulk-ra-card"> <div class="mjulk-ra-card-name">Mjulk</div> <div class="mjulk-ra-card-feature">Pilzmilch-Innovation, nordische Herkunft, Typografie-Fokus, Nachhaltigkeitswert</div> </div> </div> </div>

<div data-tn style="display:none">Typografie-System</div> <style> .mjulk-ux-container { background: #150D0C; color: #F1EBC9; font-family: Trispace, sans-serif; padding: 32px; border-radius: 0; max-width: 100%; } .mjulk-ux-title { font-family: Trispace, sans-serif; font-size: 24px; font-weight: 600; margin-bottom: 24px; } .mjulk-ux-axis-group { margin-bottom: 28px; } .mjulk-ux-axis-label { font-family: Trispace, sans-serif; font-size: 12px; text-transform: uppercase; color: rgba(241,235,201,0.55); margin-bottom: 12px; } .mjulk-ux-specimen-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 16px; } .mjulk-ux-specimen { background: #1C1C1C; border: 1px solid #2A2020; border-radius: 0; padding: 12px; text-align: center; } .mjulk-ux-specimen-text { font-family: Trispace, sans-serif; font-size: 18px; margin-bottom: 4px; } .mjulk-ux-specimen-label { font-size: 11px; color: rgba(241,235,201,0.55); } .mjulk-ux-axis-slider { background: #1C1C1C; border-radius: 0; height: 4px; margin: 16px 0; position: relative; } .mjulk-ux-slider-track { background: linear-gradient(to right, rgba(241,235,201,0.2), rgba(241,235,201,0.55)); height: 100%; border-radius: 0; } @media(max-width:767px){[class*='-grid'],[class*='-pillars'],[class*='-phases'],[class*='-row'],[class*='-flow'],[class*='-metrics'],[class*='-principles'],[class*='-cards'],[class*='-deliverables'],[class*='ux-'],[class*='vis-'],[class*='faz-']{grid-template-columns:1fr!important;flex-direction:column!important}[class*='-mb']{min-height:500px!important}[class*='-mb-img']{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:320px!important;margin:8px auto!important;display:block!important}h2{font-size:22px!important}h3{font-size:16px!important}[class$='-container'],[class*='-wrap'],[class*='-content']{padding:20px 12px!important;max-width:100%!important;overflow-x:hidden!important}} </style> <div class="mjulk-ux-container"> <div class="mjulk-ux-title">Variable Schrift – Achsen & Eigenschaften</div> <div class="mjulk-ux-axis-group"> <div class="mjulk-ux-axis-label">Weight-Achse (Gewicht)</div> <div class="mjulk-ux-specimen-grid"> <div class="mjulk-ux-specimen"> <div class="mjulk-ux-specimen-text" style="font-weight: 300;">Mjulk</div> <div class="mjulk-ux-specimen-label">Light</div> </div> <div class="mjulk-ux-specimen"> <div class="mjulk-ux-specimen-text" style="font-weight: 400;">Mjulk</div> <div class="mjulk-ux-specimen-label">Regular</div> </div> <div class="mjulk-ux-specimen"> <div class="mjulk-ux-specimen-text" style="font-weight: 600;">Mjulk</div> <div class="mjulk-ux-specimen-label">Bold</div> </div> </div> <div class="mjulk-ux-axis-slider"> <div class="mjulk-ux-slider-track"></div> </div> </div> <div class="mjulk-ux-axis-group"> <div class="mjulk-ux-axis-label">Width-Achse (Breite)</div> <div class="mjulk-ux-specimen-grid"> <div class="mjulk-ux-specimen"> <div class="mjulk-ux-specimen-text" style="">Mjulk</div> <div class="mjulk-ux-specimen-label">Condensed</div> </div> <div class="mjulk-ux-specimen"> <div class="mjulk-ux-specimen-text">Mjulk</div> <div class="mjulk-ux-specimen-label">Normal</div> </div> <div class="mjulk-ux-specimen"> <div class="mjulk-ux-specimen-text" style="">Mjulk</div> <div class="mjulk-ux-specimen-label">Extended</div> </div> </div> <div class="mjulk-ux-axis-slider"> <div class="mjulk-ux-slider-track"></div> </div> </div> </div>

<div data-tn style="display:none">Ergebnisse</div> <style> .mjulk-eg-container { background: #150D0C; color: #F1EBC9; font-family: Trispace, sans-serif; padding: 32px; border-radius: 0; max-width: 100%; } .mjulk-eg-title { font-family: Trispace, sans-serif; font-size: 24px; font-weight: 600; margin-bottom: 8px; } .mjulk-eg-subtitle { color: rgba(241,235,201,0.55); font-size: 14px; margin-bottom: 24px; } .mjulk-eg-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; } .mjulk-eg-gallery-item { background: #1C1C1C; border: 1px solid #2A2020; border-radius: 0; padding: 16px; text-align: center; } .mjulk-eg-gallery-name { font-weight: 600; margin-bottom: 8px; font-size: 14px; } .mjulk-eg-gallery-desc { color: rgba(241,235,201,0.55); font-size: 12px; line-height: 1.4; } .mjulk-eg-icon { font-size: 32px; margin: 12px 0; } @media(max-width:767px){[class*='-grid'],[class*='-pillars'],[class*='-phases'],[class*='-row'],[class*='-flow'],[class*='-metrics'],[class*='-principles'],[class*='-cards'],[class*='-deliverables'],[class*='ux-'],[class*='vis-'],[class*='faz-']{grid-template-columns:1fr!important;flex-direction:column!important}[class*='-mb']{min-height:500px!important}[class*='-mb-img']{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:320px!important;margin:8px auto!important;display:block!important}h2{font-size:22px!important}h3{font-size:16px!important}[class$='-container'],[class*='-wrap'],[class*='-content']{padding:20px 12px!important;max-width:100%!important;overflow-x:hidden!important}} </style> <div class="mjulk-eg-container"> <div class="mjulk-eg-title">Projektleistungen</div> <div class="mjulk-eg-subtitle">Umgesetzte Designkomponenten</div> <div class="mjulk-eg-gallery"> <div class="mjulk-eg-gallery-item"> <div class="mjulk-eg-icon">📦</div> <div class="mjulk-eg-gallery-name">Packaging Design</div> <div class="mjulk-eg-gallery-desc">Hängetopf und Verpackungslayout für Grow-Sets</div> </div> <div class="mjulk-eg-gallery-item"> <div class="mjulk-eg-icon">🔤</div> <div class="mjulk-eg-gallery-name">Variable Schrift</div> <div class="mjulk-eg-gallery-desc">Mjulk Font in .otf mit mehreren Achsen</div> </div> <div class="mjulk-eg-gallery-item"> <div class="mjulk-eg-icon">🎨</div> <div class="mjulk-eg-gallery-name">Markenidentität</div> <div class="mjulk-eg-gallery-desc">Logo, Farbschema und Typografiestandardss</div> </div> <div class="mjulk-eg-gallery-item"> <div class="mjulk-eg-icon">📋</div> <div class="mjulk-eg-gallery-name">Designsystem</div> <div class="mjulk-eg-gallery-desc">Richtlinien für konsistente Anwendung</div> </div> </div> </div>

<div data-tn style="display:none">Visuelles Design</div> <style> .mjulk-vd-container { background: #150D0C; color: #F1EBC9; font-family: Trispace, sans-serif; padding: 32px; border-radius: 0; max-width: 100%; } .mjulk-vd-title { font-family: Trispace, sans-serif; font-size: 24px; font-weight: 600; margin-bottom: 8px; } .mjulk-vd-subtitle { color: rgba(241,235,201,0.55); font-size: 14px; margin-bottom: 24px; } .mjulk-vd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; } .mjulk-vd-component { background: #1C1C1C; border: 1px solid #2A2020; border-radius: 0; overflow: hidden; } .mjulk-vd-component-header { padding: 16px; border-bottom: 1px solid #2A2020; } .mjulk-vd-component-name { font-weight: 600; margin-bottom: 4px; } .mjulk-vd-component-desc { color: rgba(241,235,201,0.55); font-size: 12px; } .mjulk-vd-component-preview { padding: 20px; text-align: center; } .mjulk-vd-color { width: 60px; height: 60px; border-radius: 0; margin: 0 auto 8px; border: 1px solid #2A2020; } @media(max-width:767px){[class*='-grid'],[class*='-pillars'],[class*='-phases'],[class*='-row'],[class*='-flow'],[class*='-metrics'],[class*='-principles'],[class*='-cards'],[class*='-deliverables'],[class*='ux-'],[class*='vis-'],[class*='faz-']{grid-template-columns:1fr!important;flex-direction:column!important}[class*='-mb']{min-height:500px!important}[class*='-mb-img']{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:320px!important;margin:8px auto!important;display:block!important}h2{font-size:22px!important}h3{font-size:16px!important}[class$='-container'],[class*='-wrap'],[class*='-content']{padding:20px 12px!important;max-width:100%!important;overflow-x:hidden!important}} </style> <div class="mjulk-vd-container"> <div class="mjulk-vd-title">Farbpalette & Typografie</div> <div class="mjulk-vd-subtitle">Kernelemente des Markendesigns</div> <div class="mjulk-vd-grid"> <div class="mjulk-vd-component"> <div class="mjulk-vd-component-header"> <div class="mjulk-vd-component-name">Primärfarbe</div> <div class="mjulk-vd-component-desc">Beige Akzent</div> </div> <div class="mjulk-vd-component-preview"> <div class="mjulk-vd-color" style="background: #F1EBC9;"></div> <div style="font-size: 12px; color: rgba(241,235,201,0.7);">RGB: 241, 235, 201</div> </div> </div> <div class="mjulk-vd-component"> <div class="mjulk-vd-component-header"> <div class="mjulk-vd-component-name">Hintergrund</div> <div class="mjulk-vd-component-desc">Dunkelbraun</div> </div> <div class="mjulk-vd-component-preview"> <div class="mjulk-vd-color" style="background: #150D0C;"></div> <div style="font-size: 12px; color: rgba(241,235,201,0.7);">RGB: 21, 13, 12</div> </div> </div> <div class="mjulk-vd-component"> <div class="mjulk-vd-component-header"> <div class="mjulk-vd-component-name">Headline Font</div> <div class="mjulk-vd-component-desc">Trispace</div> </div> <div class="mjulk-vd-component-preview"> <div style="font-family: Trispace, sans-serif; font-size: 20px; font-weight: 600; margin-bottom: 4px;">Mjulk</div> <div style="font-size: 12px; color: rgba(241,235,201,0.7);">Bold, Serif</div> </div> </div> </div> </div>

<div data-tn style="display:none">Fazit</div> <style> .mjulk-fazit-container { background: #150D0C; color: #F1EBC9; font-family: Trispace, sans-serif; padding: 32px; border-radius: 0; max-width: 100%; } .mjulk-fazit-title { font-family: Trispace, sans-serif; font-size: 24px; font-weight: 600; margin-bottom: 16px; } .mjulk-fazit-text { color: rgba(241,235,201,0.85); font-size: 16px; line-height: 1.8; margin-bottom: 24px; } .mjulk-fazit-highlight { background: #1C1C1C; border-left: 3px solid #F1EBC9; padding: 16px; border-radius: 0; margin-top: 20px; } .mjulk-fazit-highlight-title { font-family: Trispace, sans-serif; font-weight: 600; margin-bottom: 8px; } .mjulk-fazit-highlight-text { color: rgba(241,235,201,0.7); font-size: 14px; } @media(max-width:767px){[class*='-grid'],[class*='-pillars'],[class*='-phases'],[class*='-row'],[class*='-flow'],[class*='-metrics'],[class*='-principles'],[class*='-cards'],[class*='-deliverables'],[class*='ux-'],[class*='vis-'],[class*='faz-']{grid-template-columns:1fr!important;flex-direction:column!important}[class*='-mb']{min-height:500px!important}[class*='-mb-img']{position:relative!important;left:auto!important;top:auto!important;width:100%!important;max-width:320px!important;margin:8px auto!important;display:block!important}h2{font-size:22px!important}h3{font-size:16px!important}[class$='-container'],[class*='-wrap'],[class*='-content']{padding:20px 12px!important;max-width:100%!important;overflow-x:hidden!important}} </style> <div class="mjulk-fazit-container"> <div class="mjulk-fazit-title">Lernergebnisse & Ausblick</div> <div class="mjulk-fazit-text">Das Mjulk-Projekt demonstriert die Kraft integrierter Markengestaltung. Durch die Kombination innovativer Produktkonzepte mit handwerklich gestalteter Typografie schafften wir eine kohärente Markenidentität, die Nachhaltigkeit und Modernität vereint.</div> <div class="mjulk-fazit-highlight"> <div class="mjulk-fazit-highlight-title">Kernerkenntnisse</div> <div class="mjulk-fazit-highlight-text">Variable Schriften bieten einzigartige Möglichkeiten für flexible Markengestaltung. Die Balance zwischen Innovation (Pilzmilch) und Tradition (skandinavisches Design) schafft unterscheidungskräftige Markenidentitäten.</div> </div> </div>