사주풀이 4사 분석 & 장점 통합 적용

포스텔러 · 헬로우봇 · 점신 · 사주별관 4사를 코드 관점에서 해부하고, 장점만 선별하여 "사주도원"에 적용합니다.

0. 분석 대상 개요

<nav class="bottom-tabs">
  <a href="/">홈</a>
  <a href="/saju">사주</a>
  <a href="/today">오늘</a>
  <a href="/my">MY</a>
</nav>
<article class="fortune-card">
  <h2>2026 신년운세</h2>
  <span class="badge">AI 심층분석</span>
  <button class="cta">19,900원에 받기</button>
</article>

<section class="chatroom">
  <header><img class="bot-avatar"/><h4>판밍밍</h4></header>
  <ul class="messages">
    <li class="msg bot">생일 알려줘~</li>
    <li class="msg user">1995년 5월 15일</li>
  </ul>
  <footer class="reply-chips">
    <button>계속 들을래 (하트 1개)</button>
  </footer>
</section>

<section class="menu-grid">
  <a href="/saju"><img/><span>사주</span></a>
  <a href="/gunghap"><img/><span>궁합</span></a>
  <!-- 12~16개 아이콘 그리드 -->
</section>
<aside class="ad-slot">광고</aside>
<section class="expert-list">
  <article class="expert">
    <h4>월광도사</h4><p>경력 20년</p>
    <button>전화상담 (3,000원/분)</button>
  </article>
</section>

<nav class="category-tabs">
  <button class="active">전체</button>
  <button>연애/솔로</button>
  <button>결혼/궁합</button>
  <button>재물</button>
</nav>
<section class="product-grid">
  <article class="product">
    <img src="haeryung.jpg"/>
    <span class="discount">68% OFF</span>
    <h3>혜령선생의 상위 1% 재물운</h3>
    <div class="price">
      <s>79,800원</s><strong>25,536원</strong>
    </div>
    <div class="rating">★4.9 · 후기 1,204</div>
  </article>
</section>

5. 종합 비교 매트릭스

6. 사주도원 모듈 설계

6-1. 디렉토리 구조

사주풀이/
├── index.html
├── analysis.html
├── styles.css
└── scripts/
    ├── saju-calculator.js  [포스텔러 벤치]
    ├── daily-fortune.js    [점신 벤치]
    ├── tarot.js
    ├── ui.js
    └── main.js

6-2. 모듈별 책임

7. 4사 장점 → 사주도원 적용 매핑

각 사이트의 장점만 추출해 사주도원에 어떻게 구현했는지 매핑합니다.

7-1. 배제한 요소 (의도적 차별화)

7-2. 확장 로드맵

사주도원 초안 분석 문서 · 2026.04.19