Skip to content

ChuaKenja/OrcasPersonaWebsite

Repository files navigation

🌊 ChuaKenja's Persona | Cyber-Laboratory UI

Typing SVG

📡 System Overview

A highly customized, interactive portfolio inspired by the Persona 3 UI. This project evolves the original aesthetic into a Cyber-Industrial environment using glassmorphism and bento-grid layouts.


🚀 Features

  • Interactive Menu System: Persona 3-inspired navigation with smooth animations
  • Dynamic Resume: Real-time GitHub integration and skill showcase
  • Social Media Integration: Direct links to GitHub, YouTube, and Instagram
  • Responsive Design: Optimized for desktop and mobile viewing
  • Real-time Data: Pulls live data from GitHub API and portfolio configuration

🛠️ Tech Stack

  • Frontend: React 19, Vite 8
  • Styling: CSS-in-JS with custom animations
  • Routing: React Router DOM
  • Animations: Framer Motion
  • API Integration: GitHub REST API
  • Deployment Ready: Optimized build configuration

🎯 Quick Start

# Clone the repository
git clone https://github.com/ChuaKenja/persona3-portfolio.git

# Navigate to project directory
cd persona3-portfolio

# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build

📝 Configuration

Update your personal information in src/portfolioData.js:

export const profile = {
  name: "Your Name",
  username: "YourGitHubUsername",
  title: "Your Title",
  bio: "Your bio...",
  // ... other configuration
};

⚖️ Credits & Acknowledgments

This project is a customized evolution of the Persona 3 UI web experience.

Original Contributors:

  • Original Framework: Special thanks to blairxu13 for the persona3-website repository which served as the architectural foundation.
  • Refinement & Customization: Heavily modified by Hussain (MdHu55a1n) to align with a "Cyber-Laboratory" aesthetic, including:
    • Re-engineering the persona logic and UI components
    • Adding dynamic data integration
    • Updating Resume page with live GitHub integration
    • Replacing social media integrations

Current Version:

  • Personalization & Enhancement: Adapted by OrcaStorm for personal portfolio use, including:
    • Complete rebranding and content updates
    • Enhanced social media integration (YouTube, Instagram)
    • Improved responsive design
    • Updated tech stack and dependencies

Note

This project is for personal portfolio use. Please refer to the original repository for the upstream source and licensing information.


📄 License

This project maintains the same license as the original work. Please respect the original creators' licensing terms.


🤝 Contributing

While this is a personal portfolio, feel free to:

  • Report bugs or issues
  • Suggest improvements
  • Fork for your own portfolio (with proper attribution)

Contributor Role Profile
blairxu13 Original Template & UI Base @blairxu13
Hussain Design Overhaul & Feature Logic @MdHu55a1n
OrcaStorm Personalization & Enhancement @OrcaStorm

🌟 Showcase

Visit the live portfolio: OrcaStorm's Portfolio


Built with ❤️ and inspired by Persona 3

is going to be ripped apart by me so i can learn vite 8# OrcasPersonaWebsite

About

just yonking this for later

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors