-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathproducts.html
More file actions
194 lines (179 loc) · 9.18 KB
/
Copy pathproducts.html
File metadata and controls
194 lines (179 loc) · 9.18 KB
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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>제품 — StarCodeLabs</title>
<meta name="description" content="StarCodeLabs의 제품들 — 지도 기반 트렌드 탐색 굿투고, 근무표 OCR 캘린더 근무교대 관리미." />
<meta property="og:title" content="제품 — StarCodeLabs" />
<meta property="og:description" content="굿투고 · 근무교대 관리미 — 일상의 불편함을 해결하는 서비스들" />
<meta property="og:type" content="website" />
<link rel="icon" type="image/svg+xml" href="assets/brand/logo.svg" />
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css" />
<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=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet" />
<link rel="stylesheet" href="style.css" />
</head>
<body>
<canvas id="starfield" aria-hidden="true"></canvas>
<nav class="nav">
<a class="brand" href="index.html"><img class="brand-logo" src="assets/brand/logo.svg" alt="StarCodeLabs 로고"
width="27" height="27" /><span>StarCode<b>Labs</b></span></a>
<div class="nav-links">
<a href="index.html">홈</a>
<a href="about.html">소개</a>
<a href="products.html" class="active">제품</a>
<a href="members.html">멤버</a>
</div>
<div class="nav-right">
<a class="gh-link" href="https://github.com/StarCodeLabs" target="_blank" rel="noopener">GitHub ↗</a>
</div>
</nav>
<header class="page-hero">
<p class="sec-tag">// PRODUCTS</p>
<h1>일상의 불편함에서 시작한<br /><em>우리의 실험들</em></h1>
<p class="page-desc">작은 아이디어라도 빠르게 실행하고, 사용자의 반응으로 방향을 판단합니다.</p>
</header>
<main>
<!-- ============ 굿투고 ============ -->
<section id="goodtogo" class="section">
<div class="product-card reveal">
<div class="product-info">
<span class="status-pill"><span class="pulse-dot"></span>Live on Apps in Toss</span>
<h3 class="product-name">굿투고 <small>Good To Go</small></h3>
<p class="product-desc">
캠핑장·차박·글램핑부터 여름 한정 물놀이·해수욕장·계곡까지 —
지금 가기 좋은 야외 명소를 지도 위에서 실시간으로 찾아주는 토스 미니앱입니다.
헛걸음하기 전에, 굿투고에서 먼저 확인하세요.
</p>
<div class="chips">
<span class="chip">🗺️ 지도 기반 탐색</span>
<span class="chip">🚦 실시간 자리 신호등</span>
<span class="chip">💬 커뮤니티 제보</span>
<span class="chip">🏕️ 캠핑·차박·물놀이</span>
</div>
<div class="traffic-demo">
<p class="demo-label">지금 여기, 자리 있을까? 👇</p>
<button id="trafficLight" class="traffic-badge" type="button">
<span class="traffic-dot"></span>
<span class="traffic-text"></span>
</button>
<p class="demo-hint">눌러서 바꿔보세요 — 실제 앱의 신호등 UI예요</p>
</div>
<div class="product-cta">
<a class="btn btn-lime" href="https://minion.toss.im/HYjxHp2s" target="_blank" rel="noopener">토스에서 열기</a>
</div>
</div>
<div class="phones" aria-label="굿투고 앱 화면">
<div class="phone phone-1"><img src="assets/products/goodtogo/map.png" alt="굿투고 지도 화면 — 주변 캠핑·물놀이 명소 탐색"
loading="lazy" /></div>
<div class="phone phone-2"><img src="assets/products/goodtogo/place.png" alt="굿투고 장소 상세 화면 — 자리 신호등과 실시간 제보"
loading="lazy" /></div>
<div class="phone phone-3"><img src="assets/products/goodtogo/community.png" alt="굿투고 커뮤니티 화면"
loading="lazy" /></div>
</div>
</div>
</section>
<!-- ============ 근무교대 관리미 ============ -->
<section id="gwanrimi" class="section">
<div class="product-card reveal">
<div class="product-info">
<span class="status-pill lab"><span class="pulse-dot"></span>MVP 실험 중</span>
<h3 class="product-name">근무교대 관리미</h3>
<p class="product-desc">
간호사, 소방관, 경찰관 같은 교대근무자는 매달 이미지·종이·PDF로 근무표를 받아
캘린더에 직접 옮겨 적습니다. 관리미는 이 반복을 없앱니다 —
근무표를 촬영하면 OCR/AI가 날짜별 근무로 변환하고, 빠르게 검수한 뒤
앱과 OS 캘린더에 바로 반영됩니다.
</p>
<blockquote class="value-quote">
"근무표를 직접 입력하지 않아도, 사진이나 파일에서 바로 캘린더로 정리한다."
</blockquote>
<div class="chips">
<span class="chip">📷 근무표 OCR 스캔</span>
<span class="chip">✅ 빠른 검수 · 수정</span>
<span class="chip">👥 파트너 근무 비교</span>
<span class="chip">🔔 출근 · 수면 알림</span>
</div>
<p class="target-note">
<b>간호사</b>의 D/E/N 3교대에서 시작해, 소방관·경찰관·현장직까지 —
모든 교대근무 직군으로 확장을 준비하고 있습니다.
</p>
</div>
<div class="shift-visual" aria-label="근무표 사진이 캘린더가 되는 과정">
<div class="flow-row">
<div class="flow-step">
<div class="flow-icon">📷</div><span>근무표 촬영</span>
</div>
<div class="flow-arrow">→</div>
<div class="flow-step">
<div class="flow-icon">✨</div><span>AI 인식 · 검수</span>
</div>
<div class="flow-arrow">→</div>
<div class="flow-step">
<div class="flow-icon">📅</div><span>캘린더 완성</span>
</div>
</div>
<div class="shift-cal">
<div class="cal-title"><span>2026. 08</span><b>내 근무표</b></div>
<div class="cal-grid">
<span class="dow">일</span><span class="dow">월</span><span class="dow">화</span><span
class="dow">수</span><span class="dow">목</span><span class="dow">금</span><span class="dow">토</span>
<div class="cal-cell d">1<b>D</b></div>
<div class="cal-cell d">2<b>D</b></div>
<div class="cal-cell e">3<b>E</b></div>
<div class="cal-cell e">4<b>E</b></div>
<div class="cal-cell n">5<b>N</b></div>
<div class="cal-cell n">6<b>N</b></div>
<div class="cal-cell off">7<b>휴</b></div>
<div class="cal-cell off">8<b>휴</b></div>
<div class="cal-cell d">9<b>D</b></div>
<div class="cal-cell d">10<b>D</b></div>
<div class="cal-cell e">11<b>E</b></div>
<div class="cal-cell e">12<b>E</b></div>
<div class="cal-cell n">13<b>N</b></div>
<div class="cal-cell n">14<b>N</b></div>
<div class="cal-cell off">15<b>휴</b></div>
<div class="cal-cell off">16<b>휴</b></div>
<div class="cal-cell d">17<b>D</b></div>
<div class="cal-cell e">18<b>E</b></div>
<div class="cal-cell n">19<b>N</b></div>
<div class="cal-cell off">20<b>휴</b></div>
<div class="cal-cell d">21<b>D</b></div>
</div>
<div class="cal-legend">
<i class="lg-d">Day</i>
<i class="lg-e">Evening</i>
<i class="lg-n">Night</i>
<i class="lg-off">OFF</i>
</div>
</div>
</div>
</div>
</section>
<!-- ============ Coming Soon ============ -->
<section class="section">
<div class="coming-soon reveal">
<span class="flask">💡</span>
<div>
<h4>다음 실험은 언제나 열려 있습니다</h4>
<p>일상의 불편함을 발견하는 순간, 새로운 실험이 시작됩니다.</p>
</div>
</div>
</section>
</main>
<footer class="footer">
<p class="footer-big">반짝이는 아이디어가 있나요?</p>
<div class="footer-links">
<a href="https://github.com/StarCodeLabs" target="_blank" rel="noopener">GitHub</a>
<span class="dot-sep">·</span>
<a href="https://substantial-kilometer-566.notion.site/OverView-Culture-2f925b9b4c9f80ae9b94e11e5bdb0e85"
target="_blank" rel="noopener">팀 문서 (기록 > 기억)</a>
</div>
<p class="footer-small">© <span id="year">2026</span> StarCodeLabs · 아이디어는 밤하늘처럼, 코드는 별처럼</p>
</footer>
<script src="main.js"></script>
</body>
</html>