Update src/app/page.tsx
This commit is contained in:
294
src/app/page.tsx
294
src/app/page.tsx
@@ -30,22 +30,10 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Concept",
|
||||
id: "about",
|
||||
},
|
||||
{
|
||||
name: "Technology",
|
||||
id: "features",
|
||||
},
|
||||
{
|
||||
name: "Lineup",
|
||||
id: "products",
|
||||
},
|
||||
{
|
||||
name: "Voice",
|
||||
id: "testimonials",
|
||||
},
|
||||
{ name: "Concept", id: "about" },
|
||||
{ name: "Technology", id: "features" },
|
||||
{ name: "Lineup", id: "products" },
|
||||
{ name: "Voice", id: "testimonials" },
|
||||
]}
|
||||
brandName="déjun"
|
||||
/>
|
||||
@@ -53,61 +41,24 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCentered
|
||||
background={{
|
||||
variant: "radial-gradient",
|
||||
}}
|
||||
background={{ variant: "radial-gradient" }}
|
||||
title="未来の肌を、今日の1滴で。"
|
||||
description="再生医療の知見に着想を得て生まれた、日本発のスキンケアブランド。先端科学と日本の美意識が融合した、新たな美の体験を。"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-cute-woman-outdoor_624325-1487.jpg",
|
||||
alt: "User 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/woman-with-blonde-hair-smiling-warmly-minimalist-portrait_24972-2971.jpg",
|
||||
alt: "User 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-charming-fair-haired-woman-pink-clothes-playfully-posing-close-up-photo-refined-lady-with-wavy-hairstyle_197531-9033.jpg",
|
||||
alt: "User 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/closeup-happy-middle-aged-woman-leaning-wall_1262-1743.jpg",
|
||||
alt: "User 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/arrangement-natural-argan-oil-dropper_23-2149016620.jpg",
|
||||
alt: "User 5",
|
||||
},
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-cute-woman-outdoor_624325-1487.jpg", alt: "User 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/woman-with-blonde-hair-smiling-warmly-minimalist-portrait_24972-2971.jpg", alt: "User 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/portrait-charming-fair-haired-woman-pink-clothes-playfully-posing-close-up-photo-refined-lady-with-wavy-hairstyle_197531-9033.jpg", alt: "User 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/closeup-happy-middle-aged-woman-leaning-wall_1262-1743.jpg", alt: "User 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/arrangement-natural-argan-oil-dropper_23-2149016620.jpg", alt: "User 5" },
|
||||
]}
|
||||
avatarText="顧客満足度の高いスキンケア体験"
|
||||
buttons={[
|
||||
{
|
||||
text: "製品ラインナップ",
|
||||
href: "#products",
|
||||
},
|
||||
]}
|
||||
buttons={[{ text: "製品ラインナップ", href: "#products" }]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "科学と美の融合",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "再生医療発想",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "日本製高品質",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "五感に訴える体験",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "365日のケア",
|
||||
},
|
||||
{ type: "text", text: "科学と美の融合" },
|
||||
{ type: "text", text: "再生医療発想" },
|
||||
{ type: "text", text: "日本製高品質" },
|
||||
{ type: "text", text: "五感に訴える体験" },
|
||||
{ type: "text", text: "365日のケア" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -116,19 +67,9 @@ export default function LandingPage() {
|
||||
<InlineImageSplitTextAbout
|
||||
useInvertedBackground={true}
|
||||
heading={[
|
||||
{
|
||||
type: "text",
|
||||
content: "再生医療の発想から、",
|
||||
},
|
||||
{
|
||||
type: "image",
|
||||
src: "http://img.b2bpic.net/free-photo/abstract-watercolor-smoke-eye_23-2148226988.jpg",
|
||||
alt: "About Science",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
content: "365日の美療へ。",
|
||||
},
|
||||
{ type: "text", content: "再生医療の発想から、" },
|
||||
{ type: "image", src: "http://img.b2bpic.net/free-photo/abstract-watercolor-smoke-eye_23-2148226988.jpg", alt: "About Science" },
|
||||
{ type: "text", content: "365日の美療へ。" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -140,21 +81,9 @@ export default function LandingPage() {
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "5-デアザフラビン",
|
||||
description: "ミトコンドリアを活性化し、内側から満ちるハリとつやを育みます。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/abstract-bubbles-gradient-blurred-background_23-2148205217.jpg",
|
||||
},
|
||||
{
|
||||
title: "霧島シリカ波動水",
|
||||
description: "癒しの528Hz波動水が、肌のすみずみまで潤いを届けます。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-floating-water_23-2150963089.jpg",
|
||||
},
|
||||
{
|
||||
title: "五感を整える香り",
|
||||
description: "呼吸するたび肌と心が整う、こだわりの香りの処方。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/essential-oils-aroma-salt-near-leaves-brush_23-2147809223.jpg",
|
||||
},
|
||||
{ title: "5-デアザフラビン", description: "ミトコンドリアを活性化し、内側から満ちるハリとつやを育みます。", imageSrc: "http://img.b2bpic.net/free-photo/abstract-bubbles-gradient-blurred-background_23-2148205217.jpg" },
|
||||
{ title: "霧島シリカ波動水", description: "癒しの528Hz波動水が、肌のすみずみまで潤いを届けます。", imageSrc: "http://img.b2bpic.net/free-photo/close-up-floating-water_23-2150963089.jpg" },
|
||||
{ title: "五感を整える香り", description: "呼吸するたび肌と心が整う、こだわりの香りの処方。", imageSrc: "http://img.b2bpic.net/free-photo/essential-oils-aroma-salt-near-leaves-brush_23-2147809223.jpg" },
|
||||
]}
|
||||
title="肌本来の力を呼び覚ます、三奏の体験"
|
||||
description="視覚、触覚、嗅覚。先端科学と感性が重なり合うスキンケア。"
|
||||
@@ -163,64 +92,17 @@ export default function LandingPage() {
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
gridVariant="bento-grid"
|
||||
useInvertedBackground={true}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "déjun",
|
||||
name: "DEクレンジングエッセンス",
|
||||
price: "10,890円",
|
||||
rating: 5,
|
||||
reviewCount: "128",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232274.jpg",
|
||||
},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "déjun",
|
||||
name: "DEブースター",
|
||||
price: "17,380円",
|
||||
rating: 5,
|
||||
reviewCount: "98",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232242.jpg",
|
||||
},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "déjun",
|
||||
name: "DEローション",
|
||||
price: "13,860円",
|
||||
rating: 5,
|
||||
reviewCount: "84",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/face-wash-tech-device-with-minimalist-monochrome-background_23-2150763323.jpg",
|
||||
},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "déjun",
|
||||
name: "DEミルクセラム",
|
||||
price: "15,180円",
|
||||
rating: 5,
|
||||
reviewCount: "72",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-bottle-with-luxurious-art-nouveau-inspired-sun-relief-background_23-2151420728.jpg",
|
||||
},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "déjun",
|
||||
name: "DEクリーム",
|
||||
price: "18,480円",
|
||||
rating: 5,
|
||||
reviewCount: "65",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/women-s-day-still-life-with-makeup-jewelry_23-2149263180.jpg",
|
||||
},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "déjun",
|
||||
name: "DE UVクリーム クリア",
|
||||
price: "9,680円",
|
||||
rating: 5,
|
||||
reviewCount: "110",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-gua-sha-face-products_23-2149401503.jpg",
|
||||
},
|
||||
{ id: "p1", brand: "déjun", name: "DEクレンジングエッセンス", price: "10,890円", rating: 5, reviewCount: "128", imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232274.jpg" },
|
||||
{ id: "p2", brand: "déjun", name: "DEブースター", price: "17,380円", rating: 5, reviewCount: "98", imageSrc: "http://img.b2bpic.net/free-photo/skin-regeneration-product-still-life_23-2151232242.jpg" },
|
||||
{ id: "p3", brand: "déjun", name: "DEローション", price: "13,860円", rating: 5, reviewCount: "84", imageSrc: "http://img.b2bpic.net/free-photo/face-wash-tech-device-with-minimalist-monochrome-background_23-2150763323.jpg" },
|
||||
{ id: "p4", brand: "déjun", name: "DEミルクセラム", price: "15,180円", rating: 5, reviewCount: "72", imageSrc: "http://img.b2bpic.net/free-photo/cosmetic-bottle-with-luxurious-art-nouveau-inspired-sun-relief-background_23-2151420728.jpg" },
|
||||
{ id: "p5", brand: "déjun", name: "DEクリーム", price: "18,480円", rating: 5, reviewCount: "65", imageSrc: "http://img.b2bpic.net/free-photo/women-s-day-still-life-with-makeup-jewelry_23-2149263180.jpg" },
|
||||
{ id: "p6", brand: "déjun", name: "DE UVクリーム クリア", price: "9,680円", rating: 5, reviewCount: "110", imageSrc: "http://img.b2bpic.net/free-photo/top-view-gua-sha-face-products_23-2149401503.jpg" },
|
||||
]}
|
||||
title="déjun プロフェッショナルラインナップ"
|
||||
description="先端科学を凝縮した、全7製品のスキンケア体験。"
|
||||
@@ -234,21 +116,9 @@ export default function LandingPage() {
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
value: "1st",
|
||||
description: "世界初の同一ナノカプセル技術",
|
||||
},
|
||||
{
|
||||
id: "m2",
|
||||
value: "<1%",
|
||||
description: "希少な国産ウォートンゼリー使用",
|
||||
},
|
||||
{
|
||||
id: "m3",
|
||||
value: "4年",
|
||||
description: "開発に費やした歳月",
|
||||
},
|
||||
{ id: "m1", value: "1st", description: "世界初の同一ナノカプセル技術" },
|
||||
{ id: "m2", value: "<1%", description: "希少な国産ウォートンゼリー使用" },
|
||||
{ id: "m3", value: "4年", description: "開発に費やした歳月" },
|
||||
]}
|
||||
title="確かな研究開発の積み重ね"
|
||||
description="世界初の技術、厳選された素材へのこだわり。"
|
||||
@@ -261,41 +131,11 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "間宮 純子",
|
||||
handle: "Founder",
|
||||
testimonial: "毎日の積み重ねが未来の肌をつくる。自宅で再生医療を受けているかのような実感を届けたい。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/girl-dream-catcher_1321-1596.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "佐藤 美咲",
|
||||
handle: "Beauty Influencer",
|
||||
testimonial: "肌本来のリズムが整うのを実感しています。香りにも癒やされる至福のスキンケアタイムです。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-woman-with-short-hair_23-2148275025.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "田中 恵子",
|
||||
handle: "Clinic Manager",
|
||||
testimonial: "クリニックの施術後サポートとしても患者様から非常に高い評価をいただいています。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/young-lesbian-couple-close-up_23-2148661034.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "鈴木 裕子",
|
||||
handle: "Office Worker",
|
||||
testimonial: "これまでになく、肌が内側から満ちていく感覚です。もう手放せません。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-make-up-look-holding-brush_23-2148784359.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "高橋 直美",
|
||||
handle: "Esthetician",
|
||||
testimonial: "プロとして成分へのこだわりの深さに感銘を受けました。まさに次世代スキンケアです。",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/warm-portrait-beautiful-young-brunette_8353-5051.jpg",
|
||||
},
|
||||
{ id: "1", name: "間宮 純子", handle: "Founder", testimonial: "毎日の積み重ねが未来の肌をつくる。自宅で再生医療を受けているかのような実感を届けたい。", imageSrc: "http://img.b2bpic.net/free-photo/girl-dream-catcher_1321-1596.jpg" },
|
||||
{ id: "2", name: "佐藤 美咲", handle: "Beauty Influencer", testimonial: "肌本来のリズムが整うのを実感しています。香りにも癒やされる至福のスキンケアタイムです。", imageSrc: "http://img.b2bpic.net/free-photo/portrait-senior-woman-with-short-hair_23-2148275025.jpg" },
|
||||
{ id: "3", name: "田中 恵子", handle: "Clinic Manager", testimonial: "クリニックの施術後サポートとしても患者様から非常に高い評価をいただいています。", imageSrc: "http://img.b2bpic.net/free-photo/young-lesbian-couple-close-up_23-2148661034.jpg" },
|
||||
{ id: "4", name: "鈴木 裕子", handle: "Office Worker", testimonial: "これまでになく、肌が内側から満ちていく感覚です。もう手放せません。", imageSrc: "http://img.b2bpic.net/free-photo/male-make-up-look-holding-brush_23-2148784359.jpg" },
|
||||
{ id: "5", name: "高橋 直美", handle: "Esthetician", testimonial: "プロとして成分へのこだわりの深さに感銘を受けました。まさに次世代スキンケアです。", imageSrc: "http://img.b2bpic.net/free-photo/warm-portrait-beautiful-young-brunette_8353-5051.jpg" },
|
||||
]}
|
||||
title="美しさを育む方々の声"
|
||||
description="自信のある方にも、日常に寄り添う新しいケア体験。"
|
||||
@@ -307,21 +147,9 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "f1",
|
||||
title: "敏感肌でも使えますか?",
|
||||
content: "はい。肌が本来持つ力を呼び覚ます考え方のため、自信のある方にも、揺らいでいる方にも日常に取り入れていただきたいと願っております。",
|
||||
},
|
||||
{
|
||||
id: "f2",
|
||||
title: "美容医療の施術後でも使用可能ですか?",
|
||||
content: "施術後のケアの質の底上げとして設計されており、早期回復をサポートするホームケアとして最適です。",
|
||||
},
|
||||
{
|
||||
id: "f3",
|
||||
title: "香りはどのように決めていますか?",
|
||||
content: "フランキンセンスの深さと柑橘のまろやかな光、そこにハーブやウッドの知性を重ねた、肌と心が再起動するような処方です。",
|
||||
},
|
||||
{ id: "f1", title: "敏感肌でも使えますか?", content: "はい。肌が本来持つ力を呼び覚ます考え方のため、自信のある方にも、揺らいでいる方にも日常に取り入れていただきたいと願っております。" },
|
||||
{ id: "f2", title: "美容医療の施術後でも使用可能ですか?", content: "施術後のケアの質の底上げとして設計されており、早期回復をサポートするホームケアとして最適です。" },
|
||||
{ id: "f3", title: "香りはどのように決めていますか?", content: "フランキンセンスの深さと柑橘のまろやかな光、そこにハーブやウッドの知性を重ねた、肌と心が再起動するような処方です。" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/dried-persimmon-fruits-beige-surface_114579-46120.jpg"
|
||||
mediaAnimation="blur-reveal"
|
||||
@@ -335,45 +163,9 @@ export default function LandingPage() {
|
||||
<FooterBaseReveal
|
||||
logoText="déjun"
|
||||
columns={[
|
||||
{
|
||||
title: "Brand",
|
||||
items: [
|
||||
{
|
||||
label: "Concept",
|
||||
href: "#about",
|
||||
},
|
||||
{
|
||||
label: "Technology",
|
||||
href: "#features",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Products",
|
||||
items: [
|
||||
{
|
||||
label: "Lineup",
|
||||
href: "#products",
|
||||
},
|
||||
{
|
||||
label: "Travel Sets",
|
||||
href: "#products",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
items: [
|
||||
{
|
||||
label: "FAQ",
|
||||
href: "#faq",
|
||||
},
|
||||
{
|
||||
label: "Contact Us",
|
||||
href: "mailto:info@dejunun.co.jp",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Brand", items: [{ label: "Concept", href: "#about" }, { label: "Technology", href: "#features" }] },
|
||||
{ title: "Products", items: [{ label: "Lineup", href: "#products" }, { label: "Travel Sets", href: "#products" }] },
|
||||
{ title: "Support", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact Us", href: "mailto:info@dejunun.co.jp" }] },
|
||||
]}
|
||||
copyrightText="© 2024 DE Japan Inc."
|
||||
/>
|
||||
|
||||
Reference in New Issue
Block a user