HEX
Server: LiteSpeed
System: Linux bq-e808 5.14.0-503.23.2.el9_5.x86_64 #1 SMP PREEMPT_DYNAMIC Wed Feb 12 05:52:18 EST 2025 x86_64
User: memecom (1010)
PHP: 8.2.27
Disabled: NONE
Upload Files
File: /home/memecom/domains/pchen.info/public_html/project-detail.html
<!DOCTYPE html>
<html lang="en">

<head>
    <!-- ===== Meta ===== -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- ===== Favicon ===== -->
    <link rel="icon" type="image/x-icon" href="./assets/imgs/favicon.svg">

    <!-- ===== Title ===== -->
    <title>Stag - Personal Portfolio HTML5 Template</title>

    <!-- ===== LineAwesome ===== -->
    <link rel="stylesheet"
        href="https://maxst.icons8.com/vue-static/landings/line-awesome/line-awesome/1.3.0/css/line-awesome.min.css">


    <!-- ===== Fonts ===== -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link
        href="https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100;0,9..40,200;0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,100;1,9..40,200&display=swap"
        rel="stylesheet">

    <!-- ===== Stylesheet ===== -->
    <link rel="stylesheet" href="./assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="./assets/css/swiper.min.css">
    <link rel="stylesheet" href="./assets/css/style.css">
    <link rel="stylesheet" href="./assets/css/responsive.css">
</head>

