Skip to content

Commit 34e0a61

Browse files
mmaxencemmaxence
committed
feat: merge sections into 'Ways of Working' hub
- Create new WaysOfWorking component with three subsections: - Our Principles (Values content) - Our Team (Team content) - Our Stack (Tools content) - Update main page navigation to show only 3 sections: - The Mission - Our Mindset - Ways of Working - Remove section wrappers from Values, Team, and Tools components - Add translation keys for Ways of Working in English and Korean - Clean up unused imports in modified components - Maintain all existing functionality while improving content organization
1 parent 50c9ac0 commit 34e0a61

File tree

6 files changed

+132
-83
lines changed

6 files changed

+132
-83
lines changed

‎src/app/page.tsx‎

Lines changed: 4 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,7 @@ import Header from '@/components/layout/Header';
55
import Hero from '@/components/sections/Hero';
66
import MissionVision from '@/components/sections/MissionVision';
77
import { PhilosophyAnimation } from '@/components/sections/PhilosophyAnimation';
8-
import Values from '@/components/sections/Values';
9-
import Team from '@/components/sections/Team';
10-
import Tools from '@/components/sections/Tools';
8+
import WaysOfWorking from '@/components/sections/WaysOfWorking';
119
import Footer from '@/components/layout/Footer';
1210
import InteractiveMinimap from '@/components/ui/InteractiveMinimap';
1311
import SectionNavigation from '@/components/ui/SectionNavigation';
@@ -39,9 +37,7 @@ export default function Home() {
3937
const sections = [
4038
{ id: 'mission-vision', label: 'The Mission' },
4139
{ id: 'philosophy', label: 'Our Mindset' },
42-
{ id: 'values', label: 'The way we work' },
43-
{ id: 'team', label: 'The team' },
44-
{ id: 'tools', label: 'Tools' },
40+
{ id: 'ways-of-working', label: 'Ways of Working' },
4541
];
4642

4743
return (
@@ -87,20 +83,8 @@ export default function Home() {
8783
</ParallaxSection>
8884

8985
<ParallaxSection speed={0.5} offset={150}>
90-
<div id="values" className="scroll-mt-24">
91-
<Values />
92-
</div>
93-
</ParallaxSection>
94-
95-
<ParallaxSection speed={0.6} offset={200}>
96-
<div id="team" className="scroll-mt-24">
97-
<Team />
98-
</div>
99-
</ParallaxSection>
100-
101-
<ParallaxSection speed={0.7} offset={250}>
102-
<div id="tools" className="scroll-mt-24">
103-
<Tools />
86+
<div id="ways-of-working" className="scroll-mt-24">
87+
<WaysOfWorking />
10488
</div>
10589
</ParallaxSection>
10690

‎src/components/sections/Team.tsx‎

Lines changed: 2 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,6 @@
22

33
import { motion } from 'framer-motion';
44
import { useLanguage } from '@/contexts/LanguageContext';
5-
import { BlurReveal } from '../ui/BlurReveal';
6-
import { SectionTitle } from '../ui/SectionTitle';
75
import Avatar from '../ui/Avatar';
86
import { loadTeamMembers, TeamMember } from '@/utils/teamParser';
97
import { useState, useEffect } from 'react';
@@ -47,27 +45,7 @@ const Team = () => {
4745
};
4846

4947
return (
50-
<section id="team" className="py-32 bg-muted/30">
51-
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
52-
{/* Section Header */}
53-
<motion.div
54-
initial={{ opacity: 0, y: 30 }}
55-
whileInView={{ opacity: 1, y: 0 }}
56-
transition={{ duration: 0.6 }}
57-
viewport={{ once: true }}
58-
className="text-center mb-16"
59-
>
60-
<SectionTitle className="mb-6">
61-
<h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold">
62-
{t('team.title')}
63-
</h2>
64-
</SectionTitle>
65-
<BlurReveal>
66-
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
67-
{t('team.subtitle')}
68-
</p>
69-
</BlurReveal>
70-
</motion.div>
48+
<div>
7149

7250

7351
{/* Team Members */}
@@ -152,9 +130,7 @@ const Team = () => {
152130
</div>
153131
)}
154132
</motion.div>
155-
156-
</div>
157-
</section>
133+
</div>
158134
);
159135
};
160136

‎src/components/sections/Tools.tsx‎

Lines changed: 2 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,6 @@
33
import { motion } from 'framer-motion';
44
import { ExternalLink, Palette } from 'lucide-react';
55
import { useLanguage } from '@/contexts/LanguageContext';
6-
import { BlurReveal } from '../ui/BlurReveal';
7-
import { SectionTitle } from '../ui/SectionTitle';
86
import Image from 'next/image';
97

108
const Tools = () => {
@@ -73,27 +71,7 @@ const Tools = () => {
7371
};
7472

7573
return (
76-
<section id="tools" className="py-32">
77-
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
78-
{/* Section Header */}
79-
<motion.div
80-
initial={{ opacity: 0, y: 30 }}
81-
whileInView={{ opacity: 1, y: 0 }}
82-
transition={{ duration: 0.6 }}
83-
viewport={{ once: true }}
84-
className="text-center mb-16"
85-
>
86-
<SectionTitle className="mb-6">
87-
<h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold">
88-
{t('tools.title')}
89-
</h2>
90-
</SectionTitle>
91-
<BlurReveal>
92-
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
93-
{t('tools.subtitle')}
94-
</p>
95-
</BlurReveal>
96-
</motion.div>
74+
<div>
9775

9876
{/* Tools Grid */}
9977
<motion.div
@@ -188,8 +166,7 @@ const Tools = () => {
188166
))}
189167
</motion.div>
190168

191-
</div>
192-
</section>
169+
</div>
193170
);
194171
};
195172

