Skip to content

About Us Page — Full Implementation #3

@AbinVarghexe

Description

@AbinVarghexe

Description

Implement the full About Us page based on the Figma design (Section: "About Us", Node 624:1473).

Page Route

/aboutapp/about/page.tsx

Sections to Implement

1. Hero Section

  • Same logo animation as home page (reuse LogoScreen pattern)
  • "About Us" / "Our Works" buttons flanking the logo
  • Breadcrumb: Home > About Us

2. Our Story Section

  • Large hero image/rectangle (1252×375)
  • Title: "Our Story"
  • Body text about Incial's founding in 2024 at Kanjirappally, Kerala

3. Our Purpose Section

  • Title: "Our Purpose"
  • Body text about building brands, businesses, and innovation
  • Clean card/section layout with padding

4. Meet Our Team Section

  • Title: "Meet Our Team"
  • 6 team member cards in a 3×2 grid layout
  • Each card: circular avatar, name, title (CEO placeholder)
  • Decorative colored circles behind avatars (blur effect)

5. Awards & Recognitions Section

  • Title: "Awards & Recognitions"
  • 2 award cards side by side:
    • Awwwards – Site of the Day (2024)
    • Red Dot Design Award (2023)
  • Trophy/award icon above each

6. Brand & Impact Marquee Section

  • Two horizontal marquee/ticker strips
  • Text content: "Brand" and "Impact" repeating

7. Contact Section

8. Footer

Technical Requirements

  • Server component for the page shell, client components for animated sections
  • Dark theme (consistent with home page)
  • Framer Motion for section enter animations (scroll-triggered)
  • Responsive: stack team cards vertically on mobile

Branch

feat/about-page

Figma Reference

  • Full page: Node 624:1623 (About — final composite)
  • Team section: Nodes 624:1660 through 624:1698
  • Awards: Node 624:1699
  • Contact: Node 701:587

Parent: #1

Metadata

Metadata

Assignees

Labels

enhancementNew feature or request

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions