Refresh public download pages for community release

hooosberg · hooosberg · commit e7badaa7e210 · 2026-04-09T02:05:31.000+08:00
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,3 @@
 .DS_Store
 gh-pages-site/**/.DS_Store
+release-staging/
diff --git a/README.md b/README.md
@@ -1,16 +1,52 @@
-# GitHub Public Worktree
+<p align="center">
+  <img src="./gh-pages-site/img/logo.png" alt="TrekReel Logo" width="120" height="120">
+</p>
 
-这个工作树只放准备同步到 GitHub 的公开内容。
+<h1 align="center">TrekReel | 途影</h1>
 
-## 目录约定
+<p align="center">
+  <strong>Turn Every Outdoor Route Into a Shareable 3D Story</strong>
+</p>
 
-- `gh-pages-site/`: GitHub Pages 或静态站点的上传目录
-- 未来公开的 `README`、文档、可开源代码，都放在这个工作树中
-- 完整本地开发内容继续留在 `../local/`
+<p align="center">
+  <a href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12">
+    <img src="https://img.shields.io/badge/Download-Mac_App_Store-000000?style=for-the-badge&logo=apple&logoColor=white" alt="Download on the Mac App Store">
+  </a>
+  <a href="https://github.com/hooosberg/TrekReel/releases">
+    <img src="https://img.shields.io/badge/Download-GitHub_Releases-24292f?style=for-the-badge&logo=github&logoColor=white" alt="Download from GitHub Releases">
+  </a>
+</p>
 
-## 分支约定
+<p align="center">
+  Full-featured Mac App Store edition for macOS. Community DMG and Windows builds will be published through GitHub Releases.
+</p>
 
-- 当前工作树分支: `github`
-- 目标远端主线: `origin/main`
+---
 
-注意: 截至 2026-03-31，本仓库远端还只有 `origin/gh-pages`，还没有 `origin/main`。本地结构已经按 `github -> origin/main` 的语义整理好，后续首次公开推送时再把远端主线切过去。
+## About
+
+**TrekReel** turns GPX tracks into cinematic 3D route videos, printable terrain models, and presentation-ready map exports. It is built for hikers, cyclists, runners, sailors, and anyone who wants to tell the story behind a route.
+
+## Distribution
+
+- **Mac App Store**: the commercial edition with the fullest feature set.
+- **GitHub Releases**: lighter public builds for `DMG` and `EXE`, without the purchase wall and with a reduced feature surface.
+
+## Highlights
+
+- Import `GPX`, `KML`, and `KMZ` tracks from tools like Strava, Garmin, and Apple Watch.
+- Generate 3D terrain flyover videos for sharing on social platforms.
+- Export terrain data as `STL`, `OBJ`, and high-quality map imagery.
+- Keep route data local on your device instead of uploading it to the cloud.
+
+## Resources
+
+- **Website**: [hooosberg.github.io/TrekReel](https://hooosberg.github.io/TrekReel/)
+- **Support**: [Support Center](https://hooosberg.github.io/TrekReel/support.html)
+- **Privacy**: [Privacy Policy](https://hooosberg.github.io/TrekReel/privacy.html)
+- **Terms**: [Terms of Service](https://hooosberg.github.io/TrekReel/terms.html)
+
+## Contact
+
+- **GitHub**: [hooosberg/TrekReel](https://github.com/hooosberg/TrekReel)
+- **Email**: [zikedece@proton.me](mailto:zikedece@proton.me)
diff --git a/gh-pages-site/index.html b/gh-pages-site/index.html
@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>TrekReel | 3D Storytelling for Outdoor Adventures</title>
   <meta name="description"
-    content="TrekReel helps you turn your GPX tracks into cinematic 3D stories. Perfect for hikers, cyclists, and explorers." />
+    content="Download TrekReel from the Mac App Store or GitHub Releases and turn GPX tracks into cinematic 3D route stories." />
   <link rel="stylesheet" href="./styles.css" />
 </head>
 
@@ -104,21 +104,25 @@ <h1 class="hero-title">把每一次户外轨迹<br>变成可分享的 3D 故事<
               专为徒步、越野、骑行设计。导入 GPX，一键生成 3D 路线动画。
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">下载应用 (Mac) <span
-                  class="btn-tag">即将推出</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">查看教程</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">App Store 下载</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">GitHub 下载</a>
             </div>
+            <a class="hero-support-link" href="./support.html">查看教程</a>
           </div>
           <div class="language-block" data-lang="en">
             <h1 class="hero-title">Turn Every Outdoor Route<br>Into a Shareable 3D Story</h1>
             <p class="hero-subtitle">
               Built for hikers, runners, and cyclists. Import GPX, create cinematic 3D videos instantly.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Download for Mac <span
-                  class="btn-tag">Coming Soon</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">View Tutorial</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Download on App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Download on GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">View Tutorial</a>
           </div>
           <div class="language-block" data-lang="es">
             <h1 class="hero-title">Gira cada ruta al aire libre<br>En una historia 3D compartible</h1>
@@ -127,10 +131,12 @@ <h1 class="hero-title">Gira cada ruta al aire libre<br>En una historia 3D compar
               instante.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Descargar para Mac <span
-                  class="btn-tag">Próximamente</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">Ver tutorial</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Descargar en App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Descargar en GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">Ver tutorial</a>
           </div>
           <div class="language-block" data-lang="fr">
             <h1 class="hero-title">Transformez chaque itinéraire extérieur<br>Dans une histoire 3D partageable</h1>
@@ -139,10 +145,12 @@ <h1 class="hero-title">Transformez chaque itinéraire extérieur<br>Dans une his
               cinématographiques 3D.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Télécharger pour Mac <span
-                  class="btn-tag">Bientôt disponible</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">Voir le didacticiel</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Télécharger sur App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Télécharger sur GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">Voir le didacticiel</a>
           </div>
           <div class="language-block" data-lang="de">
             <h1 class="hero-title">Drehen Sie jede Outdoor-Route<br>In eine teilbare 3D-Geschichte</h1>
@@ -151,10 +159,12 @@ <h1 class="hero-title">Drehen Sie jede Outdoor-Route<br>In eine teilbare 3D-Gesc
               3D-Videos.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Für Mac herunterladen
-                <span class="btn-tag">Demnächst verfügbar</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">Tutorial ansehen</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Im App Store laden</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Bei GitHub laden</a>
             </div>
+            <a class="hero-support-link" href="./support.html">Tutorial ansehen</a>
           </div>
           <div class="language-block" data-lang="it">
             <h1 class="hero-title">Svolta ogni percorso esterno<br>In una storia 3D condivisibile</h1>
@@ -163,10 +173,12 @@ <h1 class="hero-title">Svolta ogni percorso esterno<br>In una storia 3D condivis
               cinematografici.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Scarica per Mac <span
-                  class="btn-tag">Prossimamente</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">Visualizza l'esercitazione</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Scarica da App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Scarica da GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">Visualizza l'esercitazione</a>
           </div>
           <div class="language-block" data-lang="pt">
             <h1 class="hero-title">Vire todas as rotas ao ar livre<br>Em uma história 3D compartilhável</h1>
@@ -175,32 +187,38 @@ <h1 class="hero-title">Vire todas as rotas ao ar livre<br>Em uma história 3D co
               instantaneamente.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Baixar para Mac <span
-                  class="btn-tag">Em breve</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">Ver tutorial</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Baixar na App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Baixar no GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">Ver tutorial</a>
           </div>
           <div class="language-block" data-lang="ja">
             <h1 class="hero-title">あらゆる屋外ルートを曲がる<br>共有可能な 3D ストーリーへ</h1>
             <p class="hero-subtitle">
               ハイカー、ランナー、サイクリストのために作られています。 GPX をインポートし、映画のような 3D ビデオを即座に作成します。
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Mac 用ダウンロード <span
-                  class="btn-tag">近日公開予定</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">チュートリアルを見る</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">App Store で入手</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">GitHub から入手</a>
             </div>
+            <a class="hero-support-link" href="./support.html">チュートリアルを見る</a>
           </div>
           <div class="language-block" data-lang="ko">
             <h1 class="hero-title">모든 야외 경로를 우회하세요<br>공유 가능한 3D 스토리 속으로</h1>
             <p class="hero-subtitle">
               등산객, 달리기 선수, 자전거 타는 사람을 위해 제작되었습니다. GPX를 가져와서 영화 같은 3D 비디오를 즉시 제작하세요.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Mac용 다운로드 <span
-                  class="btn-tag">출시 예정</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">튜토리얼 보기</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">App Store에서 다운로드</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">GitHub에서 다운로드</a>
             </div>
+            <a class="hero-support-link" href="./support.html">튜토리얼 보기</a>
           </div>
           <div class="language-block" data-lang="ru">
             <h1 class="hero-title">Поверните каждый открытый маршрут<br>В общую 3D-историю</h1>
@@ -209,10 +227,12 @@ <h1 class="hero-title">Поверните каждый открытый марш
               3D-видео.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">Скачать для Mac <span
-                  class="btn-tag">Скоро</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">Посмотреть руководство</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">Скачать в App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">Скачать на GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">Посмотреть руководство</a>
           </div>
           <div class="language-block" data-lang="ar">
             <h1 class="hero-title">اتجه إلى كل طريق خارجي<br>في قصة ثلاثية الأبعاد قابلة للمشاركة</h1>
@@ -221,10 +241,12 @@ <h1 class="hero-title">اتجه إلى كل طريق خارجي<br>في قصة 
               الفور.
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">تنزيل لنظام التشغيل Mac
-                <span class="btn-tag">قريبا</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">عرض البرنامج التعليمي</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">التنزيل من App Store</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">التنزيل من GitHub</a>
             </div>
+            <a class="hero-support-link" href="./support.html">عرض البرنامج التعليمي</a>
           </div>
           <div class="language-block" data-lang="hi">
             <h1 class="hero-title">प्रत्येक बाहरी मार्ग को मोड़ें<br>एक साझा करने योग्य 3डी कहानी में</h1>
@@ -233,10 +255,12 @@ <h1 class="hero-title">प्रत्येक बाहरी मार्ग
               बनाएं।
             </p>
             <div class="cta-row center-row">
-              <a class="btn btn-primary btn-large btn-disabled" href="#" aria-disabled="true">मैक के लिए डाउनलोड करें
-                <span class="btn-tag">जल्द आ रहा है</span></a>
-              <a class="btn btn-secondary btn-large" href="./support.html">ट्यूटोरियल देखें</a>
+              <a class="btn btn-store btn-large" href="https://apps.apple.com/us/app/trekreel-3d-map-video-maker/id6758914035?mt=12"
+                target="_blank" rel="noreferrer noopener">App Store से डाउनलोड करें</a>
+              <a class="btn btn-release btn-large" href="https://github.com/hooosberg/TrekReel/releases"
+                target="_blank" rel="noreferrer noopener">GitHub से डाउनलोड करें</a>
             </div>
+            <a class="hero-support-link" href="./support.html">ट्यूटोरियल देखें</a>
           </div>
         </div>
         <!-- Feature Carousel -->
@@ -821,4 +845,4 @@ <h4>
   <script src="./script.js"></script>
 </body>
 
-</html>
+</html>
diff --git a/gh-pages-site/styles.css b/gh-pages-site/styles.css
@@ -186,6 +186,7 @@ a:hover {
   display: flex;
   gap: 16px;
   justify-content: center;
+  flex-wrap: wrap;
 }
 
 .btn {
@@ -202,6 +203,7 @@ a:hover {
 .btn-large {
   padding: 14px 32px;
   font-size: 17px;
+  min-width: 220px;
 }
 
 .btn-primary {
@@ -224,6 +226,30 @@ a:hover {
   opacity: 1;
 }
 
+.btn-store {
+  background: #111111;
+  color: #ffffff;
+  box-shadow: 0 12px 28px rgba(17, 17, 17, 0.18);
+}
+
+.btn-store:hover {
+  background: #000000;
+  opacity: 1;
+  transform: translateY(-1px);
+}
+
+.btn-release {
+  background: #24292f;
+  color: #ffffff;
+  box-shadow: 0 12px 28px rgba(36, 41, 47, 0.16);
+}
+
+.btn-release:hover {
+  background: #1b1f23;
+  opacity: 1;
+  transform: translateY(-1px);
+}
+
 .btn-disabled {
   opacity: 0.6 !important;
   cursor: not-allowed !important;
@@ -240,6 +266,19 @@ a:hover {
   vertical-align: middle;
 }
 
+.hero-support-link {
+  display: inline-flex;
+  margin-top: 18px;
+  justify-content: center;
+  color: var(--text-secondary);
+  font-size: 15px;
+}
+
+.hero-support-link:hover {
+  color: var(--text-primary);
+  opacity: 1;
+}
+
 /* Carousel */
 .hero-carousel-container {
   margin-top: 40px;
@@ -358,6 +397,19 @@ a:hover {
 }
 
 @media (max-width: 768px) {
+  .hero-title {
+    font-size: 42px;
+  }
+
+  .hero-subtitle {
+    font-size: 20px;
+  }
+
+  .btn-large {
+    width: 100%;
+    min-width: 0;
+  }
+
   .hero-carousel-container {
     aspect-ratio: 4 / 3;
   }
@@ -835,4 +887,4 @@ a[href*="uixskills.com"] .project-icon {
   border-top: 1px solid rgba(0, 0, 0, 0.05);
   /* Subtle separator */
   padding-top: 24px;
-}
+}

Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,3 @@`
`1`	`1`	`.DS_Store`
`2`	`2`	`gh-pages-site/**/.DS_Store`
	`3`	`+release-staging/`