<body>

    <main class="project-detail-page" id="top">

        <!-- Sticky Sidebar
        ======================================= -->
        <div class="sticky-sidebar">
            <div class="sticky-sidebar-inner">
                <div class="sidebar-top">
                    <div class="sidebar-logo">
                        <div class="left">
                            <a href="./index.html" class="logo-img">
                                <img src="./assets/imgs/logo.svg" alt="Logo">
                            </a>
                            <a href="./index.html" class="logo-text">STAG</a>
                        </div>
                        <div class="right">
                            <span id="current-time"></span>
                            <i class="las la-ellipsis-v"></i>
                        </div>
                    </div>

                    <div class="sidebar-me">
                        <div class="sidebar-me-inner">
                            <div class="img-box">
                                <img src="./assets/imgs/me.png" alt="Me">
                            </div>
                            <div class="content">
                                <h3>David Henderson</h3>
                                <p>Back End Developer</p>
                                <span class="location"><i class="ph-duotone ph-map-pin"></i> San francisco</span>
                            </div>
                        </div>
                    </div>

                    <div class="sidebar-menu">
                        <nav class="menu-lists">
                            <ul>
                                <li>
                                    <a href="./index.html"><span class="icon"><i class="ph-duotone ph-house"></i></span> <span class="title">Home</span></a>
                                </li>
                                <li>
                                    <a href="./projects.html"><span class="icon"><i class="ph-duotone ph-squares-four"></i></span> <span class="title">Projects</span></a>
                                </li>
                                <li>
                                    <a href="./about.html"><span class="icon"><i class="ph-duotone ph-fingerprint"></i></span> <span class="title">About</span></a>
                                </li>
                                <li>
                                    <a href="./gallery.html"><span class="icon"><i class="ph-duotone ph-camera"></i></span> <span class="title">Gallery</span></a>
                                </li>
                                <li>
                                    <a href="./contact.html"><span class="icon"><i class="ph-duotone ph-paperclip"></i></span> <span class="title">Contact</span></a>
                                </li>
                                <li>
                                    <a href="./blog.html"><span class="icon"><i class="ph-duotone ph-swatches"></i></span> <span class="title">Blog</span></a>
                                </li>
                            </ul>
                        </nav>
                        <div class="responsive-mode sidebar-bottom">
                            <div class="social-link-wrap">
                                <ul class="social-links">
                                    <li><a href="#"><i class="lab la-dribbble"></i></a></li>
                                    <li><a href="#"><i class="lab la-xing"></i></a></li>
                                    <li><a href="#"><i class="lab la-instagram"></i></a></li>
                                    <li><a href="#"><i class="lab la-youtube"></i></a></li>
                                </ul>
                            </div>
                            <p class="copyright-text">
                                &copy; 2024
                            </p>
                        </div>
                    </div>

                    <div class="humberg-menu">
                        <span></span>
                        <span></span>
                        <span></span>
                    </div>
                </div>
                <div class="sidebar-bottom">
                    <div class="social-link-wrap">
                        <ul class="social-links">
                            <li><a href="#"><i class="lab la-dribbble"></i></a></li>
                            <li><a href="#"><i class="lab la-xing"></i></a></li>
                            <li><a href="#"><i class="lab la-instagram"></i></a></li>
                            <li><a href="#"><i class="lab la-youtube"></i></a></li>
                        </ul>
                    </div>
                    <p class="copyright-text">
                        &copy; 2024
                    </p>
                </div>
            </div>
        </div>
        <!-- End Sticky Sidebar -->


        <div class="page-content-wrapper">

            <!-- Project Detail
            ======================================= -->
            <div class="project-detail-content-wrap">
                    
                <section class="project-detail-top">
                    <div class="custom-container">
                        <div class="custom-row">
                            <div class="left">
                                <div class="project-detail-header section-header">
                                    <h4 class="subtitle common-box">
                                        Project X
                                    </h4>
                                    <div class="animation-texts-wrap">
                                        <div class="animation-text-inner">
                                            <ul>
                                                <li>⌘ It is a long established fact that a reader will distracted in the reads ⌘</li>
                                                <li>It is a long established fact that a reader will distracted in the reads ⌘</li>
                                                <li>It is a long established fact that a reader will distracted in the reads ⌘</li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>

                                <div class="project-top-content">
                                    <span>UX DESIGN</span>
                                    <h2>Retro Remix</h2>
                                    <p>To address this challenge, our approach involved crafting a distinctive brand identity that effectively communicated Vutura Sioma's values of sustainability, innovation, and authenticity. Our team meticulously devised a comprehensive brand strategy centered around creating a visually.</p>
                                </div>

                            </div>
                            <div class="right">
                                <ul class="project-address-lists">
                                    <li>
                                        <div class="icon">
                                            <i class="las la-user"></i>
                                        </div>
                                        <div class="content">
                                            <p><strong>Client</strong> - Raven Claw Studio, USA </p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="icon">
                                            <i class="las la-calendar"></i>
                                        </div>
                                        <div class="content">
                                            <p><strong>Date</strong> - December 15, 2024</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="icon">
                                            <i class="las la-chart-bar"></i>
                                        </div>
                                        <div class="content">
                                            <p><strong>Service</strong> - SEO Development</p>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="icon">
                                            <i class="las la-industry"></i>
                                        </div>
                                        <div class="content">
                                            <p><strong>Industry</strong> - Architecture</p>
                                        </div>
                                    </li>
                                </ul>

                            </div>
                        </div>

                    </div>
                </section>

                <div class="project-details-hero-wrap">
                    <div class="custom-container">
                        <div class="project-details-hero-img">
                            <img src="./assets/imgs/project-detail-hero.png" alt="Project">
                        </div>
                    </div>
                </div>

                <div class="problem-and-solution-wrap">
                    <div class="custom-container">
                        <div class="problem-solution-box">
                            <h4 class="subtitle common-box">Problem</h4>
                            <div class="content-box">
                                <p>To address this challenge, our approach involved crafting a distinctive brand identity that effectively communicated Vutura Sioma's values of sustainability, innovation, and authenticity. Our team meticulously devised a comprehensive brand strategy centered around creating a visually.</p>
                                <p>Our goal was to provide a strong visual language and help BizzBuzz to stand out and get the appealing look & feel which resonates with a target audience and gives a feeling of joy and safety during product usage. Also, we needed to introduce the product to potential users.</p>
                            </div>
                        </div>
                        <div class="problem-solution-box">
                            <h4 class="subtitle common-box">Solution</h4>
                            <div class="content-box">
                                <p>To address this challenge, our approach involved crafting a distinctive brand identity that effectively communicated Vutura Sioma's values of sustainability, innovation, and authenticity. Our team meticulously devised a comprehensive brand strategy centered around creating a visually.</p>
                                <p>Our goal was to provide a strong visual language and help BizzBuzz to stand out and get the appealing look & feel which resonates with a target audience and gives a feeling of joy and safety during product usage. Also, we needed to introduce the product to potential users.</p>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="project-img-2-col">
                    <div class="custom-container">
                        <div class="project-img-2-col-box">
                            <img src="./assets/imgs/project-detail-img-1.png" alt="Project">
                        </div>
                        <div class="project-img-2-col-box">
                            <img src="./assets/imgs/project-detail-img-2.png" alt="Project">
                        </div>
                    </div>
                </div>

                <div class="project-details-content-box-2">
                    <div class="custom-container">
                        <div class="project-details-content-box-2-inner">
                            <p>To address this challenge, our approach involved crafting a distinctive brand identity that effectively communicated Vutura Sioma's values of sustainability, innovation, and authenticity. Our team meticulously devised a comprehensive brand strategy centered around creating a visually.
                                Our goal was to provide a strong visual language and help BizzBuzz to stand out and get the appealing look & feel which resonates with a target audience and gives a feeling of joy and safety during product usage. Also, we needed to introduce the product to potential users. BizzBuzz is a travel startup born by the collaboration of professionals from tech and banking industries. The company has a strong dev department but the design language was weak and kit-made so that they had a risk of getting lost in the pool of competitors.</p>
                        </div>
                    </div>
                </div>


                <div class="project-details-hero-wrap">
                    <div class="custom-container">
                        <div class="project-details-hero-img">
                            <img src="./assets/imgs/project-detail-img-3.png" alt="Project">
                        </div>
                    </div>
                </div>

                <div class="project-details-hero-wrap">
                    <div class="custom-container">
                        <div class="project-details-hero-img">
                            <img src="./assets/imgs/project-detail-img-4.png" alt="Project">
                        </div>
                    </div>
                </div>

                <div class="project-details-hero-wrap">
                    <div class="custom-container">
                        <div class="project-details-hero-img">
                            <img src="./assets/imgs/project-detail-img-5.png" alt="Project">
                        </div>
                    </div>
                </div>

            </div>
            <!-- End Project Detail -->




            <!-- Projects
            ======================================= -->
            <section class="project-area">
                <div class="custom-container">
                    <div class="project-header section-header">
                        <a href="./projects.html" class="theme-btn common-box">
                            <span>
                                <span class="normal">Projects <i class="las la-arrow-right"></i></span>
                                <span class="hover">Projects <i class="las la-arrow-right"></i></span>
                            </span>
                        </a>
                        <div class="animation-texts-wrap">
                            <div class="animation-text-inner">
                                <ul>
                                    <li>⌘ It is a long established fact that a reader will distracted by the readable content of a page when looking an its readable ⌘</li>
                                    <li>It is a long established fact that a reader will distracted by the readable content of a page when looking an its readable ⌘</li>
                                    <li>It is a long established fact that a reader will distracted by the readable content of a page when looking an its readable ⌘</li>
                                </ul>
                            </div>
                        </div>
                    </div>


                    <div class="project-col-3">
                        <div class="project-slider-box">
                            <a href="project-detail.html" class="overlay-link"></a>
                            <div class="project-img">
                                <img src="./assets/imgs/project-4.png" alt="Project">
                                <span class="badge-year">
                                    <span class="badge-inner">
                                        <span>2024</span>
                                        <span>2024</span>
                                    </span>
                                </span>
                            </div>
                            <div class="project-content">
                                <h3>Light Play</h3>
                                <p>SEO</p>
                                <a href="project-detail.html" class="theme-btn common-box">
                                    <span>
                                        <span class="normal"><i class="las la-angle-right"></i></span>
                                        <span class="hover"><img src="./assets/imgs/right-arrow.svg" alt="Icon"></span>
                                    </span>
                                </a>
                            </div>
                        </div>
                        <div class="project-slider-box">
                            <a href="project-detail.html" class="overlay-link"></a>
                            <div class="project-img">
                                <img src="./assets/imgs/project-5.png" alt="Project">
                                <span class="badge-year">
                                    <span class="badge-inner">
                                        <span>2024</span>
                                        <span>2024</span>
                                    </span>
                                </span>
                            </div>
                            <div class="project-content">
                                <h3>Synthwave Sympony</h3>
                                <p>Social Media</p>
                                <a href="project-detail.html" class="theme-btn common-box">
                                    <span>
                                        <span class="normal"><i class="las la-angle-right"></i></span>
                                        <span class="hover"><img src="./assets/imgs/right-arrow.svg" alt="Icon"></span>
                                    </span>
                                </a>
                            </div>
                        </div>
                        <div class="project-slider-box">
                            <a href="project-detail.html" class="overlay-link"></a>
                            <div class="project-img">
                                <img src="./assets/imgs/project-6.png" alt="Project">
                                <span class="badge-year">
                                    <span class="badge-inner">
                                        <span>2024</span>
                                        <span>2024</span>
                                    </span>
                                </span>
                            </div>
                            <div class="project-content">
                                <h3>Mindscapes</h3>
                                <p>Robotic Automation</p>
                                <a href="project-detail.html" class="theme-btn common-box">
                                    <span>
                                        <span class="normal"><i class="las la-angle-right"></i></span>
                                        <span class="hover"><img src="./assets/imgs/right-arrow.svg" alt="Icon"></span>
                                    </span>
                                </a>
                            </div>
                        </div>
                    </div>

                </div>
            </section>
            <!-- End Projects -->

            

            <!-- Footer
            ======================================= -->
            <footer class="footer-area">
                <div class="left">
                    <p>&copy; 2024 All rights reserved by <a href="https://themeforest.net/user/wordpressriver/portfolio">WordPressRiver Themes</a></p>
                    <p class="mid"><span class="circle-icon"></span>Template by <a href="https://themeforest.net/user/wordpressriver/portfolio">WordPressRiver</a><span
                            class="circle-icon"></span></p>
                    <a href="#">Buy Template</a>
                </div>
                <a href="#top" class="backto-top">Scroll to top <i class="las la-arrow-up"></i></a>
            </footer>
            <!-- End Footer -->

        </div>

    </main>


    <!-- JQuery
    ======================================= -->
    <script src="https://unpkg.com/@phosphor-icons/web@2.0.3"></script>
    <script src="./assets/js/jquery-3.7.1.js"></script>
    <script src="./assets/js/bootstrap.bundle.min.js"></script>
    <script src="./assets/js/swiper.min.js"></script>
    <script src="./assets/js/moment.min.js"></script>
    <script src="./assets/js/main.js"></script>
</body>

</html>