‎src/components/sections/Values.tsx‎

Lines changed: 2 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -215,16 +215,7 @@ const Values = () => {
215215
}, [isValuesInView, translatedValues.length]);
216216

217217
return (
218-
<section className="py-20 px-4 sm:px-6 lg:px-8" ref={valuesSectionRef}>
219-
<div className="max-w-7xl mx-auto">
220-
<div className="text-center mb-16">
221-
<h2 className="text-5xl md:text-7xl font-bold mb-6 bg-gradient-to-r from-foreground to-muted-foreground bg-clip-text text-transparent">
222-
{t('values.title')}
223-
</h2>
224-
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
225-
{t('values.subtitle')}
226-
</p>
227-
</div>
218+
<div ref={valuesSectionRef}>
228219

229220
{/* Value Navigation */}
230221
<div className="flex justify-center mb-12 px-4">
@@ -338,8 +329,7 @@ const Values = () => {
338329
</div>
339330
</div>
340331
</div>
341-
</div>
342-
</section>
332+
</div>
343333
);
344334
};
345335

‎src/components/sections/WaysOfWorking.tsx‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
'use client';
2+
3+
import { motion } from 'framer-motion';
4+
import { useLanguage } from '@/contexts/LanguageContext';
5+
import { BlurReveal } from '../ui/BlurReveal';
6+
import { SectionTitle } from '../ui/SectionTitle';
7+
import Values from './Values';
8+
import Team from './Team';
9+
import Tools from './Tools';
10+
11+
const WaysOfWorking = () => {
12+
const { t } = useLanguage();
13+
14+
const containerVariants = {
15+
hidden: { opacity: 0 },
16+
visible: {
17+
opacity: 1,
18+
transition: {
19+
staggerChildren: 0.2,
20+
},
21+
},
22+
};
23+
24+
const itemVariants = {
25+
hidden: { opacity: 0, y: 30 },
26+
visible: { opacity: 1, y: 0 },
27+
};
28+
29+
return (
30+
<section className="py-20 px-4 sm:px-6 lg:px-8">
31+
<div className="max-w-7xl mx-auto">
32+
<motion.div
33+
variants={containerVariants}
34+
initial="hidden"
35+
whileInView="visible"
36+
viewport={{ once: true, margin: "-100px" }}
37+
className="text-center mb-16"
38+
>
39+
<BlurReveal>
40+
<SectionTitle>
41+
<h2 className="text-4xl md:text-5xl font-bold text-white mb-6">
42+
{t('waysOfWorking.title')}
43+
</h2>
44+
<p className="text-xl text-muted-foreground max-w-3xl mx-auto">
45+
{t('waysOfWorking.subtitle')}
46+
</p>
47+
</SectionTitle>
48+
</BlurReveal>
49+
</motion.div>
50+
51+
<motion.div
52+
variants={containerVariants}
53+
initial="hidden"
54+
whileInView="visible"
55+
viewport={{ once: true, margin: "-100px" }}
56+
className="space-y-20"
57+
>
58+
{/* Our Principles */}
59+
<motion.div variants={itemVariants}>
60+
<div className="text-center mb-12">
61+
<h3 className="text-3xl md:text-4xl font-bold text-white mb-4">
62+
{t('waysOfWorking.principles.title')}
63+
</h3>
64+
<p className="text-lg text-muted-foreground max-w-2xl mx-auto">
65+
{t('waysOfWorking.principles.subtitle')}
66+
</p>
67+
</div>
68+
<Values />
69+
</motion.div>
70+
71+
{/* Our Team */}
72+
<motion.div variants={itemVariants}>
73+
<div className="text-center mb-12">
74+
<h3 className="text-3xl md:text-4xl font-bold text-white mb-4">
75+
{t('waysOfWorking.team.title')}
76+
</h3>
77+
<p className="text-lg text-muted-foreground max-w-2xl mx-auto">
78+
{t('waysOfWorking.team.subtitle')}
79+
</p>
80+
</div>
81+
<Team />
82+
</motion.div>
83+
84+
{/* Our Stack */}
85+
<motion.div variants={itemVariants}>
86+
<div className="text-center mb-12">
87+
<h3 className="text-3xl md:text-4xl font-bold text-white mb-4">
88+
{t('waysOfWorking.stack.title')}
89+
</h3>
90+
<p className="text-lg text-muted-foreground max-w-2xl mx-auto">
91+
{t('waysOfWorking.stack.subtitle')}
92+
</p>
93+
</div>
94+
<Tools />
95+
</motion.div>
96+
</motion.div>
97+
</div>
98+
</section>
99+
);
100+
};
101+
102+
export default WaysOfWorking;

