Update src/app/projects/digital-brand-identity/page.tsx
This commit is contained in:
@@ -2,127 +2,88 @@
|
||||
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
|
||||
import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
|
||||
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
|
||||
import FeatureCardTwentyFour from "@/components/sections/feature/FeatureCardTwentyFour";
|
||||
import ContactCenter from "@/components/sections/contact/ContactCenter";
|
||||
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
|
||||
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
|
||||
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
||||
import ContactCenter from '@/components/sections/contact/ContactCenter';
|
||||
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
|
||||
|
||||
export default function DigitalBrandIdentity() {
|
||||
const navItems = [
|
||||
{ name: "Home", id: "/" },
|
||||
{ name: "Projects", id: "/projects" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
];
|
||||
|
||||
export default function DigitalBrandIdentityPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="shift-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="soft"
|
||||
contentWidth="smallMedium"
|
||||
sizing="mediumLarge"
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="outline"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
brandName="Portfolio"
|
||||
navItems={[
|
||||
{ name: "Work", id: "/" },
|
||||
{ name: "About", id: "/" },
|
||||
{ name: "Services", id: "/" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
button={{
|
||||
text: "Get in Touch", href: "contact"}}
|
||||
/>
|
||||
<NavbarLayoutFloatingOverlay navItems={navItems} />
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroBillboardCarousel
|
||||
title="Digital Brand Identity System"
|
||||
description="Complete visual identity redesign for a forward-thinking tech startup. This comprehensive project encompassed brand strategy, visual identity development, and full design system creation that elevated brand presence and market positioning."
|
||||
tag="Case Study"
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
title="Digital Brand Identity"
|
||||
description="A comprehensive brand redesign for a tech startup"
|
||||
background={{ variant: "animated-grid" }}
|
||||
mediaItems={[
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AhRowzw9k0ZSJ87n7KX34EwoE1/a-beautiful-case-study-image-showing-a-c-1773043067456-ca425d2a.png", imageAlt: "Digital brand identity system showcase"},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AhRowzw9k0ZSJ87n7KX34EwoE1/professional-portfolio-piece-featuring-s-1773043067962-bd19ff43.png", imageAlt: "Brand identity design details"},
|
||||
{
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AhRowzw9k0ZSJ87n7KX34EwoE1/high-end-portfolio-presentation-featurin-1773043068108-9dc5d0cb.png", imageAlt: "Brand guidelines documentation"},
|
||||
imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Brand identity showcase"},
|
||||
]}
|
||||
buttons={[
|
||||
{ text: "Back to Work", href: "/" },
|
||||
{ text: "Next Project", href: "/projects/ecommerce-platform-redesign" },
|
||||
{ text: "Back to Projects", href: "/projects" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="overview" data-section="overview">
|
||||
<TextSplitAbout
|
||||
title="Project Overview"
|
||||
description={[
|
||||
"Our client, a rapidly growing SaaS company, needed a cohesive visual identity to stand out in a competitive market. Their existing branding felt generic and didn't communicate their innovative spirit.", "We conducted extensive market research and stakeholder interviews to understand their vision, values, and target audience. This informed every design decision from color palette to typography.", "The result was a comprehensive brand system that included logo redesign, color palette, typography guidelines, imagery style, and a complete digital asset library. The new identity increased brand recognition by 40% and contributed to a 25% growth in customer acquisition within six months."]}
|
||||
buttons={[
|
||||
{ text: "View More Projects", href: "/" },
|
||||
]}
|
||||
showBorder={false}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="challenge" data-section="challenge">
|
||||
<div id="work" data-section="work">
|
||||
<FeatureCardTwentyFour
|
||||
title="Challenges & Solutions"
|
||||
description="Key obstacles and our strategic approach to solving them"
|
||||
tag="Strategy"
|
||||
title="Project Highlights"
|
||||
description="Key deliverables and outcomes"
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
features={[
|
||||
{
|
||||
id: "1", title: "Brand Differentiation", author: "Challenge", description: "The tech startup market is saturated with similar visual identities. We needed to create something distinctive that would cut through the noise while remaining professional and trustworthy.", tags: ["Market Research", "Strategy", "Differentiation"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AhRowzw9k0ZSJ87n7KX34EwoE1/abstract-illustration-representing-creat-1773043067648-d1f91d56.png?_wi=1", imageAlt: "Brand differentiation strategy"},
|
||||
id: "1", title: "Logo Design", author: "Brand Team", description: "Modern and versatile logo system", tags: ["Branding", "Logo"],
|
||||
imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Logo design"},
|
||||
{
|
||||
id: "2", title: "Scalability Requirements", author: "Challenge", description: "The design system needed to work across web, mobile, print, and emerging platforms. We created flexible guidelines that maintained consistency while adapting to different mediums and formats.", tags: ["Scalability", "Design System", "Flexibility"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AhRowzw9k0ZSJ87n7KX34EwoE1/modern-illustration-depicting-branding-a-1773043067558-0eccfee5.png", imageAlt: "Scalable design system approach"},
|
||||
id: "2", title: "Color Palette", author: "Design", description: "Vibrant and cohesive color system", tags: ["Design", "Colors"],
|
||||
imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Color palette"},
|
||||
{
|
||||
id: "3", title: "Brand Evolution", author: "Challenge", description: "The client needed flexibility for future growth and brand evolution. We designed a modular system that could evolve without losing its core identity. This approach has allowed them to expand into new markets with confidence.", tags: ["Growth", "Evolution", "Modularity"],
|
||||
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AhRowzw9k0ZSJ87n7KX34EwoE1/abstract-illustration-representing-creat-1773043067648-d1f91d56.png?_wi=2", imageAlt: "Brand evolution framework"},
|
||||
id: "3", title: "Typography", author: "Design", description: "Custom typography guidelines", tags: ["Typography", "Brand"],
|
||||
imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Typography system"},
|
||||
]}
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="results" data-section="results">
|
||||
<TextSplitAbout
|
||||
title="Project Results & Impact"
|
||||
description={[
|
||||
"Following the implementation of the new brand identity, the client experienced significant business improvements. Brand recognition increased by 40% as measured by customer surveys and market research.", "Customer acquisition grew by 25% in the six months following the rebrand, demonstrating the direct impact of stronger brand positioning. The new identity helped the company communicate its innovative approach more effectively.", "The design system reduced internal design time by 35%, allowing the team to focus on strategic projects rather than repetitive design work. Developers also reported a smoother handoff process thanks to comprehensive documentation."]}
|
||||
buttons={[
|
||||
{ text: "Start Your Project", href: "contact" },
|
||||
]}
|
||||
showBorder={true}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCenter
|
||||
tag="Let's Collaborate"
|
||||
title="Ready to Transform Your Brand?"
|
||||
description="Let's discuss how strategic branding and design can elevate your business and create lasting impact in your market."
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Interested?"
|
||||
title="Let's Discuss Your Brand"
|
||||
description="Ready to create a powerful brand identity?"
|
||||
background={{ variant: "plain" }}
|
||||
useInvertedBackground={false}
|
||||
inputPlaceholder="Enter your email address"
|
||||
buttonText="Send Message"
|
||||
termsText="I'll respond within 24 hours. We respect your privacy and will never share your information."
|
||||
buttonText="Schedule Consultation"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterLogoReveal
|
||||
logoText="Portfolio"
|
||||
leftLink={{ text: "Privacy Policy", href: "#" }}
|
||||
rightLink={{ text: "Terms of Service", href: "#" }}
|
||||
logoText="Our Studio"
|
||||
leftLink={{ text: "Privacy Policy", href: "/privacy" }}
|
||||
rightLink={{ text: "Contact", href: "contact" }}
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
|
||||
Reference in New Issue
Block a user