diff --git a/app/(route)/indicators/_components/form/FormTitle.tsx b/app/(route)/indicators/_components/form/FormTitle.tsx
new file mode 100644
index 0000000..4154b83
--- /dev/null
+++ b/app/(route)/indicators/_components/form/FormTitle.tsx
@@ -0,0 +1,20 @@
+import S from './form.module.css'
+
+interface Props {
+  title: string
+  subTitle?: string
+}
+
+function FormTitle({
+  title,
+  subTitle = '해당 항목의 수치는 어떻게 되나요?',
+}: Props) {
+  return (
+    <div className={S.wrapper}>
+      <span className={S.title}>{title}</span>
+      <p className={S.subTitle}>{subTitle}</p>
+    </div>
+  )
+}
+
+export default FormTitle
diff --git a/app/(route)/indicators/_components/form/form.module.css b/app/(route)/indicators/_components/form/form.module.css
new file mode 100644
index 0000000..74ce0f6
--- /dev/null
+++ b/app/(route)/indicators/_components/form/form.module.css
@@ -0,0 +1,36 @@
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.title {
+  font-size: 1.2rem;
+  font-weight: 700;
+}
+
+.subTitle {
+  font-size: 0.7rem;
+  font-weight: 300;
+  margin-bottom: 10px;
+}
+
+.inputWrapper {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: auto;
+  border-radius: 15px;
+  padding: 14px 20px;
+  border: 1px solid #efefef;
+}
+
+.input {
+  all: unset;
+  font-size: 0.83rem;
+}
+
+.error {
+  font-size: 0.67rem;
+  color: #ff453a;
+}
diff --git a/app/(route)/indicators/_components/result/index.tsx b/app/(route)/indicators/_components/result/index.tsx
new file mode 100644
index 0000000..9d8bdc4
--- /dev/null
+++ b/app/(route)/indicators/_components/result/index.tsx
@@ -0,0 +1,21 @@
+import Nav from '@/app/_common/nav'
+import Title from '@/app/_common/text/title'
+import S from './result.module.css'
+
+//TODO: 사용자가 클릭한 아이디어 이름과 해당 툴을 사용한 사용자 수가 보여집니다.
+function Result() {
+  return (
+    <div className={S.wrapper}>
+      <Nav />
+      <div>
+        <Title title="검증 결과" />
+        <div>
+          <Title title="아이디어 이름" />
+          <span>전체 사용자 162명</span>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default Result
diff --git a/app/(route)/indicators/_components/result/result.module.css b/app/(route)/indicators/_components/result/result.module.css
new file mode 100644
index 0000000..5d37d8f
--- /dev/null
+++ b/app/(route)/indicators/_components/result/result.module.css
@@ -0,0 +1,6 @@
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  padding-bottom: 50px;
+  padding: 0 18px;
+}
diff --git a/app/(route)/indicators/indicators.module.css b/app/(route)/indicators/indicators.module.css
new file mode 100644
index 0000000..c317b80
--- /dev/null
+++ b/app/(route)/indicators/indicators.module.css
@@ -0,0 +1,52 @@
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+
+.formWrapper {
+  position: relative;
+  margin-top: 46px;
+  min-height: 100vh;
+  height: 100%;
+}
+
+.paddingWrapper {
+  padding: 0 18px;
+}
+
+.overflowWrapper {
+  display: flex;
+  flex-direction: column;
+  padding: 0 18px;
+  overflow: auto;
+  height: 690px;
+  width: 100%;
+  gap: 14px;
+}
+
+.bottomWrapper {
+  position: absolute;
+  bottom: 0;
+  background-color: #fbfbfb;
+  width: 100%;
+  height: 150px;
+  border-top-left-radius: 38px;
+  border-top-right-radius: 38px;
+}
+
+.submitBtnWrapper {
+  position: absolute;
+  right: 16px;
+  bottom: 50px;
+
+  color: white;
+  font-weight: 700;
+  font-size: 1.2rem;
+  text-align: center;
+  width: 100px;
+  height: auto;
+  padding: 10px 20px;
+  border-radius: 9px;
+  background-color: var(--purple-700);
+}
diff --git a/app/(route)/indicators/page.tsx b/app/(route)/indicators/page.tsx
new file mode 100644
index 0000000..3381b47
--- /dev/null
+++ b/app/(route)/indicators/page.tsx
@@ -0,0 +1,73 @@
+'use client'
+
+import Title from '@/app/_common/text/title'
+import { useRouter } from 'next/navigation'
+import { useState } from 'react'
+import Nav from '../list/_components/nav'
+import FormTitle from './_components/form/FormTitle'
+import FormS from './_components/form/form.module.css'
+import S from './indicators.module.css'
+
+//* 투자 지표 입력 페이지입니다.
+//TODO: title에 사용자가 입력했던 요소들이 보여지게 됩니다.
+//TODO: recoil 사용
+//? 피기님이 하신 투자지표 툴로 변경 예정
+function Indicators() {
+  const router = useRouter()
+  const [inputValue, setInputValue] = useState('')
+  const [error, setError] = useState('')
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setInputValue(e.target.value)
+    setError('')
+  }
+
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault()
+    if (!/^\d+$/.test(inputValue)) {
+      setError('숫자만 입력 가능합니다.')
+    } else {
+      router.push('/result')
+    }
+  }
+
+  return (
+    <>
+      <Nav />
+      <div className={S.wrapper}>
+        <div className={S.paddingWrapper}>
+          <Title title="아이디어 제목" />
+        </div>
+        <form className={S.formWrapper} onSubmit={handleSubmit}>
+          <div className={S.overflowWrapper}>
+            <FormTitle
+              title="전체 이용자 수"
+              subTitle="전체 이용자 수를 가지고 총 결과 지표가 계산됩니다."
+            />
+
+            <div className={FormS.inputWrapper}>
+              <input
+                className={FormS.input}
+                placeholder="수치를 입력해 주세요."
+                value={inputValue}
+                onChange={handleChange}
+              />
+            </div>
+
+            {error && (
+              <span className={FormS.error}>숫자만 입력 가능합니다.</span>
+            )}
+          </div>
+
+          <div className={S.bottomWrapper}>
+            <button type="submit" className={S.submitBtnWrapper}>
+              제출하기
+            </button>
+          </div>
+        </form>
+      </div>
+    </>
+  )
+}
+
+export default Indicators
diff --git a/app/(route)/list/_components/nav/index.tsx b/app/(route)/list/_components/nav/index.tsx
index f61fc44..d175a59 100644
--- a/app/(route)/list/_components/nav/index.tsx
+++ b/app/(route)/list/_components/nav/index.tsx
@@ -3,7 +3,7 @@ import { useRouter } from 'next/navigation'
 import { GoArrowLeft } from 'react-icons/go'
 import S from './nav.module.css'
 
