FailLoop/index.html at main · jiyeonparkk/FailLoop · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>FailLoop - 실패를 자산으로 전환하는 플랫폼</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <!-- Navigation -->
    <nav class="navbar">
        <div class="nav-container">
            <div class="logo">FailLoop</div>
            <div class="nav-links">
                <a href="index.html" class="active">홈</a>
                <a href="upload.html">업로드</a>
                <a href="community.html">커뮤니티</a>
                <a href="mypage.html">마이페이지</a>
            </div>
        </div>
    </nav>

    <!-- Hero Section -->
    <section class="hero">
        <div class="hero-content">
            <div class="scroll-indicator">
                <div class="mouse">
                    <div class="wheel"></div>
                </div>
                <p>스크롤하여 더 알아보기</p>
            </div>
        </div>
    </section>

    <!-- Main Content Section -->
    <section class="main-content">
        <div class="container">
            <div class="logo-section fade-in">
                <h1 class="main-logo">FailLoop</h1>
                <p class="intro-text">
                    실패는 끝이 아닙니다. 새로운 시작의 데이터입니다.
                </p>
            </div>

            <div class="content-section fade-in">
                <h2 class="section-title">실패를 자산으로 전환하는 인간-AI 공진화 플랫폼</h2>
                <div class="description-box">
                    <p class="description-text">
                        FailLoop는 다수의 스타트업이 자신의 실패 데이터를 공유하고, AI와 인간의 협업을 통해 실패를 학습 자원으로 전환하여 성장을 돕는 혁신 플랫폼입니다. 플랫폼의 핵심은 AI와 인간이 실패를 매개로 공진화하는 선순환 학습 구조에 있으며, 다음과 같은 단계로 운영됩니다.
                    </p>
                </div>
            </div>

            <!-- Features Grid -->
            <div class="features-grid fade-in">
                <div class="feature-card">
                    <div class="feature-icon">📊</div>
                    <h3>데이터 수집</h3>
                    <p>실패 사례를 체계적으로 수집하고 구조화합니다</p>
                </div>
                <div class="feature-card">
                    <div class="feature-icon">🤖</div>
                    <h3>AI 분석</h3>
                    <p>인공지능이 패턴을 발견하고 인사이트를 도출합니다</p>
                </div>
                <div class="feature-card">
                    <div class="feature-icon">🔄</div>
                    <h3>공진화 학습</h3>
                    <p>인간과 AI가 함께 성장하는 선순환 구조</p>
                </div>
                <div class="feature-card">
                    <div class="feature-icon">🚀</div>
                    <h3>성장 가속화</h3>
                    <p>학습된 경험을 바탕으로 빠른 성장을 지원합니다</p>
                </div>
            </div>

            <!-- CTA Section -->
            <div class="cta-section fade-in">
                <button class="cta-button">
                    <span class="button-text">지금 내 데이터 넣고 AI 인사이트 받기</span>
                    <span class="button-icon">→</span>
                </button>
            </div>
        </div>
    </section>

    <script src="script.js"></script>
</body>
</html>