Merge version_1 into main #2
253
src/app/page.tsx
253
src/app/page.tsx
@@ -33,17 +33,11 @@ export default function LandingPage() {
|
||||
<NavbarStyleCentered
|
||||
navItems={[
|
||||
{
|
||||
name: "Work",
|
||||
id: "#portfolio",
|
||||
},
|
||||
name: "Work", id: "#portfolio"},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
name: "About", id: "#about"},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
name: "Contact", id: "#contact"},
|
||||
]}
|
||||
brandName="ROMA DESIGN"
|
||||
/>
|
||||
@@ -52,64 +46,39 @@ export default function LandingPage() {
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboard
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
variant: "gradient-bars"}}
|
||||
title="Creative Design from Rome"
|
||||
description="Crafting digital experiences that define modern aesthetics. I merge minimal Italian style with high-end digital precision."
|
||||
buttons={[
|
||||
{
|
||||
text: "View My Work",
|
||||
href: "#portfolio",
|
||||
},
|
||||
text: "View My Work", href: "#portfolio"},
|
||||
{
|
||||
text: "Contact Me",
|
||||
href: "#contact",
|
||||
},
|
||||
text: "Contact Me", href: "#contact"},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/3d-render-abstract-modern-network-communications-background-with-plexus-design_1048-15652.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/3d-render-abstract-modern-network-communications-background-with-plexus-design_1048-15652.jpg"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/handsome-businessman-standing-blackboard_329181-746.jpg",
|
||||
alt: "Portrait 1",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/handsome-businessman-standing-blackboard_329181-746.jpg", alt: "Portrait 1"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-4617.jpg",
|
||||
alt: "Portrait 2",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-blonde-businesswoman-formal-dressed-isolated-dark-textured-background_613910-4617.jpg", alt: "Portrait 2"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-smiling-businessman-wearing-glasses_329181-745.jpg",
|
||||
alt: "Portrait 3",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-smiling-businessman-wearing-glasses_329181-745.jpg", alt: "Portrait 3"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-middle-aged-hispanic-cheerful-female-with-curly-hair_181624-53321.jpg",
|
||||
alt: "Portrait 4",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-middle-aged-hispanic-cheerful-female-with-curly-hair_181624-53321.jpg", alt: "Portrait 4"},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-woman-with-cigarette-brown-winter-head-blue-scarf_613910-331.jpg",
|
||||
alt: "Portrait 5",
|
||||
},
|
||||
src: "http://img.b2bpic.net/free-photo/portrait-woman-with-cigarette-brown-winter-head-blue-scarf_613910-331.jpg", alt: "Portrait 5"},
|
||||
]}
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "UI/UX DESIGN",
|
||||
},
|
||||
type: "text", text: "UI/UX DESIGN"},
|
||||
{
|
||||
type: "text",
|
||||
text: "BRAND IDENTITY",
|
||||
},
|
||||
type: "text", text: "BRAND IDENTITY"},
|
||||
{
|
||||
type: "text",
|
||||
text: "WEB DEVELOPMENT",
|
||||
},
|
||||
type: "text", text: "WEB DEVELOPMENT"},
|
||||
{
|
||||
type: "text",
|
||||
text: "ART DIRECTION",
|
||||
},
|
||||
type: "text", text: "ART DIRECTION"},
|
||||
{
|
||||
type: "text",
|
||||
text: "STRATEGY",
|
||||
},
|
||||
type: "text", text: "STRATEGY"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -119,9 +88,7 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
title="Philosophy of Design"
|
||||
description={[
|
||||
"Every project is an opportunity to distill complex ideas into refined, intuitive interfaces.",
|
||||
"Located in the heart of Rome, I bring international perspective with a local soul to your digital products.",
|
||||
]}
|
||||
"Every project is an opportunity to distill complex ideas into refined, intuitive interfaces.", "Located in the heart of Rome, I bring international perspective with a local soul to your digital products."]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -133,26 +100,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
title: "UI/UX Design",
|
||||
description: "Creating seamless user experiences that convert.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-plexus-design-technology-background_1048-15593.jpg?_wi=1",
|
||||
titleImageSrc: "http://img.b2bpic.net/free-photo/artistic-blurry-colorful-wallpaper-background_58702-8430.jpg",
|
||||
buttonText: "Learn More",
|
||||
},
|
||||
title: "UI/UX Design", description: "Creating seamless user experiences that convert.", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-plexus-design-technology-background_1048-15593.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/artistic-blurry-colorful-wallpaper-background_58702-8430.jpg", buttonText: "Learn More"},
|
||||
{
|
||||
title: "Brand Identity",
|
||||
description: "Defining your visual voice in the digital market.",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-freelancer-calling-financial-expert-home-discuss-about-funds_482257-126245.jpg?_wi=1",
|
||||
titleImageSrc: "http://img.b2bpic.net/free-photo/table-lamp-laptop-yellow-paper-plane-cork-board-against-white-background_23-2147873583.jpg",
|
||||
buttonText: "Learn More",
|
||||
},
|
||||
title: "Brand Identity", description: "Defining your visual voice in the digital market.", imageSrc: "http://img.b2bpic.net/free-photo/male-freelancer-calling-financial-expert-home-discuss-about-funds_482257-126245.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/table-lamp-laptop-yellow-paper-plane-cork-board-against-white-background_23-2147873583.jpg", buttonText: "Learn More"},
|
||||
{
|
||||
title: "Web Development",
|
||||
description: "High-performance websites built to scale.",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-communication-logo-template_23-2149816399.jpg?_wi=1",
|
||||
titleImageSrc: "http://img.b2bpic.net/free-photo/two-luminous-lamps-hang-dark-from-boke-decor-atmosphere-concept_169016-9527.jpg",
|
||||
buttonText: "Learn More",
|
||||
},
|
||||
title: "Web Development", description: "High-performance websites built to scale.", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-communication-logo-template_23-2149816399.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/two-luminous-lamps-hang-dark-from-boke-decor-atmosphere-concept_169016-9527.jpg", buttonText: "Learn More"},
|
||||
]}
|
||||
title="Expertise"
|
||||
description="Comprehensive design solutions tailored to your brand's unique needs."
|
||||
@@ -166,23 +118,14 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "m1",
|
||||
icon: Award,
|
||||
title: "Awards Won",
|
||||
value: "15+",
|
||||
},
|
||||
id: "m1", icon: Award,
|
||||
title: "Awards Won", value: "15+"},
|
||||
{
|
||||
id: "m2",
|
||||
icon: Star,
|
||||
title: "Projects Completed",
|
||||
value: "80+",
|
||||
},
|
||||
id: "m2", icon: Star,
|
||||
title: "Projects Completed", value: "80+"},
|
||||
{
|
||||
id: "m3",
|
||||
icon: Users,
|
||||
title: "Happy Clients",
|
||||
value: "50+",
|
||||
},
|
||||
id: "m3", icon: Users,
|
||||
title: "Happy Clients", value: "50+"},
|
||||
]}
|
||||
title="Impact by Numbers"
|
||||
description="Data-driven results for every client."
|
||||
@@ -191,64 +134,29 @@ export default function LandingPage() {
|
||||
|
||||
<div id="portfolio" data-section="portfolio">
|
||||
<ProductCardTwo
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "p1",
|
||||
brand: "Brand",
|
||||
name: "Luxury Hotel UI",
|
||||
price: "Rome",
|
||||
rating: 5,
|
||||
reviewCount: "100",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/inspired-youth_53876-176745.jpg",
|
||||
},
|
||||
id: "p1", brand: "Brand", name: "Luxury Hotel UI", price: "Rome", rating: 5,
|
||||
reviewCount: "100", imageSrc: "http://img.b2bpic.net/free-photo/inspired-youth_53876-176745.jpg"},
|
||||
{
|
||||
id: "p2",
|
||||
brand: "Brand",
|
||||
name: "Fashion E-commerce",
|
||||
price: "Milan",
|
||||
rating: 5,
|
||||
reviewCount: "80",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/blend-minimal-nordic-interior-design-with-japanese-wabi-sabi-style_23-2151160082.jpg",
|
||||
},
|
||||
id: "p2", brand: "Brand", name: "Fashion E-commerce", price: "Milan", rating: 5,
|
||||
reviewCount: "80", imageSrc: "http://img.b2bpic.net/free-photo/blend-minimal-nordic-interior-design-with-japanese-wabi-sabi-style_23-2151160082.jpg"},
|
||||
{
|
||||
id: "p3",
|
||||
brand: "Brand",
|
||||
name: "Tech Startup Platform",
|
||||
price: "Berlin",
|
||||
rating: 5,
|
||||
reviewCount: "120",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/infographic-with-options-circular-shape_1057-1633.jpg",
|
||||
},
|
||||
id: "p3", brand: "Brand", name: "Tech Startup Platform", price: "Berlin", rating: 5,
|
||||
reviewCount: "120", imageSrc: "http://img.b2bpic.net/free-vector/infographic-with-options-circular-shape_1057-1633.jpg"},
|
||||
{
|
||||
id: "p4",
|
||||
brand: "Brand",
|
||||
name: "Creative Studio Landing",
|
||||
price: "Paris",
|
||||
rating: 5,
|
||||
reviewCount: "60",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-desk-dark-concept-with-copy-space_23-2148459468.jpg",
|
||||
},
|
||||
id: "p4", brand: "Brand", name: "Creative Studio Landing", price: "Paris", rating: 5,
|
||||
reviewCount: "60", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-desk-dark-concept-with-copy-space_23-2148459468.jpg"},
|
||||
{
|
||||
id: "p5",
|
||||
brand: "Brand",
|
||||
name: "Restaurant Concept",
|
||||
price: "Rome",
|
||||
rating: 5,
|
||||
reviewCount: "90",
|
||||
imageSrc: "http://img.b2bpic.net/free-psd/technology-landing-page-template-design_23-2149406243.jpg",
|
||||
},
|
||||
id: "p5", brand: "Brand", name: "Restaurant Concept", price: "Rome", rating: 5,
|
||||
reviewCount: "90", imageSrc: "http://img.b2bpic.net/free-psd/technology-landing-page-template-design_23-2149406243.jpg"},
|
||||
{
|
||||
id: "p6",
|
||||
brand: "Brand",
|
||||
name: "Art Gallery Portal",
|
||||
price: "London",
|
||||
rating: 5,
|
||||
reviewCount: "110",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/concentrated-young-lady-designer-sitting-office_171337-15586.jpg",
|
||||
},
|
||||
id: "p6", brand: "Brand", name: "Art Gallery Portal", price: "London", rating: 5,
|
||||
reviewCount: "110", imageSrc: "http://img.b2bpic.net/free-photo/concentrated-young-lady-designer-sitting-office_171337-15586.jpg"},
|
||||
]}
|
||||
title="Selected Works"
|
||||
description="A curated collection of my most impactful digital projects."
|
||||
@@ -261,60 +169,15 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Alessandro Rossi",
|
||||
date: "Jan 2024",
|
||||
title: "Founder",
|
||||
quote: "Exceptional vision and execution.",
|
||||
tag: "Brand",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/positive-shaved-head-male-dressed-grey-suit-dark-grey-background_613910-11352.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-modern-network-communications-background-with-plexus-design_1048-15652.jpg?_wi=2",
|
||||
imageAlt: "modern headshot professional man",
|
||||
},
|
||||
id: "1", name: "Alessandro Rossi", date: "Jan 2024", title: "Founder", quote: "Exceptional vision and execution.", tag: "Brand", avatarSrc: "http://img.b2bpic.net/free-photo/positive-shaved-head-male-dressed-grey-suit-dark-grey-background_613910-11352.jpg", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-abstract-modern-network-communications-background-with-plexus-design_1048-15652.jpg", imageAlt: "modern headshot professional man"},
|
||||
{
|
||||
id: "2",
|
||||
name: "Elena Bianchi",
|
||||
date: "Dec 2023",
|
||||
title: "CEO",
|
||||
quote: "Changed our brand perception completely.",
|
||||
tag: "Digital",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/adorable-charming-woman-with-beam-head-with-red-lips-wearing-white-shirt-is-looking-down-smiling-isolated-beige-background_291650-2045.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/male-freelancer-calling-financial-expert-home-discuss-about-funds_482257-126245.jpg?_wi=2",
|
||||
imageAlt: "modern headshot professional man",
|
||||
},
|
||||
id: "2", name: "Elena Bianchi", date: "Dec 2023", title: "CEO", quote: "Changed our brand perception completely.", tag: "Digital", avatarSrc: "http://img.b2bpic.net/free-photo/adorable-charming-woman-with-beam-head-with-red-lips-wearing-white-shirt-is-looking-down-smiling-isolated-beige-background_291650-2045.jpg", imageSrc: "http://img.b2bpic.net/free-photo/male-freelancer-calling-financial-expert-home-discuss-about-funds_482257-126245.jpg", imageAlt: "modern headshot professional man"},
|
||||
{
|
||||
id: "3",
|
||||
name: "Marco Ferraro",
|
||||
date: "Nov 2023",
|
||||
title: "Manager",
|
||||
quote: "Professional, efficient, and creative.",
|
||||
tag: "Strategy",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-shooting-with-projector_23-2149424923.jpg",
|
||||
imageAlt: "modern headshot professional man",
|
||||
},
|
||||
id: "3", name: "Marco Ferraro", date: "Nov 2023", title: "Manager", quote: "Professional, efficient, and creative.", tag: "Strategy", avatarSrc: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg", imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-shooting-with-projector_23-2149424923.jpg", imageAlt: "modern headshot professional man"},
|
||||
{
|
||||
id: "4",
|
||||
name: "Sofia Conti",
|
||||
date: "Oct 2023",
|
||||
title: "Marketing",
|
||||
quote: "The best designer in the city.",
|
||||
tag: "Design",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-suit_23-2149705921.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-communication-logo-template_23-2149816399.jpg?_wi=2",
|
||||
imageAlt: "modern headshot professional man",
|
||||
},
|
||||
id: "4", name: "Sofia Conti", date: "Oct 2023", title: "Marketing", quote: "The best designer in the city.", tag: "Design", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-bearded-man-suit_23-2149705921.jpg", imageSrc: "http://img.b2bpic.net/free-vector/hand-drawn-communication-logo-template_23-2149816399.jpg", imageAlt: "modern headshot professional man"},
|
||||
{
|
||||
id: "5",
|
||||
name: "Luigi Verdi",
|
||||
date: "Sep 2023",
|
||||
title: "Founder",
|
||||
quote: "Truly remarkable results delivered fast.",
|
||||
tag: "Tech",
|
||||
avatarSrc: "http://img.b2bpic.net/free-photo/flat-lay-desk-dark-concept-with-copy-space_23-2148459468.jpg",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-plexus-design-technology-background_1048-15593.jpg?_wi=2",
|
||||
imageAlt: "modern headshot professional man",
|
||||
},
|
||||
id: "5", name: "Luigi Verdi", date: "Sep 2023", title: "Founder", quote: "Truly remarkable results delivered fast.", tag: "Tech", avatarSrc: "http://img.b2bpic.net/free-photo/flat-lay-desk-dark-concept-with-copy-space_23-2148459468.jpg", imageSrc: "http://img.b2bpic.net/free-photo/3d-render-low-poly-plexus-design-technology-background_1048-15593.jpg", imageAlt: "modern headshot professional man"},
|
||||
]}
|
||||
title="Client Voices"
|
||||
description="What partners say about our collaboration."
|
||||
@@ -327,20 +190,11 @@ export default function LandingPage() {
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "q1",
|
||||
title: "What's your design process?",
|
||||
content: "I start with research, then move to strategy, wireframing, high-fidelity design, and final execution.",
|
||||
},
|
||||
id: "q1", title: "What's your design process?", content: "I start with research, then move to strategy, wireframing, high-fidelity design, and final execution."},
|
||||
{
|
||||
id: "q2",
|
||||
title: "Do you work remotely?",
|
||||
content: "Yes, I collaborate with clients worldwide.",
|
||||
},
|
||||
id: "q2", title: "Do you work remotely?", content: "Yes, I collaborate with clients worldwide."},
|
||||
{
|
||||
id: "q3",
|
||||
title: "What's your availability?",
|
||||
content: "I am currently accepting new projects.",
|
||||
},
|
||||
id: "q3", title: "What's your availability?", content: "I am currently accepting new projects."},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/view-3d-button_23-2149917526.jpg"
|
||||
mediaAnimation="opacity"
|
||||
@@ -354,8 +208,7 @@ export default function LandingPage() {
|
||||
<ContactSplit
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "plain",
|
||||
}}
|
||||
variant: "plain"}}
|
||||
tag="Get in touch"
|
||||
title="Ready to design?"
|
||||
description="Let's bring your vision to life."
|
||||
@@ -368,13 +221,9 @@ export default function LandingPage() {
|
||||
<FooterLogoReveal
|
||||
logoText="ROMA DESIGN"
|
||||
leftLink={{
|
||||
text: "Privacy Policy",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Privacy Policy", href: "#"}}
|
||||
rightLink={{
|
||||
text: "Terms",
|
||||
href: "#",
|
||||
}}
|
||||
text: "Terms", href: "#"}}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
|
||||
Reference in New Issue
Block a user