-function Nav({ title }: { title: string }) {
+function Nav({ title }: { title?: string }) {
   const router = useRouter()
 
   return (
diff --git a/app/(route)/main/page.module.css b/app/(route)/main/page.module.css
index 4944c6f..e6c799d 100644
--- a/app/(route)/main/page.module.css
+++ b/app/(route)/main/page.module.css
@@ -36,3 +36,15 @@
   flex-direction: column;
   gap: 18px;
 }
+
+.columnWrapper {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  flex-wrap: wrap;
+  min-height: 100vh;
+  width: 100%;
+  padding-bottom: 300px;
+}
diff --git a/app/(route)/main/page.tsx b/app/(route)/main/page.tsx
index 02ba5d1..ffc9c58 100644
--- a/app/(route)/main/page.tsx
+++ b/app/(route)/main/page.tsx
@@ -12,7 +12,9 @@ function Main() {
     <main className={S.wrapper}>
       <Nav />
       <div className={S.inWrapper}>
-        <Search />
+        <Link href="/search">
+          <Search />
+        </Link>
         <div className={S.marginWrapper}>
           <Title title="인기 많은 툴" />
         </div>
diff --git a/app/(route)/mypage/_components/.gitkeep b/app/(route)/mypage/_components/.gitkeep
deleted file mode 100644
index e69de29..0000000
diff --git a/app/(route)/mypage/_components/ideaCard/ideaCard.module.css b/app/(route)/mypage/_components/ideaCard/ideaCard.module.css
new file mode 100644
index 0000000..8f5fc37
--- /dev/null
+++ b/app/(route)/mypage/_components/ideaCard/ideaCard.module.css
@@ -0,0 +1,45 @@
+.wrapper {
+  width: 100%;
+}
+
+.rowWrapper {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.columnWrapper {
+  display: flex;
+  flex-direction: column;
+  background-color: var(--gray-100);
+  padding: 13px 17px;
+  border-radius: 11px;
+  cursor: pointer;
+  width: 100%;
+}
+
+.ideaTitle {
+  font-size: 0.98rem;
+  font-weight: 700;
+  letter-spacing: 0.03px;
+}
+
+.ideaTool {
+  font-size: 0.7rem;
+}
+
+.btnWrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 70px;
+  height: 40px;
+  font-weight: 500;
+  font-size: 0.9rem;
+  color: white;
+  background-color: var(--purple-700);
+  border-radius: 9px;
+
+  margin-left: 10px;
+}
diff --git a/app/(route)/mypage/_components/ideaCard/index.tsx b/app/(route)/mypage/_components/ideaCard/index.tsx
new file mode 100644
index 0000000..929647a
--- /dev/null
+++ b/app/(route)/mypage/_components/ideaCard/index.tsx
@@ -0,0 +1,24 @@
+import Link from 'next/link'
+import S from './ideaCard.module.css'
+
+//TODO: 아이디어 명과 사용한 툴이 들어가게 됩니다.
+//TODO: 완료된 아이디어일 경우 결과 페이지(/result)로 이동합니다.
+//TODO: 진행중인 아이디어일 경우 투자 지표 페이지(/indicators)로 이동합니다.
+function IdeaCard() {
+  return (
+    <div className={S.wrapper}>
+      <Link href="/indicators">
+        <div className={S.rowWrapper}>
+          <div className={S.columnWrapper}>
+            <span className={S.ideaTitle}>아이디어 제목</span>
+            <p className={S.ideaTool}>아이디어 툴</p>
+          </div>
+
+          <div className={S.btnWrapper}>열람</div>
+        </div>
+      </Link>
+    </div>
+  )
+}
+
+export default IdeaCard
diff --git a/app/(route)/mypage/mypage.module.css b/app/(route)/mypage/mypage.module.css
new file mode 100644
index 0000000..2744b1d
--- /dev/null
+++ b/app/(route)/mypage/mypage.module.css
@@ -0,0 +1,26 @@
+.wrapper {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding: 0 18px;
+  padding-bottom: 50px;
+}
+
+.sectionTitle {
+  font-size: 1.3rem;
+  font-weight: 700;
+  margin-top: 26px;
+}
+
+.sectionSubTitle {
+  font-size: 0.86rem;
+  font-weight: 300;
+}
+
+.ideaCardWrapper {
+  display: flex;
+  flex-direction: column;
+
+  gap: 17px;
+  margin: 12px 0 40px 0;
+}
diff --git a/app/(route)/mypage/page.tsx b/app/(route)/mypage/page.tsx
index cf4d881..f2644c4 100644
--- a/app/(route)/mypage/page.tsx
+++ b/app/(route)/mypage/page.tsx
@@ -1,5 +1,31 @@
+import Nav from '@/app/_common/nav'
+import Title from '@/app/_common/text/title'
+import IdeaCard from './_components/ideaCard'
+import S from './mypage.module.css'
+
+//TODO: 사용자 명, 아이디어 검증 수가 들어갑니다.
+//TODO: 완료된 아이디어, 입력 전 아이디어를 불러옵니다.(get)
 function Mypage() {
-  return
+  return (
+    <>
+      <div className={S.wrapper}>
+        <Nav />
+        <Title title="아이디어" />
+
+        <span className={S.sectionTitle}>완료</span>
+        <p className={S.sectionSubTitle}>투자 지표를 완료한 아이디어</p>
+        <div className={S.ideaCardWrapper}>
+          <IdeaCard />
+        </div>
+
+        <span className={S.sectionTitle}>입력 전</span>
+        <p className={S.sectionSubTitle}>투자 지표를 입력하지 않은 아이디어</p>
+        <div className={S.ideaCardWrapper}>
+          <IdeaCard />
+        </div>
+      </div>
+    </>
+  )
 }
 
 export default Mypage
diff --git a/app/(route)/onboard/Onboard.module.css b/app/(route)/onboard/Onboard.module.css
index 2284acd..9109c7f 100644
--- a/app/(route)/onboard/Onboard.module.css
+++ b/app/(route)/onboard/Onboard.module.css
@@ -135,5 +135,5 @@
 }
 
 .wrap:nth-child(3) {
-  animation-delay: 2mss;
+  animation-delay: 2s;
 }
diff --git a/app/(route)/onboard/_components/WatchWord.tsx b/app/(route)/onboard/_components/WatchWord.tsx
index ed9f223..df29f1e 100644
--- a/app/(route)/onboard/_components/WatchWord.tsx
+++ b/app/(route)/onboard/_components/WatchWord.tsx
@@ -1,7 +1,17 @@
 import { useEffect, useRef } from 'react'
 import styles from '../Onboard.module.css'
 
-function WatchWord({ handleView }: { handleView: (params: boolean) => void }) {
+function WatchWord({
+  handleView,
+  firstText = '당신의 아이디어가',
+  twoText = '로켓처럼 성장하도록.',
+  onAnimationEnd,
+}: {
+  handleView: (params: boolean) => void
+  firstText?: string
+  twoText?: string
+  onAnimationEnd?: () => void
+}) {
   const animationRef = useRef<HTMLDivElement>(null)
 
   useEffect(() => {
@@ -15,10 +25,29 @@ function WatchWord({ handleView }: { handleView: (params: boolean) => void }) {
       animationRef.current?.removeEventListener('animationend', animationend)
     }
   }, [])
+
+  useEffect(() => {
+    const timer = setTimeout(() => {
+      {
+        onAnimationEnd && onAnimationEnd()
+      }
+    }, 2000)
+
+    return () => clearTimeout(timer)
+  }, [])
+
+  const handleAnimationEnd = () => {
+    onAnimationEnd && onAnimationEnd()
+  }
+
   return (
-    <div className={styles.wordwrap} ref={animationRef}>
-      <p className={styles.word}>당신의 아이디어가</p>
-      <p className={styles.word}>로켓처럼 성장하도록.</p>
+    <div
+      className={styles.wordwrap}
+      ref={animationRef}
+      onAnimationEnd={handleAnimationEnd}
+    >
+      <p className={styles.word}>{firstText}</p>
+      <p className={styles.word}>{twoText}</p>
     </div>
   )
 }
diff --git a/app/(route)/result/page.tsx b/app/(route)/result/page.tsx
new file mode 100644
index 0000000..285f9c1
--- /dev/null
+++ b/app/(route)/result/page.tsx
@@ -0,0 +1,33 @@
+'use client'
+
+import { useState } from 'react'
+import Result from '../indicators/_components/result'
+import styles from '../onboard/Onboard.module.css'
+import WatchWord from '../onboard/_components/WatchWord'
+
+function Loading() {
+  const [showWatchWord, setShowWatchWord] = useState(true)
+
+  const handleAnimationEnd = () => {
+    setShowWatchWord(false)
+  }
+
+  return (
+    <>
+      {showWatchWord ? (
+        <div className={styles.background}>
+          <WatchWord
+            handleView={setShowWatchWord}
+            firstText="아이디어 검증 결과"
+            twoText="정리중입니다!"
+            onAnimationEnd={handleAnimationEnd}
+          />
+        </div>
+      ) : (
+        <Result />
+      )}
+    </>
+  )
+}
+
+export default Loading
diff --git a/app/(route)/result/result.module.css b/app/(route)/result/result.module.css
new file mode 100644
index 0000000..2284acd
--- /dev/null
+++ b/app/(route)/result/result.module.css
@@ -0,0 +1,139 @@
+.background {
+  background: var(--purple-700);
+  display: flex;
+  flex-direction: column;
+  padding: 0 22px;
+  min-height: 100vh;
+  height: auto;
+}
+
+.wordwrap {
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.wrap {
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.word {
+  color: #fff;
+  text-align: center;
+  font-size: 2.6rem;
+  font-weight: 800;
+}
+
+.smallword {
+  color: #fff;
+  text-align: center;
+  font-size: 1.35rem;
+  font-weight: 600;
+}
+
+.nonMember {
+  font-size: 0.89rem;
+  color: #fbfbfb;
+}
+
+.largeword {
+  color: #fff;
+  text-align: center;
+  font-size: 4.3rem;
+  font-weight: 700;
+}
+
+.blue {
+  color: #183876;
+}
+
+.topmargin {
+  margin-top: 100px;
+}
+
+.leftmargin {
+  margin-left: 5px;
+  cursor: pointer;
+  color: white;
+  font-size: 0.93rem;
+}
+
+.flex {
+  margin: 13px 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.intosignin {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 55px;
+  gap: 7px;
+  margin-top: 22px;
+  border-radius: 8px;
+  background: #fff;
+  color: #121212;
+
+  font-size: 1.15rem;
+  font-weight: 700;
+  cursor: pointer;
+}
+
+.intosignin:hover {
+  opacity: 0.8;
+  transition: all 0.4s;
+}
+
+.img {
+  width: 430px;
+  height: 430px;
+  margin-top: 48.4px;
+}
+
+@keyframes fadeInUp {
+  0% {
+    opacity: 0;
+    transform: translateY(20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+.word {
+  opacity: 0;
+  animation: fadeInUp 2s ease forwards;
+}
+
+.word:nth-child(1) {
+  animation-delay: 0.5s;
+}
+
+.word:nth-child(2) {
+  animation-delay: 1.5s;
+}
+
+.wrap {
+  opacity: 0;
+  animation: fadeInUp 1.6s ease forwards;
+}
+
+.wrap:nth-child(1) {
+  animation-delay: 0.5s;
+}
+
+.wrap:nth-child(2) {
+  animation-delay: 2s;
+}
+
+.wrap:nth-child(3) {
+  animation-delay: 2mss;
+}
diff --git a/app/(route)/search/page.tsx b/app/(route)/search/page.tsx
index 3f50c66..5ca6c94 100644
--- a/app/(route)/search/page.tsx
+++ b/app/(route)/search/page.tsx
@@ -9,7 +9,10 @@ function Search() {
       <Nav title="검색 결과" />
       <div className={CommonS.wrapper}>
         <SearchBar />
-        <span>데이터를 모두 불러왔습니다.</span>
+
+        <div className={CommonS.columnWrapper}>
+          <span>데이터를 모두 불러왔습니다.</span>
+        </div>
       </div>
     </>
   )