‎src/contexts/LanguageContext.tsx‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,16 @@ const translations = {
5858
'philosophy.subtitle': 'how we approach it',
5959
'philosophy.content': 'At Buzzvil, design shapes how people experience advertising—not as interruptions, but as moments of connection and delight.\nWe believe every touchpoint, from brand to product, should feel playful, engaging, and effortless.\nOur role is to unify how Buzzvil looks, feels, and behaves across the ecosystem, building trust, driving performance, and inspiring what AdTech can become.',
6060

61+
// Ways of Working
62+
'waysOfWorking.title': 'Ways of Working',
63+
'waysOfWorking.subtitle': 'How we think, create, and collaborate at Buzzvil Design.',
64+
'waysOfWorking.principles.title': 'Our Principles',
65+
'waysOfWorking.principles.subtitle': 'How we work together to design at Buzzvil.',
66+
'waysOfWorking.team.title': 'Our Team',
67+
'waysOfWorking.team.subtitle': 'The people behind Buzzvil Design.',
68+
'waysOfWorking.stack.title': 'Our Stack',
69+
'waysOfWorking.stack.subtitle': 'The tools that power our design work.',
70+
6171
// Principles
6272
'principles.title': 'Principles',
6373
'principles.subtitle': 'The principles that guide our approach to design and development.',
@@ -232,6 +242,16 @@ const translations = {
232242
'philosophy.title': '철학',
233243
'philosophy.content': '버즈빌에서 디자인은 사람들이 광고를 경험하는 방식을 형성합니다. 방해가 아닌 즐거운 연결의 순간으로 말입니다. 우리는 브랜드 접점부터 제품 내 경험까지 모든 상호작용이 재미있고, 매력적이며, 자연스러워야 한다고 믿습니다. 우리의 역할은 버즈빌이 생태계 전반에서 어떻게 보이고, 느껴지고, 행동하는지를 통합하여 캠페인과 플랫폼을 하나의 일관되고 즐거운 경험으로 만드는 것입니다. 우리의 원칙과 원팀 정신에 이끌려, 우리는 신뢰를 영감하고, 성과를 추진하며, AdTech가 될 수 있는 새로운 표준을 설정하기 위해 디자인합니다.',
234244

245+
// Ways of Working
246+
'waysOfWorking.title': '작업 방식',
247+
'waysOfWorking.subtitle': '버즈빌 디자인에서 우리가 생각하고, 창조하고, 협업하는 방식.',
248+
'waysOfWorking.principles.title': '우리의 원칙',
249+
'waysOfWorking.principles.subtitle': '버즈빌에서 디자인하기 위해 함께 작업하는 방식.',
250+
'waysOfWorking.team.title': '우리의 팀',
251+
'waysOfWorking.team.subtitle': '버즈빌 디자인을 만드는 사람들.',
252+
'waysOfWorking.stack.title': '우리의 스택',
253+
'waysOfWorking.stack.subtitle': '우리의 디자인 작업을 지원하는 도구들.',
254+
235255
// Principles
236256
'principles.title': '원칙',
237257
'principles.subtitle': '디자인과 개발 접근 방식을 이끄는 원칙들.',

0 commit comments

Comments
 (0)