초기 커밋

2025-03-26 18:16:46 +09:00
commit 266674cc0e
67 changed files with 14235 additions and 0 deletions
--- a/.obsidian/app.json
+++ b/.obsidian/app.json
@@ -0,0 +1,3 @@
+{
+  "alwaysUpdateLinks": true
+}
--- a/.obsidian/appearance.json
+++ b/.obsidian/appearance.json
@@ -0,0 +1,3 @@
+{
+  "cssTheme": "Notation"
+}
--- a/.obsidian/core-plugins.json
+++ b/.obsidian/core-plugins.json
@@ -0,0 +1,31 @@
+{
+  "file-explorer": true,
+  "global-search": true,
+  "switcher": true,
+  "graph": true,
+  "backlink": true,
+  "canvas": true,
+  "outgoing-link": true,
+  "tag-pane": true,
+  "properties": false,
+  "page-preview": true,
+  "daily-notes": true,
+  "templates": true,
+  "note-composer": true,
+  "command-palette": true,
+  "slash-command": false,
+  "editor-status": true,
+  "bookmarks": true,
+  "markdown-importer": false,
+  "zk-prefixer": false,
+  "random-note": false,
+  "outline": true,
+  "word-count": true,
+  "slides": false,
+  "audio-recorder": false,
+  "workspaces": false,
+  "file-recovery": true,
+  "publish": false,
+  "sync": true,
+  "webviewer": false
+}
--- a/.obsidian/themes/Notation/manifest.json
+++ b/.obsidian/themes/Notation/manifest.json
@@ -0,0 +1,6 @@
+{
+    "name": "Notation",
+    "version": "0.0.0",
+    "minAppVersion": "0.16.0",
+    "author": "deathau"
+}
--- a/.obsidian/themes/Notation/theme.css
+++ b/.obsidian/themes/Notation/theme.css
@@ -0,0 +1,831 @@
+/***** TABLE OF CONTENTS *****/
+/* 1. Font
+/* 2. Colours
+/*     2.1. Hue options (change these numbers for an entirely new look!)
+/*     2.2. Dark theme
+/*     2.3. Light theme
+/*     2.4. Common (calculated)
+/* 3. General UI
+/*     3.1. Title Bar
+/* 4. Markdown (editor / preview)
+/*     4.1. Headings
+/*         4.1.1. Fix font weights
+/*     4.2. Links
+/*         4.2.1. Nifty arrow before internal links (also applies to embeds)
+/*     4.3. Embeds
+/*     4.4. Tables
+/*     4.5. Popovers
+/*     4.6. Task Lists
+/*     4.7. Blockquotes
+/*     4.8. Code
+/*     4.9. Bulleted lists
+/*     4.10. Misc Fixes
+/* 5. Graph view colours
+/* 6. Notion Colour Blocks
+/* 7. In-document header (scrolls with the document) [remove for compatibility with Andy's mode]
+/*     7.1. Adjustments for non-in-document headers (graphs, etc)\
+/*     7.2. Active pane border 
+/*     7.3. Misc fixes
+/* 8. Tags
+/*     8.1. Tag custom colours
+/***** *****/
+
+/* 1. Font */
+body {
+  /* font stacks taken directly from Notion */
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
+  --font-monospace: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
+  -webkit-font-smoothing: auto;
+}
+
+/* 2. Colours */
+/* 2.1. Hue options ( change these numbers for an entirely new look!) */
+body.theme-light,
+body.theme-dark {
+  /* change these numbers for an entirely new look */
+  --hue: 203;
+  --sat: 8%;
+  --interactive-accent-rgb: 46, 170, 220;
+  --code: #EB5757;
+
+  --opacity-translucency: 0.7;
+}
+
+/* 2.2. Dark theme */
+.theme-dark {
+  --L0: 0%;
+  --L1: 20%;
+  --L2: 23%;
+  --L3: 26%;
+
+  --text-rgb: 255, 255, 255;
+
+  --text-highlight-bg: rgb(89, 86, 59);
+  --text-selection: hsla(211, 100%, 50%, 0.2);
+  --interactive-normal: #2a2a2a;
+  --interactive-hover: #303030;
+
+  --text-gray: rgba(255, 255, 255, 0.6);
+  --text-brown: rgb(147, 114, 100);
+  --text-orange: rgb(255, 163, 68);
+  --text-yellow: rgb(255, 220, 73);
+  --text-green: rgb(77, 171, 154);
+  --text-blue: rgb(82, 156, 202);
+  --text-purple: rgb(154, 109, 215);
+  --text-pink: rgb(226, 85, 161);
+  --text-red: rgb(255, 115, 105);
+
+  --background-gray: rgb(69, 75, 78);
+  --background-brown: rgb(67, 64, 64);
+  --background-orange: rgb(89, 74, 58);
+  --background-yellow: rgb(89, 86, 59);
+  --background-green: rgb(53, 76, 75);
+  --background-blue: rgb(54, 73, 84);
+  --background-purple: rgb(68, 63, 87);
+  --background-pink: rgb(83, 59, 76);
+  --background-red: rgb(89, 65, 65);
+}
+
+/* 2.3. Light theme */
+.theme-light {
+  --L0: 0%;
+  --L1: 100%;
+  --L2: 96%;
+  --L3: 90%;
+
+  --text-rgb: 55, 53, 47;
+
+  --text-highlight-bg: rgb(251, 243, 219);
+  --text-selection: rgba(0, 122, 255, 0.15);
+  --interactive-normal: #f2f3f5;
+  --interactive-hover: #e9e9e9;
+
+  --text-gray: rgba(55, 53, 47, 0.6);
+  --text-brown: rgb(100, 71, 58);
+  --text-orange: rgb(217, 115, 13);
+  --text-yellow: rgb(223, 171, 1);
+  --text-green: rgb(15, 123, 108);
+  --text-blue: rgb(11, 110, 153);
+  --text-purple: rgb(105, 64, 165);
+  --text-pink: rgb(173, 26, 114);
+  --text-red: rgb(224, 62, 62);
+
+  --background-gray: rgb(235, 236, 237);
+  --background-brown: rgb(233, 229, 227);
+  --background-orange: rgb(250, 235, 221);
+  --background-yellow: rgb(251, 243, 219);
+  --background-green: rgb(221, 237, 234);
+  --background-blue: rgb(221, 235, 241);
+  --background-purple: rgb(234, 228, 242);
+  --background-pink: rgb(244, 223, 235);
+  --background-red: rgb(251, 228, 228);
+}
+
+/* 2.4. Common (calculated) */
+body.theme-light,
+body.theme-dark {
+  --background-primary: hsl(var(--hue), var(--sat), var(--L1));
+  --background-primary-alt: hsl(var(--hue), var(--sat), var(--L3));
+  --background-secondary: hsl(var(--hue), var(--sat), var(--L2));
+  --background-secondary-alt: hsl(var(--hue), var(--sat), var(--L3));
+  --background-accent: hsl(var(--hue), var(--sat), var(--L0));
+  --background-modifier-border: rgba(var(--text-rgb), 0.14);
+  --text-accent: rgba(var(--text-rgb), 0.45);
+  --text-accent-hover: rgba(var(--text-rgb), 0.45);
+  --text-normal: rgba(var(--text-rgb), 0.9);
+  --text-muted: rgba(var(--text-rgb), 0.45);
+  --text-faint: rgba(var(--text-rgb), 0.25);
+  --text-on-accent: rgba(var(--text-rgb), 0.9);
+  --interactive-accent: rgb(var(--interactive-accent-rgb));
+  --interactive-accent-hover: rgba(var(--interactive-accent-rgb), 0.8);
+}
+
+body.theme-light {
+  --background-primary-alt: hsl(var(--hue), var(--sat), var(--L2));
+}
+
+/* 3. General UI */
+.view-header-title {
+  font-weight: 700;
+}
+
+/* 3.1. Title bar */
+.titlebar {
+  background-color: var(--background-secondary-alt);
+}
+
+.titlebar-inner {
+  color: var(--text-normal);
+}
+
+/* 4. Markdown (editor / preview)
+/* 4.1. Headings */
+.markdown-preview-view h1 {
+  font-size: 30px;
+  margin-top: 32px;
+  margin-bottom: 4px;
+}
+
+.markdown-preview-view h2 {
+  font-size: 24px;
+  margin-top: 23px;
+  margin-bottom: 1px;
+}
+
+.markdown-preview-view h3,
+.markdown-preview-view h4,
+.markdown-preview-view h5,
+.markdown-preview-view h6 {
+  font-size: 20px;
+  margin-top: 16px;
+  margin-bottom: 0px;
+}
+
+.cm-s-obsidian .cm-header-1 {
+  font-size: 30px;
+}
+
+.cm-s-obsidian .cm-header-2 {
+  font-size: 24px;
+}
+
+.cm-s-obsidian .cm-header-3,
+.cm-s-obsidian .cm-header-4,
+.cm-s-obsidian .cm-header-5,
+.cm-s-obsidian .cm-header-6 {
+  font-size: 20px;
+}
+
+.cm-s-obsidian .cm-header-6 {
+  color: var(--text-muted);
+}
+
+/* 4.1.1. Fix font weights */
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+strong,
+.cm-s-obsidian .cm-header {
+  font-weight: 600;
+}
+
+/* 4.2. Links */
+.external-link {
+  background-image: none;
+  /* no external link indicator */
+  padding: 0;
+  color: var(--text-normal);
+}
+
+.markdown-preview-view .internal-link,
+.popover.hover-popover .markdown-embed .internal-link {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-weight: 500;
+  line-height: 1.3;
+  border-bottom: 1px solid var(--background-modifier-border);
+  color: var(--text-normal);
+  text-decoration: none;
+}
+
+.markdown-preview-view .internal-link.is-unresolved {
+  color: var(--text-muted);
+}
+
+.cm-s-obsidian span.cm-link.cm-hmd-barelink {
+  /* Not actually a link */
+  color: var(--text-normal);
+}
+
+/* 4.2.1. Nifty arrow before internal links (also applies to embeds) */
+.internal-link::before,
+.markdown-embed-link::before {
+  content: " ";
+  background-color: var(--text-normal);
+  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpolygon points='5.4 26 24 7.4 24 20 26 20 26 4 10 4 10 6 22.6 6 4 24.6'%3E%3C/polygon%3E%3C/svg%3E");
+  display: inline-block;
+  width: 14px;
+  height: 14px;
+  margin-right: 2px;
+  margin-bottom: -1px;
+}
+
+.markdown-preview-view .internal-link.is-unresolved::before {
+  background-color: var(--text-muted);
+  -webkit-mask-image: url('data:image/svg+xml;charset=UTF-8, <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M7.977 14.963c.407 0 .747-.324.747-.723V8.72h5.362c.399 0 .74-.34.74-.747a.746.746 0 00-.74-.738H8.724V1.706c0-.398-.34-.722-.747-.722a.732.732 0 00-.739.722v5.529h-5.37a.746.746 0 00-.74.738c0 .407.341.747.74.747h5.37v5.52c0 .399.332.723.739.723z"></path></svg>');
+  width: 13px;
+  height: 13px;
+}
+
+/* 4.3. embeds (mimics embedded tables from Notion) */
+.markdown-embed-title,
+.markdown-embed-content h1:first-child,
+.markdown-embed-content h2:first-child,
+.markdown-embed-content h3:first-child,
+.markdown-embed-content h4:first-child,
+.markdown-embed-content h5:first-child,
+.markdown-embed-content h6:first-child {
+  font-size: 1.25em;
+  line-height: 1.5;
+  font-weight: 600;
+  text-align: left;
+  margin-top: 0;
+}
+
+.markdown-embed-title {
+  padding-left: 30px;
+}
+
+.markdown-preview-view .markdown-embed {
+  border: none;
+  margin: 0;
+  border-bottom: 1px solid var(--background-modifier-border);
+  border-radius: 0;
+  padding-bottom: 5px;
+}
+
+.markdown-embed .markdown-preview-view {
+  padding-left: 8px;
+  padding-right: 4px;
+}
+
+.markdown-embed-link {
+  color: var(--text-normal);
+  right: unset;
+  left: 0;
+  top: 3px;
+  height: 30px;
+  width: calc(100% - 20px);
+  margin-left: 4px;
+  border-bottom: 1px solid var(--background-modifier-border);
+}
+
+.markdown-embed-link::before {
+  font-size: 0.8em;
+}
+
+.markdown-embed-link svg {
+  display: none;
+  /* hide the svg link icon, gets replaced with a nifty arrow */
+}
+
+/* 4.4. Tables */
+/* fix for long markdown editor text (tables) getting cut off */
+.CodeMirror-scroll {
+  margin-right: -10px;
+}
+
+/* table headers and first column styling */
+.markdown-preview-view th:first-child,
+.markdown-preview-view td:first-child {
+  border-left: none;
+}
+
+.markdown-preview-view th:last-child,
+.markdown-preview-view td:last-child {
+  border-right: none;
+}
+
+.markdown-preview-view th {
+  text-align: left;
+  font-weight: normal;
+  color: var(--text-muted);
+}
+
+.markdown-preview-view td:first-child {
+  font-weight: 600;
+}
+
+.markdown-preview-view hr {
+  height: 1px;
+  opacity: 0.5;
+}
+
+/* 4.5. Popovers */
+.popover.hover-popover .markdown-embed-link {
+  border-bottom: none;
+}
+
+/* 4.6. Task lists */
+.markdown-preview-view .task-list-item-checkbox {
+  -webkit-appearance: none;
+  box-sizing: border-box;
+  border: 1px solid var(--text-normal);
+  position: relative;
+  width: 16px;
+  height: 16px;
+  margin: 0;
+  margin-right: 4px;
+  margin-bottom: 2px;
+  transition: background-color 200ms ease-out 0s;
+  cursor: pointer;
+  filter: none;
+}
+
+.markdown-preview-view .task-list-item-checkbox:checked {
+  border: none;
+  background-color: var(--interactive-accent);
+}
+
+.markdown-preview-view .task-list-item-checkbox:hover {
+  background-color: var(--background-primary-alt);
+}
+
+/* the SVG check mark */
+.markdown-preview-view .task-list-item-checkbox:checked::before {
+  content: ' ';
+  position: absolute;
+  background-color: white;
+  left: 2px;
+  top: 2px;
+  right: 2px;
+  bottom: 2px;
+  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpolygon points='5.5 11.9993304 14 3.49933039 12.5 2 5.5 8.99933039 1.5 4.9968652 0 6.49933039'%3E%3C/polygon%3E%3C/svg%3E");
+}
+
+.markdown-preview-view ul>li.task-list-item.is-checked {
+  text-decoration: line-through;
+  color: var(--text-muted);
+}
+
+/* 4.7. Blockquotes */
+.markdown-preview-view blockquote,
+.cm-s-obsidian pre.HyperMD-quote-1 {
+  border: none;
+  border-left: 3px solid currentcolor;
+}
+
+/* for some reason messing with the padding and size like this caused weirdness
+  with the editor mode cursor position. So just preview for now */
+.markdown-preview-view blockquote {
+  padding: 0 0.9em;
+  font-size: 1.2em;
+  margin: 3px 2px;
+}
+
+/* 4.8. Code */
+.markdown-preview-view code,
+.cm-s-obsidian span.cm-inline-code,
+.cm-s-obsidian pre.HyperMD-codeblock {
+  color: var(--code);
+  font-family: var(--font-monospace);
+}
+
+.markdown-preview-view pre>code {
+  padding: 24px 6px 24px 10px;
+  color: var(--text-normal);
+  display: block;
+  overflow: auto;
+  white-space: pre;
+}
+
+/* 4.9. Bulleted lists */
+ul {
+  list-style-type: disc;
+}
+
+ul,
+ol {
+  padding-inline-start: 24px;
+}
+
+ul>li,
+ol>li {
+  padding: 3px 2px;
+  min-height: calc(1.5em + 6px);
+  margin-top: 2px;
+  margin-bottom: 1px;
+}
+
+/* 4.10. Misc fixes */
+.cm-s-obsidian span.cm-quote {
+  color: var(--text-normal);
+}
+
+/* escape character */
+.cm-s-obsidian span.cm-hmd-escape-backslash {
+  color: var(--text-faint);
+}
+
+/* highlight */
+.markdown-preview-view mark {
+  color: var(--text-normal);
+}
+
+/* 5. Graph view colours */
+.graph-view.color-fill,
+.graph-view.color-arrow {
+  color: hsl(var(--hue), var(--sat), 50%);
+}
+
+.graph-view.color-fill-unresolved {
+  color: hsl(var(--hue), var(--sat), 50%);
+  opacity: 0.5;
+}
+
+.graph-view.color-line {
+  color: hsl(var(--hue), var(--sat), 50%);
+  opacity: 0.25;
+}
+
+.graph-view.color-text {
+  color: var(--text-normal);
+}
+
+.graph-view.color-fill-highlight {
+  color: var(--interactive-accent);
+}
+
+.graph-view.color-line-highlight {
+  color: var(--interactive-accent);
+}
+
+.theme-light .graph-view.color-fill-attachment,
+.theme-dark .graph-view.color-fill-attachment {
+  color: var(--background-blue);
+}
+
+.theme-dark .graph-view.color-fill-tag,
+.theme-light .graph-view.color-fill-tag {
+  color: var(--text-yellow);
+}
+
+/* 6. Notion Colour Blocks */
+/* Original idea from: https://gist.github.com/mklepaczewski/54e451f09994b9d450de81c8baaf8aa4 */
+/* but also with simpler classes so you can use `<span class='colour'>` as well */
+
+.app-container .markdown-preview-view pre[class*="language-note-"] {
+  padding: 3px 2px;
+  border-radius: 0;
+}
+
+.app-container .markdown-preview-view pre[class*="language-note-"] code[class*="language-note-"] {
+  color: var(--text-normal);
+  white-space: pre-wrap;
+  font-family: var(--default-font);
+  font-size: 1rem;
+  padding: 0;
+}
+
+.app-container .markdown-preview-view pre.language-note-notice,
+.app-container .markdown-preview-view pre.language-note-gray-background,
+.app-container .markdown-preview-view pre.language-note-gray-bg,
+.gray-background,
+.gray-bg {
+  background-color: var(--background-gray);
+}
+
+.app-container .markdown-preview-view pre.language-note-brown-background,
+.app-container .markdown-preview-view pre.language-note-brown-bg,
+.brown-background,
+.brown-bg {
+  background-color: var(--background-brown);
+}
+
+.app-container .markdown-preview-view pre.language-note-orange-background,
+.app-container .markdown-preview-view pre.language-note-orange-bg,
+.orange-background,
+.orange-bg {
+  background-color: var(--background-orange);
+}
+
+.app-container .markdown-preview-view pre.language-note-warn,
+.app-container .markdown-preview-view pre.language-note-yellow-background,
+.app-container .markdown-preview-view pre.language-note-yellow-bg,
+.yellow-background,
+.yellow-bg {
+  background-color: var(--background-yellow)
+}
+
+.app-container .markdown-preview-view pre.language-note-success,
+.app-container .markdown-preview-view pre.language-note-green-background,
+.app-container .markdown-preview-view pre.language-note-green-bg,
+.green-background,
+.green-bg {
+  background-color: var(--background-green);
+}
+
+.app-container .markdown-preview-view pre.language-note-info,
+.app-container .markdown-preview-view pre.language-note-blue-background,
+.app-container .markdown-preview-view pre.language-note-blue-bg,
+.blue-background,
+.blue-bg {
+  background-color: var(--background-blue);
+}
+
+.app-container .markdown-preview-view pre.language-note-purple-background,
+.app-container .markdown-preview-view pre.language-note-purple-bg,
+.purple-background,
+.purple-bg {
+  background-color: var(--background-purple);
+}
+
+.app-container .markdown-preview-view pre.language-note-pink-background,
+.app-container .markdown-preview-view pre.language-note-pink-bg,
+.pink-background,
+.pink-bg {
+  background-color: var(--background-pink);
+}
+
+.app-container .markdown-preview-view pre.language-note-danger,
+.app-container .markdown-preview-view pre.language-note-red-background,
+.app-container .markdown-preview-view pre.language-note-red-bg,
+.red-background,
+.red-bg {
+  background-color: var(--background-red);
+}
+
+.app-container .markdown-preview-view pre.language-note-gray,
+.app-container .markdown-preview-view pre.language-note-brown,
+.app-container .markdown-preview-view pre.language-note-orange,
+.app-container .markdown-preview-view pre.language-note-yellow,
+.app-container .markdown-preview-view pre.language-note-green,
+.app-container .markdown-preview-view pre.language-note-blue,
+.app-container .markdown-preview-view pre.language-note-purple,
+.app-container .markdown-preview-view pre.language-note-pink,
+.app-container .markdown-preview-view pre.language-note-red {
+  background-color: transparent;
+}
+
+.app-container .markdown-preview-view pre.language-note-gray code.language-note-gray,
+.gray {
+  color: var(--text-gray);
+}
+
+.app-container .markdown-preview-view pre.language-note-brown code.language-note-brown,
+.brown {
+  color: var(--text-brown);
+}
+
+.app-container .markdown-preview-view pre.language-note-orange code.language-note-orange,
+.orange {
+  color: var(--text-orange);
+}
+
+.app-container .markdown-preview-view pre.language-note-yellow code.language-note-yellow,
+.yellow {
+  color: var(--text-yellow)
+}
+
+.app-container .markdown-preview-view pre.language-note-green code.language-note-green,
+.green {
+  color: var(--text-green);
+}
+
+.app-container .markdown-preview-view pre.language-note-blue code.language-note-blue,
+.blue {
+  color: var(--text-blue);
+}
+
+.app-container .markdown-preview-view pre.language-note-purple code.language-note-purple,
+.purple {
+  color: var(--text-purple);
+}
+
+.app-container .markdown-preview-view pre.language-note-pink code.language-note-pink,
+.pink {
+  color: var(--text-pink);
+}
+
+.app-container .markdown-preview-view pre.language-note-red code.language-note-red,
+.red {
+  color: var(--text-red);
+}
+
+/* 7. In-document header (scrolls with the document) [remove for compatibility with Andy's mode] */
+/* !!! Remove from here down if you want to use with Andy Matuschak mode V2 !!! */
+.markdown-preview-view,
+.markdown-source-view {
+  background-color: transparent;
+}
+
+/* fix to padding top so that the editor and preview line up */
+.markdown-source-view.is-readable-line-width .CodeMirror {
+  padding: 0;
+  padding-top: 15px;
+}
+
+.markdown-preview-view,
+.CodeMirror-lines {
+  padding-top: 15px;
+}
+
+.markdown-preview-view {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+
+/* This is where the magic happens */
+.workspace-leaf-content[data-type=markdown] .view-header,
+.workspace-leaf.mod-active .workspace-leaf-content[data-type=markdown] .view-header {
+  max-width: 700px;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 0;
+  border: none;
+  background-color: transparent;
+  height: auto;
+  padding-top: 108px;
+}
+
+.workspace-split.mod-root .workspace-leaf {
+  background-color: var(--background-primary);
+}
+
+.workspace>.workspace-split>.workspace-leaf:first-of-type:last-of-type .workspace-leaf-content[data-type=markdown] .view-header {
+  background-color: transparent;
+  border: none;
+}
+
+.workspace-leaf {
+  position: relative;
+}
+
+.workspace-leaf-content[data-type=markdown] {
+  overflow: auto;
+  position: unset;
+  margin-top: 35px;
+}
+
+.workspace-leaf-content[data-type=markdown] .view-header-title-container {
+  width: 100%;
+  margin-top: auto;
+  height: auto;
+  padding: 0;
+}
+
+.workspace-leaf-content[data-type=markdown] .view-header-title-container:after {
+  content: none;
+}
+
+.workspace-leaf-content[data-type=markdown] .view-header-title {
+  font-size: 40px;
+  line-height: 1.2em;
+  padding: 3px 2px;
+  height: auto;
+  margin: 0;
+  color: var(--text-normal);
+  white-space: normal;
+}
+
+.workspace-leaf-content[data-type=markdown] .view-actions {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  background-color: transparent;
+  z-index: 1;
+}
+
+.workspace-leaf-content[data-type=markdown] .view-header-icon {
+  position: absolute;
+  left: 0;
+  z-index: 2;
+}
+
+.workspace-leaf-content[data-type=markdown] .view-content {
+  height: auto;
+}
+
+.workspace-leaf-content[data-type=markdown] .markdown-source-view {
+  z-index: 0;
+}
+
+.view-action {
+  color: var(--text-normal);
+  margin: 0;
+  padding: 0 8px;
+  height: 28px;
+  line-height: 28px;
+  border-radius: 3px;
+  transition: background-color 20ms ease-in 0s;
+}
+
+.view-action>svg {
+  max-width: 14px;
+  max-height: 14px;
+}
+
+.view-action:hover,
+.view-action.is-active {
+  color: var(--text-normal);
+  background-color: var(--background-primary-alt);
+}
+
+.workspace-split.mod-vertical>.workspace-leaf:not(:last-child) {
+  padding-right: 4px;
+}
+
+/* 7.1. Adjustments for non-in-document headers (graphs, etc) */
+.workspace-leaf-content:not([data-type=markdown]) .view-header,
+.workspace-leaf.mod-active .workspace-leaf-content:not([data-type=markdown]) .view-header {
+  border: none;
+  background-color: var(--background-primary);
+}
+
+.workspace-leaf-content:not([data-type=markdown]) .view-header-title-container:after,
+.workspace-leaf.mod-active .workspace-leaf-content:not([data-type=markdown]) .view-header-title-container:after {
+  background: linear-gradient(to right, transparent, var(--background-primary));
+}
+
+/* 7.2. Active pane border */
+/* Notion doesn't have multiple panes. And with the header modifications above,
+  how do you tell which pane is active? I'm just putting a border around the
+  active pane for now (unless there's only one pane) */
+.workspace-leaf.mod-active {
+  border: 1px solid var(--interactive-accent);
+}
+
+.workspace-leaf:not(.mod-active),
+.workspace>.workspace-split>.workspace-leaf:first-of-type:last-of-type {
+  border: 1px solid transparent;
+}
+
+/* 7.3 Misc fixes */
+/* Fix for the search pane scrolling off the page */
+.markdown-source-view,
+.workspace-split.mod-root .view-content {
+  position: unset;
+}
+
+/* 8. Tags */
+a.tag,
+.cm-s-obsidian span.cm-hashtag,
+.tag-pane-tag-text {
+  color: var(--text-normal);
+  text-decoration: none;
+  background-color: var(--background-yellow);
+  padding: 3px 6px;
+  border-radius: 3px;
+  font-size: 14px;
+  border: none;
+}
+
+.cm-s-obsidian span.cm-hashtag-begin {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+  border-right: none;
+  padding-right: 0;
+  font-size: 15px; /* why? I dunno. Just needs it to balance out */
+}
+
+.cm-s-obsidian span.cm-hashtag-end {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+  border-left: none;
+  padding-left: 0;
+}
+
+/* 8.1. Tag custom colours */
+/* As of Obsidian 0.9.0 there are custom classes for tags. 
+ * this theme provides varibles of the form --background-<color> and --text-<color> for the following colours:
+ * gray, brown, orange, yellow, green, blue, purple, pink, red
+ * If you want your own colours for your own specific tags you can copy and utilize this: */
+.cm-s-obsidian span.cm-hashtag.cm-tag-important,
+.tag[href="#important"] {
+  background-color: var(--background-red);
+}
--- a/.obsidian/workspace.json
+++ b/.obsidian/workspace.json
@@ -0,0 +1,214 @@
+{
+  "main": {
+    "id": "56e1ea77a88bc710",
+    "type": "split",
+    "children": [
+      {
+        "id": "f2510d123a7c027b",
+        "type": "tabs",
+        "children": [
+          {
+            "id": "ccb739e0559e3bb1",
+            "type": "leaf",
+            "state": {
+              "type": "empty",
+              "state": {},
+              "icon": "lucide-file",
+              "title": "새 탭"
+            }
+          }
+        ]
+      }
+    ],
+    "direction": "vertical"
+  },
+  "left": {
+    "id": "9f1bdcde3d6df418",
+    "type": "split",
+    "children": [
+      {
+        "id": "2e62654906d70411",
+        "type": "tabs",
+        "children": [
+          {
+            "id": "c100c8bd3d816313",
+            "type": "leaf",
+            "state": {
+              "type": "file-explorer",
+              "state": {
+                "sortOrder": "alphabetical",
+                "autoReveal": false
+              },
+              "icon": "lucide-folder-closed",
+              "title": "파일 탐색기"
+            }
+          },
+          {
+            "id": "29203f082dd45e53",
+            "type": "leaf",
+            "state": {
+              "type": "search",
+              "state": {
+                "query": "",
+                "matchingCase": false,
+                "explainSearch": false,
+                "collapseAll": false,
+                "extraContext": false,
+                "sortOrder": "alphabetical"
+              },
+              "icon": "lucide-search",
+              "title": "검색"
+            }
+          },
+          {
+            "id": "db7abf9699f2266c",
+            "type": "leaf",
+            "state": {
+              "type": "bookmarks",
+              "state": {},
+              "icon": "lucide-bookmark",
+              "title": "북마크"
+            }
+          }
+        ]
+      }
+    ],
+    "direction": "horizontal",
+    "width": 300
+  },
+  "right": {
+    "id": "22afaf11a656085d",
+    "type": "split",
+    "children": [
+      {
+        "id": "0a198d95f43a358d",
+        "type": "tabs",
+        "children": [
+          {
+            "id": "e8e3717d4394b5a5",
+            "type": "leaf",
+            "state": {
+              "type": "backlink",
+              "state": {
+                "collapseAll": false,
+                "extraContext": false,
+                "sortOrder": "alphabetical",
+                "showSearch": false,
+                "searchQuery": "",
+                "backlinkCollapsed": false,
+                "unlinkedCollapsed": true
+              },
+              "icon": "links-coming-in",
+              "title": "백링크"
+            }
+          },
+          {
+            "id": "f711a11a7b3a7804",
+            "type": "leaf",
+            "state": {
+              "type": "outgoing-link",
+              "state": {
+                "linksCollapsed": false,
+                "unlinkedCollapsed": true
+              },
+              "icon": "links-going-out",
+              "title": "나가는 링크"
+            }
+          },
+          {
+            "id": "71fa51b15273cda3",
+            "type": "leaf",
+            "state": {
+              "type": "tag",
+              "state": {
+                "sortOrder": "frequency",
+                "useHierarchy": true,
+                "showSearch": false,
+                "searchQuery": ""
+              },
+              "icon": "lucide-tags",
+              "title": "태그"
+            }
+          },
+          {
+            "id": "0b17da54789ed36e",
+            "type": "leaf",
+            "state": {
+              "type": "outline",
+              "state": {
+                "followCursor": false,
+                "showSearch": false,
+                "searchQuery": ""
+              },
+              "icon": "lucide-list",
+              "title": "개요"
+            }
+          }
+        ]
+      }
+    ],
+    "direction": "horizontal",
+    "width": 300,
+    "collapsed": true
+  },
+  "left-ribbon": {
+    "hiddenItems": {
+      "switcher:빠른 전환기 열기": false,
+      "graph:그래프 뷰 열기": false,
+      "canvas:새 캔버스 만들기": false,
+      "daily-notes:오늘의 일일 노트 열기": false,
+      "templates:템플릿 삽입": false,
+      "command-palette:명령어 팔레트 열기": false
+    }
+  },
+  "active": "ccb739e0559e3bb1",
+  "lastOpenFiles": [
+    "Objest36.5",
+    "무제 폴더",
+    "ZELLYY/zellyy note/04_참고자료/시장_조사_보고서.md",
+    "ZELLYY/zellyy note/04_참고자료/경쟁_앱_분석.md",
+    "ZELLYY/zellyy note/04_참고자료/index.md",
+    "ZELLYY/zellyy note/04_참고자료/Git_이슈_트래킹_시스템.md",
+    "ZELLYY/zellyy note/03_개발_단계/스프린트_계획.md",
+    "ZELLYY/zellyy note/03_개발_단계/개발_로드맵.md",
+    "ZELLYY/zellyy note/03_개발_단계/index.md",
+    "ZELLYY/zellyy note/02_기술_문서/시스템_아키텍처.md",
+    "ZELLYY/zellyy note/02_기술_문서/데이터_모델_설계.md",
+    "ZELLYY/zellyy note/02_기술_문서/index.md",
+    "ZELLYY/zellyy note/02_기술_문서/Supabase_연동_가이드.md",
+    "ZELLYY/zellyy note/02_기술_문서/SNS_통합_가이드.md",
+    "ZELLYY/zellyy note/02_기술_문서/React_Native_설정_가이드.md",
+    "ZELLYY/zellyy note/02_기술_문서/ERD_다이어그램.md",
+    "ZELLYY/zellyy note/02_기술_문서/API_명세서.md",
+    "ZELLYY/zellyy note/03_UI_UX_설계/사용자_페르소나.md",
+    "ZELLYY/zellyy note/03_UI_UX_설계/사용자_스토리.md",
+    "ZELLYY/zellyy note/03_UI_UX_설계/index.md",
+    "ZELLYY/zellyy note/03_UI_UX_설계/UI_와이어프레임_핵심화면.md",
+    "ZELLYY/zellyy note/03_UI_UX_설계/UI_와이어프레임_추가화면.md",
+    "ZELLYY/zellyy note/03_UI_UX_설계/UI_UX_가이드라인.md",
+    "ZELLYY/zellyy note/01_기획_및_설계/주요_사용_시나리오.md",
+    "ZELLYY/zellyy note/01_기획_및_설계/요구사항_분석.md",
+    "ZELLYY/zellyy note/01_기획_및_설계/index.md",
+    "ZELLYY/zellyy note/01_기획_및_설계/UI_UX_설계.md",
+    "ZELLYY/zellyy note/04_참고자료",
+    "ZELLYY/zellyy note/03_개발_단계",
+    "ZELLYY/zellyy note/03_UI_UX_설계",
+    "ZELLYY/zellyy note/02_기술_문서",
+    "ZELLYY/zellyy note/01_기획_및_설계",
+    "ZELLYY/zellyy note/00_프로젝트_개요",
+    "ZELLYY/워드프레스 html 변환 플러그인",
+    "ZELLYY/워드프레스 AI 검색 플러그인",
+    "ZELLYY/zellyy subscription",
+    "4. Jayoo/Jayoo IDP/jayoo_idp_system_architecture_horizontal.svg",
+    "1. Project/1. Jayoo/Jayoo IDP/jayoo_idp_system_architecture_horizontal.svg",
+    "3. Resource/4. Applications & Services/Foxit Adminconsole/ac compare.canvas",
+    "5. Attached file/U1_Atomix XL V2_146119099513796.jpeg",
+    "5. Attached file/D5C63159C9E4C6C3306C386D9367884F8813B385410419C30AD6081E7FC44F87.jpeg",
+    "5. Attached file/CC92E9D33AC53F93B415DAD32887D7DECE8C12FDD24E674F4F818F254E0C6954.jpeg",
+    "5. Attached file/A7BF7C37AD639F21E1B80BB5D0A8FB0278F8D654C312B3F2C6A75085D77600BB.jpeg",
+    "5. Attached file/19296-1548033963-Pointillism style close-up,Pointillism style Sunflower oil painting,simple and atmospheric,urim _(paintur_),creamy style texture.jpeg",
+    "5. Attached file/00049-423165256.jpeg",
+    "5. Attached file/00029-3406627674.jpeg",
+    "5. Attached file/스크린샷 2024-06-22 오전 11.57.37.png"
+  ]
+}
--- a/.obsidian/workspaces.json
+++ b/.obsidian/workspaces.json
@@ -0,0 +1,4 @@
+{
+  "workspaces": {},
+  "active": ""
+}
--- a/Arkstory/architecture.md
+++ b/Arkstory/architecture.md
@@ -0,0 +1,260 @@
+# Arkstory - 아키텍처 설계
+
+## 개요
+이 문서는 Arkstory 웹사이트의 전체 아키텍처와 주요 컴포넌트 간의 관계를 설명합니다. React 기반의 웹 애플리케이션으로, Supabase를 백엔드로 활용하고 Strapi CMS를 통해 블로그 콘텐츠를 관리합니다. Lovable UI 디자인 원칙을 적용하여 사용자에게 즐거운 경험을 제공합니다.
+
+## 아키텍처 원칙
+- **사용자 중심 디자인**: 사용자의 감정과 경험을 최우선으로 고려
+- **관심사 분리**: UI, 비즈니스 로직, 데이터 액세스 계층을 명확히 분리
+- **단방향 데이터 흐름**: React와 상태 관리 라이브러리를 통한 예측 가능한 데이터 흐름
+- **모듈화**: 기능별 모듈 분리로 유지보수성 향상
+- **확장성**: 미래의 기능 확장과 사용자 증가에 대응 가능한 설계
+
+## 아키텍처 다이어그램
+```
+┌─────────────────────────────────────────────────────────────┐
+│                     Frontend (React)                         │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │  Pages  │  │   UI    │  │  Hooks  │  │  Store  │         │
+│  │         │  │Components│  │         │  │         │         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                     Service Layer                            │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │ API     │  │ Auth    │  │ Content │  │ Analytics│         │
+│  │ Services│  │ Service │  │ Service │  │ Service  │         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                     Backend Services                         │
+│  ┌─────────────┐  ┌─────────────┐  ┌─────────────┐         │
+│  │   Supabase   │  │    Strapi   │  │   External  │         │
+│  │              │  │             │  │    APIs     │         │
+│  └─────────────┘  └─────────────┘  └─────────────┘         │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## Lovable UI 디자인 전략
+
+### 디자인 원칙
+- **감성적 연결**: 사용자와 감정적 유대를 형성하는 시각적 요소 활용
+- **즐거운 놀라움**: 미세한 애니메이션과 예상을 뛰어넘는 인터랙션 제공
+- **스토리텔링**: 브랜드 스토리와 메시지를 시각적 요소로 전달
+- **개인화**: 사용자별 맞춤형 경험 제공
+- **유기적 흐름**: 자연스럽고 부드러운 UI 전환과 흐름 설계
+
+### 구현 요소
+- **마이크로인터랙션**: 작은 동작에도 즐거움을 주는 애니메이션 활용
+- **개성있는 일러스트레이션**: 브랜드 아이덴티티를 강화하는 커스텀 그래픽
+- **감정을 자극하는 색상**: 색상 심리학에 기반한 색상 팔레트 설계
+- **타이포그래피 계층**: 가독성과 시각적 즐거움을 균형있게 조화
+- **공간의 효과적 활용**: 여백과 레이아웃을 통한 시각적 호흡 제공
+
+## 주요 컴포넌트 설명
+
+### 1. Frontend Layer
+- **Pages**: 주요 페이지 컴포넌트 (홈, 블로그, 갤러리, 소개 등)
+- **UI Components**: 재사용 가능한 Lovable UI 요소 (버튼, 카드, 모달 등)
+- **Hooks**: 커스텀 React 훅 (데이터 페칭, 애니메이션, 상태 관리 등)
+- **Store**: 전역 상태 관리 (Redux 또는 Context API)
+
+### 2. Service Layer
+- **API Services**: Supabase와 Strapi API 연동 서비스
+- **Auth Service**: 사용자 인증 및 권한 관리
+- **Content Service**: 블로그 및 콘텐츠 관리
+- **Analytics Service**: 사용자 행동 분석 및 인사이트 도출
+
+### 3. Backend Services
+- **Supabase**: 인증, 데이터베이스, 스토리지, 실시간 기능 제공
+- **Strapi CMS**: 블로그 및 콘텐츠 관리 시스템
+- **External APIs**: 필요에 따른 외부 서비스 연동 (소셜 미디어, 결제 등)
+
+## 디렉토리 구조
+```
+arkstory/
+├── frontend/                # React 앱
+│   ├── public/              # 정적 파일
+│   │   ├── assets/          # 이미지, 폰트 등 에셋
+│   │   └── animations/      # Lottie 애니메이션 파일
+│   ├── src/
+│   │   ├── pages/           # 페이지 컴포넌트
+│   │   │   ├── Home/
+│   │   │   ├── Blog/
+│   │   │   ├── Gallery/
+│   │   │   └── About/
+│   │   ├── components/      # UI 컴포넌트
+│   │   │   ├── ui/          # 기본 UI 요소
+│   │   │   ├── layout/      # 레이아웃 컴포넌트
+│   │   │   ├── animations/  # 애니메이션 컴포넌트
+│   │   │   └── shared/      # 공통 컴포넌트
+│   │   ├── hooks/           # 커스텀 훅
+│   │   ├── services/        # API 서비스
+│   │   │   ├── supabase.js  # Supabase 클라이언트
+│   │   │   └── strapi.js    # Strapi API 클라이언트
+│   │   ├── store/           # 상태 관리
+│   │   ├── styles/          # 스타일 파일
+│   │   │   ├── theme.js     # 테마 설정
+│   │   │   ├── animations.js # 애니메이션 정의
+│   │   │   └── global.css   # 전역 스타일
+│   │   └── utils/           # 유틸리티 함수
+│   └── package.json
+│
+├── strapi/                  # Strapi CMS
+│   ├── api/                 # API 정의
+│   ├── config/              # 설정 파일
+│   └── content-types/       # 콘텐츠 모델 정의
+│
+└── supabase/                # Supabase 구성
+    ├── migrations/          # 데이터베이스 마이그레이션
+    ├── functions/           # Edge Functions
+    └── policies/            # 보안 정책
+```
+
+## Lovable UI 구현 세부 전략
+
+### 1. 시각적 디자인
+- **브랜드 일관성**: 브랜드 컬러, 타이포그래피, 아이콘 스타일의 일관된 적용
+- **유기적 형태**: 딱딱한 직선보다 유기적이고 부드러운 곡선 활용
+- **깊이감**: 미묘한 그림자와 레이어를 통해 시각적 깊이 제공
+- **생동감**: 정적인 요소에도 미세한 움직임으로 생명력 부여
+
+### 2. 인터랙션 디자인
+- **예측 가능성**: 직관적이면서도 예상을 뛰어넘는 인터랙션
+- **즉각적 피드백**: 사용자 행동에 대한 시각/촉각적 피드백 제공
+- **전환 애니메이션**: 화면 간 자연스러운 전환 효과
+- **맥락 유지**: 인터랙션 과정에서 사용자의 맥락 유지
+
+### 3. 콘텐츠 전략
+- **스토리 중심**: 단순 정보 전달이 아닌 스토리텔링 방식의 콘텐츠
+- **감성적 언어**: 기술적 용어보다 감성적 연결을 형성하는 언어 사용
+- **개인화**: 사용자 행동과 선호도에 따른 맞춤형 콘텐츠 제공
+- **음성과 톤**: 브랜드 고유의 음성과 톤을 일관되게 유지
+
+## 기술 스택
+
+### Frontend
+- **React**: UI 구축을 위한 메인 라이브러리
+- **Framer Motion**: 고급 애니메이션 구현
+- **styled-components/Emotion**: CSS-in-JS 스타일링
+- **React Query**: 서버 상태 관리
+- **Zustand/Redux Toolkit**: 클라이언트 상태 관리
+
+### Backend
+- **Supabase**: 인증, 데이터베이스, 스토리지 서비스
+- **Strapi**: 헤드리스 CMS로 블로그 콘텐츠 관리
+- **PostgreSQL**: 관계형 데이터베이스 (Supabase 통합)
+
+### DevOps
+- **Vercel/Netlify**: 프론트엔드 호스팅 및 CI/CD
+- **Docker**: 개발 및 배포 환경 일관성 유지
+- **GitHub Actions**: 자동화된 테스트 및 배포
+
+## 성능 최적화
+- **코드 스플리팅**: 필요한 코드만 로드하여 초기 로딩 시간 단축
+- **이미지 최적화**: WebP/AVIF 포맷과 반응형 이미지 활용
+- **프리로딩**: 주요 리소스의 선제적 로딩으로 사용자 경험 향상
+- **SSR/ISR**: 페이지별 최적의 렌더링 전략 적용
+- **메모이제이션**: 불필요한 리렌더링 방지를 위한 최적화
+
+## 보안 전략
+- **인증**: Supabase Auth를 활용한 안전한 사용자 인증
+- **RLS**: 데이터베이스 수준의 Row Level Security
+- **CORS**: 적절한 교차 출처 리소스 공유 정책
+- **XSS 방지**: 안전한 콘텐츠 렌더링 및 입력 검증
+- **CSP**: 콘텐츠 보안 정책 구현
+
+## 접근성 및 포용성
+- **WCAG 준수**: 웹 접근성 지침 준수
+- **키보드 내비게이션**: 모든 기능을 키보드로 사용 가능하도록 구현
+- **색상 대비**: 충분한 색상 대비로 가독성 확보
+- **스크린 리더 지원**: 적절한 ARIA 속성 및 의미적 HTML 구조
+
+## 유지보수 및 확장 계획
+- **모듈화된 아키텍처**: 기능별 독립적인 모듈로 유지보수 용이성 확보
+- **스타일 가이드 및 디자인 시스템**: 일관된 UI 개발을 위한 지침 마련
+- **지속적인 성능 모니터링**: Core Web Vitals 및 UX 메트릭 추적
+- **사용자 피드백 루프**: 사용자 경험 개선을 위한 지속적인 피드백 수집
+
+## Strapi CMS 활용 전략 (블로그 기능)
+- **콘텐츠 모델링**: 블로그 포스트, 카테고리, 태그 등 콘텐츠 구조 정의
+- **API 생성**: RESTful API 및 GraphQL API 자동 생성
+- **관리자 패널**: 편리한 콘텐츠 관리 인터페이스
+- **권한 관리**: 역할 기반 액세스 제어
+- **확장성**: 플러그인을 통한 기능 확장
+- **콘텐츠 편집기**: 리치 텍스트 에디터(Markdown, WYSIWYG)를 제공하지만 페이지 레이아웃 시각적 편집 기능은 없음
+
+### Strapi의 한계와 극복 방안
+- **시각적 페이지 빌더 부재**: Strapi는 페이지 레이아웃을 시각적으로 구성하는 도구를 기본 제공하지 않음
+- **해결책**: 
+  - React 프론트엔드에서 페이지 빌더 컴포넌트 구현
+  - Strapi의 Components 및 Dynamic Zones 기능을 활용하여 모듈식 콘텐츠 구성
+  - Builder.io, Plasmic 같은 외부 시각적 빌더 통합
+  - Storyblok, Contentful 등 시각적 편집 기능이 강화된 CMS로 마이그레이션 고려
+
+## WordPress에서의 마이그레이션 전략
+
+### 워드프레스의 문제점
+- **성능 이슈**: 무거운 데이터베이스 구조와 플러그인 의존성으로 인한 느린 로딩 속도
+- **보안 취약점**: 인기 있는 CMS로서 지속적인 보안 위협에 노출
+- **개발 제약**: 모던 개발 워크플로우와의 통합 어려움
+- **확장성 한계**: 트래픽 증가에 따른 확장 비용 증가
+- **UI/UX 제한**: Lovable UI 구현을 위한 세밀한 제어의 어려움
+
+### 마이그레이션 옵션 비교
+
+| 옵션 | 장점 | 단점 | 적합한 경우 |
+|------|------|------|------------|
+| **React + Supabase + Strapi** | • 높은 커스터마이징<br>• 빠른 성능<br>• 개발자 친화적<br>• 확장성 | • 초기 개발 시간 증가<br>• 학습 곡선<br>• 시각적 페이지 빌더 부재 | 고도로 맞춤화된 인터랙션,<br>개발자 리소스 충분 |
+| **Next.js + Sanity.io** | • 통합 백엔드/프론트엔드<br>• GROQ 쿼리 언어<br>• 실시간 협업 에디터<br>• SEO 최적화 | • 백엔드 제어 제한적<br>• 데이터베이스 구조화 요구 | 콘텐츠 중심,<br>SEO 중요,<br>실시간 편집 필요 |
+| **Gatsby + Contentful** | • 뛰어난 성능<br>• 풍부한 생태계<br>• 시각적 에디터<br>• 글로벌 CDN | • 고비용(Contentful)<br>• 빌드 시간 길어질 수 있음 | 글로벌 타겟,<br>마케팅 콘텐츠 다수 |
+| **Remix + Prisma + KeystoneJS** | • 뛰어난 사용자 경험<br>• 서버 사이드 로직<br>• GraphQL 인터페이스<br>• 강력한 관리자 UI | • 비교적 신규 기술<br>• 호스팅 옵션 제한적 | 복잡한 데이터 관계,<br>높은 인터랙션 |
+| **Astro + Strapi** | • 뛰어난 성능<br>• 적은 JS 전송<br>• 다양한 UI 프레임워크 지원 | • 클라이언트 상태 관리 제한적 | 콘텐츠 중심,<br>성능 최우선 |
+| **Headless WordPress** | • 기존 콘텐츠 유지<br>• 익숙한 관리자 경험<br>• 마이그레이션 용이 | • 백엔드 성능 이슈 지속<br>• API 제한 | 콘텐츠 마이그레이션 비용 높음,<br>관리자 재교육 어려움 |
+
+### 선택 가이드라인
+
+1. **개발 리소스**가 충분하다면 React + Supabase + Strapi(또는 Payload CMS) 조합이 가장 유연한 접근 방식입니다.
+
+2. **콘텐츠 중심**이고 마케팅 팀의 쉬운 관리가 중요하다면 Next.js + Sanity.io 또는 Gatsby + Contentful이 좋은 선택입니다.
+
+3. **빠른 개발 속도**가 필요하다면 여전히 WordPress를 헤드리스 방식으로 활용하는 것이 전환 비용을 줄이는 방법입니다.
+
+4. **성능**이 가장 중요하다면 Astro + 원하는 CMS 조합이 좋은 선택입니다.
+
+### 마이그레이션 단계별 계획
+
+1. **콘텐츠 감사 및 구조화**
+   - 기존 WordPress 콘텐츠 분석
+   - 새로운 콘텐츠 모델 설계
+   - 마이그레이션 스크립트 개발
+
+2. **기술 스택 선택 및 프로토타입 개발**
+   - 프로토타입으로 기술 검증
+   - 성능 및 개발 경험 평가
+
+3. **점진적 마이그레이션**
+   - 핵심 페이지부터 마이그레이션
+   - WordPress를 임시로 헤드리스 CMS로 활용 가능
+
+4. **콘텐츠 마이그레이션**
+   - 자동화된 도구 활용
+   - 수동 검토 및 조정
+
+5. **SEO 및 리다이렉트 설정**
+   - URL 구조 유지 또는 301 리다이렉트
+   - 메타데이터 마이그레이션
+   - 검색 엔진 재색인 요청
+
+6. **테스트 및 최적화**
+   - 사용자 테스트
+   - 성능 최적화
+   - 접근성 확인
+
+7. **전환 및 모니터링**
+   - 점진적 트래픽 전환
+   - 모니터링 및 이슈 대응
+
+이 아키텍처 설계는 Lovable UI 디자인 원칙을 중심으로 사용자에게 즐거움을 주는 웹사이트를 구축하기 위한 기술적, 시각적 전략을 담고 있습니다. 감성적 연결과 사용자 중심의 경험을 통해 단순한 기능적 만족을 넘어선 브랜드 충성도를 구축하는 것을 목표로 합니다.
--- a/Arkstory/migration-plan.md
+++ b/Arkstory/migration-plan.md
@@ -0,0 +1,253 @@
+# Arkstory 워드프레스 사이트 마이그레이션 단계별 계획
+
+## 프로젝트 개요
+
+현재 Arkstory 웹사이트는 WordPress로 구축되어 있으며, 성능 이슈, 개발 제약, UI/UX 제한 등의 문제점을 가지고 있습니다. 이를 해결하기 위해 WordPress를 헤드리스 CMS로 활용하고 Next.js로 프론트엔드를 재구축하는 단계적 마이그레이션 계획을 수립합니다.
+
+## 마이그레이션 목표
+
+1. 사이트 로딩 속도 및 성능 개선
+2. 현대적인 UI/UX 구현 (Lovable UI 디자인 적용)
+3. 개발 유연성 및 확장성 향상
+4. 기존 콘텐츠 및 SEO 가치 보존
+5. 콘텐츠 관리자를 위한 익숙한 관리 환경 유지
+
+## 단계별 실행 계획
+
+### 1단계: 분석 및 준비 (2-3주)
+
+#### 귀하가 수행할 작업:
+- [ ] 현재 WordPress 사이트 구조 분석
+- [ ] 핵심 기능 및 페이지 식별 
+- [ ] 콘텐츠 유형 및 데이터 구조 분석
+- [ ] 트래픽 패턴 및 사용자 행동 데이터 수집
+- [ ] 마이그레이션 우선순위 결정
+
+#### 제가 지원할 수 있는 부분:
+- [x] WordPress 데이터 구조 분석 가이드 제공
+- [x] 핵심 페이지 식별을 위한 체크리스트 생성
+- [x] SEO 가치 보존을 위한 분석 방법론 제안
+
+**산출물**: 사이트 구조 분석 문서, 마이그레이션 우선순위 목록
+
+### 2단계: 개발 환경 설정 (1-2주)
+
+#### 귀하가 수행할 작업:
+- [ ] WordPress REST API 활성화 및 구성
+- [ ] 필요한 WordPress 플러그인 설치 (JWT Authentication, ACF to REST API 등)
+- [ ] Next.js 프로젝트 초기화 및 설정
+- [ ] 개발, 테스트, 스테이징 환경 구축
+
+#### 제가 지원할 수 있는 부분:
+- [x] Next.js 프로젝트 초기 설정 코드 제공
+- [x] WordPress REST API 설정 가이드 제작
+- [x] 필수 패키지 및 의존성 목록 제안
+- [x] 개발 환경 설정을 위한 코드 샘플 제공
+
+**산출물**: 개발 환경 설정 완료, 초기 프로젝트 구조
+
+### 3단계: API 통합 구현 (2-3주)
+
+#### 귀하가 수행할 작업:
+- [ ] WordPress REST API와 Next.js 연동
+- [ ] 데이터 페칭 로직 구현
+- [ ] 인증 및 권한 관리 설정
+- [ ] API 응답 캐싱 전략 구현
+
+#### 제가 지원할 수 있는 부분:
+- [x] WordPress API 클라이언트 코드 샘플 제공
+- [x] 데이터 페칭 및 캐싱 전략 코드 샘플
+- [x] 인증 관련 코드 예시 작성
+- [x] API 엔드포인트 설계 지원
+
+**산출물**: 작동하는 API 통합 레이어, 데이터 페칭 테스트 성공
+
+### 4단계: 프론트엔드 핵심 컴포넌트 개발 (3-4주)
+
+#### 귀하가 수행할 작업:
+- [ ] 디자인 시스템 및 UI 컴포넌트 라이브러리 구축
+- [ ] 레이아웃 컴포넌트 개발
+- [ ] 주요 페이지 템플릿 구현
+- [ ] Gutenberg 블록 렌더링 시스템 개발
+
+#### 제가 지원할 수 있는 부분:
+- [x] 디자인 시스템 아키텍처 제안
+- [x] UI 컴포넌트 구조 설계
+- [x] Gutenberg 블록 파싱 및 렌더링 코드 샘플 제공
+- [x] Lovable UI 구현을 위한 인터랙션 패턴 제안
+
+**산출물**: 디자인 시스템, 재사용 가능한 컴포넌트 라이브러리
+
+### 5단계: 핵심 페이지 마이그레이션 (2-3주)
+
+#### 귀하가 수행할 작업:
+- [ ] 홈페이지 구현
+- [ ] 주요 랜딩 페이지 개발
+- [ ] 블로그 목록 및 상세 페이지 구현
+- [ ] 페이지별 SEO 최적화
+
+#### 제가 지원할 수 있는 부분:
+- [x] 페이지 구조 및 라우팅 전략 설계
+- [x] SEO 컴포넌트 코드 제공
+- [x] 페이지 템플릿 코드 샘플 작성
+- [x] 성능 최적화 방안 제시
+
+**산출물**: 기능하는 핵심 페이지 세트
+
+### 6단계: 성능 최적화 (1-2주)
+
+#### 귀하가 수행할 작업:
+- [ ] 코어 웹 바이탈 모니터링 및 개선
+- [ ] 이미지 최적화 구현
+- [ ] 코드 스플리팅 및 지연 로딩 적용
+- [ ] 서버 사이드 렌더링 및 정적 생성 전략 최적화
+
+#### 제가 지원할 수 있는 부분:
+- [x] 성능 최적화 체크리스트 제공
+- [x] 이미지 최적화 코드 샘플 작성
+- [x] 지연 로딩 구현 예시 제공
+- [x] Lighthouse 성능 분석 가이드 작성
+
+**산출물**: 최적화된 웹사이트, 성능 메트릭 개선 보고서
+
+### 7단계: 프록시 및 리디렉션 설정 (1주)
+
+#### 귀하가 수행할 작업:
+- [ ] 리디렉션 규칙 정의 및 구현
+- [ ] 프록시 서버 설정 (Next.js와 WordPress 연동)
+- [ ] URL 구조 일관성 확보
+- [ ] 404 및 에러 페이지 처리
+
+#### 제가 지원할 수 있는 부분:
+- [x] Next.js 리디렉션 설정 코드 제공
+- [x] 프록시 서버 설정 가이드 작성
+- [x] URL 매핑 전략 제안
+- [x] 에러 처리 코드 샘플 제공
+
+**산출물**: 작동하는 프록시 및 리디렉션 시스템
+
+### 8단계: 테스트 및 QA (2주)
+
+#### 귀하가 수행할 작업:
+- [ ] 크로스 브라우저 테스트
+- [ ] 모바일 대응성 테스트
+- [ ] 사용자 테스트 및 피드백 수집
+- [ ] 접근성 검증
+- [ ] 성능 테스트
+
+#### 제가 지원할 수 있는 부분:
+- [x] 테스트 체크리스트 제공
+- [x] 자동화된 테스트 코드 샘플 작성
+- [x] 접근성 검증 가이드 제공
+- [x] 성능 테스트 방법론 제안
+
+**산출물**: 테스트 보고서, 해결된 버그 목록
+
+### 9단계: 배포 및 전환 (1-2주)
+
+#### 귀하가 수행할 작업:
+- [ ] 스테이징 환경에서 최종 검증
+- [ ] 배포 자동화 설정
+- [ ] 점진적 트래픽 전환 구현
+- [ ] 배포 후 모니터링 시스템 구축
+
+#### 제가 지원할 수 있는 부분:
+- [x] 배포 스크립트 및 설정 샘플 제공
+- [x] CI/CD 파이프라인 설계 지원
+- [x] 무중단 배포 전략 제안
+- [x] 모니터링 설정 가이드 작성
+
+**산출물**: 배포된 새 웹사이트, 모니터링 대시보드
+
+### 10단계: 사후 관리 및 최적화 (지속적)
+
+#### 귀하가 수행할 작업:
+- [ ] 사용자 피드백 수집 및 개선사항 식별
+- [ ] 성능 메트릭 모니터링
+- [ ] 콘텐츠 업데이트 및 관리 프로세스 확립
+- [ ] 정기적인 보안 업데이트 및 패치 적용
+
+#### 제가 지원할 수 있는 부분:
+- [x] 지속적 최적화를 위한 체크리스트 제공
+- [x] 새로운 기능 구현을 위한 코드 샘플 및 가이드 작성
+- [x] 일반적인 문제 해결을 위한 트러블슈팅 가이드 제공
+
+**산출물**: 개선된 사용자 경험, 안정적인 운영 시스템
+
+## 기술적 결정 사항
+
+### WordPress 설정
+- 헤드리스 모드로 전환 (프론트엔드 렌더링 비활성화)
+- REST API 및 필수 엔드포인트 커스터마이징
+- JWT 인증을 통한 보안 강화
+- 필수 플러그인: Advanced Custom Fields, Yoast SEO, WP REST API
+
+### Next.js 구성
+- 페이지 라우팅 전략: 하이브리드 접근법(SSG + ISR + SSR)
+- 상태 관리: React Query(서버 상태) + Context API 또는 Zustand(클라이언트 상태)
+- 스타일링: Styled Components 또는 Tailwind CSS
+- 빌드 및 배포: Vercel 또는 Netlify
+
+### 성능 최적화
+- 이미지 최적화: Next.js Image 컴포넌트 + WebP/AVIF 포맷
+- 폰트 최적화: 로컬 폰트 + Font Display 설정
+- 코드 분할: 페이지별, 컴포넌트별 동적 임포트
+- 콘텐츠 전송: CDN 활용
+
+## 리소스 및 타임라인
+
+### 필요 리소스
+- 개발자: Next.js/React 경험자, WordPress API 지식 보유자
+- 디자이너: UI/UX 디자인, Lovable UI 경험
+- 콘텐츠 관리자: WordPress 콘텐츠 관리 경험
+- 인프라: 호스팅 및 배포 환경
+
+### 예상 타임라인
+- 총 예상 기간: 3-4개월
+- 주요 이정표:
+  - 1개월 차: 개발 환경 설정 및 API 통합 완료
+  - 2개월 차: 핵심 페이지 구현 및 성능 최적화
+  - 3개월 차: 테스트 및 최종 배포
+  - 4개월 차: 모니터링 및 추가 최적화
+
+## 위험 요소 및 완화 계획
+
+### 잠재적 위험
+1. **WordPress API 한계**: 일부 복잡한 콘텐츠 구조에서 API 응답이 불완전할 수 있음
+   - **완화 방안**: 커스텀 엔드포인트 생성, 필요시 GraphQL 추가
+
+2. **SEO 손실**: 마이그레이션 과정에서 검색 엔진 랭킹 손실 가능성
+   - **완화 방안**: 301 리디렉션, 메타데이터 보존, 구조화된 데이터 구현
+
+3. **성능 격차**: WordPress와 Next.js 간 응답 시간 불일치
+   - **완화 방안**: 효과적인 캐싱 전략, ISR 활용, API 응답 최적화
+
+4. **개발 복잡성**: Gutenberg 블록의 커스텀 렌더링 어려움
+   - **완화 방안**: 점진적 구현, 우선순위가 높은 블록부터 시작
+
+## 성공 지표
+
+1. **성능 메트릭**:
+   - LCP(Largest Contentful Paint): 2.5초 이하
+   - FID(First Input Delay): 100ms 이하
+   - CLS(Cumulative Layout Shift): 0.1 이하
+   - 페이지 로드 시간: 이전 대비 50% 감소
+
+2. **사용자 참여**:
+   - 체류 시간 증가
+   - 페이지 조회수 증가
+   - 이탈률 감소
+
+3. **SEO 성과**:
+   - 검색 엔진 랭킹 유지 또는 향상
+   - 유기적 트래픽 증가
+
+4. **개발 효율성**:
+   - 콘텐츠 업데이트 소요 시간 감소
+   - 새 기능 개발 주기 단축
+
+## 결론
+
+이 마이그레이션 계획은 기존 WordPress 사이트의 콘텐츠 관리 장점을 유지하면서, Next.js의 성능 및 개발 이점을 활용하는 균형 잡힌 접근법입니다. 단계적 마이그레이션을 통해 위험을 최소화하고, Lovable UI 디자인 원칙을 적용하여 사용자 경험을 대폭 개선하는 것이 목표입니다.
+
+이 계획은 프로젝트 진행 상황에 따라 조정될 수 있으며, 각 단계가 끝날 때마다 성과를 평가하고 필요한 조정을 수행하는 것이 중요합니다.
--- a/Arkstory/wordpress-headless-nextjs.md
+++ b/Arkstory/wordpress-headless-nextjs.md
@@ -0,0 +1,429 @@
+# WordPress 헤드리스와 Next.js 조합 아키텍처
+
+## 개요
+
+이 문서는 WordPress를 헤드리스 CMS로 활용하고 Next.js로 프론트엔드를 구축하는 아키텍처에 대해 설명합니다. 이 접근법은 WordPress의 강력한 콘텐츠 관리 기능과 Next.js의 현대적인 프론트엔드 개발 경험을 결합하여, 기존 WordPress 사이트를 점진적으로 현대화할 수 있는 방법을 제공합니다.
+
+## 아키텍처 다이어그램
+
+```
+┌─────────────────────────────────────────────────────────────┐
+│                   Client (Browser/Mobile)                    │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                       Next.js Frontend                       │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │  Pages  │  │   UI    │  │  API    │  │ State   │         │
+│  │         │  │Components│  │ Routes  │  │ Management│       │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                   WordPress REST API / GraphQL               │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                      WordPress Backend                       │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │ Posts   │  │ Pages   │  │ Custom  │  │ Media   │         │
+│  │         │  │         │  │Post Types│  │ Library │         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │ Plugins │  │ Users   │  │ Comments│  │ Settings│         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## 헤드리스 WordPress + Next.js의 장점
+
+### WordPress의 강점 활용
+- **친숙한 관리자 경험**: 콘텐츠 편집자들에게 익숙한 편집 환경 제공
+- **풍부한 플러그인 생태계**: 수천 개의 플러그인을 통한 기능 확장
+- **성숙한 사용자 관리**: 역할 및 권한 관리 시스템
+- **다양한 콘텐츠 타입**: 포스트, 페이지, 사용자 정의 포스트 타입, 분류 등
+- **기존 콘텐츠 보존**: 기존 WordPress 사이트의 콘텐츠를 그대로 활용
+
+### Next.js의 강점 활용
+- **우수한 성능**: 서버 사이드 렌더링(SSR) 및 정적 사이트 생성(SSG)
+- **SEO 최적화**: 검색 엔진 친화적인 페이지 제공
+- **개발자 경험**: React 기반의 현대적인 개발 환경
+- **API 라우트**: 서버리스 함수를 통한 백엔드 기능 구현
+- **증분 정적 재생성(ISR)**: 동적 콘텐츠의 정적 이점 활용
+
+## 구현 방법
+
+### 1. WordPress 설정
+- **REST API 활성화**: WordPress의 내장 REST API 활용
+- **필수 플러그인 설치**:
+  - **JWT Authentication**: 안전한 API 인증
+  - **ACF to REST API**: Advanced Custom Fields 데이터를 API에 노출
+  - **WPGraphQL**: GraphQL 지원 (선택사항)
+- **CORS 설정**: Next.js 애플리케이션의 API 접근 허용
+- **커스텀 엔드포인트 생성**: 필요한 데이터 형식에 맞는 API 엔드포인트 추가
+
+### 2. Next.js 프로젝트 구성
+- **프로젝트 초기화**:
+  ```bash
+  npx create-next-app my-headless-wp
+  cd my-headless-wp
+  ```
+- **필요 패키지 설치**:
+  ```bash
+  npm install swr axios @wordpress/block-serialization-default-parser
+  ```
+- **환경 변수 설정**:
+  ```
+  WORDPRESS_API_URL=https://your-wordpress-site.com/wp-json
+  ```
+
+### 3. 데이터 페칭 구현
+**WordPress API 클라이언트 설정**:
+
+```javascript
+// lib/api.js
+const API_URL = process.env.WORDPRESS_API_URL;
+
+async function fetchAPI(endpoint, params = {}) {
+  const res = await fetch(`${API_URL}${endpoint}`, params);
+  
+  if (!res.ok) {
+    throw new Error(`API error: ${res.status} ${res.statusText}`);
+  }
+  
+  return await res.json();
+}
+
+export async function getAllPosts() {
+  return fetchAPI('/wp/v2/posts?_embed&per_page=100');
+}
+
+export async function getPostBySlug(slug) {
+  const posts = await fetchAPI(
+    `/wp/v2/posts?slug=${slug}&_embed`
+  );
+  return posts[0];
+}
+
+// 기타 필요한 API 함수들...
+```
+
+### 4. 페이지 생성
+**블로그 포스트 페이지 예시**:
+
+```jsx
+// pages/posts/[slug].js
+import { useRouter } from 'next/router';
+import { getPostBySlug, getAllPosts } from '../../lib/api';
+import Head from 'next/head';
+import PostBody from '../../components/post-body';
+
+export default function Post({ post }) {
+  const router = useRouter();
+
+  if (router.isFallback) {
+    return <div>Loading...</div>;
+  }
+
+  return (
+    <article>
+      <Head>
+        <title>{post.title.rendered}</title>
+      </Head>
+      <h1 dangerouslySetInnerHTML={{ __html: post.title.rendered }} />
+      <PostBody content={post.content.rendered} />
+    </article>
+  );
+}
+
+export async function getStaticProps({ params }) {
+  const post = await getPostBySlug(params.slug);
+  
+  return {
+    props: { post },
+    revalidate: 60 // ISR: 60초마다 재생성
+  };
+}
+
+export async function getStaticPaths() {
+  const posts = await getAllPosts();
+  
+  return {
+    paths: posts.map((post) => ({
+      params: { slug: post.slug },
+    })),
+    fallback: 'blocking',
+  };
+}
+```
+
+## 콘텐츠 렌더링 전략
+
+### 1. WordPress 블록(Gutenberg) 처리 방법
+WordPress 5.0 이후 도입된 Gutenberg 블록 에디터의 콘텐츠를 Next.js에서 렌더링하는 세 가지 접근법:
+
+#### a) HTML 직접 렌더링
+```jsx
+<div dangerouslySetInnerHTML={{ __html: post.content.rendered }} />
+```
+- **장점**: 구현 간단
+- **단점**: React 컴포넌트의 이점 활용 불가
+
+#### b) HTML 파싱 및 React 컴포넌트로 변환
+```jsx
+import parse from 'html-react-parser';
+
+const PostContent = ({ content }) => {
+  return <div>{parse(content)}</div>;
+};
+```
+- **장점**: 일부 React 이점 활용
+- **단점**: 복잡한 인터랙션 구현 어려움
+
+#### c) 블록 데이터 파싱 및 커스텀 컴포넌트 매핑
+```jsx
+import { parse } from '@wordpress/block-serialization-default-parser';
+
+const BlockRenderer = ({ blocks }) => {
+  return blocks.map((block, index) => {
+    switch (block.blockName) {
+      case 'core/paragraph':
+        return <p key={index}>{block.attrs.content}</p>;
+      case 'core/heading':
+        return <h2 key={index}>{block.attrs.content}</h2>;
+      // 다른 블록 타입들...
+      default:
+        return null;
+    }
+  });
+};
+
+const PostContent = ({ rawContent }) => {
+  const blocks = parse(rawContent);
+  return <BlockRenderer blocks={blocks} />;
+};
+```
+- **장점**: 완벽한 맞춤형 경험, 최적의 SEO
+- **단점**: 구현 복잡성, 모든 블록 타입 지원 필요
+
+### 2. 이미지 최적화
+Next.js의 Image 컴포넌트를 활용하여 WordPress 미디어 최적화:
+
+```jsx
+import Image from 'next/image';
+
+const PostImage = ({ mediaItem }) => {
+  return (
+    <Image
+      src={mediaItem.source_url}
+      width={mediaItem.media_details.width}
+      height={mediaItem.media_details.height}
+      alt={mediaItem.alt_text}
+      layout="responsive"
+    />
+  );
+};
+```
+
+## 인증 및 미리보기 기능
+
+### 1. 인증 구현
+JWT 인증을 통한 보호된 콘텐츠 접근:
+
+```javascript
+// lib/auth.js
+export async function login(username, password) {
+  const response = await fetch(`${process.env.WORDPRESS_API_URL}/jwt-auth/v1/token`, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ username, password })
+  });
+  
+  const data = await response.json();
+  
+  if (response.ok) {
+    // 토큰 저장
+    localStorage.setItem('wpToken', data.token);
+    return true;
+  }
+  
+  return false;
+}
+
+export function getAuthHeader() {
+  const token = typeof window !== 'undefined' ? localStorage.getItem('wpToken') : null;
+  return token ? { 'Authorization': `Bearer ${token}` } : {};
+}
+```
+
+### 2. 드래프트 및 미리보기
+비공개 콘텐츠 미리보기 구현:
+
+```jsx
+// pages/api/preview.js
+export default async function preview(req, res) {
+  const { secret, slug, id } = req.query;
+
+  // 시크릿 검증
+  if (secret !== process.env.WORDPRESS_PREVIEW_SECRET || !slug) {
+    return res.status(401).json({ message: '유효하지 않은 토큰' });
+  }
+
+  // 미리보기 모드 활성화
+  res.setPreviewData({});
+  
+  // 해당 포스트로 리디렉션
+  res.redirect(`/posts/${slug}`);
+}
+```
+
+## SEO 최적화
+
+### 1. 메타데이터 처리
+```jsx
+import Head from 'next/head';
+
+const SEO = ({ title, description, ogImage, canonicalUrl }) => {
+  return (
+    <Head>
+      <title>{title}</title>
+      <meta name="description" content={description} />
+      <link rel="canonical" href={canonicalUrl} />
+      <meta property="og:title" content={title} />
+      <meta property="og:description" content={description} />
+      <meta property="og:image" content={ogImage} />
+      <meta property="og:type" content="article" />
+      <meta name="twitter:card" content="summary_large_image" />
+      <meta name="twitter:title" content={title} />
+      <meta name="twitter:description" content={description} />
+      <meta name="twitter:image" content={ogImage} />
+    </Head>
+  );
+};
+```
+
+### 2. Yoast SEO 통합
+WordPress의 Yoast SEO 메타데이터를 Next.js에서 활용:
+
+```javascript
+export async function getPostSEOData(slug) {
+  const post = await getPostBySlug(slug);
+  const yoastData = post.yoast_head_json || {};
+  
+  return {
+    title: yoastData.title || post.title.rendered,
+    description: yoastData.description || post.excerpt.rendered,
+    ogImage: yoastData.og_image?.[0]?.url || 
+             post._embedded?.['wp:featuredmedia']?.[0]?.source_url,
+    canonical: yoastData.canonical || `https://your-site.com/posts/${slug}`
+  };
+}
+```
+
+## 배포 및 캐싱 전략
+
+### 1. 배포 옵션
+- **Vercel/Netlify**: Next.js 애플리케이션 배포에 가장 적합
+- **Self-hosted**: 커스텀 서버 설정이 필요한 경우
+
+### 2. 캐싱 전략
+- **ISR(Incremental Static Regeneration)**: 대부분의 페이지에 적합
+  ```javascript
+  export async function getStaticProps() {
+    // 데이터 가져오기
+    return {
+      props: { data },
+      revalidate: 60 // 60초마다 재생성
+    };
+  }
+  ```
+- **주기적인 완전 재빌드**: 콘텐츠 업데이트가 빈번하지 않은 경우
+  - Vercel/Netlify webhook을 WordPress에 연결
+  - 콘텐츠 업데이트 시 빌드 트리거
+
+### 3. WordPress 캐싱
+- Redis 캐시 활용
+- WordPress 캐싱 플러그인(WP Super Cache, W3 Total Cache) 설치
+
+## 마이그레이션 전략
+
+### 1. 점진적 마이그레이션 접근법
+1. **분석 및 계획**:
+   - 가장 중요한 페이지 식별
+   - URL 구조 및 리디렉션 계획 수립
+   
+2. **핵심 페이지부터 구현**:
+   - 홈페이지, 주요 랜딩 페이지
+   - 인기 블로그 포스트
+   
+3. **프록시 설정**:
+   - Next.js로 마이그레이션된 경로는 새 애플리케이션으로
+   - 나머지 경로는 기존 WordPress 사이트로 리디렉션
+   
+4. **점진적 롤아웃**:
+   - 트래픽이 적은 페이지로 시작
+   - 모니터링 및 이슈 수정
+   - 성공적으로 검증된 후 주요 페이지로 확장
+
+### 2. URL 구조 및 리디렉션
+기존 WordPress URL 구조를 유지하거나 301 리디렉션 설정:
+
+```javascript
+// next.config.js
+module.exports = {
+  async redirects() {
+    return [
+      {
+        source: '/blog/:year/:month/:slug',
+        destination: '/posts/:slug',
+        permanent: true,
+      },
+      // 다른 리디렉션 규칙들...
+    ];
+  },
+};
+```
+
+## 성능 최적화
+
+### 1. 코어 웹 바이탈(Core Web Vitals) 최적화
+- **LCP(Largest Contentful Paint)**: 이미지 최적화, 중요 CSS 인라인화
+- **FID(First Input Delay)**: 자바스크립트 청크 분할, 중요하지 않은 JS 지연 로드
+- **CLS(Cumulative Layout Shift)**: 이미지 크기 명시, 폰트 최적화
+
+### 2. 이미지 및 폰트 최적화
+- Next.js Image 컴포넌트 활용
+- 폰트 preload 및 display: swap 적용
+
+### 3. API 응답 최적화
+- WordPress REST API 응답에서 필요한 필드만 요청
+- API 응답 캐싱 구현
+
+## 유지보수 및 워크플로우
+
+### 1. 콘텐츠 편집 워크플로우
+- WordPress 관리자 패널에서 콘텐츠 생성/편집
+- 미리보기 기능을 통해 Next.js에서 변경사항 확인
+- 게시 시 Next.js 페이지 자동 업데이트(ISR 또는 webhook 활용)
+
+### 2. 개발자 워크플로우
+- WordPress 플러그인 및 테마 업데이트 관리
+- Next.js 애플리케이션 코드 업데이트
+- API 변경사항 모니터링 및 대응
+
+### 3. 모니터링 및 분석
+- WordPress 및 Next.js 애플리케이션 모니터링
+- API 응답 시간 및 성능 추적
+- 사용자 분석 데이터 수집
+
+## 주의사항 및 한계
+
+- **API 속도 제한**: WordPress REST API의 속도 제한 고려
+- **플러그인 호환성**: 일부 WordPress 플러그인은 헤드리스 환경과 완벽하게 호환되지 않음
+- **실시간 기능**: 댓글, 양식 제출과 같은 양방향 기능 구현 복잡성
+
+## 결론
+
+WordPress를 헤드리스 CMS로 활용하고 Next.js로 프론트엔드를 구현하는 접근법은 기존 WordPress 사이트의 모든 콘텐츠 관리 기능을 유지하면서 현대적인 프론트엔드 개발 경험을 제공합니다. 이 아키텍처는 WordPress 기반 사이트를 점진적으로 현대화하고, 더 나은 성능과 사용자 경험을 제공하는 효과적인 전략입니다.
+
+특히 개발 리소스가 제한적이거나, 콘텐츠 편집자들에게 익숙한 환경을 유지해야 하는 경우, 또는 대규모 콘텐츠 마이그레이션의 위험을 줄이고자 할 때 이상적인 선택이 될 수 있습니다.
--- a/ZELLYY/New
+++ b/ZELLYY/New
@@ -0,0 +1,8 @@
+1. 견적서 작성 자동화
+2. 재고 관리 자동화 (말로하는 재고 관리)
+3. CRM
+4. SNS 관리 자동화
+5. 쇼핑몰 만들기
+6. 말로쓰는 가계부 앱 > 적자 탈출 가계부
+7. Subscription 관리 앱 > 적자 탈출 가계부
+
--- a/core/README.md
+++ b/core/README.md
@@ -0,0 +1,44 @@
+# ZELLYY Core
+
+여러 ZELLYY 서비스의 공통 기능을 제공하는 코어 시스템입니다.
+
+## 기능
+
+- 사용자 인증 및 관리 (SSO)
+- 통합 데이터베이스 스키마
+- 공통 UI 컴포넌트
+- 서비스 간 데이터 공유 API
+
+## 연동 서비스
+
+- 적자 탈출 가계부
+- Subscription Manager
+- ZELLYY Card
+
+## 기술 스택
+
+- Backend: Supabase
+- Frontend: React
+- UI Design: Lovable
+- 개발: Windsurf
+
+## 확장성 고려사항
+
+### 인프라 확장성
+- **수평적 확장**: 서비스 컴포넌트의 독립적 스케일링
+- **부하 분산**: 지역별 Edge Functions 및 CDN 활용
+- **멀티 리전 배포**: 지역별 지연 시간 최소화
+
+### 데이터베이스 확장성
+- **샤딩 전략**: 사용자 기반 데이터 파티셔닝
+- **읽기 복제본**: 읽기 작업의 분산 처리
+- **백업 및 복구**: 안정적인 데이터 보존 및 복구 계획
+
+### 시스템 모듈성
+- **마이크로서비스**: 필요에 따라 모듈 분리 가능한 구조
+- **API 게이트웨이**: 트래픽 제어 및 서비스 라우팅
+- **서비스 디스커버리**: 동적 서비스 등록 및 발견
+
+## 설치 및 실행 방법
+
+(세부 내용 추가 예정)
--- a/core/architecture.md
+++ b/core/architecture.md
@@ -0,0 +1,144 @@
+# ZELLYY Core 아키텍처
+
+## 시스템 구조
+
+```
+---------------------+
+|     Frontend Apps   |
+| +-------+ +-------+ |
+| |적자탈출| |  구독  | |
+| |가계부  | |매니저  | |
+| +-------+ +-------+ |
+----------+----------+
+           |
+----------v----------+
+|   ZELLYY Core API   |
+|                     |
+| - 사용자 인증/관리   |
+| - SSO 서비스        |
+| - 공통 데이터 관리   |
+----------+----------+
+           |
+----------v----------+
+|     Supabase        |
+| +-------+ +-------+ |
+| |  Auth | |Database| |
+| +-------+ +-------+ |
+---------------------+
+```
+
+## 데이터 모델
+
+### 사용자 (Users)
+- id: UUID (Supabase Auth와 연동)
+- email: String
+- name: String
+- created_at: Timestamp
+- last_login: Timestamp
+- services: Array<String> (사용 중인 서비스 목록)
+- auth_provider: String (google, apple, email 등 인증 제공자)
+- auth_provider_id: String (제공자 측 사용자 ID)
+- avatar_url: String (프로필 이미지 URL)
+
+### 서비스 접근 권한 (Service_Access)
+- user_id: UUID (FK: Users)
+- service_id: UUID (FK: Services)
+- access_level: String
+- granted_at: Timestamp
+
+### 서비스 (Services)
+- id: UUID
+- name: String
+- description: String
+- api_endpoint: String
+
+## 인증 흐름
+
+1. 사용자가 어느 서비스에서든 로그인 (이메일/비밀번호, 구글 또는 애플 계정 사용)
+2. ZELLYY Core에서 인증 처리
+   - 소셜 로그인의 경우 해당 제공자의 OAuth 흐름을 통해 인증
+   - 최초 로그인 시 사용자 정보 생성 및 연결
+3. JWT 토큰 발급 및 사용자 서비스 접근 권한 확인
+4. 해당 서비스로 리다이렉트 및 SSO 세션 유지
+
+## 소셜 로그인 통합 흐름
+
+```
+-------------+     +--------------+     +---------------+
+|  사용자     |---->| ZELLYY Front |---->| 구글/애플 OAuth |
+-------------+     +--------------+     +---------------+
+       ^                   ^                    |
+       |                   |                    v
+       |                   |            +---------------+
+       |                   +------------| ZELLYY Core   |
+       |                                | Auth Handler  |
+       |                                +---------------+
+       |                                       |
+       |                                       v
+       |                               +---------------+
+       +-------------------------------|  Supabase     |
+                                       |  Auth & DB    |
+                                       +---------------+
+```
+
+## 확장성을 위한 아키텍처 설계
+
+### 1. 서비스 계층 분리
+
+```
+-------------------+
+|    클라이언트     |
+--------+----------+
+         |
+--------v----------+
+|   API Gateway     |  <-- 트래픽 제어, 로드 밸런싱
+--------+----------+
+         |
+--------v----------+     +----------------+
+|  Core Services    +---->+  Cache Layer   |  <-- Redis 클러스터
+--------+----------+     +----------------+
+         |
+--------v----------+
+|  Database Layer   |  <-- 읽기 복제본, 샤딩
+-------------------+
+```
+
+### 2. 분산 시스템 패턴
+
+- **Circuit Breaker**: 장애 전파 방지 및 빠른 실패 처리
+- **Bulkhead**: 서비스 간 영향 격리
+- **Throttling**: API 사용량 제한 및 서비스 보호
+- **Saga**: 분산 트랜잭션 처리
+- **CQRS**: 읽기/쓰기 작업 분리로 성능 최적화
+
+### 3. 성능 확장 전략
+
+#### 캐싱 계층
+- **분산 캐시**: Redis 클러스터를 활용한 세션, 토큰, 자주 사용되는 데이터 캐싱
+- **엣지 캐싱**: CDN을 통한 정적 자원 및 API 응답 캐싱
+- **멀티 레벨 캐싱**: 클라이언트 → 엣지 → 서버 단계별 캐싱
+
+#### 데이터베이스 확장
+- **수직적 확장**: 리소스 증가를 통한 초기 성능 개선
+- **수평적 확장**: 샤딩을 통한 데이터 분산
+- **읽기/쓰기 분리**: 마스터-슬레이브 구조로 읽기 부하 분산
+
+### 4. 인증 시스템 확장
+
+- **토큰 관리**: 중앙화된 JWT 발급 및 검증
+- **세션 저장소**: Redis를 활용한 분산 세션 관리
+- **토큰 갱신**: 효율적인 리프레시 토큰 처리
+- **세션 동기화**: 멀티 인스턴스 간 세션 정보 동기화
+
+### 5. 모니터링 및 탄력성
+
+- **상태 모니터링**: 서비스 상태 실시간 추적
+- **자동 스케일링**: 트래픽에 따른 자동 확장 구성
+- **장애 감지**: 이상 징후 조기 발견
+- **자동 복구**: 장애 발생 시 자동 대응 체계
+
+### 6. API 버전 관리
+
+- **하위 호환성**: 이전 버전 API 지원
+- **점진적 도입**: 새로운 기능의 단계적 출시
+- **API 문서 자동화**: OpenAPI 스펙을 통한 문서 관리
--- a/core/core-service-communication.md
+++ b/core/core-service-communication.md
@@ -0,0 +1,170 @@
+# ZELLYY Core와 서비스 간 통신 설계
+
+## 개요
+
+이 문서는 ZELLYY Core와 각 서비스(적자 탈출 가계부, Subscription Manager, ZELLYY Card) 간의 통신 구조와 API 설계를 정의합니다.
+
+## 통신 아키텍처
+
+### 기본 원칙
+
+1. **API 게이트웨이 패턴** - 모든 요청은 ZELLYY Core API 게이트웨이를 통해 라우팅
+2. **JWT 기반 인증** - 모든 서비스 간 통신은 JWT 토큰으로 인증
+3. **이벤트 기반 통신** - 서비스 간 데이터 동기화는 이벤트 기반으로 구현
+
+### 통신 흐름
+
+```
+클라이언트 → ZELLYY Core API → 개별 서비스 API
+            ↑        ↓
+            └─ Supabase Auth
+```
+
+## API 엔드포인트 구조
+
+### Core API (공통)
+
+```
+/api/v1/auth     # 인증 관련 API
+  /login         # 로그인
+  /register      # 회원가입
+  /refresh-token # 토큰 갱신
+  /logout        # 로그아웃
+  /verify-email  # 이메일 인증
+
+/api/v1/users    # 사용자 관리 API
+  /me            # 현재 사용자 정보
+  /services      # 사용자의 서비스 접근 권한
+  /profile       # 프로필 관리
+
+/api/v1/services # 서비스 관리 API
+  /list          # 사용 가능한 서비스 목록
+  /switch        # 서비스 전환
+  /access        # 서비스 접근 권한 관리
+```
+
+### 서비스별 API
+
+각 서비스는 다음 패턴으로 API를 제공:
+
+```
+/api/v1/{service-name}/...  # 서비스별 고유 API
+```
+
+예: 적자 탈출 가계부 API
+```
+/api/v1/budget/accounts     # 계좌 관리
+/api/v1/budget/transactions # 거래 내역
+/api/v1/budget/categories   # 카테고리 관리
+/api/v1/budget/reports      # 리포트 생성
+```
+
+## 인증 및 권한 부여
+
+### JWT 구조
+
+```javascript
+{
+  "sub": "user-uuid",        // 사용자 ID
+  "iss": "zellyy-core",      // 토큰 발행자
+  "exp": 1634567890,         // 만료 시간
+  "iat": 1634564290,         // 발행 시간
+  "services": ["budget", "subscription"], // 접근 가능한 서비스
+  "roles": {                 // 서비스별 사용자 역할
+    "budget": "admin",
+    "subscription": "user"
+  }
+}
+```
+
+### 권한 검증 흐름
+
+1. 클라이언트가 요청 시 JWT를 Authorization 헤더에 포함
+2. Core API 게이트웨이에서 토큰 유효성 검증
+3. 요청된 서비스에 대한 접근 권한 확인
+4. 권한이 있으면 요청을 해당 서비스로 라우팅, 없으면 403 Forbidden 반환
+
+## 데이터 공유 메커니즘
+
+### 서비스 간 직접 데이터 접근
+
+제한된 상황에서만 허용:
+
+```javascript
+// 예: 구독 관리자가 가계부 데이터에 접근해야 하는 경우
+const subscriptionCost = await coreAPI.fetchFromService({
+  service: 'budget',
+  endpoint: '/api/v1/budget/transactions',
+  query: { 
+    category: 'subscriptions',
+    timeframe: 'monthly' 
+  }
+});
+```
+
+### 이벤트 기반 데이터 동기화
+
+서비스 간 데이터 일관성을 위한 이벤트 발행/구독 패턴:
+
+```javascript
+// 이벤트 정의 예시
+{
+  "type": "transaction.created",
+  "service": "budget",
+  "payload": {
+    "user_id": "user-uuid",
+    "amount": 9900,
+    "category": "subscription",
+    "description": "Netflix 월 구독"
+  },
+  "timestamp": "2023-10-18T15:30:00Z"
+}
+```
+
+## 에러 처리 및 로깅
+
+### 표준 에러 응답 형식
+
+```json
+{
+  "error": {
+    "code": "auth/invalid-credentials",
+    "message": "이메일 또는 비밀번호가 올바르지 않습니다.",
+    "details": { ... }
+  },
+  "requestId": "req-uuid-123456"
+}
+```
+
+### 중앙 집중식 로깅
+
+모든 서비스는 구조화된 로그를 Core의 중앙 로깅 시스템으로 전송:
+
+```javascript
+logger.info('user.login.success', {
+  userId: 'user-uuid',
+  service: 'budget',
+  device: 'mobile-ios',
+  ipAddress: '192.168.1.1'
+});
+```
+
+## API 버저닝 및 하위 호환성
+
+1. **URL 기반 버저닝** - `/api/v1/...`, `/api/v2/...`
+2. **점진적 변경** - 하위 호환성을 유지하며 API 발전
+3. **폐기 정책** - API 변경 시 충분한 마이그레이션 기간 제공
+
+## 성능 최적화
+
+1. **API 캐싱** - 자주 요청되는 데이터 캐싱
+2. **일괄 요청** - 여러 리소스를 한 번에 요청할 수 있는 배치 API 제공
+3. **필드 필터링** - 클라이언트가 필요한 필드만 요청할 수 있는 기능
+
+## 다음 단계
+
+1. API 게이트웨이 구현 및 테스트
+2. 서비스별 API 스펙 상세 정의
+3. 인증 및 권한 부여 시스템 구현
+4. 모니터링 및 로깅 인프라 설정
+```
--- a/core/data-security.md
+++ b/core/data-security.md
@@ -0,0 +1,258 @@
+# ZELLYY Core 데이터 보안 전략
+
+## 개요
+
+이 문서는 ZELLYY Core 시스템의 데이터 보안 전략과 구현 방안에 대해 설명합니다. 데이터의 기밀성, 무결성, 가용성을 보장하기 위한 계층적 보안 접근법을 설명합니다.
+
+## 보안 설계 원칙
+
+### 심층 방어 (Defense in Depth)
+
+**다중 보안 계층**
+- 네트워크 보안
+- 애플리케이션 보안
+- 데이터 보안
+- 사용자 인증 및 권한 관리
+
+**보안 경계 설정**
+- 보안 영역 분리
+- 영역 간 보안 통제
+- 최소 권한 접근 정책
+
+### 제로 트러스트 모델
+
+**기본 원칙**
+- 내부 네트워크와 외부 네트워크 모두 신뢰하지 않음
+- 모든 접근 요청은 항상 검증
+- 지속적인 인증 및 권한 부여
+
+**구현 요소**
+- 다중 인증(MFA) 의무화
+- 세분화된 접근 제어
+- 지속적인 모니터링 및 검증
+
+## 데이터 분류 및 보호
+
+### 데이터 분류 체계
+
+**민감도 기반 분류**
+```
+------------------------+----------------------+------------------------+
+| 높음 (민감 정보)        | 중간 (내부 정보)      | 낮음 (공개 정보)        |
+------------------------+----------------------+------------------------+
+| - 개인식별정보(PII)     | - 내부 운영 데이터    | - 마케팅 자료           |
+| - 결제 정보            | - 분석 데이터         | - 공개 API 설명서       |
+| - 인증 크리덴셜         | - 구성 설정           | - 공개 서비스 정보      |
+------------------------+----------------------+------------------------+
+| 엄격한 보안 통제 적용   | 중간 수준 보안 통제   | 기본 보안 통제 적용     |
+------------------------+----------------------+------------------------+
+```
+
+**데이터 라벨링 전략**
+- 자동 데이터 분류 시스템
+- 메타데이터 기반 라벨링
+- 정책 기반 보호 조치 적용
+
+### 데이터 암호화
+
+**저장 데이터(Data at Rest) 암호화**
+- 데이터베이스 행 수준 암호화
+- 테이블럿/필드 수준 암호화
+- 디스크 수준 암호화(FDE)
+
+**전송 중 데이터(Data in Transit) 암호화**
+- TLS 1.3 이상 적용
+- 인증서 관리 및 갱신 자동화
+- 안전한 키 교환 프로토콜
+
+**처리 중 데이터(Data in Use) 보호**
+- 메모리 보호 기술
+- 안전한 컴퓨팅 환경
+- 데이터 마스킹 및 토큰화
+
+### 암호화 키 관리
+
+**키 계층 구조**
+- 마스터 키
+- 데이터 암호화 키
+- 세션 키
+
+**키 수명 주기 관리**
+```
+┌───────────┐     ┌───────────┐     ┌───────────┐     ┌───────────┐
+│ 키 생성   │ ──> │ 키 활성화 │ ──> │ 키 교체   │ ──> │ 키 보관   │
+└───────────┘     └───────────┘     └───────────┘     └───────────┘
+                        │                                   │
+                        │                                   ▼
+                        │                            ┌───────────┐
+                        └───────────────────────────>│ 키 삭제   │
+                                                     └───────────┘
+```
+
+**키 보호 메커니즘**
+- 하드웨어 보안 모듈(HSM) 활용
+- 키 분할 및 쿼럼 기반 접근
+- 키 사용 감사 및 모니터링
+
+## 접근 제어
+
+### 인증 시스템
+
+**다중 인증(MFA) 구현**
+- 지식 기반(비밀번호)
+- 소유 기반(OTP, 모바일 인증)
+- 생체 인증(필요시)
+
+**세션 관리**
+- 안전한 세션 생성 및 만료
+- 동시 세션 제한
+- 비정상 세션 탐지 및 종료
+
+**소셜 로그인 보안 강화**
+- OAuth 2.0 + PKCE 사용
+- 철저한 제공자 검증
+- 추가 인증 계층 적용
+
+### 권한 관리
+
+**역할 기반 접근 제어(RBAC)**
+- 역할 정의 및 최소 권한 할당
+- 역할 계층 구조 설계
+- 권한 승인 워크플로우
+
+**속성 기반 접근 제어(ABAC)**
+- 사용자 속성(직무, 위치 등)
+- 자원 속성(민감도, 소유권)
+- 컨텍스트 속성(시간, 위치, 장치)
+
+**데이터 수준 보안**
+- 행 수준 보안(RLS) 구현
+- 열 수준 암호화 및 마스킹
+- 동적 데이터 접근 필터링
+
+### API 보안
+
+**인증 및 권한 부여**
+- API 키 관리
+- JWT 기반 인증
+- OAuth 2.0 / OpenID Connect 통합
+
+**요청 제한 및 방어**
+- 속도 제한(Rate Limiting)
+- API 사용량 할당량 설정
+- 비정상 요청 패턴 차단
+
+**API 보안 모니터링**
+- 요청/응답 로깅 및 분석
+- 보안 취약점 자동 감지
+- API 사용 패턴 분석
+
+## 위협 탐지 및 대응
+
+### 보안 모니터링
+
+**실시간 모니터링**
+- 로그 집계 및 분석
+- 행동 기반 탐지
+- 이상 징후 알림
+
+**보안 정보 및 이벤트 관리(SIEM)**
+- 중앙 집중식 로그 관리
+- 상관관계 분석 규칙
+- 자동화된 위협 정보 통합
+
+**취약점 관리**
+- 정기적인 취약점 스캔
+- 패치 관리 프로세스
+- 위험 기반 우선순위 설정
+
+### 침해 대응
+
+**사고 대응 계획**
+```
+1. 준비 → 2. 탐지 및 분석 → 3. 봉쇄 → 4. 제거 → 5. 복구 → 6. 교훈
+```
+
+**대응 절차**
+- 에스컬레이션 경로 및 담당자
+- 증거 수집 및 보존
+- 내외부 커뮤니케이션 지침
+
+**복구 전략**
+- 백업 기반 시스템 복원
+- 단계적 서비스 재개
+- 보안 강화 조치 구현
+
+### 보안 자동화
+
+**보안 오케스트레이션 및 자동화(SOAR)**
+- 반복 작업 자동화
+- 이벤트 기반 대응 워크플로우
+- 플레이북 기반 대응
+
+**지속적 보안 검증**
+- 자동화된 보안 테스트
+- 구성 드리프트 감지
+- 보안 회귀 방지
+
+## 규정 준수 및 감사
+
+### 데이터 보호 규정
+
+**주요 규정 준수**
+- GDPR(유럽 일반 데이터 보호 규정)
+- CCPA/CPRA(캘리포니아 소비자 개인정보 보호법)
+- PIPA(한국 개인정보 보호법)
+
+**개인정보 보호**
+- 데이터 최소화 원칙
+- 개인정보 처리 근거 관리
+- 정보 주체 권리 보장
+
+**국가별/지역별 데이터 현지화**
+- 데이터 상주 요구사항 준수
+- 국가간 데이터 전송 관리
+- 지역별 규제 모니터링
+
+### 보안 감사 및 평가
+
+**정기 보안 평가**
+- 내부 보안 감사
+- 외부 침투 테스트
+- 코드 보안 검토
+
+**컴플라이언스 증명**
+- SOC 2 인증
+- ISO 27001 준수
+- 산업별 표준 인증
+
+**감사 증적(Audit Trail)**
+- 변경 불가능한 감사 로그
+- 특권 사용자 활동 감사
+- 데이터 접근 내역 기록
+
+## 보안 구현 로드맵
+
+### 1단계: 기본 보안 인프라 구축 (1-2개월)
+- 인증 시스템 강화 (MFA 포함)
+- 기본 암호화 구현
+- 초기 보안 모니터링 설정
+
+### 2단계: 고급 데이터 보호 구현 (2-4개월)
+- 데이터 분류 및 라벨링 시스템
+- 암호화 키 관리 시스템 구축
+- 열/행 수준 보안 구현
+
+### 3단계: 위협 탐지 및 대응 체계 구축 (3-6개월)
+- SIEM 솔루션 도입
+- 자동화된 위협 탐지 규칙 설정
+- 침해 대응 계획 및 프로세스 개발
+
+### 4단계: 보안 자동화 및 지속 개선 (6-12개월)
+- 보안 오케스트레이션 구현
+- 지속적인 보안 검증 파이프라인
+- 보안 성숙도 평가 및 개선
+
+## 결론
+
+ZELLYY Core의 데이터 보안은 기술적 보안 조치뿐만 아니라 적절한 정책, 프로세스, 조직적 조치의 조합을 통해 달성됩니다. 계층적 방어 전략과 제로 트러스트 모델은 시스템과 데이터를 다양한 위협으로부터 보호하는 프레임워크를 제공합니다. 이러한 포괄적인 보안 접근 방식은 사용자 신뢰를 구축하고 비즈니스 연속성을 보장하며 규정 준수 요구사항을 충족하는 데 필수적입니다.
--- a/core/database-integration.md
+++ b/core/database-integration.md
@@ -0,0 +1,111 @@
+# ZELLYY 서비스 데이터베이스 통합 계획
+
+## 개요
+이 문서는 ZELLYY Core와 각 서비스(적자 탈출 가계부, Subscription Manager, ZELLYY Card)의 데이터베이스 통합 방안을 설명합니다.
+
+## 통합 원칙
+
+1. **단일 Supabase 인스턴스** - 모든 서비스는 하나의 Supabase 인스턴스를 공유
+2. **스키마 분리** - 서비스별로 독립된 스키마 사용
+3. **공통 테이블 공유** - 사용자 정보 등 공통 데이터는 Core 스키마에서 관리
+4. **Row-Level Security (RLS)** - 서비스별 데이터 접근 제어
+
+## 스키마 구조
+
+```
+supabase
+├── core        # ZELLYY Core 스키마
+│   ├── users   # 사용자 정보
+│   ├── services # 서비스 정보
+│   └── service_access # 사용자-서비스 접근 권한
+│
+├── budget      # 적자 탈출 가계부 스키마
+│   ├── accounts # 계좌 정보
+│   ├── categories # 지출/수입 카테고리
+│   ├── transactions # 거래 내역
+│   └── budgets # 예산 계획
+│
+├── subscription # Subscription Manager 스키마
+│   ├── subscriptions # 구독 정보
+│   ├── payment_history # 결제 내역
+│   └── reminders # 구독 알림 설정
+│
+└── card        # ZELLYY Card 스키마
+    ├── cards   # 카드 정보
+    ├── benefits # 카드 혜택
+    └── usages  # 카드 사용 내역
+```
+
+## 데이터 관계 관리
+
+### 외래 키 전략
+
+각 서비스의 데이터는 `core.users` 테이블의 사용자 ID를 외래 키로 참조합니다:
+
+```sql
+-- 예: 적자 탈출 가계부의 계좌 테이블
+CREATE TABLE budget.accounts (
+  id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+  user_id UUID REFERENCES core.users(id) ON DELETE CASCADE,
+  name TEXT NOT NULL,
+  -- 기타 필드
+);
+```
+
+### Row-Level Security (RLS) 정책
+
+각 테이블에는 사용자별 접근 제어를 위한 RLS 정책을 적용합니다:
+
+```sql
+-- 예: 계좌 테이블의 RLS 정책
+CREATE POLICY "사용자 본인의 계좌만 접근 가능" 
+ON budget.accounts 
+FOR ALL 
+USING (auth.uid() = user_id);
+```
+
+## 데이터 마이그레이션 계획
+
+기존 '적자 탈출 가계부'의 데이터베이스를 통합 스키마로 마이그레이션하는 단계:
+
+1. **스키마 생성**: `budget` 스키마 생성
+2. **테이블 이동**: 기존 테이블을 새 스키마로 이동
+3. **외래 키 업데이트**: `core.users` 테이블을 참조하도록 외래 키 수정
+4. **RLS 정책 적용**: 모든 테이블에 적절한 RLS 정책 설정
+5. **데이터 검증**: 마이그레이션 후 데이터 무결성 확인
+
+## 서비스별 데이터 접근
+
+각 서비스는 자신의 스키마와 `core` 스키마에만 접근할 수 있도록 설계:
+
+1. **서비스별 데이터베이스 역할 생성**
+```sql
+CREATE ROLE budget_service;
+GRANT USAGE ON SCHEMA core TO budget_service;
+GRANT USAGE ON SCHEMA budget TO budget_service;
+GRANT ALL PRIVILEGES ON ALL TABLES IN SCHEMA budget TO budget_service;
+GRANT SELECT ON core.users TO budget_service;
+```
+
+2. **API 접근 제어**
+   - 각 서비스별 API 키를 생성하여 적절한 권한 범위 설정
+   - Core API를 통한 인증 및 권한 검증
+
+## 성능 최적화
+
+1. **인덱스 전략**
+   - 사용자 ID 기반 인덱스 추가
+   - 자주 조회되는 필드에 적절한 인덱스 설정
+
+2. **캐싱 전략**
+   - 사용자 세션 및 자주 사용되는 데이터 캐싱
+   - 서비스별 캐시 무효화 정책 수립
+
+## 다음 단계
+
+1. 기존 '적자 탈출 가계부' 데이터베이스 스키마 상세 분석
+2. 'Subscription Manager'와 'ZELLYY Card'의 요구사항 수집 및 스키마 설계
+3. 공통 필드 및 관계 정의
+4. 테스트 데이터베이스에서 통합 스키마 검증
+5. 마이그레이션 스크립트 작성 및 테스트
+```
--- a/core/high-availability.md
+++ b/core/high-availability.md
@@ -0,0 +1,252 @@
+# ZELLYY Core 고가용성 아키텍처
+
+## 개요
+
+이 문서는 ZELLYY Core 시스템의 고가용성(High Availability, HA) 아키텍처에 대해 설명합니다. 서비스 중단 없이 안정적으로 운영하기 위한 설계 원칙과 구현 방안을 제시합니다.
+
+## 고가용성 설계 원칙
+
+### 1. 단일 장애점(Single Point of Failure) 제거
+
+**인프라 중복성**
+- 여러 가용 영역(AZ)에 걸친 서비스 배포
+- 서버, 네트워크, 스토리지 컴포넌트 중복 구성
+- 데이터베이스 클러스터 구성
+
+**장애 격리**
+- 장애 도메인 분리
+- 서비스 간 독립적 배포 및 운영
+- 컨테이너화를 통한 애플리케이션 격리
+
+### 2. 자동화된 장애 대응
+
+**자동 장애 감지**
+- 상태 확인(Health Check) 시스템 구축
+- 분산 모니터링으로 장애 조기 감지
+- 이상 징후 탐지 알고리즘 적용
+
+**자동 복구 메커니즘**
+- 자가 치유(Self-healing) 시스템 구현
+- 상태가 불량한 서버 자동 대체
+- 서비스 재시작 및 재배포 자동화
+
+## 멀티 리전 아키텍처
+
+### 글로벌 배포 전략
+
+```
+             +--------------------+
+             |  DNS Load Balancer |
+             +--------+-----------+
+                      |
+       +-------------------------------+
+       |              |               |
+------v-----+  +-----v------+  +-----v------+
+| Region A   |  | Region B   |  | Region C   |
+| (Primary)  |  | (DR Site)  |  | (Edge)     |
+------+-----+  +-----+------+  +-----+------+
+       |              |               |
+       +-------------------------------+
+                      |
+             +--------v-----------+
+             | Global Data Sync   |
+             +--------------------+
+```
+
+**리전별 서비스 특성화**
+- 주 리전(Primary): 모든 서비스 및 데이터 처리
+- 재해 복구(DR) 리전: 장애 대비 복제 환경
+- 엣지 리전: 정적 콘텐츠 및 캐싱
+
+**글로벌 트래픽 관리**
+- 지리적 라우팅으로 가장 가까운 리전으로 트래픽 유도
+- 리전 장애 시 자동 우회 라우팅
+- 부하에 따른 동적 트래픽 분산
+
+### 데이터 동기화 전략
+
+**글로벌 데이터 일관성**
+- 멀티 리전 데이터베이스 복제
+- 데이터 일관성 모델 선택 (강한 일관성 vs. 최종 일관성)
+- 분산 트랜잭션 관리
+
+**복제 지연 관리**
+- 복제 지연 모니터링
+- 지연 임계값 설정 및 알림
+- 복제 최적화 전략
+
+## 서비스 연속성
+
+### 장애 조치(Failover) 전략
+
+**자동 장애 조치**
+```
+1. 상태 모니터링 시스템이 장애 감지
+2. 장애 발생 리전/서비스 격리
+3. 대기 시스템으로 트래픽 전환
+4. 장애 리전/서비스 복구 시도
+5. 복구 완료 후 정상 운영 재개
+```
+
+**수동 장애 조치**
+- 계획된 유지보수를 위한 수동 장애 조치 절차
+- 테스트 환경에서 장애 조치 시뮬레이션
+- 장애 조치 체크리스트 및 롤백 계획
+
+### 재해 복구 계획(DRP)
+
+**복구 시나리오**
+- 단일 서비스 장애: 개별 서비스 재시작 또는 대체
+- 가용 영역 장애: 다른 AZ의 인스턴스로 자동 전환
+- 리전 장애: DR 리전으로 서비스 전환
+- 광범위한 재해: 백업에서 새 환경 구축
+
+**복구 목표**
+- 복구 시간 목표(RTO): 서비스별 차등 적용
+  * 핵심 서비스: 5분 이내
+  * 일반 서비스: 15분 이내
+  * 비핵심 서비스: 1시간 이내
+- 복구 지점 목표(RPO): 데이터 중요도에 따라 차등 적용
+  * 핵심 데이터: 거의 실시간 (1분 이내)
+  * 일반 데이터: 5분 이내
+  * 통계/로그 데이터: 1시간 이내
+
+## 데이터베이스 고가용성
+
+### Supabase PostgreSQL HA 구성
+
+**PostgreSQL 클러스터 구성**
+- 1 Primary + 2 Replica 구성
+- 자동 장애 조치 설정
+- 연결 풀 관리
+
+**백업 전략**
+- 일간 전체 백업 
+- 지속적인 WAL(Write-Ahead Log) 아카이빙
+- Point-in-Time Recovery(PITR) 지원
+
+### 다중 데이터베이스 전략
+
+**데이터베이스 샤딩**
+- 사용자 ID 기반 수평 샤딩
+- 서비스별 수직 샤딩
+- 샤드 관리 및 라우팅 시스템
+
+**읽기/쓰기 분리**
+- 쓰기 작업은 Primary로 라우팅
+- 읽기 작업은 Replica로 분산
+- 읽기 일관성 레벨 설정
+
+## 애플리케이션 고가용성
+
+### 무상태(Stateless) 설계
+
+**세션 관리**
+- 분산 세션 스토어(Redis) 활용
+- 클라이언트 측 상태 관리 최소화
+- JWT 기반 인증으로 서버 상태 의존성 감소
+
+**캐싱 전략**
+- 다층 캐싱 구현
+- 캐시 일관성 유지
+- 캐시 장애 대응 전략
+
+### API 게이트웨이 고가용성
+
+**API 게이트웨이 클러스터**
+- 여러 가용 영역에 분산 배치
+- 로드 밸런싱 및 자동 확장
+- 장애 감지 및 자동 복구
+
+**서비스 디스커버리**
+- 동적 서비스 등록 및 발견
+- 상태 기반 라우팅
+- 서비스 버전 관리
+
+## 스토리지 고가용성
+
+### 파일 스토리지 중복성
+
+**객체 스토리지 복제**
+- 리전 내 여러 가용 영역에 걸친 복제
+- 리전 간 비동기 복제
+- 버저닝 기반 데이터 보호
+
+**콘텐츠 분산 전략**
+- CDN을 통한 정적 콘텐츠 캐싱
+- 원본 대체(Origin Shield) 구현
+- 장애 시 대체 경로 제공
+
+### 데이터 지속성 보장
+
+**데이터 내구성 목표**
+- 99.999999999%(11 9's) 이상의 데이터 내구성
+- 다중 계층 데이터 보호
+- 일관된 백업 및 복원 절차
+
+**데이터 검증**
+- 체크섬 기반 데이터 무결성 검증
+- 정기적인 복원 테스트
+- 데이터 감사 및 모니터링
+
+## 모니터링 및 운영
+
+### 고가용성 모니터링
+
+**실시간 상태 대시보드**
+- 서비스 가용성 지표
+- 리전 및 가용 영역 상태
+- SLA 준수 모니터링
+
+**분산 로깅 시스템**
+- 중앙 집중식 로그 수집
+- 로그 분석 및 알림
+- 장애 패턴 탐지
+
+### 사전 예방적 운영
+
+**용량 계획**
+- 정기적인 성능 검토
+- 성장 추세 분석
+- 확장 계획 수립
+
+**정기 유지보수**
+- 계획된 유지보수 일정
+- 영향 최소화 전략
+- 무중단 배포 절차
+
+## 테스트 및 검증
+
+### 고가용성 테스트
+
+**정기적인 DR 훈련**
+- 분기별 재해 복구 시뮬레이션
+- 장애 조치 절차 훈련
+- 복구 시간 측정 및 개선
+
+**카오스 엔지니어링**
+- 제어된 환경에서 장애 주입
+- 시스템 복원력 테스트
+- 장애 대응 개선
+
+### 성능 테스트
+
+**부하 테스트**
+- 정상 부하의 3-5배 처리 검증
+- 자동 확장 기능 테스트
+- 병목 현상 식별 및 해결
+
+**장기 실행 테스트**
+- 장기간(7일 이상) 연속 운영 테스트
+- 메모리 누수 및 성능 저하 모니터링
+- 자원 사용 패턴 분석
+
+## 다음 단계
+
+1. 현재 시스템의 고가용성 수준 평가
+2. 주요 단일 장애점 식별 및 제거 계획 수립
+3. 멀티 리전 아키텍처 설계 및 구현
+4. 자동 장애 조치 시스템 개발
+5. 종합적인 재해 복구 계획 수립 및 테스트
+6. 고가용성 모니터링 체계 구축
+```
--- a/core/implementation-plan.md
+++ b/core/implementation-plan.md
@@ -0,0 +1,62 @@
+# ZELLYY Core 구현 계획
+
+## 1단계: 기초 인프라 구축 (1-2주)
+- Supabase 프로젝트 설정
+- 데이터베이스 스키마 설계 및 구현
+- 기본 인증 시스템 구축
+  - 이메일/비밀번호 인증
+  - 구글 OAuth 연동
+  - 애플 로그인 연동
+- 개발 환경 설정
+
+## 2단계: API 개발 (2-3주)
+- 사용자 관리 API 개발
+  - 회원가입/로그인/로그아웃
+  - 소셜 계정 연결 및 관리
+  - 프로필 관리
+  - 권한 관리
+- 서비스 연동 API 개발
+  - 서비스 접근 토큰 발급
+  - 서비스 간 데이터 공유
+- SSO 구현
+  - 세션 관리
+  - 서비스 간 전환
+
+## 3단계: SDK 개발 (1-2주)
+- 각 서비스에서 사용할 JavaScript/TypeScript SDK 개발
+- 인증 및 API 호출 래퍼 함수 구현
+- 소셜 로그인 통합 헬퍼
+- 에러 처리 및 로깅
+
+## 4단계: UI 컴포넌트 개발 (1-2주)
+- 로그인/회원가입 폼
+  - 소셜 로그인 버튼
+  - OAuth 리다이렉트 처리
+- 프로필 관리 페이지
+  - 소셜 계정 연결/해제
+- 서비스 전환 인터페이스
+- 공통 디자인 시스템 적용
+
+## 5단계: 테스트 및 통합 (1-2주)
+- 단위 및 통합 테스트
+- 각 서비스와의 연동 테스트
+- 소셜 로그인 흐름 테스트
+- 성능 및 보안 테스트
+
+## 6단계: 배포 및 모니터링 (1주)
+- CI/CD 파이프라인 구축
+- 배포 자동화
+- 모니터링 및 알림 시스템 구축
+
+## 일정
+총 예상 소요 기간: 7-12주
+```
+|   단계   |    1    |    2    |    3    |    4    |    5    |    6    |    7    |    8    |    9    |    10   |    11   |    12   |
+|----------|---------|---------|---------|---------|---------|---------|---------|---------|---------|---------|---------|---------|
+| 1단계    |    X    |    X    |         |         |         |         |         |         |         |         |         |         |
+| 2단계    |         |         |    X    |    X    |    X    |         |         |         |         |         |         |         |
+| 3단계    |         |         |         |         |         |    X    |    X    |         |         |         |         |         |
+| 4단계    |         |         |         |         |         |         |    X    |    X    |         |         |         |         |
+| 5단계    |         |         |         |         |         |         |         |         |    X    |    X    |         |         |
+| 6단계    |         |         |         |         |         |         |         |         |         |         |    X    |         |
+```
--- a/core/scalability-plan.md
+++ b/core/scalability-plan.md
@@ -0,0 +1,427 @@
+# ZELLYY Core 확장성 계획
+
+## 개요
+
+이 문서는 ZELLYY Core 시스템의 확장성 전략과 구현 방안에 대해 설명합니다. 사용자 수 증가와 서비스 다양화에 따른 안정적인 성능을 보장하기 위한 계획을 포함합니다.
+
+## 확장성 핵심 요소
+
+### 1. 기술적 확장성 (Technical Scalability)
+
+#### 인프라 확장성
+
+**클라우드 인프라 전략**
+- Supabase의 자동 확장 기능 활용
+- 서버리스 아키텍처 채택 (Firebase Functions, Supabase Edge Functions)
+- 정적 컨텐츠 CDN 배포
+
+**컨테이너화 및 오케스트레이션**
+- Docker 컨테이너화로 일관된 환경 구성
+- Kubernetes를 통한 서비스 관리 (필요시)
+- 자동 확장 정책 구현
+
+**글로벌 배포 전략**
+- 지역별 서비스 배치
+- Edge Computing을 통한 지연 시간 최소화
+- 멀티 리전 데이터 복제
+
+#### 데이터베이스 확장성
+
+**데이터 파티셔닝**
+```sql
+-- 사용자 ID 기반 샤딩 예시
+CREATE TABLE users_shard_1 (LIKE core.users INCLUDING ALL);
+CREATE TABLE users_shard_2 (LIKE core.users INCLUDING ALL);
+
+-- 샤딩 함수
+CREATE OR REPLACE FUNCTION get_shard_for_user(user_id UUID)
+RETURNS TEXT AS $$
+BEGIN
+  RETURN 'users_shard_' || (('x' || substring(user_id::text, 1, 8))::bit(32)::int % 2 + 1)::text;
+END;
+$$ LANGUAGE plpgsql;
+```
+
+**읽기 복제본 구성**
+- 읽기 작업 전용 데이터베이스 인스턴스
+- 마스터-슬레이브 구조 구축
+- 복제 지연 모니터링
+
+**연결 풀링 및 캐싱**
+- 데이터베이스 연결 효율적 관리
+- 결과 캐싱으로 반복 쿼리 최소화
+- 인덱스 최적화 전략
+
+### 2. 시스템 아키텍처 확장성
+
+#### 마이크로서비스 아키텍처
+
+**서비스 분리 전략**
+- 기능 기반 서비스 모듈화
+- 독립적 배포 및 확장 가능한 구조
+- 서비스 간 통신 표준화
+
+**예시 서비스 구성**
+```
+zellyy-core
+├── auth-service       # 인증 및 권한 관리
+├── user-service       # 사용자 프로필 관리
+├── notification-service # 알림 처리
+├── analytics-service  # 데이터 분석
+└── integration-service # 외부 서비스 연동
+```
+
+**서비스 디스커버리**
+- 동적 서비스 등록 및 발견
+- 상태 기반 라우팅
+- 로드 밸런싱
+
+#### API 설계
+
+**API 계층화**
+- 공개 API (클라이언트용)
+- 내부 API (서비스 간 통신)
+- 관리 API (시스템 관리용)
+
+**API 게이트웨이 구현**
+- 요청 라우팅 및 로드 밸런싱
+- 속도 제한 및 할당량 관리
+- 인증 및 권한 검증
+
+**API 버전 관리**
+```
+/api/v1/auth/login  # 현재 버전
+/api/v2/auth/login  # 새 기능이 추가된 버전
+```
+
+### 3. 성능 확장성
+
+#### 캐싱 전략
+
+**멀티 레벨 캐싱**
+```
+클라이언트 캐시 → CDN 캐시 → API 게이트웨이 캐시 → 서비스 캐시 → 데이터베이스
+```
+
+**캐시 무효화 전략**
+- 이벤트 기반 캐시 갱신
+- TTL(Time-to-Live) 기반 만료
+- 버전 태그를 통한 캐시 관리
+
+**캐시 저장소 구성**
+- Redis 클러스터 구성
+- 메모리 사용량 모니터링
+- 캐시 히트율 분석
+
+#### 비동기 처리
+
+**메시지 큐 시스템**
+- AWS SQS, RabbitMQ 또는 Kafka 활용
+- 작업 우선순위 설정
+- 재시도 및 데드레터 큐 전략
+
+**이벤트 기반 아키텍처**
+```javascript
+// 이벤트 게시 예시
+async function publishUserRegisteredEvent(userData) {
+  await eventBus.publish('user.registered', {
+    userId: userData.id,
+    timestamp: new Date().toISOString(),
+    service: 'auth-service'
+  });
+}
+
+// 이벤트 구독 예시
+eventBus.subscribe('user.registered', async (event) => {
+  await notificationService.sendWelcomeEmail(event.userId);
+  await analyticsService.trackSignup(event);
+});
+```
+
+**백그라운드 작업 처리**
+- 장기 실행 작업 분리
+- 배치 처리 최적화
+- 작업 상태 추적
+
+### 4. 운영 확장성
+
+#### 모니터링 및 알림
+
+**모니터링 지표**
+- 시스템 지표: CPU, 메모리, 디스크, 네트워크
+- 애플리케이션 지표: 응답 시간, 에러율, 요청 수
+- 비즈니스 지표: 활성 사용자, 트랜잭션 수, 전환율
+
+**로깅 전략**
+- 구조화된 로그 형식
+- 중앙화된 로그 저장소
+- 로그 분석 및 검색 도구 (ELK, Grafana)
+
+**알림 체계**
+- 임계값 기반 알림
+- 이상 탐지 알림
+- 에스컬레이션 정책
+
+#### 자동화된 운영
+
+**CI/CD 파이프라인**
+- 자동 빌드 및 테스트
+- 블루/그린 배포
+- 점진적 출시 (Canary Releases)
+
+**인프라 자동화**
+- Infrastructure as Code (Terraform, AWS CDK)
+- 자동 확장 구성
+- 자가 복구 메커니즘
+
+**장애 대응 자동화**
+- 장애 탐지 및 격리
+- 자동 롤백 메커니즘
+- 장애 분석 및 보고
+
+### 5. 비즈니스 확장성
+
+#### 멀티테넌시(Multi-tenancy)
+
+**테넌트 격리 전략**
+- 스키마 기반 분리
+- 행 수준 보안 정책 (RLS)
+- 테넌트별 리소스 할당
+
+**테넌트 온보딩 자동화**
+- 셀프서비스 등록 흐름
+- 자동 리소스 프로비저닝
+- 구성 템플릿
+
+**청구 및 사용량 추적**
+- 테넌트별 리소스 사용량 측정
+- 사용량 기반 과금 모델
+- 사용량 보고서 생성
+
+#### 국제화 및 지역화
+
+**다국어 지원**
+- 번역 관리 시스템
+- 동적 언어 전환
+- 지역별 콘텐츠 최적화
+
+**지역별 규정 준수**
+- GDPR, CCPA 등 데이터 보호 규정
+- 지역별 데이터 상주 요건
+- 규제 변경에 따른 유연한 대응
+
+**지역별 서비스 사용자화**
+- 지역별 결제 방식 지원
+- 문화적 차이를 고려한 UI/UX
+- 지역별 서비스 가용성 설정
+
+### 6. 고가용성 아키텍처 (High Availability)
+
+#### 멀티 리전 배포
+
+**리전 간 서비스 분산**
+- 지리적으로 분산된 데이터 센터 활용
+- 글로벌 트래픽 라우팅 (AWS Global Accelerator, Cloudflare 등)
+- 리전별 장애 격리
+
+**액티브-액티브 구성**
+- 모든 리전에서 동시에 서비스 제공
+- 지역 기반 라우팅으로 가장 가까운 리전으로 접속
+- 글로벌 부하 분산
+
+**액티브-패시브 구성** (비용 효율적 대안)
+- 주 리전에서 서비스 제공, 다른 리전은 대기 상태
+- 자동 장애 감지 및 장애 조치
+- 정기적인 장애 조치 테스트
+
+#### 무중단 운영
+
+**롤링 업데이트 전략**
+```
+1. 전체 서버 중 일부(예: 20%)를 서비스에서 제외
+2. 해당 서버에 새 버전 배포
+3. 정상 작동 확인 후 다시 서비스에 포함
+4. 다음 서버 그룹에 대해 반복
+```
+
+**블루-그린 배포**
+- 두 개의 동일한 환경(블루/그린) 유지
+- 새 버전을 그린 환경에 배포하고 테스트
+- 트래픽을 블루에서 그린으로 전환
+- 문제 발생 시 블루로 즉시 롤백
+
+**서킷 브레이커 패턴**
+- 서비스 장애 시 자동 차단으로 연쇄 장애 방지
+- 부분적 기능 저하로 핵심 기능 유지
+- 자동 복구 메커니즘
+
+#### 데이터 고가용성
+
+**데이터베이스 복제**
+- 동기식 복제: 트랜잭션 일관성 보장
+- 비동기식 복제: 성능 최적화
+- 지역 간 복제로 재해 복구 지원
+
+**데이터 백업 전략**
+- 정기적인 전체 백업 (일간/주간)
+- 지속적인 증분 백업
+- 백업 자동화 및 검증
+- 복구 프로세스 정기 테스트
+
+**복구 시간 목표(RTO)와 복구 시점 목표(RPO)**
+- RTO: 서비스 중단 후 복구까지 허용 시간 (예: 15분)
+- RPO: 허용 가능한 최대 데이터 손실 기간 (예: 5분)
+- 서비스 중요도에 따른 차별화된 RTO/RPO 설정
+
+### 7. 스토리지 확장 전략
+
+#### 계층형 스토리지 아키텍처
+
+**데이터 접근 패턴 기반 스토리지 분리**
+- 핫 데이터: 자주 접근되는 데이터는 고성능 스토리지
+- 웜 데이터: 가끔 접근되는 데이터는 표준 스토리지
+- 콜드 데이터: 거의 접근되지 않는 데이터는 저비용 아카이브 스토리지
+
+**자동 데이터 계층화**
+```javascript
+// 예: 데이터 이동 정책 설정
+const storageTieringPolicy = {
+  hotToCold: {
+    accessThreshold: '30days', // 30일 동안 접근되지 않으면
+    destinationTier: 'standardStorage' // 표준 스토리지로 이동
+  },
+  coldToArchive: {
+    accessThreshold: '90days', // 90일 동안 접근되지 않으면
+    destinationTier: 'archiveStorage' // 아카이브 스토리지로 이동
+  }
+};
+```
+
+**스토리지 비용 최적화**
+- 데이터 압축 및 중복 제거
+- 자동 만료 정책 설정
+- 사용량 모니터링 및 비용 분석
+
+#### 파일 스토리지 확장
+
+**객체 스토리지 활용**
+- Supabase Storage 또는 AWS S3 기반 확장 가능한 스토리지
+- CDN 연동으로 전역 콘텐츠 배포
+- 버저닝 지원으로 파일 변경 이력 관리
+
+**메타데이터 관리**
+- 파일 메타데이터 분리 저장
+- 검색 최적화 인덱스 구현
+- 태그 기반 파일 관리
+
+**파일 처리 자동화**
+- 서버리스 함수를 사용한 이미지 리사이징
+- 동영상 인코딩 파이프라인
+- OCR 및 콘텐츠 분석으로 검색 기능 강화
+
+#### 데이터베이스 스토리지 확장
+
+**수직적 파티셔닝 (테이블 분할)**
+- 자주 사용되는 열과 그렇지 않은 열 분리
+- 대용량 텍스트/BLOB 데이터 외부 저장소로 분리
+- 테이블 간 조인 최적화
+
+**시계열 데이터 샤딩**
+```sql
+-- 시간별로 분할된 테이블 예시
+CREATE TABLE logs_2023_q1 PARTITION OF logs
+  FOR VALUES FROM ('2023-01-01') TO ('2023-04-01');
+  
+CREATE TABLE logs_2023_q2 PARTITION OF logs
+  FOR VALUES FROM ('2023-04-01') TO ('2023-07-01');
+```
+
+**자동 아카이빙**
+- 오래된 데이터 자동 압축 및 아카이브
+- 아카이브 테이블의 인덱스 최적화
+- 아카이브 데이터 접근 API 구현
+
+#### 확장 가능한 검색 기능
+
+**검색 엔진 통합**
+- Elasticsearch 또는 Algolia 활용
+- 전문 검색(Full-text search) 최적화
+- 검색 결과 캐싱
+
+**분산 인덱싱**
+- 샤딩된 인덱스로 검색 부하 분산
+- 실시간 인덱스 업데이트
+- 검색 쿼리 최적화
+
+**검색 인프라 확장**
+- 검색 트래픽에 따른 자동 확장
+- 쿼리 분석 및 성능 최적화
+- 지연 로딩 및 페이징 전략
+
+## 확장성 테스트 전략
+
+### 부하 테스트
+
+**성능 테스트 도구**
+- JMeter, k6 또는 Locust 활용
+- 실제 사용 패턴 기반 시나리오
+- 점진적 부하 증가 테스트
+
+**병목 현상 식별**
+- APM 도구를 통한 성능 병목 식별
+- 데이터베이스 쿼리 최적화
+- 리소스 사용량 프로파일링
+
+**확장 임계값 설정**
+- 자동 확장 트리거 포인트 결정
+- 알림 임계값 설정
+- 용량 계획 기준 수립
+
+### 재해 복구 및 고가용성
+
+**백업 전략**
+- 정기적인 자동 백업
+- 지역 간 데이터 복제
+- 복구 시간 목표(RTO) 및 복구 시점 목표(RPO) 설정
+
+**장애 시뮬레이션**
+- 카오스 엔지니어링 원칙 적용
+- 계획된 장애 주입 테스트
+- 복구 절차 검증
+
+**지속적인 가용성 모니터링**
+- 서비스 상태 대시보드
+- 가용성 지표 추적
+- 사고 대응 프로세스 최적화
+
+## 구현 로드맵
+
+### 1단계: 기반 확장성 구축 (1-3개월)
+- Supabase 확장 설정 최적화
+- 기본 모니터링 시스템 구축
+- 캐싱 계층 구현
+
+### 2단계: 서비스 분리 및 모듈화 (3-6개월)
+- 핵심 서비스 분리 및 API 게이트웨이 구현
+- 메시지 큐 기반 비동기 처리 도입
+- CI/CD 파이프라인 고도화
+
+### 3단계: 글로벌 확장 및 고가용성 (6-12개월)
+- 멀티 리전 배포 구현
+- 데이터베이스 샤딩 및 읽기 복제본 구성
+- 재해 복구 시스템 구축
+- 고가용성 아키텍처 구현
+- 스토리지 계층화 시스템 도입
+- 자동 백업 및 복원 시스템 구축
+
+### 4단계: 최적화 및 운영 자동화 (12개월+)
+- 자동화된 성능 최적화
+- 자가 복구 시스템 구현
+- 고급 분석 및 AI 기반 운영 지원
+- 고급 스토리지 관리 시스템 구현
+- 데이터 보존 및 컴플라이언스 자동화
+- 스토리지 비용 최적화 시스템 개발
+
+## 결론
+
+ZELLYY Core의 확장성은 기술적 측면뿐만 아니라 비즈니스 성장에도 중요한 요소입니다. 이 계획은 사용자 수 증가, 서비스 다양화, 글로벌 확장에 유연하게 대응할 수 있는 기반을 제공합니다. 특히 고가용성 아키텍처와 스토리지 확장 전략을 통해 서비스의 안정성을 보장하고 데이터 증가에 효율적으로 대응할 수 있습니다. 정기적인 검토와 업데이트를 통해 변화하는 요구사항에 적응할 수 있는 확장성 전략을 유지하는 것이 중요합니다.
--- a/core/sso-implementation.md
+++ b/core/sso-implementation.md
@@ -0,0 +1,251 @@
+# ZELLYY Core SSO 구현 계획
+
+## 개요
+
+이 문서는 ZELLYY Core의 Single Sign-On (SSO) 구현 방안과 소셜 로그인(구글, 애플) 통합에 대해 설명합니다.
+
+## SSO 구현 전략
+
+### 지원하는 인증 방식
+
+1. **이메일/비밀번호** - 기본 인증 방식
+2. **구글 OAuth** - 구글 계정을 통한 로그인
+3. **애플 로그인** - 애플 계정을 통한 로그인 (iOS 앱 필수)
+
+### Supabase Auth 활용
+
+ZELLYY Core는 Supabase Auth를 활용하여 SSO를 구현합니다. Supabase는 다음 기능을 제공합니다:
+
+- 소셜 로그인 통합 (Google, Apple, Github 등)
+- JWT 토큰 관리
+- 사용자 세션 관리
+- 보안 설정 (2FA, 비밀번호 정책 등)
+
+## 소셜 로그인 구현 단계
+
+### 1. 제공자 등록 및 설정
+
+#### 구글 OAuth 설정
+
+1. Google Cloud Console에서 프로젝트 생성
+2. OAuth 2.0 클라이언트 ID 생성
+3. 승인된 리디렉션 URI 설정:
+   ```
+   https://[PROJECT_ID].supabase.co/auth/v1/callback
+   ```
+4. 클라이언트 ID와 비밀번호를 Supabase 설정에 등록
+
+#### 애플 로그인 설정
+
+1. Apple Developer 계정에서 App ID 등록
+2. Sign in with Apple 서비스 활성화
+3. 서비스 ID 생성 및 도메인 검증
+4. 승인된 리디렉션 URI 설정
+5. 키 생성 및 Supabase 설정에 등록
+
+### 2. 프론트엔드 구현
+
+#### 로그인 버튼
+
+```jsx
+import { supabase } from './supabaseClient';
+
+const SocialLoginButtons = () => {
+  const handleGoogleLogin = async () => {
+    await supabase.auth.signInWithOAuth({
+      provider: 'google',
+      options: {
+        redirectTo: 'https://app.zellyy.com/auth/callback'
+      }
+    });
+  };
+
+  const handleAppleLogin = async () => {
+    await supabase.auth.signInWithOAuth({
+      provider: 'apple',
+      options: {
+        redirectTo: 'https://app.zellyy.com/auth/callback'
+      }
+    });
+  };
+
+  return (
+    <div className="social-login">
+      <button onClick={handleGoogleLogin} className="google-btn">
+        Google로 계속하기
+      </button>
+      <button onClick={handleAppleLogin} className="apple-btn">
+        Apple로 계속하기
+      </button>
+    </div>
+  );
+};
+```
+
+#### OAuth 콜백 처리
+
+```jsx
+import { useEffect } from 'react';
+import { useLocation, useNavigate } from 'react-router-dom';
+import { supabase } from './supabaseClient';
+
+const AuthCallback = () => {
+  const location = useLocation();
+  const navigate = useNavigate();
+
+  useEffect(() => {
+    // URL에서 인증 정보 추출
+    const handleAuthCallback = async () => {
+      const { error } = await supabase.auth.getSession();
+      
+      if (error) {
+        console.error('인증 오류:', error);
+        navigate('/login?error=auth_callback_error');
+        return;
+      }
+      
+      // 성공적으로 인증됨
+      navigate('/dashboard');
+    };
+
+    handleAuthCallback();
+  }, [navigate]);
+
+  return <div>로그인 처리 중...</div>;
+};
+```
+
+### 3. 백엔드 구현
+
+#### 사용자 프로필 동기화
+
+새 사용자가 소셜 로그인으로 가입할 때 추가 정보를 저장하는 Supabase 함수:
+
+```sql
+-- Supabase 함수로 auth.users 테이블에서 core.users로 사용자 정보 동기화
+CREATE OR REPLACE FUNCTION public.handle_new_user()
+RETURNS TRIGGER AS $$
+BEGIN
+  INSERT INTO core.users (id, email, name, auth_provider, auth_provider_id, avatar_url)
+  VALUES (
+    NEW.id,
+    NEW.email,
+    COALESCE(NEW.raw_user_meta_data->>'full_name', NEW.email),
+    NEW.provider,
+    NEW.provider_id,
+    NEW.raw_user_meta_data->>'avatar_url'
+  );
+  
+  -- 기본 서비스 접근 권한 부여 (예: 처음 가입한 서비스)
+  INSERT INTO core.service_access (user_id, service_id, access_level)
+  SELECT 
+    NEW.id, 
+    id, 
+    'user' 
+  FROM core.services 
+  WHERE name = 'budget'; -- 예시: 적자 탈출 가계부를 기본 서비스로 설정
+    
+  RETURN NEW;
+END;
+$$ LANGUAGE plpgsql SECURITY DEFINER;
+
+-- 트리거 설정
+CREATE TRIGGER on_auth_user_created
+  AFTER INSERT ON auth.users
+  FOR EACH ROW EXECUTE PROCEDURE public.handle_new_user();
+```
+
+#### 서비스 간 인증 상태 공유
+
+쿠키 또는 localStorage를 사용한 SSO 세션 관리:
+
+```javascript
+// ZELLYY Core API 서비스
+export const checkAndRefreshSession = async () => {
+  const { data, error } = await supabase.auth.getSession();
+  
+  if (error || !data.session) {
+    // 세션이 없거나 만료됨
+    return { isAuthenticated: false };
+  }
+  
+  // 세션 활성 연장
+  if (data.session.expires_at - Date.now() / 1000 < 3600) {
+    // 만료 1시간 전이면 갱신
+    await supabase.auth.refreshSession();
+  }
+  
+  return { 
+    isAuthenticated: true,
+    user: data.session.user,
+    accessibleServices: await getUserServices(data.session.user.id)
+  };
+};
+
+// 사용자의 접근 가능한 서비스 목록 조회
+const getUserServices = async (userId) => {
+  const { data, error } = await supabase
+    .from('service_access')
+    .select(`
+      service:service_id (
+        id,
+        name,
+        description,
+        api_endpoint
+      ),
+      access_level
+    `)
+    .eq('user_id', userId);
+    
+  if (error) throw new Error('서비스 접근 권한 조회 실패');
+  return data.map(item => ({
+    ...item.service,
+    accessLevel: item.access_level
+  }));
+};
+```
+
+## 통합 사용자 경험
+
+### 1. 최초 로그인
+
+1. 사용자가 어느 ZELLYY 서비스에서든 "구글로 로그인" 버튼 클릭
+2. 구글 OAuth 인증 화면으로 리다이렉트
+3. 인증 후 ZELLYY Core로 리다이렉트
+4. 최초 로그인인 경우:
+   - 사용자 프로필 정보 저장
+   - 접근한 서비스에 대한 권한 부여
+   - 환영 화면 표시
+5. 로그인 완료 후 원래 서비스로 리다이렉트
+
+### 2. 서비스 간 전환
+
+사용자가 이미 로그인한 상태에서 다른 ZELLYY 서비스 접근 시:
+
+1. 서비스는 로컬 스토리지 또는 쿠키에서 토큰 확인
+2. ZELLYY Core API에 토큰 검증 요청
+3. 유효한 토큰이면 자동 로그인 처리
+4. 접근 권한이 없는 서비스의 경우 권한 요청 화면 표시
+
+### 3. 로그아웃
+
+1. 어느 서비스에서든 로그아웃 시 ZELLYY Core 로그아웃 API 호출
+2. 모든 서비스에서 인증 토큰 삭제
+3. SSO 세션 종료
+
+## 보안 고려사항
+
+1. **PKCE 인증 흐름**: OAuth에 PKCE(Proof Key for Code Exchange) 사용
+2. **토큰 관리**: 짧은 수명의 액세스 토큰과 리프레시 토큰 사용
+3. **HTTPS**: 모든 통신은 HTTPS로 암호화
+4. **CORS 설정**: API에 적절한 CORS 정책 적용
+5. **CSP(Content Security Policy)**: 적절한 CSP 헤더 설정
+
+## 다음 단계
+
+1. 구글 및 애플 개발자 계정 설정 및 OAuth 클라이언트 등록
+2. Supabase Auth 설정 및 테스트
+3. 로그인 UI 컴포넌트 개발
+4. 소셜 로그인 통합 테스트
+5. 서비스 간 SSO 흐름 테스트
+```
--- a/core/storage-management.md
+++ b/core/storage-management.md
@@ -0,0 +1,279 @@
+# ZELLYY Core 스토리지 관리 전략
+
+## 개요
+
+이 문서는 ZELLYY Core 시스템의 데이터 및 스토리지 관리 전략을 설명합니다. 스토리지 요구 사항이 증가함에 따라 확장성, 성능, 비용 효율성을 유지하기 위한 접근 방식을 설명합니다.
+
+## 스토리지 요구사항 분석
+
+### 데이터 유형 및 특성
+
+**구조화된 데이터**
+- 사용자 정보 및 인증 데이터
+- 서비스 구성 및 설정
+- 트랜잭션 및 관계형 데이터
+
+**비구조화된 데이터**
+- 사용자 업로드 파일 (이미지, 문서 등)
+- 로그 및 분석 데이터
+- 백업 및 아카이브 데이터
+
+**데이터 증가 예측**
+- 사용자 데이터: 월 10% 증가
+- 트랜잭션 데이터: 월 15-20% 증가
+- 미디어 파일: 월 25-30% 증가
+- 로그 및 분석: 월 40% 증가
+
+## 스토리지 아키텍처
+
+### 계층형 스토리지 모델
+
+```
+-------------------------------------------+
+|             데이터 계층                    |
+-------------------------------------------+
+| 핫 스토리지      | 웜 스토리지     | 콜드 스토리지  |
+| (고성능)        | (표준)         | (아카이브)    |
+| - 활성 사용자    | - 최근 트랜잭션  | - 오래된 로그  |
+| - 현재 세션      | - 최근 로그     | - 백업       |
+| - 캐시 데이터    | - 최근 파일     | - 아카이브    |
+-------------------------------------------+
+| 액세스 빈도:     | 액세스 빈도:    | 액세스 빈도:  |
+| 매우 높음        | 중간           | 낮음         |
+| 지연 시간:       | 지연 시간:      | 지연 시간:    |
+| < 10ms          | < 100ms        | < 1000ms     |
+-------------------------------------------+
+```
+
+**데이터 라이프사이클 관리**
+- 데이터 생성 시점부터 아카이브/삭제까지 자동화된 정책
+- 사용 패턴에 따른 스토리지 계층 간 자동 이동
+- 규제 준수를 위한 데이터 보존 정책
+
+### 데이터베이스 스토리지
+
+**관계형 데이터 관리**
+- PostgreSQL 테이블 파티셔닝
+- 자동 테이블 압축
+- 수명 주기별 데이터 분리
+
+**시계열 데이터 최적화**
+```sql
+-- 시계열 데이터를 위한 분할 테이블 예시
+CREATE TABLE metrics (
+  time_bucket TIMESTAMP NOT NULL,
+  metric_name TEXT NOT NULL,
+  metric_value FLOAT NOT NULL,
+  source TEXT NOT NULL
+) PARTITION BY RANGE (time_bucket);
+
+-- 월별 파티션 생성 예시
+CREATE TABLE metrics_y2023m01 PARTITION OF metrics
+  FOR VALUES FROM ('2023-01-01') TO ('2023-02-01');
+  
+CREATE TABLE metrics_y2023m02 PARTITION OF metrics
+  FOR VALUES FROM ('2023-02-01') TO ('2023-03-01');
+```
+
+**인덱스 관리 전략**
+- 자주 쿼리되는 필드에 인덱스 최적화
+- 사용 빈도에 따른 인덱스 조정
+- 파티션별 인덱스 관리
+
+### 파일 및 객체 스토리지
+
+**객체 스토리지 구성**
+- Supabase Storage 또는 Amazon S3 호환 스토리지 활용
+- 버킷 및 폴더 구조화
+- 액세스 패턴 기반 스토리지 클래스 선택
+
+**미디어 처리 파이프라인**
+```
+----------+     +-----------+     +----------+     +----------+
+| 원본 업로드 | --> | 처리/변환  | --> | 스토리지 | --> | CDN 배포 |
+----------+     +-----------+     +----------+     +----------+
+                       |
+                       v
+                +-----------+
+                | 메타데이터 |
+                | 데이터베이스|
+                +-----------+
+```
+
+**콘텐츠 전송 최적화**
+- CDN을 통한 글로벌 배포
+- 이미지/비디오 최적화
+- 적응형 비트레이트 스트리밍
+
+## 스토리지 확장 전략
+
+### 수평적 확장
+
+**데이터베이스 샤딩**
+- 사용자 ID 기반 샤딩
+- 지리적 위치 기반 샤딩
+- 샤드 간 조정 및 관리
+
+**분산 파일 시스템**
+- 객체 스토리지의 멀티 리전 복제
+- 동적 용량 확장
+- 지역 최적화 액세스
+
+### 수직적 확장
+
+**스토리지 성능 최적화**
+- 고성능 스토리지 계층 (SSD) 활용
+- 메모리 기반 캐싱 계층
+- 리소스 증설을 통한 확장
+
+**IOPS 및 처리량 관리**
+- 워크로드 특성에 따른 스토리지 프로비저닝
+- 버스트 용량 계획
+- 성능 병목 모니터링
+
+### 하이브리드 스토리지 전략
+
+**온프레미스와 클라우드 통합**
+- 중요 데이터는 로컬 스토리지 보관
+- 대용량 및 덜 중요한 데이터는 클라우드로 이동
+- 통합 스토리지 관리 인터페이스
+
+**스토리지 마이그레이션 전략**
+- 데이터 중단 없는 마이그레이션
+- 단계적 데이터 이전 계획
+- 마이그레이션 검증 프로세스
+
+## 데이터 보호 및 규정 준수
+
+### 백업 및 복구 전략
+
+**백업 정책**
+- 일일 증분 백업
+- 주간 전체 백업
+- 월간 아카이브 백업
+- 오프사이트(다른 리전) 백업 복제
+
+**데이터 복구 프로세스**
+```
+-------------------+     +-------------------+     +-------------------+
+| 1. 백업 선택      | --> | 2. 복구 환경 준비  | --> | 3. 데이터 복원     |
+-------------------+     +-------------------+     +-------------------+
+                                                           |
+-------------------+     +-------------------+     +-------------------+
+| 6. 운영 전환      | <-- | 5. 데이터 검증     | <-- | 4. 정합성 확인     |
+-------------------+     +-------------------+     +-------------------+
+```
+
+**복구 지점 목표(RPO) 및 복구 시간 목표(RTO)**
+- 중요 데이터: RPO 15분, RTO 1시간
+- 일반 데이터: RPO 1시간, RTO 4시간
+- 아카이브 데이터: RPO 24시간, RTO 24시간
+
+### 데이터 보존 및 삭제 정책
+
+**데이터 보존 정책**
+- 사용자 데이터: 계정 삭제 후 30일
+- 트랜잭션 데이터: 7년
+- 로그 데이터: 90일 활성, 1년 아카이브
+- 서비스 설정: 영구 보존
+
+**규정 준수 데이터 보존**
+- GDPR, CCPA 등 규정 기반 데이터 처리
+- 법적 보존(Legal hold) 관리
+- 보존 증명 문서화
+
+**안전한 데이터 삭제**
+- 소프트 삭제 (논리적 삭제)
+- 하드 삭제 (물리적 삭제)
+- 데이터 삭제 증명 및 감사
+
+### 암호화 및 데이터 보안
+
+**저장 데이터 암호화**
+- 데이터베이스 TDE(Transparent Data Encryption)
+- 객체 스토리지 서버 측 암호화
+- 암호화 키 관리 시스템
+
+**전송 중 데이터 암호화**
+- TLS/SSL 통신
+- VPN 터널링
+- API 간 통신 암호화
+
+**액세스 제어 및 감사**
+- 역할 기반 액세스 제어(RBAC)
+- 최소 권한 원칙 적용
+- 모든 액세스 시도 로깅 및 감사
+
+## 스토리지 모니터링 및 최적화
+
+### 성능 모니터링
+
+**핵심 성능 지표**
+- 읽기/쓰기 지연 시간
+- IOPS 및 처리량
+- 저장 용량 사용률
+- 캐시 히트율
+
+**알림 및 대응**
+- 용량 임계값 알림
+- 성능 저하 감지
+- 자동 스케일링 트리거
+
+### 비용 최적화
+
+**스토리지 비용 분석**
+- 서비스별 스토리지 비용 할당
+- 계층별 비용 추적
+- 사용 패턴 기반 비용 예측
+
+**스토리지 최적화 전략**
+- 자주 접근하지 않는 데이터 저비용 계층으로 이동
+- 중복 데이터 제거
+- 압축 및 최적화 정책
+
+**데이터 수명 주기 자동화**
+```javascript
+// 예: 자동 계층화 정책
+const storageRules = [
+  {
+    dataType: 'userUploads',
+    hotStorageDuration: '30days',
+    warmStorageDuration: '90days',
+    coldStorageThreshold: 'accessCount < 5',
+    retentionPeriod: '7years',
+  },
+  {
+    dataType: 'applicationLogs',
+    hotStorageDuration: '7days',
+    warmStorageDuration: '30days',
+    archiveThreshold: '90days',
+    deletionThreshold: '1year',
+  }
+];
+```
+
+## 구현 로드맵
+
+### 1단계: 기반 스토리지 아키텍처 설계 (1-2개월)
+- 데이터 유형 및 특성 분석
+- 스토리지 요구사항 정의
+- 계층형 스토리지 아키텍처 설계
+
+### 2단계: 초기 구현 (2-3개월)
+- 데이터베이스 파티셔닝 구현
+- 객체 스토리지 설정
+- 백업 및 복구 시스템 구축
+
+### 3단계: 확장성 기능 구현 (3-6개월)
+- 자동 계층화 시스템 개발
+- 분산 스토리지 구성
+- 성능 모니터링 도구 통합
+
+### 4단계: 고급 기능 및 최적화 (6-12개월)
+- 데이터 수명 주기 자동화
+- 비용 최적화 시스템 구현
+- 규정 준수 관리 도구 통합
+
+## 결론
+
+ZELLYY Core의 스토리지 관리 전략은 확장성, 성능, 비용 효율성, 데이터 보호를 종합적으로 고려합니다. 계층형 스토리지 아키텍처는 다양한 데이터 유형과 액세스 패턴을 효율적으로 지원하며, 자동화된 데이터 라이프사이클 관리는 운영 오버헤드를 최소화합니다. 이러한 접근 방식은 데이터 볼륨이 증가하고 사용 패턴이 변화함에 따라 ZELLYY Core가 효율적으로 확장할 수 있는 기반을 제공합니다.
--- a/note/00_프로젝트_개요/01_프로젝트_소개.md
+++ b/note/00_프로젝트_개요/01_프로젝트_소개.md
@@ -0,0 +1,55 @@
+# ZELLYY 프로젝트 소개
+
+## 프로젝트 개요
+
+ZELLYY는 모바일 중심의 카드 제작 애플리케이션으로, 사용자들이 디자인 전문 지식 없이도 고품질의 시각적 콘텐츠를 쉽고 빠르게 제작할 수 있도록 돕는 서비스입니다. 특히 소셜 미디어에 공유하기 위한 텍스트 중심의 카드(인용구, 생각, 아이디어 등)를 직관적인 인터페이스로 제작하고 관리할 수 있습니다.
+
+## 비전 및 미션
+
+### 비전
+"누구나 자신의 생각과 아이디어를 아름답게 표현할 수 있는 세상"
+
+### 미션
+"디자인의 장벽을 낮추어 모든 사람이 자신의 메시지를 시각적으로 매력적인 방식으로 전달할 수 있도록 지원한다"
+
+## 핵심 가치
+
+1. **단순함(Simplicity)**: 복잡한 디자인 과정을 단순화하여 누구나 쉽게 사용할 수 있는 경험 제공
+2. **창의성(Creativity)**: 사용자의 창의적 표현을 돕는 다양한 도구와 템플릿 제공
+3. **효율성(Efficiency)**: 빠르고 효율적인 콘텐츠 제작 워크플로우 구현
+4. **접근성(Accessibility)**: 디자인 지식이나 고가의 장비 없이도 고품질 콘텐츠 제작 가능
+5. **일관성(Consistency)**: 개인 또는 브랜드의 일관된 시각적 아이덴티티 유지 지원
+
+## 주요 차별점
+
+1. **모바일 네이티브 경험**: 스마트폰에 최적화된 디자인 경험 제공
+2. **텍스트 중심 특화**: 텍스트 표현과 타이포그래피에 특화된 기능
+3. **소셜 미디어 최적화**: 주요 소셜 플랫폼에 최적화된 형식과 크기 지원
+4. **템플릿 기반 접근**: 전문적으로 디자인된 템플릿으로 빠른 제작 가능
+5. **직관적 인터페이스**: 3탭 이내로 주요 작업을 완료할 수 있는 단순한 UI/UX
+
+## 타겟 사용자
+
+1. **콘텐츠 크리에이터**: 소셜 미디어에서 활동하는 인플루언서, 블로거, 크리에이터
+2. **소상공인 및 스타트업**: 전문 디자이너 없이 마케팅 콘텐츠를 제작해야 하는 소규모 비즈니스
+3. **개인 브랜딩 관심층**: 소셜 미디어에서 일관된 개인 브랜드를 구축하려는 전문가
+4. **지식 근로자**: 아이디어와 인용구를 시각적으로 정리하고 공유하려는 학생, 연구자, 작가
+5. **마케팅 팀**: 빠르게 소셜 미디어 콘텐츠를 제작해야 하는 마케팅 담당자
+
+## 기대 효과
+
+1. **콘텐츠 제작 시간 단축**: 시간 단위에서 분 단위로 제작 시간 단축
+2. **디자인 품질 향상**: 디자인 전문가가 아니어도 프로페셔널한 결과물 제작
+3. **브랜드 일관성 강화**: 일관된 시각적 아이덴티티 유지 용이
+4. **소셜 미디어 참여도 증가**: 시각적으로 매력적인 콘텐츠를 통한 참여율 향상
+5. **접근성 확대**: 디자인 툴에 대한 접근성 확대로 창의적 표현의 민주화
+
+## 장기 비전
+
+ZELLYY는 초기에는 텍스트 중심의 카드 제작에 집중하지만, 장기적으로는 다음과 같은 방향으로 확장할 계획입니다:
+
+1. **웹 플랫폼 확장**: 모바일 앱을 넘어 웹 기반 에디터 제공
+2. **협업 기능 강화**: 팀 단위의 콘텐츠 제작 및 관리 지원
+3. **AI 기반 디자인 지원**: 인공지능을 활용한 디자인 추천 및 자동화
+4. **커뮤니티 기능**: 사용자 간 템플릿 및 디자인 공유 플랫폼 구축
+5. **통합 콘텐츠 관리**: 소셜 미디어 게시, 분석, 일정 관리 등 통합 솔루션으로 발전
--- a/note/00_프로젝트_개요/index.md
+++ b/note/00_프로젝트_개요/index.md
@@ -0,0 +1,35 @@
+# ZELLYY 프로젝트 개요
+
+## 목차
+
+1. [프로젝트 소개](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/01_프로젝트_소개.md)
+2. [핵심 문제 정의](핵심_문제_정의.md)
+3. [사용자 페르소나](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/사용자_페르소나.md)
+4. [사용자 스토리](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/사용자_스토리.md)
+
+## 프로젝트 요약
+
+ZELLYY는 모바일 중심의 카드 제작 애플리케이션으로, 사용자들이 디자인 전문 지식 없이도 고품질의 시각적 콘텐츠를 쉽고 빠르게 제작할 수 있도록 돕는 서비스입니다. 특히 소셜 미디어에 공유하기 위한 텍스트 중심의 카드(인용구, 생각, 아이디어 등)를 직관적인 인터페이스로 제작하고 관리할 수 있습니다.
+
+## 주요 목표
+
+- 디자인 지식이 없는 사용자도 프로페셔널한 시각 콘텐츠를 제작할 수 있게 함
+- 모바일 환경에서 완결된 콘텐츠 제작 워크플로우 제공
+- 소셜 미디어 플랫폼에 최적화된 콘텐츠 제작 및 공유 지원
+- 일관된 브랜드 이미지 유지를 위한 도구 제공
+- 콘텐츠 제작 시간을 대폭 단축 (시간 단위 → 분 단위)
+
+## 핵심 가치
+
+1. **단순함(Simplicity)**: 복잡한 디자인 과정을 단순화하여 누구나 쉽게 사용할 수 있는 경험 제공
+2. **창의성(Creativity)**: 사용자의 창의적 표현을 돕는 다양한 도구와 템플릿 제공
+3. **효율성(Efficiency)**: 빠르고 효율적인 콘텐츠 제작 워크플로우 구현
+4. **접근성(Accessibility)**: 디자인 지식이나 고가의 장비 없이도 고품질 콘텐츠 제작 가능
+5. **일관성(Consistency)**: 개인 또는 브랜드의 일관된 시각적 아이덴티티 유지 지원
+
+## 주요 문서
+
+- [프로젝트 소개](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/01_프로젝트_소개.md): ZELLYY 프로젝트의 비전, 미션, 핵심 가치 등 상세 설명
+- [핵심 문제 정의](핵심_문제_정의.md): ZELLYY가 해결하고자 하는 핵심 문제와 접근 방식
+- [사용자 페르소나](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/사용자_페르소나.md): ZELLYY의 주요 타겟 사용자 유형과 특성
+- [사용자 스토리](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/사용자_스토리.md): 사용자 관점에서의 주요 기능 및 가치 정의
--- a/note/00_프로젝트_개요/사용자_스토리.md
+++ b/note/00_프로젝트_개요/사용자_스토리.md
@@ -0,0 +1,69 @@
+# ZELLYY - 사용자 스토리
+
+## 콘텐츠 크리에이터 관점
+
+1. **카드 제작**
+   - "나는 콘텐츠 크리에이터로서, 인상적인 인용구를 시각적으로 매력적인 카드로 만들고 싶다. 그래서 내 팔로워들의 참여도를 높일 수 있다."
+   - "나는 콘텐츠 크리에이터로서, 모바일에서도 프로페셔널한 품질의 카드를 제작하고 싶다. 그래서 이동 중에도 콘텐츠를 만들 수 있다."
+   - "나는 콘텐츠 크리에이터로서, 내 브랜드 색상과 폰트를 저장하고 모든 카드에 일관되게 적용하고 싶다. 그래서 일관된 시각적 아이덴티티를 유지할 수 있다."
+
+2. **템플릿 활용**
+   - "나는 콘텐츠 크리에이터로서, 다양한 스타일의 템플릿을 빠르게 탐색하고 싶다. 그래서 내 콘텐츠에 맞는 최적의 디자인을 찾을 수 있다."
+   - "나는 콘텐츠 크리에이터로서, 자주 사용하는 템플릿을 커스터마이징하고 저장하고 싶다. 그래서 반복적인 디자인 작업을 줄일 수 있다."
+   - "나는 콘텐츠 크리에이터로서, 트렌디한 디자인 템플릿에 접근하고 싶다. 그래서 내 콘텐츠가 시대에 뒤처지지 않게 할 수 있다."
+
+3. **소셜 미디어 공유**
+   - "나는 콘텐츠 크리에이터로서, 제작한 카드를 여러 소셜 미디어 플랫폼에 최적화된 형식으로 내보내고 싶다. 그래서 각 플랫폼에서 최상의 품질로 보여질 수 있다."
+   - "나는 콘텐츠 크리에이터로서, 카드를 직접 인스타그램에 공유하고 싶다. 그래서 앱 전환 없이 빠르게 콘텐츠를 발행할 수 있다."
+   - "나는 콘텐츠 크리에이터로서, 공유한 카드의 참여도를 추적하고 싶다. 그래서 어떤 디자인이 가장 효과적인지 파악할 수 있다."
+
+## 비즈니스 사용자 관점
+
+1. **브랜드 관리**
+   - "나는 스타트업 창업자로서, 회사의 브랜드 가이드라인을 앱에 설정하고 싶다. 그래서 모든 마케팅 자료가 일관된 브랜드 이미지를 유지할 수 있다."
+   - "나는 마케팅 매니저로서, 팀원들이 사용할 수 있는 브랜드 템플릿을 만들고 싶다. 그래서 누가 콘텐츠를 만들어도 브랜드 일관성을 유지할 수 있다."
+   - "나는 소상공인으로서, 프로페셔널해 보이는 프로모션 카드를 만들고 싶다. 그래서 큰 비용 없이도 브랜드 이미지를 향상시킬 수 있다."
+
+2. **팀 협업**
+   - "나는 마케팅 팀장으로서, 팀원들과 템플릿과 디자인 자산을 공유하고 싶다. 그래서 효율적인 협업이 가능하다."
+   - "나는 콘텐츠 매니저로서, 팀원들이 제작한 카드를 검토하고 승인하고 싶다. 그래서 품질 관리를 할 수 있다."
+   - "나는 마케팅 담당자로서, 캠페인용 카드 시리즈를 한 번에 계획하고 제작하고 싶다. 그래서 일관된 메시지와 디자인으로 캠페인을 진행할 수 있다."
+
+3. **마케팅 최적화**
+   - "나는 비즈니스 오너로서, 제품 특징을 강조하는 카드를 빠르게 만들고 싶다. 그래서 시장 변화에 신속하게 대응할 수 있다."
+   - "나는 마케팅 전문가로서, A/B 테스트를 위한 여러 버전의 카드를 만들고 싶다. 그래서 어떤 디자인이 가장 효과적인지 테스트할 수 있다."
+   - "나는 소셜 미디어 매니저로서, 여러 플랫폼에 맞는 콘텐츠를 한 번에 제작하고 싶다. 그래서 플랫폼별 최적화에 드는 시간을 줄일 수 있다."
+
+## 개인 사용자 관점
+
+1. **지식 관리**
+   - "나는 대학원생으로서, 책에서 발견한 인용구를 시각적으로 저장하고 싶다. 그래서 나중에 쉽게 찾고 활용할 수 있다."
+   - "나는 연구자로서, 관련 아이디어를 시각적으로 연결하고 싶다. 그래서 새로운 통찰을 얻을 수 있다."
+   - "나는 작가로서, 영감을 주는 문구를 카테고리별로 정리하고 싶다. 그래서 글쓰기에 활용할 수 있다."
+
+2. **개인 표현**
+   - "나는 소셜 미디어 사용자로서, 내 생각이나 감정을 시각적으로 표현하고 싶다. 그래서 텍스트만으로는 전달하기 어려운 뉘앙스를 전달할 수 있다."
+   - "나는 일반 사용자로서, 특별한 날에 친구에게 보낼 맞춤형 카드를 만들고 싶다. 그래서 내 마음을 더 특별하게 전할 수 있다."
+   - "나는 취미 블로거로서, 내 취미 활동에 대한 팁과 노하우를 시각적으로 공유하고 싶다. 그래서 다른 사람들에게 도움을 줄 수 있다."
+
+3. **학습 및 발표**
+   - "나는 학생으로서, 학습 내용을 시각적 카드로 요약하고 싶다. 그래서 복습과 기억에 도움이 될 수 있다."
+   - "나는 발표자로서, 핵심 포인트를 강조하는 슬라이드를 빠르게 만들고 싶다. 그래서 청중의 주의를 집중시킬 수 있다."
+   - "나는 교육자로서, 학생들을 위한 시각적 학습 자료를 만들고 싶다. 그래서 복잡한 개념을 이해하기 쉽게 전달할 수 있다."
+
+## 기술 및 사용성 관점
+
+1. **사용 편의성**
+   - "나는 사용자로서, 직관적인 인터페이스로 앱을 빠르게 배우고 싶다. 그래서 별도의 학습 없이도 바로 사용할 수 있다."
+   - "나는 사용자로서, 모바일에서 손가락으로 쉽게 조작할 수 있는 편집 도구를 원한다. 그래서 정밀한 작업도 스트레스 없이 할 수 있다."
+   - "나는 사용자로서, 실시간으로 변경 사항을 미리보기하고 싶다. 그래서 최종 결과물을 정확히 예측할 수 있다."
+
+2. **성능 및 안정성**
+   - "나는 사용자로서, 오프라인에서도 앱을 사용하고 싶다. 그래서 인터넷 연결이 불안정한 상황에서도 작업할 수 있다."
+   - "나는 사용자로서, 앱이 빠르게 로딩되고 반응하기를 원한다. 그래서 창의적인 흐름이 끊기지 않는다."
+   - "나는 사용자로서, 작업 중인 내용이 자동으로 저장되기를 원한다. 그래서 예기치 않은 상황에서도 작업물을 잃지 않는다."
+
+3. **개인정보 및 보안**
+   - "나는 사용자로서, 내 카드와 템플릿을 비공개로 유지하고 싶다. 그래서 원하는 것만 선택적으로 공유할 수 있다."
+   - "나는 사용자로서, 내 브랜드 자산을 안전하게 보관하고 싶다. 그래서 무단 사용을 방지할 수 있다."
+   - "나는 사용자로서, 내 계정에 안전하게 로그인하고 싶다. 그래서 개인 정보와 콘텐츠가 보호받을 수 있다."
--- a/note/00_프로젝트_개요/사용자_페르소나.md
+++ b/note/00_프로젝트_개요/사용자_페르소나.md
@@ -0,0 +1,151 @@
+# ZELLYY - 사용자 페르소나
+
+## 페르소나 1: 콘텐츠 크리에이터 김소연 (27세, 여성)
+
+### 기본 정보
+- **직업**: 프리랜서 콘텐츠 크리에이터 (3년차)
+- **전문 분야**: 라이프스타일, 독서, 여행
+- **활동 플랫폼**: 인스타그램(팔로워 15,000명), 스레드, 블로그
+- **디지털 역량**: 중상 (기본적인 디자인 툴 사용 가능)
+- **수입원**: 브랜드 협찬, 제휴 마케팅, 콘텐츠 제작 의뢰
+
+### 콘텐츠 제작 패턴
+- 주 3-4회 인스타그램 포스팅
+- 주 1-2회 블로그 포스팅
+- 일 1-2회 스토리 및 스레드 업데이트
+- 월 1-2회 브랜드 협찬 콘텐츠 제작
+- 콘텐츠 기획 및 제작에 주당 약 20시간 소요
+
+### 페인 포인트
+- 고품질 시각 콘텐츠 제작에 많은 시간 소요
+- 포토샵, 일러스트레이터 등 전문 디자인 툴의 높은 학습 장벽
+- 모바일에서 프로페셔널한 콘텐츠 제작의 어려움
+- 여러 플랫폼에 맞는 다양한 크기의 콘텐츠 제작 필요
+- 일관된 브랜드 이미지 유지의 어려움
+
+### 목표
+- 콘텐츠 제작 시간 단축 (현재 포스트당 2시간 → 30분 이내)
+- 모바일에서도 고품질 콘텐츠 제작 가능하게 하기
+- 팔로워 참여도 증가 (현재 평균 좋아요 500개 → 1,000개)
+- 브랜드 협찬 기회 확대 (월 2회 → 월 5회)
+- 차별화된 시각적 아이덴티티 구축
+
+### 앱 사용 행태
+- 스마트폰 사용 시간: 하루 평균 5시간
+- 자주 사용하는 앱: 인스타그램, 스레드, 핀터레스트, Canva
+- 콘텐츠 제작 앱: Lightroom, VSCO, Unfold
+- 새로운 앱 설치 주기: 월 2-3개 (콘텐츠 제작 관련)
+
+---
+
+## 페르소나 2: 스타트업 창업자 박준영 (32세, 남성)
+
+### 기본 정보
+- **직업**: 건강 식품 스타트업 CEO (창업 1년차)
+- **회사 규모**: 직원 5명 (마케팅 전담 인력 없음)
+- **타겟 시장**: 2030 건강 관심층
+- **디지털 역량**: 중 (기본적인 소셜 미디어 활용 가능)
+- **마케팅 예산**: 월 100-150만원
+
+### 마케팅 활동 패턴
+- 주 3회 소셜 미디어 콘텐츠 발행
+- 월 1회 뉴스레터 발송
+- 분기 1회 프로모션 캠페인 진행
+- 제품 출시 시 집중 마케팅 (연 3-4회)
+- 마케팅 활동에 주당 약 10시간 직접 투입
+
+### 페인 포인트
+- 디자인 전문가 없이 브랜드 이미지 구축의 어려움
+- 제한된 예산으로 고품질 마케팅 자료 제작 필요
+- 여러 플랫폼(인스타그램, 페이스북, 이메일 등)에 맞는 콘텐츠 제작 부담
+- 일관된 브랜드 메시지와 시각적 아이덴티티 유지의 어려움
+- 콘텐츠 제작에 많은 시간을 소비하여 핵심 사업에 집중 어려움
+
+### 목표
+- 마케팅 콘텐츠 제작 시간 단축 (현재 건당 3시간 → 30분 이내)
+- 일관된 브랜드 이미지 구축
+- 소셜 미디어 참여도 증가 (현재 평균 참여율 1.5% → 3%)
+- 마케팅 비용 효율화 (디자인 외주 비용 절감)
+- 제품 인지도 및 판매량 증가
+
+### 앱 사용 행태
+- 스마트폰 사용 시간: 하루 평균 3시간
+- 자주 사용하는 앱: 인스타그램, 페이스북, 링크드인, 트렐로
+- 마케팅 관련 앱: Canva, 메일침프, 구글 애널리틱스
+- 새로운 앱 설치 주기: 월 1-2개 (비즈니스/생산성 관련)
+
+---
+
+## 페르소나 3: 대학원생 이지현 (24세, 여성)
+
+### 기본 정보
+- **직업**: 문학 전공 대학원생 (석사 과정 1년차)
+- **연구 분야**: 현대 페미니즘 문학
+- **활동**: 학술 세미나 참여, 소규모 독서 모임 운영
+- **디지털 역량**: 중 (기본적인 디지털 도구 활용 가능)
+- **학업 환경**: 주 3일 대학원 수업, 주 2일 개인 연구
+
+### 학습 및 연구 패턴
+- 주 5-7권의 책 독서 및 메모
+- 월 2-3편의 학술 논문 작성
+- 학기당 2-3회 세미나 발표
+- 주 1회 독서 모임 진행
+- 연구 및 학습에 주당 약 40시간 소요
+
+### 페인 포인트
+- 방대한 양의 독서 내용과 인용구 관리의 어려움
+- 텍스트 중심 메모의 한계 (나중에 찾기 어려움)
+- 아이디어와 인용구 간의 연결성 파악 어려움
+- 학술 발표를 위한 시각 자료 제작의 번거로움
+- 여러 기기(노트북, 태블릿, 스마트폰)에서의 동기화 문제
+
+### 목표
+- 효율적인 독서 메모 및 인용구 관리 시스템 구축
+- 아이디어 간의 연결성 시각화
+- 학술 발표를 위한 시각 자료 제작 시간 단축
+- 연구 생산성 향상
+- 개인 지식 관리 시스템 구축
+
+### 앱 사용 행태
+- 스마트폰 사용 시간: 하루 평균 4시간
+- 자주 사용하는 앱: Notion, Google Drive, Evernote, Kindle
+- 학습 관련 앱: Mendeley, Zotero, Forest
+- 새로운 앱 설치 주기: 월 1-2개 (생산성/학습 관련)
+
+---
+
+## 페르소나 4: 마케팅 팀장 최태준 (29세, 남성)
+
+### 기본 정보
+- **직업**: 중소기업 마케팅 팀장 (경력 5년차)
+- **팀 구성**: 마케팅 담당자 4명 (디자이너 없음)
+- **업무 영역**: 소셜 미디어 마케팅, 콘텐츠 마케팅, 이벤트 기획
+- **디지털 역량**: 중상 (다양한 마케팅 툴 활용 가능)
+- **마케팅 예산**: 분기 1,000만원
+
+### 업무 패턴
+- 주 10-15개의 소셜 미디어 콘텐츠 제작 및 발행
+- 월 2-3회의 캠페인 기획 및 실행
+- 주 1회 팀 회의 및 콘텐츠 검토
+- 월 1회 성과 분석 및 보고
+- 콘텐츠 기획 및 제작에 팀 전체 주당 약 60시간 소요
+
+### 페인 포인트
+- 디자인 팀 의존으로 인한 콘텐츠 제작 지연
+- 여러 플랫폼에 맞는 다양한 콘텐츠 제작의 부담
+- 팀원 간 일관된 브랜드 메시지와 디자인 유지의 어려움
+- 콘텐츠 검토 및 승인 프로세스의 비효율성
+- 콘텐츠 성과 측정 및 분석의 어려움
+
+### 목표
+- 디자인 팀 의존도 감소 (현재 80% → 20% 이하)
+- 콘텐츠 제작 시간 단축 (현재 건당 평균 5시간 → 1시간 이내)
+- 팀 내 콘텐츠 제작 역량 강화
+- 콘텐츠 검토 및 승인 프로세스 간소화
+- 마케팅 콘텐츠 ROI 향상
+
+### 앱 사용 행태
+- 스마트폰 사용 시간: 하루 평균 4시간
+- 자주 사용하는 앱: Slack, Asana, 인스타그램, 링크드인
+- 마케팅 관련 앱: Hootsuite, Google Analytics, Canva
+- 새로운 앱 설치 주기: 분기 2-3개 (마케팅/생산성 관련)
--- a/note/00_프로젝트_개요/초기_프로젝트_개요.md
+++ b/note/00_프로젝트_개요/초기_프로젝트_개요.md
@@ -0,0 +1,95 @@
+# Zellyy 초기 프로젝트 개요
+
+## 프로젝트 소개
+
+Zellyy는 사용자가 간단한 생각, 아이디어, 메모를 정사각형 카드 형태로 작성하고 저장할 수 있는 모바일 앱입니다. 기본적인 노트 기능을 제공하면서도, 작성한 카드를 다양한 SNS 플랫폼에 공유할 수 있는 기능을 갖추고 있습니다. 추후 웹 서비스를 통해 모바일과 웹 간의 동기화 기능을 제공할 예정입니다.
+
+## 주요 기능
+
+### 1단계 (모바일 앱)
+- **카드 작성 및 저장**: 정사각형 카드 형태의 UI에 짧은 글을 작성하고 로컬에 저장
+- **카드 관리**: 작성한 카드 목록 보기, 수정, 삭제 기능
+- **카드 커스터마이징**: 배경색, 폰트, 텍스트 정렬 등 기본적인 스타일링 옵션
+- **SNS 공유**: 작성한 카드를 페이스북, 인스타그램, 스레드 등 주요 SNS에 공유
+- **프리미엄 기능**: 구독 사용자에게 클라우드 저장 및 백업 기능 제공
+
+### 2단계 (웹 서비스)
+- **웹 인터페이스**: 브라우저에서 카드 작성 및 관리
+- **클라우드 동기화**: 모바일 앱과 웹 서비스 간 카드 동기화
+- **고급 커스터마이징**: 더 다양한 디자인 옵션 및 템플릿 제공
+- **공개 갤러리**: 사용자가 원하는 카드를 공개적으로 공유할 수 있는 갤러리 기능
+
+## 타겟 사용자
+
+- **주 타겟**: 20~30대 젊은 성인
+- **사용자 특성**: 
+  - 소셜 미디어를 활발히 사용하는 사람들
+  - 간단한 생각이나 아이디어를 기록하고 싶은 사람들
+  - 시각적으로 매력적인 콘텐츠를 만들고 싶은 사람들
+
+## 비즈니스 모델
+
+- **기본 앱**: 무료 (기본적인 카드 작성 및 로컬 저장 기능)
+- **프리미엄 구독**: 월정액 또는 연간 구독 방식
+  - 클라우드 저장 및 백업
+  - 모바일-웹 동기화
+  - 고급 디자인 옵션 및 템플릿
+  - 광고 제거
+
+## 개발 일정
+
+### 1단계: 모바일 앱 개발 (2023년 Q4 ~ 2024년 Q1)
+- 기본 UI/UX 설계
+- 카드 작성 및 저장 기능 구현
+- SNS 공유 기능 구현
+- 베타 테스트 및 피드백 수집
+- 앱 스토어 출시 (iOS, Android)
+
+### 2단계: 웹 서비스 개발 (2024년 Q2 ~ Q3)
+- 웹 인터페이스 설계 및 구현
+- 클라우드 동기화 기능 구현
+- 공개 갤러리 기능 구현
+- 프리미엄 기능 확장
+
+## 기술 스택
+
+### 모바일 앱
+- **프론트엔드**: React Native
+- **상태 관리**: Redux 또는 Context API
+- **스타일링**: Styled Components 또는 React Native Paper
+
+### 웹 서비스
+- **프론트엔드**: React.js 또는 Next.js
+- **상태 관리**: Redux 또는 Context API
+- **스타일링**: Tailwind CSS 또는 Material-UI
+
+### 백엔드
+- **서버**: 자체 호스팅 Supabase
+- **데이터베이스**: PostgreSQL (Supabase 내장)
+- **인증**: Supabase Auth
+- **스토리지**: Supabase Storage
+- **배포 환경**: Debian 12 서버 (기존 인프라 활용)
+
+## 성공 지표
+
+- **사용자 수**: 첫 해 10,000명 이상의 활성 사용자 확보
+- **구독 전환율**: 무료 사용자의 5% 이상이 유료 구독으로 전환
+- **사용자 참여**: 사용자당 월 평균 10개 이상의 카드 작성
+- **공유율**: 작성된 카드의 20% 이상이 SNS에 공유됨
+- **사용자 유지율**: 30일 사용자 유지율 40% 이상
+
+## 리스크 및 대응 전략
+
+### 리스크
+1. **경쟁 앱과의 차별화 부족**: 시장에 유사한 노트 앱이 많음
+2. **사용자 확보 어려움**: 초기 사용자 유입이 부족할 수 있음
+3. **수익화 모델의 효과**: 구독 모델이 충분한 수익을 창출하지 못할 수 있음
+
+### 대응 전략
+1. **차별화 포인트 강화**: 정사각형 카드 UI와 SNS 통합에 초점을 맞춘 마케팅
+2. **초기 사용자 인센티브**: 얼리 어답터에게 프리미엄 기능 무료 제공
+3. **다양한 수익 모델 테스트**: 구독 외에도 인앱 구매, 템플릿 마켓플레이스 등 다양한 수익 모델 실험
+
+## 결론
+
+Zellyy 프로젝트는 간단한 노트 기능과 SNS 공유 기능을 결합한 모바일 앱으로 시작하여, 추후 웹 서비스로 확장할 계획입니다. 20~30대 젊은 성인을 타겟으로 하며, 기본 기능은 무료로 제공하고 클라우드 동기화 및 고급 기능은 구독 모델을 통해 수익화할 예정입니다. 기존 인프라(Supabase)를 활용하여 개발 효율성을 높이고, 단계적인 접근 방식으로 리스크를 관리하며 프로젝트를 진행할 것입니다.
--- a/note/00_프로젝트_개요/핵심_문제_정의.md
+++ b/note/00_프로젝트_개요/핵심_문제_정의.md
@@ -0,0 +1,90 @@
+# ZELLYY - 핵심 문제 정의
+
+## 소셜 미디어 콘텐츠 제작 관련 문제점 분석
+
+### 1. 시각적 콘텐츠 제작의 장벽
+- **전문 디자인 지식 필요**: 대부분의 사용자는 디자인 원칙이나 전문 도구 사용법에 익숙하지 않음
+- **복잡한 디자인 툴**: 포토샵, 일러스트레이터 등 전문 디자인 툴은 학습 곡선이 가파름
+- **시간 소요**: 고품질 시각 콘텐츠 제작에 많은 시간이 소요됨
+- **모바일 환경 제약**: 기존 디자인 툴은 데스크톱 중심으로, 모바일에서 사용하기 어려움
+- **일관된 브랜드 이미지 유지 어려움**: 여러 콘텐츠에 걸쳐 일관된 시각적 아이덴티티 유지가 어려움
+
+### 2. 기존 디자인/콘텐츠 제작 앱의 한계
+- **범용성 vs 전문성 딜레마**: 쉬운 앱은 기능이 제한적이고, 전문적인 앱은 사용이 복잡함
+- **템플릿 한계**: 제공되는 템플릿이 제한적이거나 차별화가 어려움
+- **플랫폼 최적화 부족**: 다양한 소셜 미디어 플랫폼별 최적 크기/형식 지원 부족
+- **워크플로우 비효율**: 여러 앱을 오가며 콘텐츠를 제작해야 하는 비효율
+- **협업 기능 부재**: 팀 단위 콘텐츠 제작 및 관리 기능 부족
+
+### 3. 소셜 미디어 환경의 변화
+- **시각적 콘텐츠 중요성 증가**: 텍스트보다 시각적 콘텐츠가 참여도와 주목도 높임
+- **콘텐츠 수명 단축**: 빠르게 소비되는 콘텐츠 특성상 제작 속도가 중요해짐
+- **다중 플랫폼 관리**: 여러 소셜 미디어 플랫폼에 맞는 콘텐츠 제작 필요
+- **모바일 중심 환경**: 이동 중에도 콘텐츠를 제작하고 공유해야 하는 필요성
+- **개인 브랜딩 중요성**: 일반 사용자도 개인 브랜드 구축을 위한 시각적 일관성 필요
+
+## MVP 접근 방식: 모바일 중심 카드 제작 툴
+
+### 문제 해결 전략
+1. **단순화된 디자인 경험**: 디자인 지식 없이도 고품질 콘텐츠를 제작할 수 있는 직관적 인터페이스
+2. **모바일 최적화**: 스마트폰에서 완결된 워크플로우로 언제 어디서나 콘텐츠 제작 가능
+3. **템플릿 중심 접근**: 전문적으로 디자인된 템플릿을 기반으로 빠른 콘텐츠 제작
+4. **소셜 미디어 최적화**: 주요 소셜 플랫폼에 최적화된 형식과 크기 지원
+
+### MVP 핵심 기능 선정 이유
+1. **직관적인 카드 에디터**
+   - 복잡한 레이어 관리나 디자인 도구 없이 간단한 터치 인터페이스
+   - WYSIWYG(What You See Is What You Get) 방식으로 실시간 결과 확인
+   - 디자인 원칙이 내장된 스마트 가이드라인 제공
+
+2. **다양한 템플릿 라이브러리**
+   - 전문 디자이너가 제작한 고품질 템플릿 제공
+   - 목적별, 스타일별 템플릿 카테고리화
+   - 사용자 커스터마이징이 용이한 모듈식 디자인
+
+3. **텍스트 중심 콘텐츠 최적화**
+   - 인용구, 생각, 아이디어 등 텍스트 기반 콘텐츠에 특화
+   - 가독성과 시각적 매력을 균형 있게 갖춘 타이포그래피 옵션
+   - 텍스트 강조와 계층 구조를 위한 직관적 도구
+
+4. **소셜 미디어 최적화 공유**
+   - 주요 플랫폼(인스타그램, 페이스북, 트위터 등)에 최적화된 내보내기
+   - 플랫폼별 권장 크기 자동 조정
+   - 빠른 공유 워크플로우 지원
+
+5. **기본 카드 관리 시스템**
+   - 제작한 카드의 체계적 저장 및 관리
+   - 재사용 및 편집을 위한 히스토리 관리
+   - 태그 및 컬렉션 기반 구성
+
+### 기대 효과
+- 콘텐츠 제작 시간 대폭 단축 (시간 단위 → 분 단위)
+- 디자인 전문가 없이도 프로페셔널한 품질의 콘텐츠 제작 가능
+- 모바일 환경에서 완결된 콘텐츠 제작 워크플로우 구현
+- 일관된 브랜드 이미지 유지 용이
+- 소셜 미디어 참여도 및 효과 증가
+
+## 차별화 전략
+
+### 1. 텍스트 중심 특화
+- 대부분의 디자인 툴이 이미지 편집에 중점을 두는 반면, ZELLYY는 텍스트 표현에 특화
+- 타이포그래피, 텍스트 레이아웃, 텍스트 효과 등에 집중하여 차별화
+
+### 2. 극도의 단순함
+- 필수 기능만 포함하여 학습 곡선 최소화
+- "3탭 이내" 원칙: 주요 작업을 3번 이내의 탭으로 완료할 수 있도록 설계
+
+### 3. 모바일 네이티브 경험
+- 모바일 환경을 고려한 UI/UX 설계
+- 터치 제스처를 활용한 직관적 조작
+- 오프라인 작업 지원으로 언제 어디서나 사용 가능
+
+### 4. 소셜 미디어 최적화
+- 플랫폼별 특성을 고려한 템플릿 및 내보내기 옵션
+- 공유 과정의 마찰 최소화
+- 소셜 미디어 트렌드를 반영한 지속적 업데이트
+
+### 5. 개인화 및 브랜딩 지원
+- 사용자 브랜드 요소(로고, 색상, 폰트) 저장 및 적용
+- 개인 스타일 프리셋 생성 및 적용
+- 일관된 시각적 아이덴티티 유지 지원
--- a/note/01_기획_및_설계/MVP_기능_목록.md
+++ b/note/01_기획_및_설계/MVP_기능_목록.md
@@ -0,0 +1,157 @@
+# ZELLYY - MVP 기능 목록
+
+이 문서는 ZELLYY 앱의 MVP(Minimum Viable Product) 기능 목록을 정의합니다. 우선순위는 MoSCoW 방법론에 따라 분류되었습니다:
+
+- **Must have**: 반드시 포함되어야 하는 핵심 기능
+- **Should have**: 중요하지만 MVP 출시에 필수적이지는 않은 기능
+- **Could have**: 있으면 좋지만 없어도 MVP 가치에 크게 영향을 미치지 않는 기능
+- **Won't have**: MVP에서는 제외되는 기능 (향후 업데이트에서 고려)
+
+## 카드 제작 및 편집
+
+### Must have
+- 기본 텍스트 입력 및 편집 기능
+- 다양한 폰트 스타일 선택 옵션
+- 기본 배경 색상 및 그라데이션 설정
+- 텍스트 정렬 및 크기 조정 기능
+- 완성된 카드 저장 기능
+
+### Should have
+- 텍스트 위치 자유롭게 조정 기능
+- 기본 아이콘 및 심볼 라이브러리
+- 텍스트 색상 및 투명도 조정
+- 여러 텍스트 블록 추가 기능
+- 실시간 미리보기 기능
+
+### Could have
+- 텍스트 효과 (그림자, 테두리 등) 적용
+- 배경 패턴 및 텍스처 옵션
+- 레이어 관리 기능
+- 작업 히스토리 및 실행 취소/다시 실행
+- 카드 비율 변경 옵션 (1:1, 4:5, 9:16 등)
+
+### Won't have (MVP)
+- 고급 이미지 편집 기능
+- 애니메이션 및 동적 효과
+- 사용자 정의 폰트 업로드
+- 협업 편집 기능
+- AI 기반 디자인 추천
+
+## 템플릿 및 스타일
+
+### Must have
+- 기본 카드 템플릿 제공 (10-15개)
+- 템플릿 카테고리별 분류 (인용구, 정보, 프로모션 등)
+- 템플릿 기반 빠른 카드 생성 기능
+- 템플릿 내 텍스트 및 색상 커스터마이징
+
+### Should have
+- 인기 템플릿 추천 기능
+- 최근 사용한 템플릿 빠른 접근
+- 템플릿 검색 및 필터링
+- 사용자 커스텀 템플릿 저장 기능
+
+### Could have
+- 시즌별/이벤트별 특별 템플릿
+- 템플릿 미리보기 갤러리
+- 브랜드 스타일 가이드 설정 (색상, 폰트 세트)
+- 템플릿 평점 및 리뷰 시스템
+
+### Won't have (MVP)
+- 템플릿 마켓플레이스
+- 디자이너 제작 프리미엄 템플릿
+- 산업별 특화 템플릿 세트
+- 템플릿 공유 및 교환 기능
+
+## 소셜 미디어 공유
+
+### Must have
+- 인스타그램 스토리/피드 최적화 내보내기
+- 기본 이미지 포맷 저장 (JPG, PNG)
+- 카드 갤러리에서 공유 기능
+- 워터마크 기본 설정
+
+### Should have
+- 다중 소셜 플랫폼 지원 (페이스북, 트위터, 스레드)
+- 플랫폼별 최적 크기 자동 조정
+- 공유 시 캡션 추천 기능
+- 워터마크 위치 및 투명도 조정
+
+### Could have
+- 소셜 미디어 계정 직접 연동
+- 예약 발행 기능
+- 해시태그 추천 및 관리
+- 공유 통계 기본 분석
+
+### Won't have (MVP)
+- 다중 카드 캐러셀 포스팅
+- 소셜 미디어 성과 고급 분석
+- AI 기반 최적 발행 시간 추천
+- 자동화된 소셜 미디어 캠페인 관리
+
+## 카드 관리 및 구성
+
+### Must have
+- 생성한 카드 갤러리 뷰
+- 기본 정렬 옵션 (최신순, 이름순)
+- 카드 삭제 및 복제 기능
+- 카드 상세 정보 보기
+
+### Should have
+- 카드 검색 기능
+- 폴더 또는 컬렉션으로 카드 구성
+- 카드에 태그 추가 기능
+- 태그 기반 필터링
+
+### Could have
+- 카드 일괄 편집 기능
+- 사용 통계 (조회수, 공유수)
+- 카드 버전 관리
+- 카드 내보내기/가져오기 기능
+
+### Won't have (MVP)
+- 고급 검색 및 필터링 옵션
+- AI 기반 카드 자동 분류
+- 클라우드 백업 및 동기화
+- 카드 아카이브 및 복원 기능
+
+## 사용자 관리 및 설정
+
+### Must have
+- 기본 회원가입 및 로그인 기능
+- 프로필 정보 관리
+- 앱 기본 설정 (알림, 테마)
+- 로컬 저장소 관리
+
+### Should have
+- 소셜 로그인 연동
+- 계정 복구 옵션
+- 기본 사용자 통계 (생성한 카드 수 등)
+- 앱 사용 가이드 및 튜토리얼
+
+### Could have
+- 생체 인증 로그인 (지문, 얼굴 인식)
+- 데이터 사용량 관리
+- 다크 모드 지원
+- 앱 언어 설정
+
+### Won't have (MVP)
+- 다중 계정 관리
+- 팀 협업 기능
+- 고급 권한 설정
+- 사용자 활동 로그 및 분석
+
+## 제외 기능 (명확한 정의)
+
+MVP 단계에서는 다음 기능들을 명확히 제외합니다:
+
+1. **클라우드 동기화**: 여러 기기 간 자동 동기화 기능은 MVP에서 제외하고 로컬 저장소 기반으로 구현
+2. **고급 이미지 편집**: 이미지 자르기, 필터, 효과 등의 고급 편집 기능은 향후 업데이트에서 구현
+3. **협업 기능**: 팀 멤버 초대 및 공동 작업 기능은 MVP에서 제외
+4. **AI 기반 기능**: 디자인 추천, 콘텐츠 생성 등 AI 기반 기능은 향후 업데이트에서 구현
+5. **웹 버전**: 웹 기반 에디터는 MVP에서 제외하고 모바일 앱에 집중
+6. **고급 분석**: 상세한 사용자 통계 및 소셜 미디어 성과 분석은 MVP에서 제외
+7. **커뮤니티 기능**: 사용자 간 템플릿 공유, 갤러리 등의 커뮤니티 기능은 향후 업데이트에서 구현
+8. **구독 모델**: 프리미엄 기능 및 구독 결제 시스템은 MVP에서 제외하고 기본 기능 무료 제공에 집중
+
+이러한 제외 기능들은 MVP 출시 후 사용자 피드백과 우선순위에 따라 향후 업데이트에서 순차적으로 구현할 계획입니다.
--- a/note/01_기획_및_설계/UI_UX_설계.md
+++ b/note/01_기획_및_설계/UI_UX_설계.md
@@ -0,0 +1,195 @@
+# ZELLYY - UI/UX 설계
+
+## 디자인 원칙
+
+ZELLYY의 UI/UX 설계는 다음과 같은 핵심 원칙을 기반으로 합니다:
+
+1. **단순함(Simplicity)**: 복잡한 기능을 단순한 인터페이스로 제공하여 사용자의 인지 부하 최소화
+2. **직관성(Intuitiveness)**: 사용자가 별도의 학습 없이도 앱을 사용할 수 있도록 직관적인 디자인 적용
+3. **효율성(Efficiency)**: 최소한의 탭과 제스처로 작업을 완료할 수 있는 효율적인 워크플로우 설계
+4. **일관성(Consistency)**: 모든 화면과 기능에서 일관된 디자인 언어와 상호작용 패턴 유지
+5. **피드백(Feedback)**: 사용자 행동에 대한 명확한 시각적, 촉각적 피드백 제공
+
+## 디자인 시스템
+
+### 색상 팔레트
+
+#### 주요 색상
+- **Primary**: #4A6FFF (파란색) - 주요 액션, 강조 요소
+- **Secondary**: #FF6B6B (코랄 레드) - 보조 액션, 알림
+- **Tertiary**: #6CD9CC (민트 그린) - 성공, 완료 상태
+
+#### 중립 색상
+- **Background**: #FFFFFF (흰색) - 기본 배경
+- **Surface**: #F8F9FA (연한 회색) - 카드, 컨테이너 배경
+- **On Background**: #212529 (진한 회색) - 기본 텍스트
+- **On Surface**: #495057 (중간 회색) - 보조 텍스트
+
+#### 상태 색상
+- **Success**: #40C057 (녹색) - 성공 상태
+- **Warning**: #FD7E14 (주황색) - 경고 상태
+- **Error**: #FA5252 (빨간색) - 오류 상태
+- **Info**: #339AF0 (하늘색) - 정보 상태
+
+### 타이포그래피
+
+#### 폰트 패밀리
+- **기본 폰트**: SF Pro (iOS), Roboto (Android)
+- **대체 폰트**: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif
+
+#### 텍스트 스타일
+- **Heading 1**: 24px, Bold, 1.2 line-height
+- **Heading 2**: 20px, Bold, 1.3 line-height
+- **Heading 3**: 18px, SemiBold, 1.4 line-height
+- **Body 1**: 16px, Regular, 1.5 line-height
+- **Body 2**: 14px, Regular, 1.5 line-height
+- **Caption**: 12px, Regular, 1.4 line-height
+- **Button**: 16px, Medium, 1.2 line-height
+
+### 컴포넌트
+
+#### 기본 컴포넌트
+- **버튼**: 기본, 강조, 텍스트, 아이콘 버튼
+- **입력 필드**: 텍스트 입력, 숫자 입력, 멀티라인 입력
+- **선택 컨트롤**: 체크박스, 라디오 버튼, 토글 스위치
+- **카드**: 기본 카드, 그림자 카드, 테두리 카드
+- **리스트**: 기본 리스트, 아이콘 리스트, 썸네일 리스트
+- **다이얼로그**: 알림, 확인, 입력 다이얼로그
+- **탭**: 상단 탭, 하단 탭, 스크롤 탭
+
+#### 특화 컴포넌트
+- **템플릿 카드**: 템플릿 미리보기 및 선택을 위한 카드
+- **컬러 피커**: 색상 및 그라데이션 선택 컴포넌트
+- **텍스트 에디터**: 텍스트 스타일링 및 편집 컴포넌트
+- **갤러리 그리드**: 카드 갤러리 표시를 위한 그리드
+- **플랫폼 프리뷰**: 다양한 소셜 미디어 플랫폼 미리보기
+
+## 화면 구조
+
+### 주요 화면
+
+1. **온보딩 화면**
+   - 앱 소개 및 주요 기능 하이라이트
+   - 회원가입 및 로그인 옵션
+   - 퀵 스타트 튜토리얼
+
+2. **홈 화면**
+   - 최근 작업한 카드
+   - 추천 템플릿
+   - 빠른 액션 버튼 (새 카드 만들기, 템플릿 탐색)
+   - 사용 통계 요약
+
+3. **템플릿 갤러리**
+   - 카테고리별 템플릿 분류
+   - 검색 및 필터 옵션
+   - 템플릿 미리보기 및 선택
+
+4. **카드 에디터**
+   - 텍스트 편집 영역
+   - 스타일링 도구 모음
+   - 배경 설정 옵션
+   - 레이아웃 조정 도구
+   - 저장 및 공유 버튼
+
+5. **내 카드 갤러리**
+   - 그리드 및 리스트 뷰 옵션
+   - 정렬 및 필터 도구
+   - 카드 관리 옵션 (삭제, 복제, 편집)
+   - 컬렉션 및 폴더 구성
+
+6. **설정 화면**
+   - 계정 관리
+   - 앱 환경 설정
+   - 알림 설정
+   - 저장소 관리
+   - 도움말 및 지원
+
+### 네비게이션 구조
+
+- **하단 탭 바**: 홈, 템플릿, 에디터, 내 카드, 설정
+- **계층적 네비게이션**: 드릴다운 방식의 화면 전환
+- **모달 다이얼로그**: 빠른 작업 및 설정을 위한 오버레이
+- **제스처 기반 네비게이션**: 스와이프, 핀치, 탭 제스처 지원
+
+## 주요 사용자 흐름
+
+### 1. 새 카드 제작 흐름
+
+1. 홈 화면에서 '새 카드 만들기' 버튼 탭
+2. 템플릿 카테고리 선택
+3. 특정 템플릿 선택
+4. 텍스트 내용 입력 및 편집
+5. 스타일 조정 (폰트, 색상, 배치)
+6. 미리보기 확인
+7. 저장 및/또는 공유
+
+### 2. 템플릿 커스터마이징 흐름
+
+1. 템플릿 갤러리에서 템플릿 선택
+2. 기본 요소 편집 (텍스트, 색상)
+3. 고급 커스터마이징 (레이아웃, 요소 추가/제거)
+4. 커스텀 템플릿으로 저장
+5. 새 카드에 적용
+
+### 3. 소셜 미디어 공유 흐름
+
+1. 카드 에디터 또는 갤러리에서 공유 버튼 탭
+2. 공유 플랫폼 선택
+3. 플랫폼별 최적화 옵션 조정
+4. 캡션 및 해시태그 추가
+5. 공유 실행 또는 예약
+
+## 반응형 디자인
+
+### 기기별 최적화
+
+- **스마트폰 (소형)**: 5.5인치 이하 화면에 최적화된 컴팩트 레이아웃
+- **스마트폰 (대형)**: 5.5인치 이상 화면에 최적화된 확장 레이아웃
+- **태블릿**: 분할 화면 및 확장된 도구 패널 지원
+- **방향**: 세로 및 가로 모드 모두 지원
+
+### 접근성 고려사항
+
+- **텍스트 크기 조정**: 시스템 텍스트 크기 설정에 반응
+- **색상 대비**: WCAG 2.1 AA 기준 준수
+- **스크린 리더 지원**: 모든 UI 요소에 적절한 접근성 레이블 제공
+- **터치 타겟**: 최소 44x44pt 크기의 터치 영역 확보
+- **다크 모드**: 시스템 설정에 따른 다크 모드 지원
+
+## 프로토타입 및 테스트
+
+### 프로토타입 도구
+- **로우 피델리티**: Figma, Sketch
+- **하이 피델리티**: Figma, Protopie
+- **인터랙션 테스트**: Figma 프로토타입, 개발 빌드
+
+### 사용성 테스트 계획
+- **참가자**: 주요 페르소나에 맞는 사용자 그룹 (콘텐츠 크리에이터, 비즈니스 사용자, 개인 사용자)
+- **테스트 방법**: 과제 기반 테스트, 사고 구술법, 인터뷰
+- **측정 지표**: 작업 완료율, 오류율, 작업 완료 시간, SUS 점수
+- **피드백 반영**: 반복적인 디자인 개선 사이클
+
+## 디자인 에셋
+
+모든 디자인 에셋은 Figma 프로젝트에서 관리되며, 다음 항목을 포함합니다:
+
+1. **디자인 시스템 라이브러리**
+   - 색상 스타일
+   - 텍스트 스타일
+   - 컴포넌트 라이브러리
+   - 아이콘 세트
+
+2. **와이어프레임**
+   - 주요 화면 구조
+   - 사용자 흐름 다이어그램
+   - 인터랙션 모델
+
+3. **하이 피델리티 목업**
+   - 모든 화면의 상세 디자인
+   - 상태 변화 및 애니메이션
+   - 다양한 기기 및 화면 크기 대응
+
+4. **프로토타입**
+   - 인터랙티브 프로토타입
+   - 사용자 테스트용 시나리오
+   - 개발 참조용 상세 명세
--- a/note/01_기획_및_설계/index.md
+++ b/note/01_기획_및_설계/index.md
@@ -0,0 +1,27 @@
+# ZELLYY 기획 및 설계
+
+## 목차
+
+1. [요구사항 분석](../02_요구사항_분석.md)
+2. [MVP 기능 목록](1.%20Project/2.%20ZELLYY/젤리의%20노트/01_기획_및_설계/MVP_기능_목록.md)
+3. [주요 사용 시나리오](주요_사용_시나리오.md)
+4. [UI/UX 설계](UI_UX_설계.md)
+
+## 기획 및 설계 개요
+
+ZELLYY 프로젝트의 기획 및 설계 단계에서는 사용자 요구사항을 분석하고, 핵심 기능을 정의하며, 사용자 경험을 설계하는 작업을 진행합니다. 이 단계에서는 프로젝트의 방향성을 명확히 하고, 개발 단계에서의 우선순위를 설정하는 것이 중요합니다.
+
+## 주요 문서
+
+- **요구사항 분석**: 사용자 인터뷰, 시장 조사, 경쟁 앱 분석 등을 통해 도출된 요구사항을 정리한 문서
+- **MVP 기능 목록**: 최소 기능 제품(MVP)에 포함될 핵심 기능과 우선순위를 정의한 문서
+- **주요 사용 시나리오**: 다양한 사용자 유형별 ZELLYY 앱 사용 시나리오를 상세히 설명한 문서
+- **UI/UX 설계**: 사용자 인터페이스 및 경험 설계에 관한 문서 (와이어프레임, 프로토타입 등)
+
+## 기획 원칙
+
+1. **사용자 중심 설계**: 모든 기능과 인터페이스는 사용자의 니즈와 행동 패턴을 기반으로 설계
+2. **단순함 우선**: 복잡한 기능보다 핵심 기능의 완성도와 사용성을 우선시
+3. **모바일 최적화**: 모바일 환경에서의 최적 경험을 위한 설계 우선
+4. **점진적 확장**: MVP를 기반으로 사용자 피드백에 따라 점진적으로 기능 확장
+5. **일관된 경험**: 모든 화면과 기능에서 일관된 사용자 경험 제공
--- a/note/01_기획_및_설계/요구사항_분석.md
+++ b/note/01_기획_및_설계/요구사항_분석.md
@@ -0,0 +1,293 @@
+# ZELLYY - 요구사항 분석
+
+## 1. 개요
+
+ZELLYY는 모바일 중심의 카드 제작 애플리케이션으로, 사용자들이 디자인 전문 지식 없이도 고품질의 시각적 콘텐츠를 쉽고 빠르게 제작할 수 있도록 돕는 서비스입니다. 이 문서는 ZELLYY 앱의 요구사항을 정의하고 분석합니다.
+
+## 2. 사용자 요구사항
+
+### 2.1 기능적 요구사항
+
+#### 카드 제작 및 편집
+- 사용자는 다양한 템플릿을 기반으로 카드를 제작할 수 있어야 함
+- 사용자는 텍스트 내용, 폰트, 색상, 배치 등을 편집할 수 있어야 함
+- 사용자는 배경 색상, 그라데이션, 패턴을 선택하고 조정할 수 있어야 함
+- 사용자는 기본 아이콘 및 심볼을 카드에 추가할 수 있어야 함
+- 사용자는 실시간으로 변경 사항을 미리볼 수 있어야 함
+
+#### 템플릿 및 스타일
+- 시스템은 다양한 목적(인용구, 정보, 프로모션 등)에 맞는 템플릿을 제공해야 함
+- 사용자는 템플릿을 검색하고 필터링할 수 있어야 함
+- 사용자는 자주 사용하는 템플릿에 빠르게 접근할 수 있어야 함
+- 사용자는 자신만의 커스텀 템플릿을 저장하고 재사용할 수 있어야 함
+- 시스템은 트렌디한 디자인 스타일을 정기적으로 업데이트해야 함
+
+#### 소셜 미디어 공유
+- 사용자는 제작한 카드를 주요 소셜 미디어 플랫폼에 직접 공유할 수 있어야 함
+- 시스템은 각 소셜 미디어 플랫폼에 최적화된 크기와 형식으로 카드를 내보낼 수 있어야 함
+- 사용자는 공유 시 캡션과 해시태그를 추가할 수 있어야 함
+- 사용자는 워터마크 설정을 조정할 수 있어야 함
+- 시스템은 공유된 카드의 기본적인 참여 통계를 제공해야 함
+
+#### 카드 관리 및 구성
+- 사용자는 제작한 모든 카드를 갤러리 형태로 볼 수 있어야 함
+- 사용자는 카드를 검색하고 필터링할 수 있어야 함
+- 사용자는 카드를 폴더나 컬렉션으로 구성할 수 있어야 함
+- 사용자는 카드에 태그를 추가하고 태그 기반으로 필터링할 수 있어야 함
+- 사용자는 카드를 복제, 편집, 삭제할 수 있어야 함
+
+#### 사용자 관리 및 설정
+- 사용자는 이메일 또는 소셜 미디어 계정으로 가입하고 로그인할 수 있어야 함
+- 사용자는 프로필 정보를 관리할 수 있어야 함
+- 사용자는 앱의 기본 설정(알림, 테마 등)을 조정할 수 있어야 함
+- 사용자는 자신의 브랜드 요소(로고, 색상, 폰트)를 저장하고 관리할 수 있어야 함
+- 시스템은 사용자 데이터를 안전하게 저장하고 보호해야 함
+
+### 2.2 비기능적 요구사항
+
+#### 성능
+- 앱은 5초 이내에 로딩되어야 함
+- 카드 저장 및 공유 작업은 3초 이내에 완료되어야 함
+- 앱은 최소 100개의 저장된 카드를 원활하게 관리할 수 있어야 함
+- 템플릿 갤러리는 1초 이내에 로딩되어야 함
+- 에디터의 실시간 미리보기는 지연 없이 반응해야 함
+
+#### 사용성
+- 앱은 직관적인 인터페이스로 초보 사용자도 쉽게 사용할 수 있어야 함
+- 주요 작업은 3탭 이내로 완료할 수 있어야 함
+- 앱은 명확한 오류 메시지와 가이드를 제공해야 함
+- 앱은 다양한 화면 크기와 방향에 적응하는 반응형 디자인을 가져야 함
+- 앱은 기본적인 접근성 가이드라인을 준수해야 함
+
+#### 신뢰성
+- 앱의 크래시 비율은 0.5% 미만이어야 함
+- 앱은 오프라인 모드에서도 기본 기능을 사용할 수 있어야 함
+- 시스템은 사용자 데이터를 자동으로 백업하고 복구할 수 있어야 함
+- 앱은 예기치 않은 종료 시에도 작업 중인 내용을 보존해야 함
+- 서비스 가용성은 99.9% 이상이어야 함
+
+#### 보안
+- 모든 사용자 데이터는 암호화되어 저장되어야 함
+- 인증 시스템은 업계 표준 보안 프로토콜을 따라야 함
+- 앱은 정기적인 보안 업데이트를 제공해야 함
+- 사용자 권한 관리 시스템이 구현되어야 함
+- 개인정보 보호 정책이 명확히 제시되어야 함
+
+#### 확장성
+- 시스템은 사용자 수가 증가해도 성능 저하 없이 작동해야 함
+- 앱은 새로운 소셜 미디어 플랫폼을 쉽게 추가할 수 있는 구조여야 함
+- 데이터베이스는 대량의 카드와 템플릿을 효율적으로 관리할 수 있어야 함
+- 시스템은 향후 웹 버전으로 확장 가능한 아키텍처를 가져야 함
+- API는 향후 서드파티 통합을 위해 확장 가능해야 함
+
+## 3. 시장 요구사항
+
+### 3.1 타겟 사용자 분석
+
+#### 콘텐츠 크리에이터
+- 소셜 미디어에서 활동하는 인플루언서, 블로거, 크리에이터
+- 고품질 시각 콘텐츠를 빠르게 제작하고자 함
+- 일관된 브랜드 이미지 유지가 중요함
+- 모바일에서 작업하는 경우가 많음
+- 디자인 전문 지식은 제한적임
+
+#### 소상공인 및 스타트업
+- 마케팅 전담 인력 없이 콘텐츠를 직접 제작해야 함
+- 제한된 예산으로 프로페셔널한 콘텐츠 필요
+- 브랜드 일관성 유지가 중요함
+- 여러 플랫폼에 콘텐츠 배포 필요
+- 시간 효율성이 중요함
+
+#### 개인 사용자
+- 자신의 생각, 인용구, 아이디어를 시각적으로 표현하고자 함
+- 디자인 경험이 거의 없음
+- 간단하고 직관적인 인터페이스 선호
+- 주로 개인적인 용도나 소규모 공유를 위해 사용
+- 트렌디한 디자인 스타일에 관심 있음
+
+### 3.2 경쟁 앱 분석
+
+#### 주요 경쟁 앱
+1. **Canva**
+   - 강점: 다양한 템플릿, 풍부한 기능, 웹 및 모바일 지원
+   - 약점: 복잡한 인터페이스, 모바일에서 제한된 기능, 학습 곡선 높음
+
+2. **Adobe Spark**
+   - 강점: 고품질 디자인, Adobe 생태계 통합, 전문적인 결과물
+   - 약점: 구독 모델, 모바일 최적화 부족, 복잡한 워크플로우
+
+3. **Over**
+   - 강점: 모바일 중심, 직관적 인터페이스, 소셜 미디어 최적화
+   - 약점: 제한된 템플릿, 고급 기능 부족, 협업 기능 제한적
+
+4. **Unfold**
+   - 강점: 미니멀한 디자인, 스토리 특화, 사용 용이성
+   - 약점: 제한된 커스터마이징, 특정 스타일에 국한, 다양성 부족
+
+### 3.3 차별화 전략
+
+1. **모바일 네이티브 경험**
+   - 모바일 환경에 완전히 최적화된 인터페이스
+   - 터치 제스처를 활용한 직관적 조작
+   - 오프라인 작업 지원
+
+2. **텍스트 중심 특화**
+   - 텍스트 표현과 타이포그래피에 특화된 기능
+   - 다양한 텍스트 스타일링 옵션
+   - 텍스트 중심 콘텐츠를 위한 최적화된 템플릿
+
+3. **극도의 단순함**
+   - "3탭 이내" 원칙으로 설계된 워크플로우
+   - 필수 기능만 포함하여 학습 곡선 최소화
+   - 직관적인 디자인 가이드라인 내장
+
+4. **소셜 미디어 최적화**
+   - 주요 소셜 플랫폼에 최적화된 형식과 크기 지원
+   - 플랫폼별 특성을 고려한 템플릿
+   - 공유 과정의 마찰 최소화
+
+5. **개인화 및 브랜딩 지원**
+   - 사용자 브랜드 요소 저장 및 적용
+   - 개인 스타일 프리셋 생성 및 적용
+   - 일관된 시각적 아이덴티티 유지 지원
+
+## 4. 기술 요구사항
+
+### 4.1 개발 플랫폼
+
+#### 모바일 앱
+- **iOS**: iOS 13.0 이상 지원
+- **Android**: Android 8.0 (API 레벨 26) 이상 지원
+- **개발 프레임워크**: React Native
+- **상태 관리**: Redux/Redux Toolkit
+- **UI 컴포넌트**: React Native Paper, 커스텀 컴포넌트
+
+#### 백엔드 (향후 확장)
+- **서비스**: Supabase
+- **데이터베이스**: PostgreSQL
+- **인증**: Supabase Auth
+- **스토리지**: Supabase Storage
+- **API**: RESTful API
+
+### 4.2 통합 요구사항
+
+#### 소셜 미디어 통합
+- Instagram API 연동
+- Facebook API 연동
+- Twitter API 연동
+- LinkedIn API 연동
+- 기타 주요 소셜 미디어 플랫폼 지원
+
+#### 클라우드 서비스 통합
+- 클라우드 저장소 연동 (Google Drive, Dropbox, iCloud)
+- 이미지 최적화 서비스 연동
+- 푸시 알림 서비스 (Firebase Cloud Messaging)
+- 분석 서비스 (Google Analytics, Firebase Analytics)
+
+### 4.3 데이터 요구사항
+
+#### 데이터 모델
+- 사용자 프로필 데이터
+- 카드 및 템플릿 데이터
+- 브랜드 에셋 데이터
+- 사용자 설정 및 환경설정 데이터
+- 사용 통계 및 분석 데이터
+
+#### 데이터 저장 및 동기화
+- 로컬 저장소 (AsyncStorage, SQLite)
+- 클라우드 동기화 (Supabase)
+- 오프라인 모드 지원
+- 데이터 백업 및 복원 메커니즘
+- 충돌 해결 전략
+
+## 5. 제약 사항
+
+### 5.1 기술적 제약
+
+- 모바일 기기의 제한된 화면 크기 및 입력 방식
+- 모바일 기기의 제한된 처리 능력 및 메모리
+- 네트워크 연결 상태의 변동성
+- 다양한 기기 및 OS 버전 지원 필요
+- 앱 크기 제한 (초기 다운로드 크기 최소화)
+
+### 5.2 비즈니스 제약
+
+- 제한된 초기 개발 예산 및 인력
+- 경쟁 앱과의 차별화 필요성
+- 수익 모델 구축 (무료 vs 프리미엄 기능)
+- 마케팅 및 사용자 확보 전략
+- 지속 가능한 운영 모델 수립
+
+### 5.3 법적/규제 제약
+
+- 개인정보 보호법 준수
+- 소셜 미디어 플랫폼의 API 사용 정책 준수
+- 저작권 및 지적 재산권 고려
+- 앱스토어 및 구글 플레이 스토어 정책 준수
+- 접근성 관련 법규 준수
+
+## 6. 가정 및 의존성
+
+### 6.1 가정
+
+- 타겟 사용자는 기본적인 모바일 앱 사용 경험이 있음
+- 대부분의 사용자는 안정적인 인터넷 연결을 가지고 있음
+- 사용자는 소셜 미디어 계정을 보유하고 있음
+- 모바일 기기는 기본적인 카메라 및 갤러리 접근 기능을 제공함
+- 사용자는 기본적인 디자인 개념(색상, 폰트, 레이아웃)을 이해함
+
+### 6.2 의존성
+
+- 소셜 미디어 플랫폼 API의 가용성 및 정책
+- 서드파티 라이브러리 및 서비스의 안정성
+- 앱스토어 및 구글 플레이 스토어의 승인 프로세스
+- 클라우드 서비스 제공업체의 가용성 및 성능
+- 모바일 OS 업데이트 및 변경사항
+
+## 7. 우선순위 및 릴리스 계획
+
+### 7.1 MVP (Minimum Viable Product)
+
+- 기본 카드 제작 및 편집 기능
+- 핵심 템플릿 세트 (10-15개)
+- 로컬 저장 및 관리 기능
+- 기본 소셜 미디어 공유 기능
+- 사용자 계정 및 기본 설정
+
+### 7.2 향후 릴리스
+
+#### 릴리스 1.1
+- 추가 템플릿 및 스타일 옵션
+- 고급 텍스트 편집 기능
+- 태그 및 컬렉션 관리 기능
+- 향상된 소셜 미디어 통합
+
+#### 릴리스 1.2
+- 클라우드 동기화 기능
+- 사용자 커스텀 템플릿 저장
+- 기본 분석 및 통계 기능
+- 추가 소셜 미디어 플랫폼 지원
+
+#### 릴리스 2.0
+- 프리미엄 구독 모델 도입
+- 고급 브랜딩 및 커스터마이징 옵션
+- 웹 버전 출시
+- 팀 협업 기능
+
+## 8. 승인 기준
+
+### 8.1 기능 승인 기준
+
+- 모든 핵심 기능이 명세대로 구현됨
+- 사용자 테스트에서 80% 이상의 작업 완료율
+- 모든 주요 사용 시나리오가 성공적으로 테스트됨
+- 크래시 비율 0.5% 미만
+- 성능 지표가 목표치를 충족함
+
+### 8.2 품질 승인 기준
+
+- 코드 품질 검토 통과
+- 보안 감사 통과
+- 접근성 가이드라인 준수
+- 모든 우선순위 버그 수정
+- 사용자 만족도 테스트에서 4/5 이상 점수
--- a/note/01_기획_및_설계/주요_사용_시나리오.md
+++ b/note/01_기획_및_설계/주요_사용_시나리오.md
@@ -0,0 +1,169 @@
+# ZELLYY - 주요 사용 시나리오
+
+## 시나리오 1: SNS 공유용 카드 제작 및 공유
+
+### 사용자: 김소연 (27세, 여성, 콘텐츠 크리에이터)
+
+#### 배경
+김소연은 인스타그램과 스레드에서 활발하게 활동하는 콘텐츠 크리에이터입니다. 자신의 생각과 아이디어를 시각적으로 매력적인 방식으로 표현하고 싶지만, 디자인 툴을 사용하는 것이 복잡하고 시간이 많이 소요되어 어려움을 겪고 있습니다. 특히 모바일에서 간편하게 고품질 콘텐츠를 제작할 수 있는 방법을 찾고 있습니다.
+
+#### 시나리오 흐름
+
+1. **앱 설치 및 가입**
+   - 소연은 인스타그램에서 ZELLYY로 제작된 카드를 본 후, 앱스토어에서 'ZELLYY' 앱을 검색하여 설치합니다.
+   - 이메일 또는 소셜 미디어 계정으로 간편하게 회원가입을 완료합니다.
+
+2. **첫 카드 제작**
+   - 소연은 홈 화면에서 '새 카드 만들기' 버튼을 탭합니다.
+   - 다양한 템플릿 중 '인용구' 스타일을 선택합니다.
+   - 최근에 읽은 책에서 인상 깊었던 문구를 입력합니다.
+   - 앱이 제안하는 여러 폰트 스타일 중 자신의 브랜드 이미지와 맞는 스타일을 선택합니다.
+   - 배경 색상과 그라데이션을 조정하여 자신만의 스타일을 만듭니다.
+
+3. **카드 커스터마이징**
+   - 텍스트 위치와 크기를 손가락으로 간단히 조정합니다.
+   - 하단에 자신의 인스타그램 계정명을 작은 폰트로 추가합니다.
+   - 앱에서 제공하는 미니멀한 아이콘을 선택하여 카드 모서리에 배치합니다.
+   - 실시간으로 변경사항을 미리보기로 확인합니다.
+
+4. **카드 저장 및 공유**
+   - 완성된 카드를 저장합니다.
+   - '인스타그램에 공유' 버튼을 탭하여 스토리 또는 피드에 바로 공유할 수 있는 옵션을 선택합니다.
+   - 인스타그램 스토리에 카드를 공유하고, 스와이프 업 링크로 자신의 블로그를 연결합니다.
+   - 앱은 자동으로 최적화된 크기와 해상도로 카드를 내보냅니다.
+
+5. **피드백 및 분석**
+   - 다음 날, 소연은 ZELLYY 앱에서 자신이 공유한 카드의 반응(좋아요, 공유 수)을 확인합니다.
+   - 앱에서 제공하는 인사이트를 통해 어떤 스타일의 카드가 가장 인기 있는지 분석합니다.
+   - 이 정보를 바탕으로 다음 카드 디자인을 계획합니다.
+
+#### 결과
+소연은 ZELLYY를 사용하여 디자인 전문 지식 없이도 프로페셔널한 품질의 카드를 빠르게 제작할 수 있게 되었습니다. 일관된 브랜드 이미지를 유지하면서도 다양한 스타일의 콘텐츠를 제작할 수 있게 되어 팔로워 참여도가 30% 증가했습니다. 특히 모바일에서 5분 이내에 고품질 콘텐츠를 제작할 수 있게 되어 콘텐츠 제작 시간이 크게 단축되었습니다.
+
+---
+
+## 시나리오 2: 비즈니스 브랜딩을 위한 일관된 카드 시리즈 제작
+
+### 사용자: 박준영 (32세, 남성, 스타트업 창업자)
+
+#### 배경
+박준영은 최근 건강 식품 스타트업을 창업했습니다. 소셜 미디어를 통해 브랜드 인지도를 높이고 제품 정보를 효과적으로 전달하고 싶지만, 마케팅 팀이 없는 상황에서 일관된 브랜드 이미지를 유지하는 것이 어렵습니다. 특히 여러 플랫폼에 맞는 다양한 크기의 콘텐츠를 제작하는 데 많은 시간이 소요됩니다.
+
+#### 시나리오 흐름
+
+1. **브랜드 프로필 설정**
+   - 준영은 ZELLYY 앱에 가입한 후, '브랜드 프로필' 기능을 사용합니다.
+   - 회사 로고를 업로드하고, 브랜드 색상 코드(#2E8B57)와 주 폰트를 설정합니다.
+   - 자주 사용하는 해시태그와 슬로건을 저장합니다.
+
+2. **템플릿 시리즈 생성**
+   - '템플릿 시리즈 만들기' 기능을 사용하여 제품 소개, 고객 후기, 건강 팁 등 다양한 카테고리의 템플릿을 생성합니다.
+   - 각 템플릿에 브랜드 요소(로고, 색상, 폰트)가 자동으로 적용됩니다.
+   - 템플릿마다 텍스트와 이미지 위치를 조정하여 일관성을 유지하면서도 다양성을 갖도록 설정합니다.
+
+3. **제품 소개 카드 제작**
+   - 새로운 제품 출시를 앞두고, '제품 소개' 템플릿을 선택합니다.
+   - 제품 이미지를 업로드하고, 앱의 자동 배경 제거 기능을 사용하여 깔끔하게 처리합니다.
+   - 제품명과 핵심 특징을 입력하면, 앱이 자동으로 텍스트 크기와 위치를 최적화합니다.
+   - 하단에 제품 출시일과 구매 링크를 추가합니다.
+
+4. **멀티 플랫폼 최적화**
+   - '멀티 플랫폼 내보내기' 기능을 사용하여 하나의 디자인을 인스타그램, 페이스북, 트위터 등 여러 플랫폼에 맞는 크기로 자동 변환합니다.
+   - 각 플랫폼별 미리보기를 확인하고 필요한 경우 세부 조정을 합니다.
+   - 모든 버전을 한 번에 저장하고, 플랫폼별로 예약 발행 일정을 설정합니다.
+
+5. **시리즈 콘텐츠 관리**
+   - 일주일 동안 매일 다른 제품 특징을 강조하는 카드 시리즈를 계획합니다.
+   - 앱의 '콘텐츠 캘린더' 기능을 사용하여 발행 일정을 관리합니다.
+   - 이전에 만든 템플릿을 복제하고 내용만 변경하여 빠르게 시리즈 콘텐츠를 완성합니다.
+
+#### 결과
+준영은 ZELLYY를 통해 디자인 전문가 없이도 일관된 브랜드 이미지를 가진 프로페셔널한 마케팅 콘텐츠를 제작할 수 있게 되었습니다. 콘텐츠 제작 시간이 80% 단축되었고, 여러 플랫폼에 최적화된 콘텐츠를 쉽게 배포할 수 있게 되었습니다. 일관된 브랜드 메시지와 시각적 아이덴티티 덕분에 소셜 미디어 참여도가 45% 증가했고, 브랜드 인지도가 크게 향상되었습니다.
+
+---
+
+## 시나리오 3: 개인 아카이브 및 아이디어 관리
+
+### 사용자: 이지현 (24세, 여성, 대학원생)
+
+#### 배경
+이지현은 문학 전공 대학원생으로, 읽는 책이나 논문에서 인상 깊은 구절을 자주 메모합니다. 기존에는 메모 앱이나 노트에 텍스트만 기록했지만, 이런 방식으로는 나중에 찾아보기 어렵고 영감을 얻기도 힘들었습니다. 자신의 생각과 수집한 인용구를 시각적으로 정리하고 쉽게 검색할 수 있는 방법을 찾고 있습니다.
+
+#### 시나리오 흐름
+
+1. **개인 아카이브 설정**
+   - 지현은 ZELLYY 앱을 설치하고 '개인 아카이브' 모드로 사용하기로 결정합니다.
+   - 자신만의 태그 시스템을 설정합니다: #문학이론, #페미니즘, #포스트모더니즘, #논문아이디어 등
+   - 프라이버시 설정을 '비공개'로 설정하여 모든 카드가 자신만 볼 수 있도록 합니다.
+
+2. **독서 중 인용구 저장**
+   - 지현은 책을 읽다가 인상적인 구절을 발견합니다.
+   - ZELLYY 앱을 열고 '빠른 캡처' 기능을 사용하여 텍스트를 입력합니다.
+   - 출처(저자, 책 제목, 페이지)를 메타데이터로 추가합니다.
+   - 관련 태그(#페미니즘, #문학이론)를 추가합니다.
+   - 간단한 템플릿을 선택하여 시각적 카드로 변환하고 저장합니다.
+
+3. **아이디어 발전 및 연결**
+   - 며칠 후, 논문 주제에 대해 고민하던 지현은 앱에서 #페미니즘 태그로 저장된 모든 카드를 검색합니다.
+   - 여러 카드를 나란히 배치하여 비교하고, 연관성을 발견합니다.
+   - '아이디어 맵' 기능을 사용하여 관련 카드들을 시각적으로 연결하고 관계를 표시합니다.
+   - 새로운 통찰을 얻어 논문 아이디어를 카드로 작성하고 #논문아이디어 태그를 추가합니다.
+
+4. **개인 컬렉션 관리**
+   - 지현은 관련 카드들을 '페미니즘 문학 연구' 컬렉션으로 그룹화합니다.
+   - 컬렉션 내에서 카드를 논리적 순서로 재배열합니다.
+   - 컬렉션에 간단한 설명을 추가하여 나중에 컨텍스트를 기억할 수 있게 합니다.
+   - 클라우드 동기화를 통해 모든 기기에서 접근할 수 있도록 설정합니다.
+
+5. **학술 발표 준비**
+   - 세미나 발표를 준비하면서, 지현은 저장해둔 카드 중 핵심 개념을 설명하는 5개를 선택합니다.
+   - '프레젠테이션 모드'를 사용하여 카드를 슬라이드 형식으로 변환합니다.
+   - 각 카드의 디자인을 학술 발표에 적합하게 조정합니다.
+   - 완성된 슬라이드를 PDF로 내보내 발표 자료로 활용합니다.
+
+#### 결과
+지현은 ZELLYY를 통해 단순한 텍스트 메모를 넘어 시각적이고 구조화된 지식 관리 시스템을 구축할 수 있게 되었습니다. 태그와 컬렉션 기능으로 방대한 양의 인용구와 아이디어를 효율적으로 관리하고, 필요할 때 쉽게 찾을 수 있게 되었습니다. 특히 아이디어 간의 연결을 시각화함으로써 새로운 통찰을 얻는 데 도움이 되었고, 학술 작업의 생산성이 크게 향상되었습니다.
+
+---
+
+## 시나리오 4: 팀 협업을 통한 마케팅 콘텐츠 제작
+
+### 사용자: 최태준 (29세, 남성, 마케팅 매니저) & 그의 팀원들
+
+#### 배경
+최태준은 중소기업의 마케팅 팀장으로, 4명의 팀원과 함께 소셜 미디어 콘텐츠를 제작하고 있습니다. 기존에는 디자인 팀에 의존하여 콘텐츠를 제작했지만, 디자인 팀의 업무량이 많아 콘텐츠 제작이 지연되는 경우가 많았습니다. 마케팅 팀이 직접 퀄리티 높은 콘텐츠를 빠르게 제작하고 일관된 브랜드 이미지를 유지할 수 있는 솔루션이 필요합니다.
+
+#### 시나리오 흐름
+
+1. **팀 워크스페이스 설정**
+   - 태준은 ZELLYY 비즈니스 계정을 생성하고 팀원들을 초대합니다.
+   - 회사 브랜드 가이드라인(로고, 색상, 폰트)을 워크스페이스에 설정합니다.
+   - 팀원별 권한(편집자, 검토자, 관리자)을 설정합니다.
+   - 주요 캠페인별로 폴더를 생성하여 콘텐츠를 구조화합니다.
+
+2. **템플릿 라이브러리 구축**
+   - 디자인 팀과 협업하여 회사 브랜드에 맞는 기본 템플릿 세트를 제작합니다.
+   - 제품 소개, 고객 후기, 프로모션 안내 등 다양한 유형의 템플릿을 라이브러리에 추가합니다.
+   - 모든 템플릿에 편집 가능한 영역과 고정 영역을 명확히 구분하여 브랜드 일관성을 유지합니다.
+   - 템플릿 사용 가이드라인을 작성하여 팀원들과 공유합니다.
+
+3. **협업 콘텐츠 제작**
+   - 신제품 출시 캠페인을 위해 태준이 콘텐츠 계획을 수립하고 팀원들에게 과제를 할당합니다.
+   - 팀원 A는 제품 특징 카드를, 팀원 B는 고객 혜택 카드를 담당합니다.
+   - 각자 할당된 템플릿을 사용하여 콘텐츠를 제작하고 팀 워크스페이스에 저장합니다.
+   - 태준은 실시간으로 팀원들의 작업 상황을 확인하고 댓글 기능을 통해 피드백을 제공합니다.
+
+4. **검토 및 승인 프로세스**
+   - 모든 팀원이 콘텐츠 제작을 완료하면, 태준은 '검토 모드'에서 전체 캠페인 콘텐츠를 확인합니다.
+   - 일부 카드의 메시지 톤과 이미지 배치를 조정하도록 요청합니다.
+   - 팀원들이 수정을 완료하면 최종 검토 후 '승인' 상태로 변경합니다.
+   - 마케팅 디렉터에게 최종 승인을 위한 링크를 공유합니다.
+
+5. **콘텐츠 일정 관리 및 배포**
+   - 승인된 콘텐츠는 '콘텐츠 캘린더'에 등록되어 발행 일정이 관리됩니다.
+   - 팀은 앱 내 '소셜 미디어 매니저' 기능을 통해 여러 플랫폼에 콘텐츠를 예약 발행합니다.
+   - 발행된 콘텐츠의 성과 데이터가 앱으로 자동 수집되어 대시보드에 표시됩니다.
+   - 팀은 주간 회의에서 성과 데이터를 분석하고 다음 콘텐츠 전략을 조정합니다.
+
+#### 결과
+태준의 팀은 ZELLYY를 도입한 후 콘텐츠 제작 시간을 70% 단축하고, 디자인 팀에 대한 의존도를 크게 줄였습니다. 브랜드 일관성이 향상되었고, 팀원들 간의 협업 효율성이 증가했습니다. 특히 검토 및 승인 프로세스가 간소화되어 콘텐츠 출시 주기가 빨라졌고, 실시간 성과 분석을 통해 콘텐츠 전략을 지속적으로 최적화할 수 있게 되었습니다. 결과적으로 소셜 미디어 참여도가 60% 증가하고 전환율이 25% 향상되었습니다.
--- a/note/02_기술_문서/API_명세서.md
+++ b/note/02_기술_문서/API_명세서.md
@@ -0,0 +1,666 @@
+# Zellyy API 명세서
+
+이 문서는 Zellyy 프로젝트의 API 엔드포인트와 기능에 대한 상세 명세를 제공합니다.
+
+## 기본 정보
+
+- **기본 URL**: `https://a11.ism.kr/api`
+- **API 버전**: v1
+- **인증 방식**: JWT 토큰 (Bearer Authentication)
+- **응답 형식**: JSON
+
+## 인증 API
+
+### 회원가입
+
+```
+POST /auth/signup
+```
+
+**요청 본문**:
+```json
+{
+  "email": "user@example.com",
+  "password": "securepassword",
+  "username": "username"
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "user": {
+    "id": "uuid",
+    "email": "user@example.com",
+    "username": "username"
+  },
+  "session": {
+    "access_token": "jwt_token",
+    "refresh_token": "refresh_token",
+    "expires_at": 1672531200
+  }
+}
+```
+
+### 로그인
+
+```
+POST /auth/login
+```
+
+**요청 본문**:
+```json
+{
+  "email": "user@example.com",
+  "password": "securepassword"
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "user": {
+    "id": "uuid",
+    "email": "user@example.com",
+    "username": "username"
+  },
+  "session": {
+    "access_token": "jwt_token",
+    "refresh_token": "refresh_token",
+    "expires_at": 1672531200
+  }
+}
+```
+
+### 토큰 갱신
+
+```
+POST /auth/refresh
+```
+
+**요청 본문**:
+```json
+{
+  "refresh_token": "refresh_token"
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "access_token": "new_jwt_token",
+  "refresh_token": "new_refresh_token",
+  "expires_at": 1672531200
+}
+```
+
+### 로그아웃
+
+```
+POST /auth/logout
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "message": "Successfully logged out"
+}
+```
+
+## 사용자 API
+
+### 사용자 정보 조회
+
+```
+GET /users/me
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "uuid",
+  "email": "user@example.com",
+  "username": "username",
+  "display_name": "Display Name",
+  "avatar_url": "https://example.com/avatar.jpg",
+  "is_premium": false,
+  "premium_until": null,
+  "created_at": "2023-01-01T00:00:00Z"
+}
+```
+
+### 사용자 정보 업데이트
+
+```
+PATCH /users/me
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**요청 본문**:
+```json
+{
+  "display_name": "New Display Name",
+  "avatar_url": "https://example.com/new-avatar.jpg"
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "uuid",
+  "email": "user@example.com",
+  "username": "username",
+  "display_name": "New Display Name",
+  "avatar_url": "https://example.com/new-avatar.jpg",
+  "updated_at": "2023-01-02T00:00:00Z"
+}
+```
+
+## 카드 API
+
+### 카드 생성
+
+```
+POST /cards
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**요청 본문**:
+```json
+{
+  "content": "This is a card content",
+  "background_color": "#FFFFFF",
+  "text_color": "#000000",
+  "font_family": "system",
+  "font_size": 16,
+  "text_align": "center",
+  "is_public": false,
+  "tags": ["personal", "ideas"]
+}
+```
+
+**응답 (201 Created)**:
+```json
+{
+  "id": "uuid",
+  "content": "This is a card content",
+  "background_color": "#FFFFFF",
+  "text_color": "#000000",
+  "font_family": "system",
+  "font_size": 16,
+  "text_align": "center",
+  "is_public": false,
+  "is_synced": false,
+  "created_at": "2023-01-01T00:00:00Z",
+  "updated_at": "2023-01-01T00:00:00Z",
+  "tags": ["personal", "ideas"]
+}
+```
+
+### 카드 목록 조회
+
+```
+GET /cards
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**쿼리 파라미터**:
+- `page`: 페이지 번호 (기본값: 1)
+- `limit`: 페이지당 항목 수 (기본값: 20, 최대: 100)
+- `sort`: 정렬 기준 (options: created_at, updated_at, 기본값: created_at)
+- `order`: 정렬 순서 (options: asc, desc, 기본값: desc)
+- `tag`: 태그로 필터링 (선택 사항)
+- `search`: 내용 검색 (선택 사항)
+
+**응답 (200 OK)**:
+```json
+{
+  "data": [
+    {
+      "id": "uuid1",
+      "content": "Card 1 content",
+      "background_color": "#FFFFFF",
+      "text_color": "#000000",
+      "font_family": "system",
+      "font_size": 16,
+      "text_align": "center",
+      "is_public": false,
+      "is_synced": false,
+      "created_at": "2023-01-01T00:00:00Z",
+      "updated_at": "2023-01-01T00:00:00Z",
+      "tags": ["personal"]
+    },
+    {
+      "id": "uuid2",
+      "content": "Card 2 content",
+      "background_color": "#F0F0F0",
+      "text_color": "#333333",
+      "font_family": "arial",
+      "font_size": 18,
+      "text_align": "left",
+      "is_public": true,
+      "is_synced": true,
+      "created_at": "2023-01-02T00:00:00Z",
+      "updated_at": "2023-01-02T00:00:00Z",
+      "tags": ["ideas", "public"]
+    }
+  ],
+  "pagination": {
+    "total": 42,
+    "page": 1,
+    "limit": 20,
+    "total_pages": 3
+  }
+}
+```
+
+### 카드 상세 조회
+
+```
+GET /cards/{card_id}
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "uuid",
+  "content": "This is a card content",
+  "background_color": "#FFFFFF",
+  "text_color": "#000000",
+  "font_family": "system",
+  "font_size": 16,
+  "text_align": "center",
+  "is_public": false,
+  "is_synced": false,
+  "created_at": "2023-01-01T00:00:00Z",
+  "updated_at": "2023-01-01T00:00:00Z",
+  "tags": ["personal", "ideas"],
+  "share_count": 2,
+  "share_platforms": ["facebook", "instagram"]
+}
+```
+
+### 카드 업데이트
+
+```
+PATCH /cards/{card_id}
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**요청 본문**:
+```json
+{
+  "content": "Updated card content",
+  "background_color": "#F0F0F0",
+  "is_public": true,
+  "tags": ["personal", "ideas", "updated"]
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "uuid",
+  "content": "Updated card content",
+  "background_color": "#F0F0F0",
+  "text_color": "#000000",
+  "font_family": "system",
+  "font_size": 16,
+  "text_align": "center",
+  "is_public": true,
+  "is_synced": false,
+  "created_at": "2023-01-01T00:00:00Z",
+  "updated_at": "2023-01-02T00:00:00Z",
+  "tags": ["personal", "ideas", "updated"]
+}
+```
+
+### 카드 삭제
+
+```
+DELETE /cards/{card_id}
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (204 No Content)**
+
+## 소셜 공유 API
+
+### 소셜 계정 연동
+
+```
+POST /social/connect/{platform}
+```
+
+**지원 플랫폼**: `facebook`, `instagram`, `twitter`
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**요청 본문**:
+```json
+{
+  "access_token": "platform_access_token",
+  "refresh_token": "platform_refresh_token",
+  "expires_at": 1672531200
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "platform": "facebook",
+  "connected": true,
+  "platform_user_id": "platform_user_id",
+  "expires_at": 1672531200
+}
+```
+
+### 소셜 계정 연동 해제
+
+```
+DELETE /social/connect/{platform}
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (204 No Content)**
+
+### 연동된 소셜 계정 목록
+
+```
+GET /social/accounts
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "accounts": [
+    {
+      "platform": "facebook",
+      "platform_user_id": "facebook_user_id",
+      "connected_at": "2023-01-01T00:00:00Z",
+      "expires_at": 1672531200
+    },
+    {
+      "platform": "instagram",
+      "platform_user_id": "instagram_user_id",
+      "connected_at": "2023-01-02T00:00:00Z",
+      "expires_at": 1672617600
+    }
+  ]
+}
+```
+
+### 카드 소셜 공유
+
+```
+POST /cards/{card_id}/share/{platform}
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**요청 본문**:
+```json
+{
+  "message": "Check out my new card!" // 선택적 메시지
+}
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "share_id",
+  "card_id": "card_id",
+  "platform": "facebook",
+  "status": "success",
+  "share_url": "https://facebook.com/post/123456",
+  "shared_at": "2023-01-01T00:00:00Z"
+}
+```
+
+## 구독 API
+
+### 구독 플랜 목록
+
+```
+GET /subscriptions/plans
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "plans": [
+    {
+      "id": "monthly",
+      "name": "Monthly Premium",
+      "description": "Monthly subscription with cloud sync",
+      "price": 4.99,
+      "currency": "USD",
+      "interval": "month",
+      "features": [
+        "Cloud sync",
+        "Unlimited cards",
+        "Premium templates"
+      ]
+    },
+    {
+      "id": "yearly",
+      "name": "Yearly Premium",
+      "description": "Yearly subscription with cloud sync (save 20%)",
+      "price": 47.99,
+      "currency": "USD",
+      "interval": "year",
+      "features": [
+        "Cloud sync",
+        "Unlimited cards",
+        "Premium templates",
+        "Priority support"
+      ]
+    }
+  ]
+}
+```
+
+### 구독 생성
+
+```
+POST /subscriptions
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**요청 본문**:
+```json
+{
+  "plan_id": "monthly",
+  "payment_method_id": "payment_method_id",
+  "payment_provider": "stripe"
+}
+```
+
+**응답 (201 Created)**:
+```json
+{
+  "id": "subscription_id",
+  "plan_id": "monthly",
+  "status": "active",
+  "start_date": "2023-01-01T00:00:00Z",
+  "end_date": "2023-02-01T00:00:00Z",
+  "payment_provider": "stripe",
+  "payment_id": "payment_id"
+}
+```
+
+### 현재 구독 정보
+
+```
+GET /subscriptions/current
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "subscription_id",
+  "plan_id": "monthly",
+  "status": "active",
+  "start_date": "2023-01-01T00:00:00Z",
+  "end_date": "2023-02-01T00:00:00Z",
+  "auto_renew": true,
+  "payment_provider": "stripe",
+  "payment_id": "payment_id"
+}
+```
+
+### 구독 취소
+
+```
+POST /subscriptions/cancel
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer jwt_token
+```
+
+**응답 (200 OK)**:
+```json
+{
+  "id": "subscription_id",
+  "status": "canceled",
+  "end_date": "2023-02-01T00:00:00Z",
+  "message": "Subscription will be active until the end date"
+}
+```
+
+## 오류 응답
+
+모든 API 엔드포인트는 오류 발생 시 다음과 같은 형식으로 응답합니다:
+
+**응답 (4xx/5xx)**:
+```json
+{
+  "error": {
+    "code": "error_code",
+    "message": "Error message description",
+    "details": {} // 추가 오류 정보 (선택 사항)
+  }
+}
+```
+
+### 공통 오류 코드
+
+- `invalid_request`: 잘못된 요청 형식
+- `authentication_required`: 인증 필요
+- `invalid_credentials`: 잘못된 인증 정보
+- `permission_denied`: 권한 없음
+- `resource_not_found`: 리소스를 찾을 수 없음
+- `rate_limit_exceeded`: 요청 한도 초과
+- `internal_server_error`: 서버 내부 오류
+
+## 웹훅 (Webhook)
+
+Zellyy는 다음 이벤트에 대한 웹훅을 제공합니다:
+
+### 웹훅 등록
+
+```
+POST /webhooks
+```
+
+**요청 헤더**:
+```
+Authorization: Bearer admin_token
+```
+
+**요청 본문**:
+```json
+{
+  "url": "https://your-service.com/webhook",
+  "events": ["user.created", "subscription.created", "subscription.canceled"],
+  "secret": "your_webhook_secret"
+}
+```
+
+**응답 (201 Created)**:
+```json
+{
+  "id": "webhook_id",
+  "url": "https://your-service.com/webhook",
+  "events": ["user.created", "subscription.created", "subscription.canceled"],
+  "created_at": "2023-01-01T00:00:00Z"
+}
+```
+
+### 웹훅 이벤트 형식
+
+```json
+{
+  "id": "event_id",
+  "type": "event.type",
+  "created_at": "2023-01-01T00:00:00Z",
+  "data": {
+    // 이벤트 관련 데이터
+  }
+}
+```
+
+## 결론
+
+이 API 명세서는 Zellyy 프로젝트의 기본 기능을 구현하기 위한 엔드포인트를 정의합니다. 프로젝트가 발전함에 따라 추가 엔드포인트와 기능이 확장될 수 있습니다.
--- a/note/02_기술_문서/ERD_다이어그램.md
+++ b/note/02_기술_문서/ERD_다이어그램.md
@@ -0,0 +1,245 @@
+# ERD 다이어그램
+
+이 문서는 Zellyy 프로젝트의 데이터베이스 구조를 Entity-Relationship Diagram(ERD)으로 설명합니다.
+
+## 개요
+
+Zellyy 프로젝트는 사용자가 카드를 작성하고 관리하며 소셜 미디어에 공유하는 기능을 제공합니다. 이를 위한 데이터베이스 구조는 다음과 같은 주요 엔티티로 구성됩니다:
+
+1. 사용자 (Users)
+2. 카드 (Cards)
+3. 카드 태그 (Card Tags)
+4. 소셜 계정 (Social Accounts)
+5. 소셜 공유 (Social Shares)
+6. 구독 (Subscriptions)
+
+## ERD 다이어그램
+
+아래는 Zellyy 프로젝트의 ERD 다이어그램입니다. 이 다이어그램은 [dbdiagram.io](https://dbdiagram.io)를 사용하여 생성되었습니다.
+
+```
+// Zellyy 데이터베이스 ERD
+// 이 다이어그램은 dbdiagram.io에서 생성되었습니다.
+
+Table zellyy.users {
+  id UUID [pk, ref: > auth.users.id]
+  email TEXT [not null, unique]
+  username TEXT [unique]
+  display_name TEXT
+  avatar_url TEXT
+  created_at TIMESTAMP [default: `NOW()`]
+  updated_at TIMESTAMP [default: `NOW()`]
+  last_login TIMESTAMP
+  is_premium BOOLEAN [default: false]
+  premium_until TIMESTAMP
+}
+
+Table zellyy.cards {
+  id UUID [pk, default: `uuid_generate_v4()`]
+  user_id UUID [not null, ref: > zellyy.users.id]
+  content TEXT [not null]
+  background_color TEXT [default: '#FFFFFF']
+  text_color TEXT [default: '#000000']
+  font_family TEXT [default: 'system']
+  font_size INTEGER [default: 16]
+  text_align TEXT [default: 'center']
+  is_public BOOLEAN [default: false]
+  is_synced BOOLEAN [default: false]
+  created_at TIMESTAMP [default: `NOW()`]
+  updated_at TIMESTAMP [default: `NOW()`]
+  deleted_at TIMESTAMP
+}
+
+Table zellyy.card_tags {
+  id UUID [pk, default: `uuid_generate_v4()`]
+  card_id UUID [not null, ref: > zellyy.cards.id]
+  tag_name TEXT [not null]
+  created_at TIMESTAMP [default: `NOW()`]
+  
+  indexes {
+    (card_id, tag_name) [unique]
+  }
+}
+
+Table zellyy.social_accounts {
+  id UUID [pk, default: `uuid_generate_v4()`]
+  user_id UUID [not null, ref: > zellyy.users.id]
+  platform TEXT [not null]
+  platform_user_id TEXT
+  access_token TEXT
+  refresh_token TEXT
+  token_expires_at TIMESTAMP
+  created_at TIMESTAMP [default: `NOW()`]
+  updated_at TIMESTAMP [default: `NOW()`]
+  
+  indexes {
+    (user_id, platform) [unique]
+  }
+}
+
+Table zellyy.social_shares {
+  id UUID [pk, default: `uuid_generate_v4()`]
+  card_id UUID [not null, ref: > zellyy.cards.id]
+  user_id UUID [not null, ref: > zellyy.users.id]
+  platform TEXT [not null]
+  share_url TEXT
+  shared_at TIMESTAMP [default: `NOW()`]
+  status TEXT [default: 'pending']
+  response_data JSONB
+}
+
+Table zellyy.subscriptions {
+  id UUID [pk, default: `uuid_generate_v4()`]
+  user_id UUID [not null, ref: > zellyy.users.id]
+  plan_type TEXT [not null]
+  status TEXT [not null]
+  start_date TIMESTAMP [not null]
+  end_date TIMESTAMP [not null]
+  payment_provider TEXT
+  payment_id TEXT
+  created_at TIMESTAMP [default: `NOW()`]
+  updated_at TIMESTAMP [default: `NOW()`]
+}
+
+// 참조 테이블 (Supabase Auth)
+Table auth.users {
+  id UUID [pk]
+  email TEXT [unique]
+  // 기타 Supabase Auth 필드
+}
+```
+
+## 엔티티 설명
+
+### 1. 사용자 (zellyy.users)
+
+사용자 정보를 저장하는 테이블입니다. Supabase Auth와 연동됩니다.
+
+- **id**: 사용자 고유 식별자 (UUID), Supabase Auth의 사용자 ID와 연결
+- **email**: 사용자 이메일 주소
+- **username**: 사용자 이름 (고유)
+- **display_name**: 표시 이름
+- **avatar_url**: 프로필 이미지 URL
+- **created_at**: 계정 생성 시간
+- **updated_at**: 계정 정보 업데이트 시간
+- **last_login**: 마지막 로그인 시간
+- **is_premium**: 프리미엄 사용자 여부
+- **premium_until**: 프리미엄 구독 만료 시간
+
+### 2. 카드 (zellyy.cards)
+
+사용자가 작성한 카드 정보를 저장하는 테이블입니다.
+
+- **id**: 카드 고유 식별자 (UUID)
+- **user_id**: 카드 작성자 ID (users 테이블 참조)
+- **content**: 카드 내용
+- **background_color**: 배경색 (HEX 코드)
+- **text_color**: 텍스트 색상 (HEX 코드)
+- **font_family**: 폰트 패밀리
+- **font_size**: 폰트 크기
+- **text_align**: 텍스트 정렬 방식 ('left', 'center', 'right')
+- **is_public**: 공개 여부
+- **is_synced**: 클라우드 동기화 여부
+- **created_at**: 카드 생성 시간
+- **updated_at**: 카드 업데이트 시간
+- **deleted_at**: 카드 삭제 시간 (소프트 삭제)
+
+### 3. 카드 태그 (zellyy.card_tags)
+
+카드에 적용된 태그 정보를 저장하는 테이블입니다.
+
+- **id**: 태그 고유 식별자 (UUID)
+- **card_id**: 카드 ID (cards 테이블 참조)
+- **tag_name**: 태그 이름
+- **created_at**: 태그 생성 시간
+
+### 4. 소셜 계정 (zellyy.social_accounts)
+
+사용자의 소셜 미디어 계정 연동 정보를 저장하는 테이블입니다.
+
+- **id**: 소셜 계정 고유 식별자 (UUID)
+- **user_id**: 사용자 ID (users 테이블 참조)
+- **platform**: 플랫폼 이름 ('facebook', 'twitter', 'instagram' 등)
+- **platform_user_id**: 플랫폼에서의 사용자 ID
+- **access_token**: 액세스 토큰
+- **refresh_token**: 리프레시 토큰
+- **token_expires_at**: 토큰 만료 시간
+- **created_at**: 연동 생성 시간
+- **updated_at**: 연동 업데이트 시간
+
+### 5. 소셜 공유 (zellyy.social_shares)
+
+카드의 소셜 미디어 공유 기록을 저장하는 테이블입니다.
+
+- **id**: 공유 기록 고유 식별자 (UUID)
+- **card_id**: 카드 ID (cards 테이블 참조)
+- **user_id**: 사용자 ID (users 테이블 참조)
+- **platform**: 공유된 플랫폼 이름
+- **share_url**: 공유된 URL
+- **shared_at**: 공유 시간
+- **status**: 공유 상태 ('pending', 'success', 'failed')
+- **response_data**: 플랫폼 응답 데이터 (JSON)
+
+### 6. 구독 (zellyy.subscriptions)
+
+사용자의 구독 정보를 저장하는 테이블입니다.
+
+- **id**: 구독 고유 식별자 (UUID)
+- **user_id**: 사용자 ID (users 테이블 참조)
+- **plan_type**: 구독 플랜 유형 ('monthly', 'yearly' 등)
+- **status**: 구독 상태 ('active', 'canceled', 'expired')
+- **start_date**: 구독 시작 날짜
+- **end_date**: 구독 종료 날짜
+- **payment_provider**: 결제 제공자 ('apple', 'google', 'stripe' 등)
+- **payment_id**: 결제 ID
+- **created_at**: 구독 생성 시간
+- **updated_at**: 구독 업데이트 시간
+
+## 관계 설명
+
+1. **사용자와 카드**: 일대다 관계. 한 사용자는 여러 카드를 가질 수 있습니다.
+2. **카드와 태그**: 일대다 관계. 한 카드는 여러 태그를 가질 수 있습니다.
+3. **사용자와 소셜 계정**: 일대다 관계. 한 사용자는 여러 소셜 계정을 연동할 수 있습니다.
+4. **카드와 소셜 공유**: 일대다 관계. 한 카드는 여러 소셜 미디어에 공유될 수 있습니다.
+5. **사용자와 구독**: 일대다 관계. 한 사용자는 여러 구독 기록을 가질 수 있습니다.
+
+## 인덱스
+
+성능 최적화를 위해 다음과 같은 인덱스를 생성합니다:
+
+1. **zellyy.cards**:
+   - `user_id`: 사용자별 카드 조회 최적화
+   - `created_at`: 시간순 정렬 최적화
+   - `is_public`: 공개 카드 필터링 최적화
+
+2. **zellyy.card_tags**:
+   - `(card_id, tag_name)`: 고유 제약 조건 및 카드별 태그 조회 최적화
+   - `tag_name`: 태그별 카드 검색 최적화
+
+3. **zellyy.social_accounts**:
+   - `(user_id, platform)`: 고유 제약 조건 및 사용자별 플랫폼 계정 조회 최적화
+
+4. **zellyy.social_shares**:
+   - `user_id`: 사용자별 공유 기록 조회 최적화
+   - `card_id`: 카드별 공유 기록 조회 최적화
+
+## 데이터 무결성
+
+데이터 무결성을 보장하기 위해 다음과 같은 제약 조건을 적용합니다:
+
+1. **외래 키 제약 조건**: 모든 관계는 외래 키로 연결되어 참조 무결성을 보장합니다.
+2. **고유 제약 조건**: 이메일, 사용자 이름 등은 고유해야 합니다.
+3. **NOT NULL 제약 조건**: 필수 필드는 NULL이 될 수 없습니다.
+4. **기본값**: 많은 필드에 기본값을 제공하여 데이터 일관성을 유지합니다.
+
+## 확장성 고려사항
+
+1. **샤딩**: 사용자 수가 크게 증가할 경우, 사용자 ID를 기준으로 데이터를 샤딩하는 전략을 고려할 수 있습니다.
+2. **아카이빙**: 오래된 카드 데이터는 별도의 아카이브 테이블로 이동하여 주 테이블의 성능을 유지할 수 있습니다.
+3. **인덱스 최적화**: 실제 쿼리 패턴에 따라 추가 인덱스를 생성하거나 기존 인덱스를 조정할 수 있습니다.
+
+## 결론
+
+이 ERD는 Zellyy 프로젝트의 데이터 모델을 시각적으로 표현합니다. 이 구조는 사용자가 카드를 작성하고, 태그를 지정하며, 소셜 미디어에 공유하는 핵심 기능을 지원합니다. 또한 구독 관리와 소셜 계정 연동을 위한 테이블도 포함되어 있습니다.
+
+프로젝트가 발전함에 따라 이 ERD는 새로운 요구사항을 반영하여 업데이트될 수 있습니다.
--- a/note/02_기술_문서/React_Native_설정_가이드.md
+++ b/note/02_기술_문서/React_Native_설정_가이드.md
@@ -0,0 +1,335 @@
+# React Native 설정 가이드
+
+이 문서는 Zellyy 모바일 앱 개발을 위한 React Native 개발 환경 설정 방법을 안내합니다.
+
+## 개발 환경 요구사항
+
+- Node.js 16.0.0 이상
+- npm 8.0.0 이상 또는 Yarn 1.22.0 이상
+- Git
+- Watchman (macOS 사용자)
+- Xcode 14.0 이상 (iOS 개발용, macOS 필요)
+- Android Studio (Android 개발용)
+- JDK 11 이상
+
+## 개발 환경 설정
+
+### 1. Node.js 및 npm 설치
+
+#### macOS (Homebrew 사용)
+
+```bash
+brew install node
+```
+
+#### Windows (Chocolatey 사용)
+
+```bash
+choco install nodejs
+```
+
+#### Linux (Ubuntu/Debian)
+
+```bash
+curl -fsSL https://deb.nodesource.com/setup_16.x | sudo -E bash -
+sudo apt-get install -y nodejs
+```
+
+### 2. React Native CLI 설치
+
+```bash
+npm install -g react-native-cli
+```
+
+### 3. Expo CLI 설치 (권장)
+
+Expo는 React Native 개발을 더 쉽게 만들어주는 도구 세트입니다. Zellyy 프로젝트는 Expo를 사용하여 개발합니다.
+
+```bash
+npm install -g expo-cli
+```
+
+### 4. iOS 개발 환경 설정 (macOS 필요)
+
+#### Xcode 설치
+
+App Store에서 Xcode를 설치하거나 [Apple 개발자 웹사이트](https://developer.apple.com/xcode/)에서 다운로드합니다.
+
+#### iOS 시뮬레이터 설정
+
+Xcode를 설치한 후, 다음 명령어로 iOS 시뮬레이터를 설치합니다:
+
+1. Xcode 실행
+2. Xcode > Preferences > Components 메뉴 선택
+3. 원하는 iOS 시뮬레이터 버전 설치
+
+#### CocoaPods 설치
+
+```bash
+sudo gem install cocoapods
+```
+
+### 5. Android 개발 환경 설정
+
+#### Android Studio 설치
+
+[Android Studio 다운로드 페이지](https://developer.android.com/studio)에서 Android Studio를 다운로드하고 설치합니다.
+
+#### Android SDK 설치
+
+Android Studio를 설치한 후, 다음 단계를 따릅니다:
+
+1. Android Studio 실행
+2. SDK Manager 열기 (Tools > SDK Manager)
+3. "SDK Platforms" 탭에서 Android 12 (API Level 31) 이상 설치
+4. "SDK Tools" 탭에서 다음 항목 설치:
+   - Android SDK Build-Tools
+   - Android Emulator
+   - Android SDK Platform-Tools
+   - Google Play services
+
+#### 환경 변수 설정
+
+##### macOS/Linux
+
+`~/.bash_profile` 또는 `~/.zshrc` 파일에 다음 내용을 추가합니다:
+
+```bash
+export ANDROID_HOME=$HOME/Library/Android/sdk
+export PATH=$PATH:$ANDROID_HOME/emulator
+export PATH=$PATH:$ANDROID_HOME/tools
+export PATH=$PATH:$ANDROID_HOME/tools/bin
+export PATH=$PATH:$ANDROID_HOME/platform-tools
+```
+
+##### Windows
+
+시스템 환경 변수에 다음 내용을 추가합니다:
+
+- 변수 이름: `ANDROID_HOME`
+- 변수 값: `C:\Users\USERNAME\AppData\Local\Android\Sdk`
+
+PATH 환경 변수에 다음 경로를 추가합니다:
+- `%ANDROID_HOME%\platform-tools`
+- `%ANDROID_HOME%\emulator`
+- `%ANDROID_HOME%\tools`
+- `%ANDROID_HOME%\tools\bin`
+
+## Zellyy 프로젝트 설정
+
+### 1. 프로젝트 클론
+
+```bash
+git clone https://github.com/your-organization/zellyy-app.git
+cd zellyy-app
+```
+
+### 2. 의존성 설치
+
+```bash
+npm install
+# 또는
+yarn install
+```
+
+### 3. 환경 변수 설정
+
+`.env.example` 파일을 복사하여 `.env` 파일을 생성하고 필요한 환경 변수를 설정합니다:
+
+```bash
+cp .env.example .env
+```
+
+`.env` 파일을 열고 다음 변수를 설정합니다:
+
+```
+API_URL=https://a11.ism.kr/api
+SUPABASE_URL=https://a11.ism.kr
+SUPABASE_ANON_KEY=your_supabase_anon_key
+```
+
+### 4. iOS 설정 완료 (macOS 필요)
+
+```bash
+cd ios
+pod install
+cd ..
+```
+
+### 5. 앱 실행
+
+#### Expo 개발 서버 시작
+
+```bash
+expo start
+```
+
+이 명령어는 개발 서버를 시작하고 QR 코드를 표시합니다. Expo Go 앱(iOS/Android)으로 QR 코드를 스캔하여 앱을 실행할 수 있습니다.
+
+#### iOS 시뮬레이터에서 실행
+
+```bash
+expo run:ios
+# 또는
+npm run ios
+```
+
+#### Android 에뮬레이터에서 실행
+
+```bash
+expo run:android
+# 또는
+npm run android
+```
+
+## 프로젝트 구조
+
+Zellyy 앱 프로젝트는 다음과 같은 구조로 구성됩니다:
+
+```
+zellyy-app/
+├── App.js                # 앱의 진입점
+├── app.json              # Expo 설정
+├── assets/               # 이미지, 폰트 등의 정적 자산
+├── babel.config.js       # Babel 설정
+├── components/           # 재사용 가능한 UI 컴포넌트
+│   ├── Card/             # 카드 관련 컴포넌트
+│   ├── Common/           # 공통 UI 컴포넌트
+│   └── ...
+├── constants/            # 상수 정의
+├── hooks/                # 커스텀 React 훅
+├── navigation/           # 네비게이션 설정
+├── screens/              # 앱 화면
+│   ├── Auth/             # 인증 관련 화면
+│   ├── Cards/            # 카드 관련 화면
+│   ├── Profile/          # 프로필 관련 화면
+│   └── ...
+├── services/             # API 및 외부 서비스 통합
+│   ├── api.js            # API 클라이언트
+│   ├── supabase.js       # Supabase 클라이언트
+│   └── ...
+├── store/                # 상태 관리 (Redux 또는 Context API)
+├── styles/               # 글로벌 스타일 정의
+└── utils/                # 유틸리티 함수
+```
+
+## 주요 라이브러리
+
+Zellyy 앱은 다음과 같은 주요 라이브러리를 사용합니다:
+
+- **React Navigation**: 화면 간 네비게이션
+- **Expo**: 개발 도구 및 네이티브 기능 접근
+- **Supabase JS Client**: Supabase 백엔드 연동
+- **React Native Paper**: Material Design 컴포넌트
+- **Formik & Yup**: 폼 관리 및 유효성 검사
+- **React Native Share**: 소셜 미디어 공유 기능
+- **Async Storage**: 로컬 데이터 저장
+- **React Native SVG**: SVG 이미지 지원
+- **React Native Reanimated**: 고급 애니메이션
+
+## 코딩 스타일 가이드
+
+Zellyy 프로젝트는 다음과 같은 코딩 스타일을 따릅니다:
+
+- **ESLint & Prettier**: 코드 품질 및 포맷팅
+- **함수형 컴포넌트**: 클래스 컴포넌트 대신 함수형 컴포넌트와 훅 사용
+- **명명 규칙**:
+  - 컴포넌트: PascalCase (예: `CardItem.js`)
+  - 함수 및 변수: camelCase (예: `getUserData`)
+  - 상수: UPPER_SNAKE_CASE (예: `API_URL`)
+- **파일 구조**: 관련 기능끼리 폴더로 그룹화
+- **주석**: 복잡한 로직에 주석 추가
+
+## 디버깅
+
+### React Native Debugger 설정
+
+[React Native Debugger](https://github.com/jhen0409/react-native-debugger)를 사용하여 앱을 디버깅할 수 있습니다:
+
+1. React Native Debugger 설치:
+   ```bash
+   # macOS (Homebrew)
+   brew install --cask react-native-debugger
+   
+   # Windows/Linux
+   # GitHub 릴리스 페이지에서 다운로드
+   ```
+
+2. 디버거 실행:
+   ```bash
+   open "rndebugger://set-debugger-loc?host=localhost&port=19000"
+   ```
+
+3. 앱에서 디버깅 활성화:
+   - iOS 시뮬레이터: `Cmd + D` 누르고 "Debug JS Remotely" 선택
+   - Android 에뮬레이터: `Cmd + M` 또는 `Ctrl + M` 누르고 "Debug JS Remotely" 선택
+
+### Flipper (선택 사항)
+
+네이티브 코드 디버깅을 위해 [Flipper](https://fbflipper.com/)를 사용할 수 있습니다.
+
+## 빌드 및 배포
+
+### iOS 앱 빌드
+
+1. 앱 버전 업데이트:
+   `app.json` 파일에서 `version` 및 `buildNumber` 업데이트
+
+2. 배포용 빌드 생성:
+   ```bash
+   expo build:ios
+   ```
+
+3. 생성된 IPA 파일을 App Store Connect에 업로드
+
+### Android 앱 빌드
+
+1. 앱 버전 업데이트:
+   `app.json` 파일에서 `version` 및 `versionCode` 업데이트
+
+2. 배포용 빌드 생성:
+   ```bash
+   expo build:android
+   ```
+
+3. 생성된 APK 또는 AAB 파일을 Google Play Console에 업로드
+
+## 문제 해결
+
+### 일반적인 문제 및 해결 방법
+
+1. **Metro 번들러 캐시 문제**:
+   ```bash
+   expo start --clear
+   ```
+
+2. **의존성 문제**:
+   ```bash
+   rm -rf node_modules
+   npm install
+   ```
+
+3. **iOS 빌드 실패**:
+   ```bash
+   cd ios
+   pod install --repo-update
+   cd ..
+   ```
+
+4. **Android 빌드 실패**:
+   ```bash
+   cd android
+   ./gradlew clean
+   cd ..
+   ```
+
+## 참고 자료
+
+- [React Native 공식 문서](https://reactnative.dev/docs/getting-started)
+- [Expo 문서](https://docs.expo.dev/)
+- [React Navigation 문서](https://reactnavigation.org/docs/getting-started)
+- [Supabase 문서](https://supabase.io/docs)
+
+## 결론
+
+이 가이드는 Zellyy 앱 개발을 위한 React Native 환경 설정 및 프로젝트 구조에 대한 기본 정보를 제공합니다. 개발 과정에서 추가적인 질문이나 문제가 있으면 개발팀에 문의하세요.
--- a/note/02_기술_문서/SNS_통합_가이드.md
+++ b/note/02_기술_문서/SNS_통합_가이드.md
@@ -0,0 +1,802 @@
+# SNS 통합 가이드
+
+이 문서는 Zellyy 앱에서 다양한 소셜 미디어 플랫폼과의 통합 방법을 안내합니다.
+
+## 개요
+
+Zellyy 앱의 핵심 기능 중 하나는 사용자가 작성한 카드를 다양한 소셜 미디어 플랫폼에 공유하는 기능입니다. 이 문서는 다음 플랫폼과의 통합 방법을 설명합니다:
+
+- Facebook
+- Instagram
+- Twitter (X)
+- LinkedIn
+- Pinterest
+
+## 사전 요구사항
+
+- 각 소셜 미디어 플랫폼의 개발자 계정
+- 각 플랫폼에 등록된 앱
+- React Native 개발 환경
+- Supabase 설정 완료
+
+## 1. 소셜 미디어 앱 등록
+
+### 1.1 Facebook 앱 등록
+
+1. [Facebook 개발자 포털](https://developers.facebook.com/)에 접속
+2. "내 앱" > "앱 만들기" 클릭
+3. "소비자" 유형 선택
+4. 앱 이름 입력 (예: "Zellyy")
+5. 앱 생성 후 다음 제품 추가:
+   - Facebook 로그인
+   - Instagram API
+   - 공유 API
+
+설정 완료 후 다음 정보를 기록:
+- 앱 ID
+- 앱 시크릿
+
+### 1.2 Twitter 앱 등록
+
+1. [Twitter 개발자 포털](https://developer.twitter.com/)에 접속
+2. "Projects & Apps" > "Overview" > "Create App" 클릭
+3. 앱 이름, 설명 입력
+4. 앱 권한 설정: "Read and Write"
+5. 리디렉션 URL 설정: `zellyy://auth/twitter`
+
+설정 완료 후 다음 정보를 기록:
+- API 키
+- API 시크릿 키
+- 액세스 토큰
+- 액세스 토큰 시크릿
+
+### 1.3 LinkedIn 앱 등록
+
+1. [LinkedIn 개발자 포털](https://www.linkedin.com/developers/)에 접속
+2. "Create App" 클릭
+3. 앱 이름, 설명, 로고 등 입력
+4. 제품 추가: "Share on LinkedIn"
+5. OAuth 2.0 설정:
+   - 리디렉션 URL: `zellyy://auth/linkedin`
+   - 권한: `r_liteprofile`, `w_member_social`
+
+설정 완료 후 다음 정보를 기록:
+- 클라이언트 ID
+- 클라이언트 시크릿
+
+### 1.4 Pinterest 앱 등록
+
+1. [Pinterest 개발자 포털](https://developers.pinterest.com/)에 접속
+2. "Apps" > "Create app" 클릭
+3. 앱 이름, 설명 입력
+4. 리디렉션 URL 설정: `zellyy://auth/pinterest`
+5. 권한 설정: `read_public`, `write_public`
+
+설정 완료 후 다음 정보를 기록:
+- 앱 ID
+- 앱 시크릿
+
+## 2. 환경 변수 설정
+
+앱의 `.env` 파일에 소셜 미디어 API 키를 추가합니다:
+
+```
+# Facebook
+FACEBOOK_APP_ID=your_facebook_app_id
+FACEBOOK_APP_SECRET=your_facebook_app_secret
+
+# Twitter
+TWITTER_CONSUMER_KEY=your_twitter_api_key
+TWITTER_CONSUMER_SECRET=your_twitter_api_secret
+
+# LinkedIn
+LINKEDIN_CLIENT_ID=your_linkedin_client_id
+LINKEDIN_CLIENT_SECRET=your_linkedin_client_secret
+
+# Pinterest
+PINTEREST_APP_ID=your_pinterest_app_id
+PINTEREST_APP_SECRET=your_pinterest_app_secret
+```
+
+## 3. 필요한 패키지 설치
+
+```bash
+# 소셜 로그인 및 공유 라이브러리
+npm install react-native-fbsdk-next
+npm install @react-native-twitter-signin/twitter-signin
+npm install react-native-linkedin
+npm install react-native-pinterest
+
+# 일반 공유 기능
+npm install react-native-share
+
+# 딥링크 처리
+npm install react-native-app-auth
+```
+
+## 4. iOS 설정
+
+### 4.1 Info.plist 설정
+
+`ios/YourApp/Info.plist` 파일에 다음 내용을 추가합니다:
+
+```xml
+<key>CFBundleURLTypes</key>
+<array>
+  <!-- Facebook -->
+  <dict>
+    <key>CFBundleURLSchemes</key>
+    <array>
+      <string>fb{FACEBOOK_APP_ID}</string>
+    </array>
+  </dict>
+  <!-- Twitter -->
+  <dict>
+    <key>CFBundleURLSchemes</key>
+    <array>
+      <string>twitterkit-{TWITTER_CONSUMER_KEY}</string>
+    </array>
+  </dict>
+  <!-- LinkedIn -->
+  <dict>
+    <key>CFBundleURLSchemes</key>
+    <array>
+      <string>zellyy</string>
+    </array>
+  </dict>
+  <!-- Pinterest -->
+  <dict>
+    <key>CFBundleURLSchemes</key>
+    <array>
+      <string>pdk{PINTEREST_APP_ID}</string>
+    </array>
+  </dict>
+</array>
+
+<!-- Facebook 설정 -->
+<key>FacebookAppID</key>
+<string>{FACEBOOK_APP_ID}</string>
+<key>FacebookDisplayName</key>
+<string>Zellyy</string>
+
+<key>LSApplicationQueriesSchemes</key>
+<array>
+  <string>fbapi</string>
+  <string>fb-messenger-share-api</string>
+  <string>fbauth2</string>
+  <string>fbshareextension</string>
+  <string>twitter</string>
+  <string>twitterauth</string>
+  <string>linkedin</string>
+  <string>linkedin-sdk2</string>
+  <string>pinterestsdk</string>
+</array>
+```
+
+### 4.2 AppDelegate.m 수정
+
+`ios/YourApp/AppDelegate.m` 파일에 다음 내용을 추가합니다:
+
+```objective-c
+#import <FBSDKCoreKit/FBSDKCoreKit-swift.h>
+#import <TwitterKit/TwitterKit.h>
+
+@implementation AppDelegate
+
+- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
+{
+  // ...
+  
+  // Facebook SDK 초기화
+  [[FBSDKApplicationDelegate sharedInstance] application:application didFinishLaunchingWithOptions:launchOptions];
+  
+  // Twitter SDK 초기화
+  [[Twitter sharedInstance] startWithConsumerKey:@"TWITTER_CONSUMER_KEY" consumerSecret:@"TWITTER_CONSUMER_SECRET"];
+  
+  return YES;
+}
+
+// URL 스킴 처리
+- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
+{
+  // Facebook URL 처리
+  BOOL handled = [[FBSDKApplicationDelegate sharedInstance] application:app openURL:url options:options];
+  
+  // Twitter URL 처리
+  if (!handled) {
+    handled = [[Twitter sharedInstance] application:app openURL:url options:options];
+  }
+  
+  return handled;
+}
+
+@end
+```
+
+## 5. Android 설정
+
+### 5.1 AndroidManifest.xml 수정
+
+`android/app/src/main/AndroidManifest.xml` 파일에 다음 내용을 추가합니다:
+
+```xml
+<manifest ...>
+  <uses-permission android:name="android.permission.INTERNET" />
+  
+  <application ...>
+    <!-- Facebook 설정 -->
+    <meta-data
+      android:name="com.facebook.sdk.ApplicationId"
+      android:value="@string/facebook_app_id" />
+    <meta-data
+      android:name="com.facebook.sdk.ClientToken"
+      android:value="@string/facebook_client_token" />
+      
+    <activity
+      android:name="com.facebook.FacebookActivity"
+      android:configChanges="keyboard|keyboardHidden|screenLayout|screenSize|orientation"
+      android:label="@string/app_name" />
+    <activity
+      android:name="com.facebook.CustomTabActivity"
+      android:exported="true">
+      <intent-filter>
+        <action android:name="android.intent.action.VIEW" />
+        <category android:name="android.intent.category.DEFAULT" />
+        <category android:name="android.intent.category.BROWSABLE" />
+        <data android:scheme="@string/fb_login_protocol_scheme" />
+      </intent-filter>
+    </activity>
+    
+    <!-- Twitter 설정 -->
+    <activity
+      android:name="com.twitter.sdk.android.core.identity.OAuthActivity"
+      android:exported="true">
+    </activity>
+    
+    <!-- 딥링크 처리 -->
+    <activity
+      android:name=".MainActivity"
+      android:exported="true">
+      <intent-filter>
+        <action android:name="android.intent.action.VIEW" />
+        <category android:name="android.intent.category.DEFAULT" />
+        <category android:name="android.intent.category.BROWSABLE" />
+        <data android:scheme="zellyy" />
+      </intent-filter>
+    </activity>
+  </application>
+</manifest>
+```
+
+### 5.2 strings.xml 설정
+
+`android/app/src/main/res/values/strings.xml` 파일에 다음 내용을 추가합니다:
+
+```xml
+<resources>
+  <string name="app_name">Zellyy</string>
+  <string name="facebook_app_id">FACEBOOK_APP_ID</string>
+  <string name="fb_login_protocol_scheme">fbFACEBOOK_APP_ID</string>
+  <string name="facebook_client_token">FACEBOOK_CLIENT_TOKEN</string>
+</resources>
+```
+
+### 5.3 build.gradle 설정
+
+`android/app/build.gradle` 파일에 다음 내용을 추가합니다:
+
+```gradle
+dependencies {
+  // ...
+  implementation 'com.facebook.android:facebook-android-sdk:latest.release'
+  implementation 'com.twitter.sdk.android:twitter-core:3.3.0'
+  implementation 'com.twitter.sdk.android:tweet-composer:3.3.0'
+  // ...
+}
+```
+
+## 6. 소셜 로그인 구현
+
+### 6.1 Facebook 로그인
+
+```javascript
+import { LoginManager, AccessToken, GraphRequest, GraphRequestManager } from 'react-native-fbsdk-next';
+import supabase from '../services/supabase';
+
+const loginWithFacebook = async () => {
+  try {
+    // 로그인 권한 요청
+    const result = await LoginManager.logInWithPermissions(['public_profile', 'email']);
+    
+    if (result.isCancelled) {
+      throw new Error('User cancelled login');
+    }
+    
+    // 액세스 토큰 가져오기
+    const data = await AccessToken.getCurrentAccessToken();
+    
+    if (!data) {
+      throw new Error('Failed to get access token');
+    }
+    
+    // 사용자 정보 가져오기
+    const profileRequest = new GraphRequest(
+      '/me',
+      {
+        accessToken: data.accessToken,
+        parameters: {
+          fields: {
+            string: 'id,name,email,picture.type(large)',
+          },
+        },
+      },
+      async (error, result) => {
+        if (error) {
+          console.error('Error fetching profile:', error);
+          return;
+        }
+        
+        // Supabase에 소셜 계정 연결
+        const { data: socialAccount, error: socialError } = await supabase
+          .from('zellyy.social_accounts')
+          .upsert({
+            user_id: supabase.auth.user().id,
+            platform: 'facebook',
+            platform_user_id: result.id,
+            access_token: data.accessToken,
+            token_expires_at: new Date(data.expirationTime),
+          })
+          .select()
+          .single();
+          
+        if (socialError) {
+          console.error('Error connecting Facebook account:', socialError);
+        }
+      }
+    );
+    
+    new GraphRequestManager().addRequest(profileRequest).start();
+  } catch (error) {
+    console.error('Facebook login error:', error);
+    throw error;
+  }
+};
+```
+
+### 6.2 Twitter 로그인
+
+```javascript
+import { TwitterSignIn } from '@react-native-twitter-signin/twitter-signin';
+import supabase from '../services/supabase';
+
+const loginWithTwitter = async () => {
+  try {
+    // Twitter SDK 초기화
+    TwitterSignIn.init(
+      'TWITTER_CONSUMER_KEY',
+      'TWITTER_CONSUMER_SECRET'
+    );
+    
+    // 로그인 요청
+    const { authToken, authTokenSecret, userName, userID } = await TwitterSignIn.logIn();
+    
+    // Supabase에 소셜 계정 연결
+    const { data: socialAccount, error: socialError } = await supabase
+      .from('zellyy.social_accounts')
+      .upsert({
+        user_id: supabase.auth.user().id,
+        platform: 'twitter',
+        platform_user_id: userID,
+        access_token: authToken,
+        refresh_token: authTokenSecret,
+      })
+      .select()
+      .single();
+      
+    if (socialError) {
+      console.error('Error connecting Twitter account:', socialError);
+    }
+  } catch (error) {
+    console.error('Twitter login error:', error);
+    throw error;
+  }
+};
+```
+
+## 7. 소셜 공유 구현
+
+### 7.1 일반 공유 기능
+
+```javascript
+import Share from 'react-native-share';
+
+const shareToDefault = async (card) => {
+  try {
+    // 카드 이미지 생성 (별도 함수로 구현)
+    const imageUrl = await generateCardImage(card);
+    
+    const options = {
+      title: 'Share via',
+      message: card.content,
+      url: imageUrl,
+    };
+    
+    const result = await Share.open(options);
+    console.log('Share result:', result);
+    
+    return result;
+  } catch (error) {
+    console.error('Error sharing:', error);
+    throw error;
+  }
+};
+```
+
+### 7.2 Facebook 공유
+
+```javascript
+import { ShareDialog } from 'react-native-fbsdk-next';
+import supabase from '../services/supabase';
+
+const shareToFacebook = async (card) => {
+  try {
+    // 카드 이미지 생성 (별도 함수로 구현)
+    const imageUrl = await generateCardImage(card);
+    
+    const shareContent = {
+      contentType: 'link',
+      contentUrl: imageUrl,
+      contentDescription: card.content,
+    };
+    
+    // 공유 다이얼로그 표시
+    const result = await ShareDialog.show(shareContent);
+    
+    if (result.isCancelled) {
+      throw new Error('User cancelled sharing');
+    }
+    
+    // 공유 기록 저장
+    const { data: share, error: shareError } = await supabase
+      .from('zellyy.social_shares')
+      .insert({
+        card_id: card.id,
+        user_id: supabase.auth.user().id,
+        platform: 'facebook',
+        status: 'success',
+        response_data: result,
+      })
+      .select()
+      .single();
+      
+    if (shareError) {
+      console.error('Error recording share:', shareError);
+    }
+    
+    return result;
+  } catch (error) {
+    console.error('Error sharing to Facebook:', error);
+    throw error;
+  }
+};
+```
+
+### 7.3 Twitter 공유
+
+```javascript
+import { TwitterSignIn } from '@react-native-twitter-signin/twitter-signin';
+import supabase from '../services/supabase';
+
+const shareToTwitter = async (card) => {
+  try {
+    // 소셜 계정 정보 가져오기
+    const { data: socialAccount, error: socialError } = await supabase
+      .from('zellyy.social_accounts')
+      .select('*')
+      .eq('user_id', supabase.auth.user().id)
+      .eq('platform', 'twitter')
+      .single();
+      
+    if (socialError || !socialAccount) {
+      throw new Error('Twitter account not connected');
+    }
+    
+    // 카드 이미지 생성 (별도 함수로 구현)
+    const imageUrl = await generateCardImage(card);
+    
+    // Edge Function 호출하여 트윗 게시
+    const response = await fetch('https://a11.ism.kr/functions/v1/social-share', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+        'Authorization': `Bearer ${supabase.auth.session().access_token}`,
+      },
+      body: JSON.stringify({
+        cardId: card.id,
+        platform: 'twitter',
+        message: card.content,
+      }),
+    });
+    
+    const result = await response.json();
+    
+    if (!result.success) {
+      throw new Error(result.error || 'Failed to share to Twitter');
+    }
+    
+    return result;
+  } catch (error) {
+    console.error('Error sharing to Twitter:', error);
+    throw error;
+  }
+};
+```
+
+## 8. 소셜 계정 관리
+
+### 8.1 연결된 계정 목록 조회
+
+```javascript
+import { useEffect, useState } from 'react';
+import supabase from '../services/supabase';
+
+const SocialAccountsScreen = () => {
+  const [accounts, setAccounts] = useState([]);
+  const [loading, setLoading] = useState(true);
+  
+  useEffect(() => {
+    fetchAccounts();
+  }, []);
+  
+  const fetchAccounts = async () => {
+    try {
+      setLoading(true);
+      
+      const { data, error } = await supabase
+        .from('zellyy.social_accounts')
+        .select('*')
+        .eq('user_id', supabase.auth.user().id);
+        
+      if (error) {
+        throw error;
+      }
+      
+      setAccounts(data || []);
+    } catch (error) {
+      console.error('Error fetching social accounts:', error);
+      alert('Failed to load social accounts');
+    } finally {
+      setLoading(false);
+    }
+  };
+  
+  // 컴포넌트 렌더링 코드
+};
+```
+
+### 8.2 계정 연결 해제
+
+```javascript
+const disconnectAccount = async (platform) => {
+  try {
+    // 소셜 계정 삭제
+    const { error } = await supabase
+      .from('zellyy.social_accounts')
+      .delete()
+      .match({
+        user_id: supabase.auth.user().id,
+        platform,
+      });
+      
+    if (error) {
+      throw error;
+    }
+    
+    // 플랫폼별 로그아웃 처리
+    if (platform === 'facebook') {
+      LoginManager.logOut();
+    } else if (platform === 'twitter') {
+      TwitterSignIn.logOut();
+    }
+    
+    // 계정 목록 새로고침
+    fetchAccounts();
+    
+    alert(`${platform} account disconnected`);
+  } catch (error) {
+    console.error(`Error disconnecting ${platform} account:`, error);
+    alert(`Failed to disconnect ${platform} account`);
+  }
+};
+```
+
+## 9. 공유 기록 관리
+
+### 9.1 공유 기록 조회
+
+```javascript
+import { useEffect, useState } from 'react';
+import supabase from '../services/supabase';
+
+const ShareHistoryScreen = () => {
+  const [shares, setShares] = useState([]);
+  const [loading, setLoading] = useState(true);
+  
+  useEffect(() => {
+    fetchShareHistory();
+  }, []);
+  
+  const fetchShareHistory = async () => {
+    try {
+      setLoading(true);
+      
+      const { data, error } = await supabase
+        .from('zellyy.social_shares')
+        .select(`
+          id,
+          platform,
+          share_url,
+          shared_at,
+          status,
+          cards:card_id (
+            id,
+            content,
+            background_color,
+            text_color
+          )
+        `)
+        .eq('user_id', supabase.auth.user().id)
+        .order('shared_at', { ascending: false });
+        
+      if (error) {
+        throw error;
+      }
+      
+      setShares(data || []);
+    } catch (error) {
+      console.error('Error fetching share history:', error);
+      alert('Failed to load share history');
+    } finally {
+      setLoading(false);
+    }
+  };
+  
+  // 컴포넌트 렌더링 코드
+};
+```
+
+## 10. 카드 이미지 생성
+
+카드를 이미지로 변환하여 소셜 미디어에 공유하기 위한 함수입니다.
+
+```javascript
+import ViewShot from 'react-native-view-shot';
+import { useRef } from 'react';
+import supabase from '../services/supabase';
+
+// 카드 컴포넌트
+const Card = ({ card, viewShotRef }) => {
+  return (
+    <ViewShot ref={viewShotRef} options={{ format: 'jpg', quality: 0.9 }}>
+      <View
+        style={{
+          width: 300,
+          height: 300,
+          backgroundColor: card.background_color,
+          justifyContent: 'center',
+          alignItems: 'center',
+          padding: 20,
+        }}
+      >
+        <Text
+          style={{
+            color: card.text_color,
+            fontFamily: card.font_family,
+            fontSize: card.font_size,
+            textAlign: card.text_align,
+          }}
+        >
+          {card.content}
+        </Text>
+      </View>
+    </ViewShot>
+  );
+};
+
+// 이미지 생성 및 업로드 함수
+const generateCardImage = async (card) => {
+  try {
+    // ViewShot 참조
+    const viewShotRef = useRef();
+    
+    // 카드 이미지 캡처
+    const uri = await viewShotRef.current.capture();
+    
+    // 파일 이름 생성
+    const fileName = `${supabase.auth.user().id}/${card.id}_${Date.now()}.jpg`;
+    
+    // 이미지 파일 생성
+    const formData = new FormData();
+    formData.append('file', {
+      uri,
+      name: fileName,
+      type: 'image/jpeg',
+    });
+    
+    // Supabase Storage에 업로드
+    const { data, error } = await supabase
+      .storage
+      .from('card-images')
+      .upload(fileName, formData);
+      
+    if (error) {
+      throw error;
+    }
+    
+    // 공개 URL 생성
+    const { publicURL, error: urlError } = supabase
+      .storage
+      .from('card-images')
+      .getPublicUrl(fileName);
+      
+    if (urlError) {
+      throw urlError;
+    }
+    
+    return publicURL;
+  } catch (error) {
+    console.error('Error generating card image:', error);
+    throw error;
+  }
+};
+```
+
+## 11. 문제 해결
+
+### 11.1 일반적인 문제 및 해결 방법
+
+1. **소셜 로그인 실패**:
+   - 앱 ID와 시크릿이 올바른지 확인
+   - 리디렉션 URL이 올바르게 설정되었는지 확인
+   - 앱 권한이 올바르게 설정되었는지 확인
+
+2. **공유 기능 실패**:
+   - 소셜 미디어 앱이 기기에 설치되어 있는지 확인
+   - 액세스 토큰이 유효한지 확인
+   - 필요한 권한이 부여되었는지 확인
+
+3. **이미지 업로드 실패**:
+   - 스토리지 버킷 권한 설정 확인
+   - 파일 크기 및 형식 확인
+
+### 11.2 플랫폼별 문제 해결
+
+#### Facebook
+- 앱 검토 상태 확인
+- 개발 모드에서는 테스트 사용자만 앱에 접근 가능
+
+#### Twitter
+- API 키와 시크릿이 올바른지 확인
+- 개발자 계정 상태 확인
+
+#### Instagram
+- Facebook 개발자 계정과 연결되어 있는지 확인
+- Instagram Graph API 권한 확인
+
+## 12. 보안 고려사항
+
+1. **토큰 보안**:
+   - 액세스 토큰과 리프레시 토큰은 안전하게 저장
+   - 서버 측에서만 API 시크릿 사용
+
+2. **사용자 데이터 보호**:
+   - 필요한 최소한의 권한만 요청
+   - 사용자 동의 없이 데이터를 공유하지 않음
+
+3. **API 키 관리**:
+   - 환경 변수로 관리하고 소스 코드에 하드코딩하지 않음
+   - 프로덕션과 개발 환경에 별도의 API 키 사용
+
+## 결론
+
+이 가이드는 Zellyy 앱에서 다양한 소셜 미디어 플랫폼과의 통합 방법을 제공합니다. 각 플랫폼의 API는 지속적으로 변경될 수 있으므로, 최신 문서를 참조하여 구현을 업데이트하는 것이 중요합니다. 소셜 미디어 통합은 사용자 경험을 향상시키고 앱의 확산을 촉진하는 중요한 기능입니다.
--- a/note/02_기술_문서/Supabase_연동_가이드.md
+++ b/note/02_기술_문서/Supabase_연동_가이드.md
@@ -0,0 +1,750 @@
+# Supabase 연동 가이드
+
+이 문서는 Zellyy 프로젝트에서 Supabase를 연동하고 설정하는 방법을 안내합니다.
+
+## 개요
+
+Zellyy 프로젝트는 백엔드로 자체 호스팅된 Supabase를 사용합니다. 이 가이드는 기존에 설치된 Supabase 인스턴스에 Zellyy 프로젝트를 위한 스키마와 테이블을 설정하는 방법을 설명합니다.
+
+## 사전 요구사항
+
+- 설치된 Supabase 인스턴스 (참조: [[Nginx Supabase 설치 가이드]])
+- PostgreSQL 기본 지식
+- Supabase API 키 및 URL
+
+## 1. Supabase 프로젝트 설정
+
+### 1.1 스키마 생성
+
+Zellyy 프로젝트를 위한 별도의 스키마를 생성합니다. 이는 기존 프로젝트와의 데이터 분리를 위한 것입니다.
+
+```sql
+-- Supabase SQL 편집기에서 실행
+CREATE SCHEMA IF NOT EXISTS zellyy;
+```
+
+### 1.2 확장 활성화
+
+필요한 PostgreSQL 확장을 활성화합니다.
+
+```sql
+-- UUID 생성을 위한 확장
+CREATE EXTENSION IF NOT EXISTS "uuid-ossp";
+
+-- 전문 검색을 위한 확장
+CREATE EXTENSION IF NOT EXISTS pg_trgm;
+```
+
+## 2. 데이터베이스 테이블 생성
+
+### 2.1 사용자 테이블
+
+```sql
+CREATE TABLE zellyy.users (
+    id UUID REFERENCES auth.users(id) PRIMARY KEY,
+    email TEXT UNIQUE NOT NULL,
+    username TEXT UNIQUE,
+    display_name TEXT,
+    avatar_url TEXT,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    last_login TIMESTAMP WITH TIME ZONE,
+    is_premium BOOLEAN DEFAULT FALSE,
+    premium_until TIMESTAMP WITH TIME ZONE
+);
+
+-- 트리거 설정
+CREATE OR REPLACE FUNCTION zellyy.update_timestamp()
+RETURNS TRIGGER AS $$
+BEGIN
+    NEW.updated_at = NOW();
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+CREATE TRIGGER update_users_timestamp
+BEFORE UPDATE ON zellyy.users
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_timestamp();
+```
+
+### 2.2 카드 테이블
+
+```sql
+CREATE TABLE zellyy.cards (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    content TEXT NOT NULL,
+    background_color TEXT DEFAULT '#FFFFFF',
+    text_color TEXT DEFAULT '#000000',
+    font_family TEXT DEFAULT 'system',
+    font_size INTEGER DEFAULT 16,
+    text_align TEXT DEFAULT 'center',
+    is_public BOOLEAN DEFAULT FALSE,
+    is_synced BOOLEAN DEFAULT FALSE,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    deleted_at TIMESTAMP WITH TIME ZONE
+);
+
+CREATE TRIGGER update_cards_timestamp
+BEFORE UPDATE ON zellyy.cards
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_timestamp();
+```
+
+### 2.3 카드 태그 테이블
+
+```sql
+CREATE TABLE zellyy.card_tags (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    card_id UUID REFERENCES zellyy.cards(id) NOT NULL,
+    tag_name TEXT NOT NULL,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    UNIQUE(card_id, tag_name)
+);
+```
+
+### 2.4 소셜 공유 테이블
+
+```sql
+CREATE TABLE zellyy.social_shares (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    card_id UUID REFERENCES zellyy.cards(id) NOT NULL,
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    platform TEXT NOT NULL,
+    share_url TEXT,
+    shared_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    status TEXT DEFAULT 'pending',
+    response_data JSONB
+);
+```
+
+### 2.5 소셜 계정 테이블
+
+```sql
+CREATE TABLE zellyy.social_accounts (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    platform TEXT NOT NULL,
+    platform_user_id TEXT,
+    access_token TEXT,
+    refresh_token TEXT,
+    token_expires_at TIMESTAMP WITH TIME ZONE,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    UNIQUE(user_id, platform)
+);
+
+CREATE TRIGGER update_social_accounts_timestamp
+BEFORE UPDATE ON zellyy.social_accounts
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_timestamp();
+```
+
+### 2.6 구독 테이블
+
+```sql
+CREATE TABLE zellyy.subscriptions (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    plan_type TEXT NOT NULL,
+    status TEXT NOT NULL,
+    start_date TIMESTAMP WITH TIME ZONE NOT NULL,
+    end_date TIMESTAMP WITH TIME ZONE NOT NULL,
+    payment_provider TEXT,
+    payment_id TEXT,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
+);
+
+CREATE TRIGGER update_subscriptions_timestamp
+BEFORE UPDATE ON zellyy.subscriptions
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_timestamp();
+
+-- 구독 상태에 따라 사용자의 프리미엄 상태 업데이트
+CREATE OR REPLACE FUNCTION zellyy.update_premium_status()
+RETURNS TRIGGER AS $$
+BEGIN
+    IF NEW.status = 'active' THEN
+        UPDATE zellyy.users
+        SET is_premium = TRUE, premium_until = NEW.end_date
+        WHERE id = NEW.user_id;
+    ELSIF NEW.status IN ('canceled', 'expired') AND NEW.end_date <= NOW() THEN
+        UPDATE zellyy.users
+        SET is_premium = FALSE, premium_until = NULL
+        WHERE id = NEW.user_id;
+    END IF;
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+CREATE TRIGGER update_premium_status_trigger
+AFTER INSERT OR UPDATE ON zellyy.subscriptions
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_premium_status();
+```
+
+## 3. 인덱스 생성
+
+성능 최적화를 위한 인덱스를 생성합니다.
+
+```sql
+-- 카드 검색 최적화
+CREATE INDEX idx_cards_user_id ON zellyy.cards(user_id);
+CREATE INDEX idx_cards_created_at ON zellyy.cards(created_at);
+CREATE INDEX idx_cards_is_public ON zellyy.cards(is_public);
+
+-- 태그 검색 최적화
+CREATE INDEX idx_card_tags_card_id ON zellyy.card_tags(card_id);
+CREATE INDEX idx_card_tags_tag_name ON zellyy.card_tags(tag_name);
+
+-- 소셜 공유 검색 최적화
+CREATE INDEX idx_social_shares_user_id ON zellyy.social_shares(user_id);
+CREATE INDEX idx_social_shares_card_id ON zellyy.social_shares(card_id);
+```
+
+## 4. Row Level Security (RLS) 설정
+
+Supabase의 Row Level Security를 사용하여 데이터 접근을 제한합니다.
+
+### 4.1 사용자 테이블 정책
+
+```sql
+-- RLS 활성화
+ALTER TABLE zellyy.users ENABLE ROW LEVEL SECURITY;
+
+-- 사용자는 자신의 정보만 읽을 수 있음
+CREATE POLICY "사용자는 자신의 정보만 읽을 수 있음" ON zellyy.users
+    FOR SELECT USING (auth.uid() = id);
+
+-- 사용자는 자신의 정보만 업데이트할 수 있음
+CREATE POLICY "사용자는 자신의 정보만 업데이트할 수 있음" ON zellyy.users
+    FOR UPDATE USING (auth.uid() = id);
+```
+
+### 4.2 카드 테이블 정책
+
+```sql
+-- RLS 활성화
+ALTER TABLE zellyy.cards ENABLE ROW LEVEL SECURITY;
+
+-- 사용자는 자신의 카드만 읽을 수 있음 (또는 공개 카드)
+CREATE POLICY "사용자는 자신의 카드만 읽을 수 있음" ON zellyy.cards
+    FOR SELECT USING (auth.uid() = user_id OR is_public = TRUE);
+
+-- 사용자는 자신의 카드만 생성할 수 있음
+CREATE POLICY "사용자는 자신의 카드만 생성할 수 있음" ON zellyy.cards
+    FOR INSERT WITH CHECK (auth.uid() = user_id);
+
+-- 사용자는 자신의 카드만 업데이트할 수 있음
+CREATE POLICY "사용자는 자신의 카드만 업데이트할 수 있음" ON zellyy.cards
+    FOR UPDATE USING (auth.uid() = user_id);
+
+-- 사용자는 자신의 카드만 삭제할 수 있음
+CREATE POLICY "사용자는 자신의 카드만 삭제할 수 있음" ON zellyy.cards
+    FOR DELETE USING (auth.uid() = user_id);
+```
+
+### 4.3 기타 테이블 정책
+
+다른 테이블에도 유사한 방식으로 RLS 정책을 적용합니다.
+
+```sql
+-- 카드 태그 테이블
+ALTER TABLE zellyy.card_tags ENABLE ROW LEVEL SECURITY;
+
+CREATE POLICY "카드 태그 읽기 정책" ON zellyy.card_tags
+    FOR SELECT USING (
+        EXISTS (
+            SELECT 1 FROM zellyy.cards
+            WHERE cards.id = card_tags.card_id
+            AND (cards.user_id = auth.uid() OR cards.is_public = TRUE)
+        )
+    );
+
+-- 소셜 공유 테이블
+ALTER TABLE zellyy.social_shares ENABLE ROW LEVEL SECURITY;
+
+CREATE POLICY "소셜 공유 읽기 정책" ON zellyy.social_shares
+    FOR SELECT USING (user_id = auth.uid());
+
+-- 소셜 계정 테이블
+ALTER TABLE zellyy.social_accounts ENABLE ROW LEVEL SECURITY;
+
+CREATE POLICY "소셜 계정 읽기 정책" ON zellyy.social_accounts
+    FOR SELECT USING (user_id = auth.uid());
+
+-- 구독 테이블
+ALTER TABLE zellyy.subscriptions ENABLE ROW LEVEL SECURITY;
+
+CREATE POLICY "구독 읽기 정책" ON zellyy.subscriptions
+    FOR SELECT USING (user_id = auth.uid());
+```
+
+## 5. 저장 프로시저 및 함수
+
+자주 사용되는 작업을 위한 저장 프로시저와 함수를 생성합니다.
+
+### 5.1 카드 생성 함수
+
+```sql
+CREATE OR REPLACE FUNCTION zellyy.create_card(
+    content TEXT,
+    background_color TEXT DEFAULT '#FFFFFF',
+    text_color TEXT DEFAULT '#000000',
+    font_family TEXT DEFAULT 'system',
+    font_size INTEGER DEFAULT 16,
+    text_align TEXT DEFAULT 'center',
+    is_public BOOLEAN DEFAULT FALSE,
+    tags TEXT[] DEFAULT '{}'
+)
+RETURNS UUID AS $$
+DECLARE
+    card_id UUID;
+    tag TEXT;
+BEGIN
+    -- 카드 생성
+    INSERT INTO zellyy.cards (
+        user_id, content, background_color, text_color,
+        font_family, font_size, text_align, is_public
+    ) VALUES (
+        auth.uid(), content, background_color, text_color,
+        font_family, font_size, text_align, is_public
+    ) RETURNING id INTO card_id;
+    
+    -- 태그 추가
+    FOREACH tag IN ARRAY tags
+    LOOP
+        INSERT INTO zellyy.card_tags (card_id, tag_name)
+        VALUES (card_id, tag);
+    END LOOP;
+    
+    RETURN card_id;
+END;
+$$ LANGUAGE plpgsql SECURITY DEFINER;
+```
+
+### 5.2 카드 검색 함수
+
+```sql
+CREATE OR REPLACE FUNCTION zellyy.search_cards(
+    search_query TEXT DEFAULT NULL,
+    tag_filter TEXT DEFAULT NULL,
+    page_number INTEGER DEFAULT 1,
+    items_per_page INTEGER DEFAULT 20
+)
+RETURNS TABLE (
+    id UUID,
+    content TEXT,
+    background_color TEXT,
+    text_color TEXT,
+    font_family TEXT,
+    font_size INTEGER,
+    text_align TEXT,
+    is_public BOOLEAN,
+    created_at TIMESTAMP WITH TIME ZONE,
+    updated_at TIMESTAMP WITH TIME ZONE,
+    tags TEXT[]
+) AS $$
+BEGIN
+    RETURN QUERY
+    WITH filtered_cards AS (
+        SELECT c.id, c.content, c.background_color, c.text_color,
+               c.font_family, c.font_size, c.text_align, c.is_public,
+               c.created_at, c.updated_at
+        FROM zellyy.cards c
+        WHERE (c.user_id = auth.uid() OR c.is_public = TRUE)
+          AND (search_query IS NULL OR c.content ILIKE '%' || search_query || '%')
+          AND c.deleted_at IS NULL
+          AND (
+              tag_filter IS NULL
+              OR EXISTS (
+                  SELECT 1 FROM zellyy.card_tags ct
+                  WHERE ct.card_id = c.id AND ct.tag_name = tag_filter
+              )
+          )
+    ),
+    cards_with_tags AS (
+        SELECT fc.*, array_agg(ct.tag_name) as tags
+        FROM filtered_cards fc
+        LEFT JOIN zellyy.card_tags ct ON fc.id = ct.card_id
+        GROUP BY fc.id, fc.content, fc.background_color, fc.text_color,
+                 fc.font_family, fc.font_size, fc.text_align, fc.is_public,
+                 fc.created_at, fc.updated_at
+    )
+    SELECT * FROM cards_with_tags
+    ORDER BY created_at DESC
+    LIMIT items_per_page
+    OFFSET (page_number - 1) * items_per_page;
+END;
+$$ LANGUAGE plpgsql SECURITY DEFINER;
+```
+
+## 6. Supabase 클라이언트 설정
+
+### 6.1 React Native 앱에서 Supabase 클라이언트 설정
+
+`services/supabase.js` 파일을 생성하고 다음 코드를 추가합니다:
+
+```javascript
+import { createClient } from '@supabase/supabase-js';
+import AsyncStorage from '@react-native-async-storage/async-storage';
+import { SUPABASE_URL, SUPABASE_ANON_KEY } from '@env';
+
+const supabaseUrl = SUPABASE_URL;
+const supabaseAnonKey = SUPABASE_ANON_KEY;
+
+// AsyncStorage 어댑터 생성
+const AsyncStorageAdapter = {
+  getItem: (key) => AsyncStorage.getItem(key),
+  setItem: (key, value) => AsyncStorage.setItem(key, value),
+  removeItem: (key) => AsyncStorage.removeItem(key),
+};
+
+// Supabase 클라이언트 생성
+const supabase = createClient(supabaseUrl, supabaseAnonKey, {
+  auth: {
+    storage: AsyncStorageAdapter,
+    autoRefreshToken: true,
+    persistSession: true,
+    detectSessionInUrl: false,
+  },
+});
+
+export default supabase;
+```
+
+### 6.2 환경 변수 설정
+
+`.env` 파일에 Supabase URL과 익명 키를 추가합니다:
+
+```
+SUPABASE_URL=https://a11.ism.kr
+SUPABASE_ANON_KEY=your_anon_key
+```
+
+## 7. 인증 설정
+
+### 7.1 이메일/비밀번호 인증 활성화
+
+Supabase 대시보드에서:
+
+1. Authentication > Settings로 이동
+2. Email Auth를 활성화
+3. 필요한 경우 이메일 템플릿 커스터마이징
+
+### 7.2 소셜 로그인 설정 (선택 사항)
+
+소셜 로그인을 활성화하려면:
+
+1. Authentication > Settings > OAuth Providers로 이동
+2. 원하는 소셜 로그인 제공자 활성화 (예: Google, Facebook)
+3. 각 제공자의 클라이언트 ID와 시크릿 설정
+
+## 8. 스토리지 설정
+
+### 8.1 버킷 생성
+
+Supabase 대시보드에서:
+
+1. Storage로 이동
+2. "New Bucket" 클릭
+3. 다음 버킷 생성:
+   - `avatars`: 사용자 프로필 이미지용
+   - `card-images`: 카드 이미지용
+
+### 8.2 스토리지 정책 설정
+
+각 버킷에 대한 접근 정책을 설정합니다:
+
+```sql
+-- avatars 버킷 정책
+CREATE POLICY "사용자는 자신의 아바타만 업로드할 수 있음"
+ON storage.objects FOR INSERT
+WITH CHECK (
+  bucket_id = 'avatars' AND
+  auth.uid() = (storage.foldername(name)::uuid)
+);
+
+CREATE POLICY "사용자는 자신의 아바타만 업데이트할 수 있음"
+ON storage.objects FOR UPDATE
+USING (
+  bucket_id = 'avatars' AND
+  auth.uid() = (storage.foldername(name)::uuid)
+);
+
+CREATE POLICY "아바타는 공개적으로 접근 가능"
+ON storage.objects FOR SELECT
+USING (bucket_id = 'avatars');
+
+-- card-images 버킷 정책
+CREATE POLICY "사용자는 자신의 카드 이미지만 업로드할 수 있음"
+ON storage.objects FOR INSERT
+WITH CHECK (
+  bucket_id = 'card-images' AND
+  auth.uid() = (storage.foldername(name)::uuid)
+);
+
+CREATE POLICY "사용자는 자신의 카드 이미지만 업데이트할 수 있음"
+ON storage.objects FOR UPDATE
+USING (
+  bucket_id = 'card-images' AND
+  auth.uid() = (storage.foldername(name)::uuid)
+);
+
+CREATE POLICY "카드 이미지는 공개적으로 접근 가능"
+ON storage.objects FOR SELECT
+USING (bucket_id = 'card-images');
+```
+
+## 9. Edge Functions 설정 (선택 사항)
+
+소셜 미디어 공유와 같은 복잡한 기능을 위해 Supabase Edge Functions를 사용할 수 있습니다.
+
+### 9.1 Edge Function 생성
+
+```bash
+# Supabase CLI 설치
+npm install -g supabase
+
+# 로그인
+supabase login
+
+# 프로젝트 연결
+supabase link --project-ref your-project-ref
+
+# 소셜 공유 함수 생성
+supabase functions new social-share
+
+# 함수 배포
+supabase functions deploy social-share
+```
+
+### 9.2 소셜 공유 함수 예시
+
+`supabase/functions/social-share/index.ts` 파일:
+
+```typescript
+import { serve } from 'https://deno.land/std@0.131.0/http/server.ts';
+import { createClient } from 'https://esm.sh/@supabase/supabase-js@2.0.0';
+
+const supabaseUrl = Deno.env.get('SUPABASE_URL') ?? '';
+const supabaseServiceKey = Deno.env.get('SUPABASE_SERVICE_ROLE_KEY') ?? '';
+
+serve(async (req) => {
+  // CORS 헤더
+  if (req.method === 'OPTIONS') {
+    return new Response('ok', {
+      headers: {
+        'Access-Control-Allow-Origin': '*',
+        'Access-Control-Allow-Methods': 'POST',
+        'Access-Control-Allow-Headers': 'authorization, x-client-info, apikey, content-type',
+      },
+    });
+  }
+
+  try {
+    // 요청 본문 파싱
+    const { cardId, platform, message } = await req.json();
+    
+    // Supabase 클라이언트 생성
+    const supabase = createClient(supabaseUrl, supabaseServiceKey);
+    
+    // 인증 확인
+    const authHeader = req.headers.get('Authorization');
+    if (!authHeader) {
+      return new Response(JSON.stringify({ error: 'Unauthorized' }), {
+        status: 401,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    
+    const token = authHeader.replace('Bearer ', '');
+    const { data: { user }, error: authError } = await supabase.auth.getUser(token);
+    
+    if (authError || !user) {
+      return new Response(JSON.stringify({ error: 'Unauthorized' }), {
+        status: 401,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    
+    // 카드 정보 가져오기
+    const { data: card, error: cardError } = await supabase
+      .from('zellyy.cards')
+      .select('*')
+      .eq('id', cardId)
+      .single();
+    
+    if (cardError || !card) {
+      return new Response(JSON.stringify({ error: 'Card not found' }), {
+        status: 404,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    
+    // 소셜 계정 정보 가져오기
+    const { data: socialAccount, error: socialError } = await supabase
+      .from('zellyy.social_accounts')
+      .select('*')
+      .eq('user_id', user.id)
+      .eq('platform', platform)
+      .single();
+    
+    if (socialError || !socialAccount) {
+      return new Response(JSON.stringify({ error: 'Social account not connected' }), {
+        status: 400,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    
+    // 소셜 미디어 공유 로직 (플랫폼별로 다름)
+    let shareResult;
+    let shareUrl;
+    
+    if (platform === 'facebook') {
+      // Facebook API 호출 로직
+      // ...
+      shareUrl = 'https://facebook.com/post/123456';
+    } else if (platform === 'instagram') {
+      // Instagram API 호출 로직
+      // ...
+      shareUrl = 'https://instagram.com/p/123456';
+    } else if (platform === 'twitter') {
+      // Twitter API 호출 로직
+      // ...
+      shareUrl = 'https://twitter.com/user/status/123456';
+    } else {
+      return new Response(JSON.stringify({ error: 'Unsupported platform' }), {
+        status: 400,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    
+    // 공유 기록 저장
+    const { data: share, error: shareError } = await supabase
+      .from('zellyy.social_shares')
+      .insert({
+        card_id: cardId,
+        user_id: user.id,
+        platform,
+        share_url: shareUrl,
+        status: 'success',
+        response_data: shareResult
+      })
+      .select()
+      .single();
+    
+    if (shareError) {
+      return new Response(JSON.stringify({ error: 'Failed to record share' }), {
+        status: 500,
+        headers: { 'Content-Type': 'application/json' },
+      });
+    }
+    
+    return new Response(JSON.stringify({ success: true, share }), {
+      status: 200,
+      headers: {
+        'Content-Type': 'application/json',
+        'Access-Control-Allow-Origin': '*',
+      },
+    });
+  } catch (error) {
+    return new Response(JSON.stringify({ error: error.message }), {
+      status: 500,
+      headers: {
+        'Content-Type': 'application/json',
+        'Access-Control-Allow-Origin': '*',
+      },
+    });
+  }
+});
+```
+
+## 10. 백업 및 유지 관리
+
+### 10.1 정기 백업 설정
+
+기존 백업 스크립트를 활용하여 Zellyy 스키마도 백업합니다:
+
+```bash
+#!/bin/bash
+BACKUP_DIR="/home/ism-admin/backups"
+TIMESTAMP=$(date +"%Y%m%d_%H%M%S")
+BACKUP_FILE="$BACKUP_DIR/postgres_backup_$TIMESTAMP.sql.gz"
+
+# 백업 디렉토리 생성
+mkdir -p $BACKUP_DIR
+
+# 데이터베이스 백업
+docker exec supabase-db pg_dumpall -U postgres | gzip > $BACKUP_FILE
+
+# 30일 이상 된 백업 삭제
+find $BACKUP_DIR -name "postgres_backup_*.sql.gz" -type f -mtime +30 -delete
+```
+
+### 10.2 성능 모니터링
+
+PostgreSQL 성능을 모니터링하기 위한 쿼리:
+
+```sql
+-- 느린 쿼리 확인
+SELECT
+  query,
+  calls,
+  total_time,
+  mean_time,
+  rows
+FROM pg_stat_statements
+ORDER BY total_time DESC
+LIMIT 10;
+
+-- 테이블 크기 확인
+SELECT
+  schemaname,
+  relname,
+  pg_size_pretty(pg_total_relation_size(relid)) as total_size
+FROM pg_catalog.pg_statio_user_tables
+WHERE schemaname = 'zellyy'
+ORDER BY pg_total_relation_size(relid) DESC;
+```
+
+## 11. 문제 해결
+
+### 11.1 일반적인 문제 및 해결 방법
+
+1. **RLS 정책 문제**:
+   - 정책이 너무 제한적인지 확인
+   - `auth.uid()`가 올바르게 작동하는지 확인
+
+2. **성능 문제**:
+   - 인덱스가 올바르게 생성되었는지 확인
+   - 쿼리 실행 계획 분석
+
+3. **인증 문제**:
+   - JWT 토큰이 올바른지 확인
+   - 세션 만료 시간 확인
+
+### 11.2 로그 확인
+
+```bash
+# Supabase 로그 확인
+docker logs supabase-db
+docker logs supabase-auth
+docker logs supabase-rest
+```
+
+## 12. 보안 고려사항
+
+1. **API 키 관리**:
+   - 익명 키와 서비스 키를 안전하게 보관
+   - 서비스 키는 서버 측 코드에서만 사용
+
+2. **데이터 암호화**:
+   - 민감한 정보는 암호화하여 저장
+   - 소셜 미디어 토큰과 같은 민감한 정보는 암호화
+
+3. **정기적인 보안 감사**:
+   - RLS 정책 검토
+   - 권한 설정 검토
+
+## 결론
+
+이 가이드는 Zellyy 프로젝트를 위한 Supabase 설정 방법을 제공합니다. 기존 Supabase 인프라를 활용하면서도 데이터를 분리하여 관리함으로써 효율적인 개발과 운영이 가능합니다. 추가적인 기능이나 요구사항이 생기면 이 문서를 업데이트하여 최신 상태를 유지하세요.
--- a/note/02_기술_문서/index.md
+++ b/note/02_기술_문서/index.md
@@ -0,0 +1,26 @@
+# 기술 문서
+
+이 폴더에는 Zellyy 프로젝트의 기술적 구현에 관한 문서가 포함되어 있습니다.
+
+## 문서 목록
+
+1. [[데이터 모델 설계]] - 데이터 모델 설계 문서
+2. [[ERD 다이어그램]] - 엔티티 관계 다이어그램
+3. [[API 명세서]] - API 엔드포인트 및 기능 명세
+4. [[React Native 설정 가이드]] - React Native 개발 환경 설정 가이드
+5. [[Supabase 연동 가이드]] - Supabase 연동 및 설정 방법
+6. [[SNS 통합 가이드]] - 소셜 미디어 플랫폼 연동 방법
+
+## 기술 스택 요약
+
+Zellyy 프로젝트는 다음과 같은 기술 스택을 사용합니다:
+
+- **모바일 앱 프론트엔드**: React Native (iOS, Android)
+- **웹 프론트엔드**: React.js 또는 Next.js (2단계)
+- **백엔드**: Supabase (자체 호스팅)
+- **데이터베이스**: PostgreSQL (Supabase 내장)
+- **인증**: Supabase Auth
+- **스토리지**: Supabase Storage
+- **배포 환경**: Debian 12 서버 (기존 인프라 활용)
+
+이 문서들은 프로젝트의 기술적 구현에 필요한 상세 정보를 제공하며, 개발자가 시스템을 이해하고 구현하는 데 도움을 줍니다.
--- a/note/02_기술_문서/데이터_모델_설계.md
+++ b/note/02_기술_문서/데이터_모델_설계.md
@@ -0,0 +1,265 @@
+# Zellyy 데이터 모델 설계
+
+이 문서는 Zellyy 프로젝트의 데이터베이스 모델 설계에 대한 상세 내용을 제공합니다.
+
+## 스키마 구조
+
+Zellyy 프로젝트는 Supabase의 PostgreSQL 데이터베이스를 사용하며, 모든 테이블은 `zellyy` 스키마 아래에 생성됩니다. 이는 기존 프로젝트와의 분리를 위한 것입니다.
+
+## 핵심 테이블
+
+### 1. zellyy.users
+
+사용자 정보를 저장하는 테이블입니다. Supabase Auth와 연동됩니다.
+
+```sql
+CREATE TABLE zellyy.users (
+    id UUID REFERENCES auth.users(id) PRIMARY KEY,
+    email TEXT UNIQUE NOT NULL,
+    username TEXT UNIQUE,
+    display_name TEXT,
+    avatar_url TEXT,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    last_login TIMESTAMP WITH TIME ZONE,
+    is_premium BOOLEAN DEFAULT FALSE,
+    premium_until TIMESTAMP WITH TIME ZONE
+);
+```
+
+### 2. zellyy.cards
+
+사용자가 작성한 카드 정보를 저장하는 테이블입니다.
+
+```sql
+CREATE TABLE zellyy.cards (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    content TEXT NOT NULL,
+    background_color TEXT DEFAULT '#FFFFFF',
+    text_color TEXT DEFAULT '#000000',
+    font_family TEXT DEFAULT 'system',
+    font_size INTEGER DEFAULT 16,
+    text_align TEXT DEFAULT 'center',
+    is_public BOOLEAN DEFAULT FALSE,
+    is_synced BOOLEAN DEFAULT FALSE,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    deleted_at TIMESTAMP WITH TIME ZONE
+);
+```
+
+### 3. zellyy.card_tags
+
+카드에 적용된 태그 정보를 저장하는 테이블입니다.
+
+```sql
+CREATE TABLE zellyy.card_tags (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    card_id UUID REFERENCES zellyy.cards(id) NOT NULL,
+    tag_name TEXT NOT NULL,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    UNIQUE(card_id, tag_name)
+);
+```
+
+### 4. zellyy.social_shares
+
+카드의 소셜 미디어 공유 기록을 저장하는 테이블입니다.
+
+```sql
+CREATE TABLE zellyy.social_shares (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    card_id UUID REFERENCES zellyy.cards(id) NOT NULL,
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    platform TEXT NOT NULL, -- 'facebook', 'instagram', 'twitter', etc.
+    share_url TEXT,
+    shared_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    status TEXT DEFAULT 'pending', -- 'pending', 'success', 'failed'
+    response_data JSONB
+);
+```
+
+### 5. zellyy.social_accounts
+
+사용자의 소셜 미디어 계정 연동 정보를 저장하는 테이블입니다.
+
+```sql
+CREATE TABLE zellyy.social_accounts (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    platform TEXT NOT NULL, -- 'facebook', 'instagram', 'twitter', etc.
+    platform_user_id TEXT,
+    access_token TEXT,
+    refresh_token TEXT,
+    token_expires_at TIMESTAMP WITH TIME ZONE,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    UNIQUE(user_id, platform)
+);
+```
+
+### 6. zellyy.subscriptions
+
+사용자의 구독 정보를 저장하는 테이블입니다.
+
+```sql
+CREATE TABLE zellyy.subscriptions (
+    id UUID PRIMARY KEY DEFAULT uuid_generate_v4(),
+    user_id UUID REFERENCES zellyy.users(id) NOT NULL,
+    plan_type TEXT NOT NULL, -- 'monthly', 'yearly', etc.
+    status TEXT NOT NULL, -- 'active', 'canceled', 'expired'
+    start_date TIMESTAMP WITH TIME ZONE NOT NULL,
+    end_date TIMESTAMP WITH TIME ZONE NOT NULL,
+    payment_provider TEXT, -- 'apple', 'google', 'stripe', etc.
+    payment_id TEXT,
+    created_at TIMESTAMP WITH TIME ZONE DEFAULT NOW(),
+    updated_at TIMESTAMP WITH TIME ZONE DEFAULT NOW()
+);
+```
+
+## 보안 정책 (RLS)
+
+Supabase의 Row Level Security(RLS)를 사용하여 데이터 접근을 제한합니다.
+
+### zellyy.users 테이블 정책
+
+```sql
+-- 사용자는 자신의 정보만 읽을 수 있음
+CREATE POLICY "사용자는 자신의 정보만 읽을 수 있음" ON zellyy.users
+    FOR SELECT USING (auth.uid() = id);
+
+-- 사용자는 자신의 정보만 업데이트할 수 있음
+CREATE POLICY "사용자는 자신의 정보만 업데이트할 수 있음" ON zellyy.users
+    FOR UPDATE USING (auth.uid() = id);
+```
+
+### zellyy.cards 테이블 정책
+
+```sql
+-- 사용자는 자신의 카드만 읽을 수 있음 (또는 공개 카드)
+CREATE POLICY "사용자는 자신의 카드만 읽을 수 있음" ON zellyy.cards
+    FOR SELECT USING (auth.uid() = user_id OR is_public = TRUE);
+
+-- 사용자는 자신의 카드만 생성할 수 있음
+CREATE POLICY "사용자는 자신의 카드만 생성할 수 있음" ON zellyy.cards
+    FOR INSERT WITH CHECK (auth.uid() = user_id);
+
+-- 사용자는 자신의 카드만 업데이트할 수 있음
+CREATE POLICY "사용자는 자신의 카드만 업데이트할 수 있음" ON zellyy.cards
+    FOR UPDATE USING (auth.uid() = user_id);
+
+-- 사용자는 자신의 카드만 삭제할 수 있음
+CREATE POLICY "사용자는 자신의 카드만 삭제할 수 있음" ON zellyy.cards
+    FOR DELETE USING (auth.uid() = user_id);
+```
+
+## 인덱스
+
+성능 최적화를 위한 인덱스를 생성합니다.
+
+```sql
+-- 카드 검색 최적화
+CREATE INDEX idx_cards_user_id ON zellyy.cards(user_id);
+CREATE INDEX idx_cards_created_at ON zellyy.cards(created_at);
+CREATE INDEX idx_cards_is_public ON zellyy.cards(is_public);
+
+-- 태그 검색 최적화
+CREATE INDEX idx_card_tags_card_id ON zellyy.card_tags(card_id);
+CREATE INDEX idx_card_tags_tag_name ON zellyy.card_tags(tag_name);
+
+-- 소셜 공유 검색 최적화
+CREATE INDEX idx_social_shares_user_id ON zellyy.social_shares(user_id);
+CREATE INDEX idx_social_shares_card_id ON zellyy.social_shares(card_id);
+```
+
+## 트리거 및 함수
+
+자동화된 작업을 위한 트리거와 함수를 정의합니다.
+
+### 업데이트 타임스탬프 트리거
+
+```sql
+-- 업데이트 타임스탬프 함수
+CREATE OR REPLACE FUNCTION zellyy.update_timestamp()
+RETURNS TRIGGER AS $$
+BEGIN
+    NEW.updated_at = NOW();
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+-- 사용자 테이블에 트리거 적용
+CREATE TRIGGER update_users_timestamp
+BEFORE UPDATE ON zellyy.users
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_timestamp();
+
+-- 카드 테이블에 트리거 적용
+CREATE TRIGGER update_cards_timestamp
+BEFORE UPDATE ON zellyy.cards
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_timestamp();
+```
+
+### 프리미엄 상태 업데이트 함수
+
+```sql
+-- 구독 상태에 따라 사용자의 프리미엄 상태 업데이트
+CREATE OR REPLACE FUNCTION zellyy.update_premium_status()
+RETURNS TRIGGER AS $$
+BEGIN
+    IF NEW.status = 'active' THEN
+        UPDATE zellyy.users
+        SET is_premium = TRUE, premium_until = NEW.end_date
+        WHERE id = NEW.user_id;
+    ELSIF NEW.status IN ('canceled', 'expired') AND NEW.end_date <= NOW() THEN
+        UPDATE zellyy.users
+        SET is_premium = FALSE, premium_until = NULL
+        WHERE id = NEW.user_id;
+    END IF;
+    RETURN NEW;
+END;
+$$ LANGUAGE plpgsql;
+
+-- 구독 테이블에 트리거 적용
+CREATE TRIGGER update_premium_status_trigger
+AFTER INSERT OR UPDATE ON zellyy.subscriptions
+FOR EACH ROW EXECUTE FUNCTION zellyy.update_premium_status();
+```
+
+## 데이터 마이그레이션 및 초기 설정
+
+프로젝트 초기 설정을 위한 SQL 스크립트입니다.
+
+```sql
+-- 스키마 생성
+CREATE SCHEMA IF NOT EXISTS zellyy;
+
+-- UUID 확장 활성화
+CREATE EXTENSION IF NOT EXISTS "uuid-ossp";
+
+-- 테이블 생성 (위에서 정의한 모든 테이블)
+
+-- 기본 관리자 사용자 생성
+INSERT INTO zellyy.users (id, email, username, display_name, is_premium)
+VALUES ('00000000-0000-0000-0000-000000000000', 'admin@zellyy.com', 'admin', 'Zellyy Admin', TRUE);
+```
+
+## 확장성 고려사항
+
+1. **샤딩**: 사용자 수가 크게 증가할 경우, 사용자 ID를 기준으로 데이터를 샤딩하는 전략을 고려할 수 있습니다.
+
+2. **아카이빙**: 오래된 카드 데이터는 별도의 아카이브 테이블로 이동하여 주 테이블의 성능을 유지할 수 있습니다.
+
+3. **캐싱**: 자주 접근하는 데이터(예: 공개 카드, 인기 태그)는 Redis와 같은 캐시 시스템을 도입하여 성능을 향상시킬 수 있습니다.
+
+4. **읽기 복제본**: 쿼리 부하가 높아질 경우, 읽기 전용 복제본을 설정하여 부하를 분산할 수 있습니다.
+
+## 데이터 백업 전략
+
+1. **정기 백업**: 매일 전체 데이터베이스 백업을 수행합니다.
+2. **증분 백업**: 시간별 WAL(Write-Ahead Log) 백업을 통해 세부적인 복구 지점을 제공합니다.
+3. **지리적 복제**: 재해 복구를 위해 다른 지역에 백업을 저장합니다.
+
+## 결론
+
+이 데이터 모델은 Zellyy 프로젝트의 초기 요구사항을 충족하도록 설계되었습니다. 사용자 피드백과 실제 사용 패턴에 따라 모델을 지속적으로 개선하고 확장할 계획입니다.
--- a/note/02_기술_문서/시스템_아키텍처.md
+++ b/note/02_기술_문서/시스템_아키텍처.md
@@ -0,0 +1,217 @@
+# ZELLYY 시스템 아키텍처
+
+## 아키텍처 개요
+
+ZELLYY는 모바일 중심의 카드 제작 애플리케이션으로, 클라이언트-서버 아키텍처를 기반으로 설계되었습니다. 초기 MVP 단계에서는 로컬 저장소 중심으로 구현하고, 이후 클라우드 동기화 기능을 추가하는 방식으로 발전할 예정입니다.
+
+## 시스템 구성 요소
+
+### 클라이언트 애플리케이션
+
+#### 모바일 앱 (React Native)
+- **UI 레이어**: React Native 컴포넌트, 스타일링 (Styled Components)
+- **상태 관리**: Redux/Redux Toolkit, Context API
+- **네비게이션**: React Navigation
+- **로컬 저장소**: AsyncStorage, SQLite
+- **네트워크**: Axios, React Query
+- **오프라인 지원**: 로컬 캐싱, 오프라인 작업 큐
+
+#### 웹 애플리케이션 (향후 개발)
+- **프레임워크**: Next.js
+- **UI 라이브러리**: React
+- **상태 관리**: Redux/Redux Toolkit
+- **스타일링**: Tailwind CSS, Styled Components
+- **API 통신**: Axios, React Query
+
+### 백엔드 서비스
+
+#### Supabase 기반 백엔드
+- **데이터베이스**: PostgreSQL
+- **인증**: Supabase Auth (이메일, 소셜 로그인)
+- **스토리지**: Supabase Storage (이미지, 에셋 저장)
+- **실시간 기능**: Supabase Realtime (향후 협업 기능용)
+- **API**: RESTful API, GraphQL (선택적)
+
+#### 추가 서버 컴포넌트 (필요시)
+- **Node.js 서버**: 복잡한 비즈니스 로직, 서드파티 API 통합
+- **이미지 처리 서비스**: 이미지 최적화, 변환
+- **푸시 알림 서비스**: Firebase Cloud Messaging 연동
+
+### 인프라
+
+- **호스팅**: Supabase 자체 호스팅 (Debian 12 서버)
+- **CDN**: Cloudflare (정적 자산 배포)
+- **CI/CD**: GitHub Actions
+- **모니터링**: Sentry, Datadog
+- **분석**: Google Analytics, Firebase Analytics
+
+## 데이터 흐름
+
+### 기본 데이터 흐름
+1. 사용자가 모바일 앱에서 카드 제작/편집
+2. 로컬 저장소에 변경사항 저장
+3. 온라인 상태일 때 Supabase에 동기화
+4. 다른 기기에서 접속 시 Supabase에서 최신 데이터 가져오기
+
+### 오프라인 지원
+1. 오프라인 상태에서 모든 변경사항 로컬에 저장
+2. 변경사항을 작업 큐에 추가
+3. 온라인 상태가 되면 작업 큐 처리
+4. 충돌 발생 시 해결 전략 적용 (최신 타임스탬프 우선, 사용자 선택 등)
+
+## 주요 API 엔드포인트
+
+### 사용자 관리
+- `POST /auth/signup`: 회원가입
+- `POST /auth/login`: 로그인
+- `POST /auth/logout`: 로그아웃
+- `GET /auth/user`: 현재 사용자 정보 조회
+- `PUT /auth/user`: 사용자 정보 업데이트
+
+### 카드 관리
+- `GET /cards`: 사용자의 카드 목록 조회
+- `GET /cards/:id`: 특정 카드 상세 조회
+- `POST /cards`: 새 카드 생성
+- `PUT /cards/:id`: 카드 업데이트
+- `DELETE /cards/:id`: 카드 삭제
+
+### 템플릿 관리
+- `GET /templates`: 템플릿 목록 조회
+- `GET /templates/:id`: 특정 템플릿 상세 조회
+- `POST /templates`: 사용자 커스텀 템플릿 생성
+- `PUT /templates/:id`: 템플릿 업데이트
+- `DELETE /templates/:id`: 템플릿 삭제
+
+### 에셋 관리
+- `GET /assets`: 에셋(이미지, 아이콘 등) 목록 조회
+- `POST /assets`: 새 에셋 업로드
+- `DELETE /assets/:id`: 에셋 삭제
+
+## 보안 아키텍처
+
+### 인증 및 권한 관리
+- JWT 기반 인증
+- 역할 기반 접근 제어 (RBAC)
+- API 요청 제한 (Rate Limiting)
+- HTTPS 전용 통신
+
+### 데이터 보안
+- 저장 데이터 암호화 (Encryption at Rest)
+- 전송 데이터 암호화 (Encryption in Transit)
+- 민감 정보 마스킹
+- 정기적인 보안 감사
+
+## 확장성 고려사항
+
+### 수평적 확장
+- 마이크로서비스 아키텍처로의 점진적 전환 가능성
+- 서버리스 함수 활용 (AWS Lambda, Supabase Edge Functions)
+- 데이터베이스 샤딩 전략
+
+### 성능 최적화
+- 이미지 최적화 및 압축
+- CDN 활용한 정적 자산 배포
+- 캐싱 전략 (메모리 캐시, 디스크 캐시)
+- 데이터베이스 인덱싱 및 쿼리 최적화
+
+## 시스템 아키텍처 다이어그램
+
+```
+------------------+        +------------------+
+|                  |        |                  |
+|  모바일 앱        |        |  웹 애플리케이션   |
+|  (React Native)  |        |  (Next.js)       |
+|                  |        |                  |
+--------+---------+        +--------+---------+
+         |                           |
+         |                           |
+         v                           v
+------------------------------------------+
+|                                          |
+|             API Gateway                  |
+|                                          |
+------------------+---------------------+
+                   |
+                   |
+                   v
+------------------+---------------------+
+|                                        |
+|            Supabase                    |
+|                                        |
+|  +-------------+    +-------------+    |
+|  |             |    |             |    |
+|  | PostgreSQL  |    |  Storage    |    |
+|  |             |    |             |    |
+|  +-------------+    +-------------+    |
+|                                        |
+|  +-------------+    +-------------+    |
+|  |             |    |             |    |
+|  |    Auth     |    |  Realtime   |    |
+|  |             |    |             |    |
+|  +-------------+    +-------------+    |
+|                                        |
+------------------+---------------------+
+                   |
+                   |
+                   v
+------------------+---------------------+
+|                                        |
+|        추가 서비스 (필요시)              |
+|                                        |
+|  +-------------+    +-------------+    |
+|  |             |    |             |    |
+|  | Node.js     |    | 이미지 처리  |    |
+|  | 서버        |    | 서비스       |    |
+|  +-------------+    +-------------+    |
+|                                        |
+|  +-------------+    +-------------+    |
+|  |             |    |             |    |
+|  | 푸시 알림    |    | 분석 서비스  |    |
+|  | 서비스       |    |             |    |
+|  +-------------+    +-------------+    |
+|                                        |
+------------------------------------------+
+```
+
+## 기술 스택 선택 이유
+
+### React Native
+- 크로스 플랫폼 개발로 iOS와 Android 동시 지원
+- 네이티브 성능과 사용자 경험 제공
+- JavaScript/TypeScript 기반으로 개발 효율성 높음
+- 풍부한 커뮤니티와 라이브러리 생태계
+
+### Supabase
+- Firebase의 오픈소스 대안으로 자체 호스팅 가능
+- PostgreSQL 기반으로 강력한 쿼리 기능 제공
+- 인증, 스토리지, 실시간 기능 통합 제공
+- RESTful API와 GraphQL 지원
+- 확장성과 커스터마이징 용이
+
+### Redux/Redux Toolkit
+- 예측 가능한 상태 관리
+- 디버깅 및 개발 도구 지원 우수
+- 미들웨어를 통한 비동기 작업 처리 용이
+- 대규모 애플리케이션에서의 상태 관리 효율성
+
+## 향후 아키텍처 발전 계획
+
+### 1단계: MVP (로컬 중심)
+- 기본 기능 로컬 저장소 기반 구현
+- 최소한의 서버 의존성
+
+### 2단계: 클라우드 동기화
+- Supabase 연동 및 데이터 동기화
+- 사용자 인증 및 권한 관리 강화
+
+### 3단계: 협업 기능
+- 실시간 데이터 동기화
+- 팀 워크스페이스 및 공유 기능
+
+### 4단계: 웹 서비스 확장
+- Next.js 기반 웹 애플리케이션 개발
+- 모바일-웹 간 일관된 경험 제공
+
+### 5단계: AI 기능 통합
+- 디자인 추천 및 자동화
+- 콘텐츠 분석 및 최적화
--- a/note/03_UI_UX_설계/UI_UX_가이드라인.md
+++ b/note/03_UI_UX_설계/UI_UX_가이드라인.md
@@ -0,0 +1,355 @@
+# UI/UX 가이드라인
+
+이 문서는 Zellyy 앱의 사용자 인터페이스(UI) 및 사용자 경험(UX) 설계에 대한 가이드라인을 제공합니다.
+
+## 1. 디자인 원칙
+
+Zellyy 앱의 디자인은 다음 원칙을 따릅니다:
+
+### 1.1 단순함 (Simplicity)
+- 불필요한 요소를 제거하고 핵심 기능에 집중합니다.
+- 사용자가 직관적으로 이해할 수 있는 인터페이스를 제공합니다.
+
+### 1.2 일관성 (Consistency)
+- 앱 전체에 걸쳐 일관된 디자인 언어를 사용합니다.
+- 색상, 타이포그래피, 아이콘 등의 요소를 일관되게 적용합니다.
+
+### 1.3 피드백 (Feedback)
+- 사용자 행동에 대한 명확한 피드백을 제공합니다.
+- 로딩 상태, 성공/실패 메시지 등을 시각적으로 표현합니다.
+
+### 1.4 접근성 (Accessibility)
+- 다양한 사용자가 앱을 사용할 수 있도록 접근성을 고려합니다.
+- 충분한 대비, 적절한 글꼴 크기, 스크린 리더 지원 등을 제공합니다.
+
+### 1.5 효율성 (Efficiency)
+- 최소한의 단계로 작업을 완료할 수 있도록 설계합니다.
+- 자주 사용하는 기능에 쉽게 접근할 수 있도록 합니다.
+
+## 2. 브랜드 아이덴티티
+
+### 2.1 로고
+
+Zellyy 로고는 앱의 핵심 아이덴티티를 나타냅니다:
+- 정사각형 카드 형태를 기반으로 한 심플한 디자인
+- 앱 아이콘, 스플래시 화면, 마케팅 자료 등에 일관되게 사용
+
+### 2.2 색상 팔레트
+
+#### 기본 색상
+- **주 색상(Primary)**: `#4A6FFF` - 버튼, 링크, 강조 요소에 사용
+- **보조 색상(Secondary)**: `#FF6B6B` - 액션 버튼, 알림 등에 사용
+- **중립 색상(Neutral)**: `#F8F9FA` ~ `#212529` - 배경, 텍스트 등에 사용
+
+#### 기능적 색상
+- **성공(Success)**: `#40C057` - 성공 메시지, 완료 상태 등에 사용
+- **경고(Warning)**: `#FD7E14` - 주의가 필요한 상태에 사용
+- **오류(Error)**: `#FA5252` - 오류 메시지, 실패 상태 등에 사용
+- **정보(Info)**: `#339AF0` - 정보성 메시지에 사용
+
+### 2.3 타이포그래피
+
+#### 기본 글꼴
+- **iOS**: San Francisco
+- **Android**: Roboto
+- **웹**: Inter 또는 시스템 기본 글꼴
+
+#### 글꼴 크기
+- **헤더 1**: 24sp/px
+- **헤더 2**: 20sp/px
+- **헤더 3**: 18sp/px
+- **본문 텍스트**: 16sp/px
+- **보조 텍스트**: 14sp/px
+- **작은 텍스트**: 12sp/px
+
+#### 글꼴 두께
+- **Regular**: 400
+- **Medium**: 500
+- **Bold**: 700
+
+### 2.4 아이콘
+
+- 라인 스타일의 심플한 아이콘 사용
+- 일관된 스트로크 두께와 스타일 유지
+- 의미가 명확하고 인식하기 쉬운 아이콘 선택
+
+## 3. 레이아웃 및 그리드 시스템
+
+### 3.1 기본 그리드
+
+- 8포인트 그리드 시스템 사용
+- 모든 간격, 패딩, 마진은 8의 배수(8, 16, 24, 32, ...)로 설정
+- 요소 간 일관된 간격 유지
+
+### 3.2 카드 레이아웃
+
+- 카드는 기본적으로 정사각형 형태 (1:1 비율)
+- 그리드 뷰에서는 화면 너비에 따라 2열 또는 3열로 표시
+- 카드 간 간격: 16px
+
+### 3.3 화면 패딩
+
+- 기본 화면 좌우 패딩: 16px
+- 콘텐츠 영역 상하 패딩: 16px
+- 섹션 간 간격: 24px
+
+## 4. 컴포넌트 가이드라인
+
+### 4.1 버튼
+
+#### 기본 버튼
+- 높이: 48px
+- 패딩: 좌우 16px
+- 테두리 반경: 8px
+- 텍스트: 16px, Medium
+
+#### 버튼 상태
+- **기본(Default)**: 주 색상 배경, 흰색 텍스트
+- **비활성화(Disabled)**: 회색 배경, 어두운 회색 텍스트
+- **누름(Pressed)**: 어두운 주 색상 배경, 흰색 텍스트
+
+#### 버튼 종류
+- **기본 버튼(Primary)**: 주 색상 배경, 흰색 텍스트
+- **보조 버튼(Secondary)**: 흰색 배경, 주 색상 테두리, 주 색상 텍스트
+- **텍스트 버튼(Text)**: 배경 없음, 주 색상 텍스트
+
+### 4.2 입력 필드
+
+- 높이: 56px
+- 패딩: 좌우 16px, 상하 12px
+- 테두리 반경: 8px
+- 테두리 색상: 중립 색상
+- 포커스 상태: 주 색상 테두리
+- 오류 상태: 오류 색상 테두리, 오류 메시지 표시
+
+### 4.3 카드 컴포넌트
+
+- 크기: 화면 너비에 따라 조정 (기본적으로 정사각형)
+- 테두리 반경: 12px
+- 그림자: 약한 그림자 효과
+- 배경색: 사용자 설정 또는 기본 흰색
+- 텍스트 색상: 사용자 설정 또는 기본 검정색
+- 패딩: 16px
+
+### 4.4 탭 바
+
+- 높이: 56px
+- 아이콘 크기: 24px
+- 레이블 텍스트: 12px, Regular
+- 활성 상태: 주 색상 아이콘 및 텍스트
+- 비활성 상태: 중립 색상 아이콘 및 텍스트
+
+### 4.5 모달 및 다이얼로그
+
+- 테두리 반경: 16px
+- 패딩: 24px
+- 배경색: 흰색
+- 그림자: 중간 강도의 그림자 효과
+- 제목: 20px, Bold
+- 내용: 16px, Regular
+- 버튼 정렬: 우측 또는 중앙 정렬
+
+## 5. 화면별 설계
+
+### 5.1 온보딩 화면
+
+- 간결한 일러스트레이션과 짧은 텍스트로 핵심 기능 소개
+- 최대 3-4개 화면으로 제한
+- 건너뛰기 옵션 제공
+- 마지막 화면에 시작하기/로그인 버튼 배치
+
+### 5.2 인증 화면
+
+#### 로그인 화면
+- 이메일/비밀번호 입력 필드
+- 소셜 로그인 옵션
+- 비밀번호 찾기 링크
+- 회원가입 링크
+
+#### 회원가입 화면
+- 이메일, 비밀번호, 사용자 이름 입력 필드
+- 약관 동의 체크박스
+- 소셜 회원가입 옵션
+
+### 5.3 홈 화면
+
+- 상단에 앱 로고 및 검색 버튼
+- 카드 생성 버튼 (플로팅 액션 버튼)
+- 카드 그리드 또는 리스트 뷰
+- 필터링 및 정렬 옵션
+
+### 5.4 카드 작성 화면
+
+- 전체 화면 편집기
+- 상단에 취소 및 저장 버튼
+- 텍스트 입력 영역
+- 하단에 스타일링 옵션 (배경색, 텍스트 색상, 폰트 등)
+- 공개/비공개 설정 토글
+- 태그 추가 옵션
+
+### 5.5 카드 상세 화면
+
+- 카드 전체 보기
+- 하단에 편집, 삭제, 공유 버튼
+- 생성 날짜 및 태그 정보
+- 공유 기록 (있는 경우)
+
+### 5.6 프로필 화면
+
+- 사용자 정보 (이름, 프로필 이미지)
+- 통계 정보 (카드 수, 공유 수 등)
+- 설정 메뉴
+- 구독 상태 및 관리 옵션
+
+### 5.7 설정 화면
+
+- 계정 설정
+- 알림 설정
+- 테마 설정
+- 소셜 계정 연동 관리
+- 구독 관리
+- 로그아웃 및 계정 삭제 옵션
+
+## 6. 상호작용 및 애니메이션
+
+### 6.1 전환 애니메이션
+
+- 화면 전환: 부드러운 슬라이드 또는 페이드 효과
+- 모달 표시: 페이드 인 및 스케일 효과
+- 전환 시간: 300ms (기본)
+
+### 6.2 피드백 애니메이션
+
+- 버튼 누름: 스케일 다운 효과 (95%)
+- 카드 선택: 약간의 확대 및 그림자 강화
+- 스와이프 제스처: 부드러운 따라오기 효과
+
+### 6.3 로딩 상태
+
+- 스켈레톤 로딩 UI 사용
+- 진행 상태가 명확한 로딩 인디케이터
+- 긴 작업의 경우 진행률 표시
+
+### 6.4 제스처
+
+- 카드 스와이프: 좌우 스와이프로 카드 간 이동
+- 당겨서 새로고침: 목록 화면에서 당겨서 새로고침
+- 길게 누르기: 카드에 대한 추가 옵션 표시
+
+## 7. 반응형 디자인
+
+### 7.1 모바일 화면 (< 600px)
+
+- 카드 그리드: 2열
+- 하단 탭 바 네비게이션
+- 간소화된 UI 요소
+
+### 7.2 태블릿 화면 (600px ~ 1024px)
+
+- 카드 그리드: 3열 또는 4열
+- 사이드 네비게이션 + 하단 탭 바 (가로 모드)
+- 분할 화면 레이아웃 지원
+
+### 7.3 데스크톱 화면 (> 1024px)
+
+- 카드 그리드: 4열 이상
+- 사이드 네비게이션
+- 고급 편집 기능 및 키보드 단축키 지원
+
+## 8. 접근성 가이드라인
+
+### 8.1 색상 대비
+
+- 텍스트와 배경 간 최소 대비율: 4.5:1
+- 중요 텍스트와 배경 간 최소 대비율: 7:1
+- 색상만으로 정보를 구분하지 않음
+
+### 8.2 터치 타겟
+
+- 최소 터치 영역: 44px x 44px
+- 터치 요소 간 최소 간격: 8px
+
+### 8.3 스크린 리더 지원
+
+- 모든 이미지에 대체 텍스트 제공
+- 의미 있는 요소에 적절한 레이블 제공
+- 논리적인 포커스 순서 유지
+
+### 8.4 키보드 네비게이션
+
+- 모든 기능을 키보드로 접근 가능하도록 설계
+- 포커스 상태를 시각적으로 명확하게 표시
+- 논리적인 탭 순서 유지
+
+## 9. 다크 모드
+
+### 9.1 색상 조정
+
+- **배경색**: 
+  - 라이트 모드: `#FFFFFF`
+  - 다크 모드: `#121212`
+  
+- **텍스트 색상**:
+  - 라이트 모드: `#212529`
+  - 다크 모드: `#E9ECEF`
+  
+- **주 색상**:
+  - 라이트 모드: `#4A6FFF`
+  - 다크 모드: `#738FFE`
+
+### 9.2 그림자 및 구분선
+
+- 다크 모드에서는 그림자 대신 약간 밝은 배경색으로 구분
+- 구분선 색상 조정하여 가시성 유지
+
+### 9.3 이미지 및 아이콘
+
+- 아이콘은 다크 모드에 맞게 색상 반전
+- 이미지에 다크 모드용 대체 버전 제공 (필요한 경우)
+
+## 10. 에러 상태 및 빈 상태
+
+### 10.1 에러 상태
+
+- 명확한 오류 메시지 제공
+- 문제 해결을 위한 행동 지침 제공
+- 친근하고 이해하기 쉬운 언어 사용
+- 시각적 아이콘으로 오류 유형 표시
+
+### 10.2 빈 상태
+
+- 데이터가 없는 화면에 적절한 안내 메시지 표시
+- 시작하기 위한 행동 유도 (CTA) 제공
+- 간단한 일러스트레이션으로 빈 상태 시각화
+
+## 11. 마이크로인터랙션
+
+### 11.1 피드백 마이크로인터랙션
+
+- 카드 저장 시 성공 애니메이션
+- 공유 완료 시 축하 효과
+- 오류 발생 시 주의 효과
+
+### 11.2 상태 변화 마이크로인터랙션
+
+- 토글 스위치 전환 애니메이션
+- 드롭다운 메뉴 펼침/접힘 효과
+- 탭 전환 시 부드러운 인디케이터 이동
+
+## 12. 테스트 및 검증
+
+### 12.1 사용성 테스트
+
+- 프로토타입을 사용한 사용자 테스트 진행
+- 핵심 사용자 흐름에 대한 태스크 완료율 측정
+- 사용자 피드백 수집 및 분석
+
+### 12.2 A/B 테스트
+
+- 중요한 UI 요소에 대한 A/B 테스트 진행
+- 데이터 기반 디자인 의사 결정
+- 지속적인 개선 사이클 유지
+
+## 결론
+
+이 UI/UX 가이드라인은 Zellyy 앱의 일관된 사용자 경험을 위한 기준을 제공합니다. 디자인 과정에서 이 가이드라인을 참조하여 사용자 중심의 직관적이고 매력적인 인터페이스를 구현하세요. 프로젝트가 발전함에 따라 이 가이드라인도 지속적으로 업데이트될 예정입니다.
--- a/note/03_UI_UX_설계/UI_와이어프레임_추가화면.md
+++ b/note/03_UI_UX_설계/UI_와이어프레임_추가화면.md
@@ -0,0 +1,422 @@
+# Zellyy - UI 와이어프레임 (추가 화면)
+
+## 1. 온보딩 화면
+
+```
+----------------------------------+
+|                [건너뛰기]        |
+----------------------------------+
+|                                  |
+|                                  |
+|         [일러스트레이션]         |
+|                                  |
+|                                  |
+|                                  |
+|       나만의 카드 만들기         |
+|                                  |
+|   원하는 내용을 담은 카드를      |
+|   쉽고 빠르게 만들어보세요.      |
+|                                  |
+|                                  |
+|                                  |
+|                                  |
+|  [○] [○] [●] [○]  (페이지 인디케이터) |
+|                                  |
+|  [이전]           [다음]         |
+|                                  |
+----------------------------------+
+
+----------------------------------+
+|                [건너뛰기]        |
+----------------------------------+
+|                                  |
+|                                  |
+|         [일러스트레이션]         |
+|                                  |
+|                                  |
+|                                  |
+|       카드 공유하기             |
+|                                  |
+|   만든 카드를 친구들과 공유하고  |
+|   소통해보세요.                 |
+|                                  |
+|                                  |
+|                                  |
+|                                  |
+|  [○] [○] [○] [●]  (페이지 인디케이터) |
+|                                  |
+|  [이전]        [시작하기]        |
+|                                  |
+----------------------------------+
+```
+
+## 2. 알림 화면
+
+```
+----------------------------------+
+|  [뒤로]       알림              |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]님이 회원님의 |  |
+|  |  카드를 좋아합니다.         |  |
+|  |  2시간 전                   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]님이 회원님을 |  |
+|  |  팔로우했습니다.            |  |
+|  |  5시간 전                   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [시스템 아이콘]           |  |
+|  |  회원님의 카드가 인기 카드에 |  |
+|  |  선정되었습니다.            |  |
+|  |  어제                       |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]님이 회원님의 |  |
+|  |  카드에 댓글을 남겼습니다.   |  |
+|  |  어제                       |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]님이 회원님의 |  |
+|  |  카드를 공유했습니다.       |  |
+|  |  2일 전                     |  |
+|  +----------------------------+  |
+|                                  |
+|  [더 불러오기]                   |
+|                                  |
+----------------------------------+
+|  [홈]  [검색]  [+]  [보관함]  [프로필] |
+----------------------------------+
+```
+
+## 3. 카드 보관함 화면
+
+```
+----------------------------------+
+|  [뒤로]      보관함             |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |       보관함 필터          |  |
+|  |                            |  |
+|  |  [전체] [생성] [저장] [좋아요] |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       정렬 기준           |  |
+|  |                            |  |
+|  |  [최신순 ▼]                |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       카드 보기 방식       |  |
+|  |                            |  |
+|  |  [그리드 ◉] [리스트 ◯]     |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |  [그리드 형태로 카드 표시]  |  |
+|  |                            |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |  |     | |     | |     |   |  |
+|  |  |  1  | |  2  | |  3  |   |  |
+|  |  |     | |     | |     |   |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |                            |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |  |     | |     | |     |   |  |
+|  |  |  4  | |  5  | |  6  |   |  |
+|  |  |     | |     | |     |   |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |                            |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |  |     | |     | |     |   |  |
+|  |  |  7  | |  8  | |  9  |   |  |
+|  |  |     | |     | |     |   |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  [더 불러오기]                   |
+|                                  |
+----------------------------------+
+|  [홈]  [검색]  [+]  [보관함]  [프로필] |
+----------------------------------+
+```
+
+## 4. 설정 화면
+
+```
+----------------------------------+
+|  [뒤로]       설정              |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |       계정 설정           |  |
+|  |                            |  |
+|  |  프로필 편집    >          |  |
+|  |  비밀번호 변경  >          |  |
+|  |  개인정보 설정  >          |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       알림 설정           |  |
+|  |                            |  |
+|  |  푸시 알림      [켜기 ◉]   |  |
+|  |  이메일 알림    [켜기 ◯]   |  |
+|  |  알림 유형 설정  >         |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       앱 설정             |  |
+|  |                            |  |
+|  |  테마          [라이트 ▼]  |  |
+|  |  언어          [한국어 ▼]  |  |
+|  |  자동 재생     [켜기 ◉]    |  |
+|  |  데이터 사용    >          |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       지원 및 정보         |  |
+|  |                            |  |
+|  |  도움말 센터    >          |  |
+|  |  이용약관      >           |  |
+|  |  개인정보처리방침 >        |  |
+|  |  앱 버전       v1.0.0      |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |        로그아웃           |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |       계정 삭제           |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+```
+
+## 5. 카드 공유 화면
+
+```
+----------------------------------+
+|  [뒤로]      카드 공유          |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |      [카드 미리보기]       |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  공유 옵션:                      |
+|                                  |
+|  +----------------------------+  |
+|  |       소셜 미디어          |  |
+|  |                            |  |
+|  |  [인스타] [페이스북] [트위터] |  |
+|  |  [카카오]  [라인]  [기타]   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       직접 공유            |  |
+|  |                            |  |
+|  |  [링크 복사]  [QR 코드]    |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       공유 설정            |  |
+|  |                            |  |
+|  |  공개 범위:                |  |
+|  |  [전체 공개 ◉] [친구만 ◯]  |  |
+|  |                            |  |
+|  |  댓글 허용:                |  |
+|  |  [허용 ◉] [비허용 ◯]       |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |         공유하기           |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+```
+
+## 6. 댓글 화면
+
+```
+----------------------------------+
+|  [뒤로]      댓글 (23)          |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  정말 멋진 카드네요! 저도   |  |
+|  |  이런 카드 만들고 싶어요.   |  |
+|  |  2시간 전  [좋아요] [답글]  |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  어떤 도구로 만드셨나요?    |  |
+|  |  5시간 전  [좋아요] [답글]  |  |
+|  |                            |  |
+|  |  +------------------------+|  |
+|  |  |  [사용자 아이콘]       ||  |
+|  |  |  [작성자 이름]         ||  |
+|  |  |  Zellyy 앱으로 만들었어요!||  |
+|  |  |  3시간 전  [좋아요]    ||  |
+|  |  +------------------------+|  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  색상 조합이 정말 좋네요.   |  |
+|  |  어제  [좋아요] [답글]      |  |
+|  +----------------------------+  |
+|                                  |
+|  [더 불러오기]                   |
+|                                  |
+----------------------------------+
+|  +----------------------------+  |
+|  |  [댓글 입력]     [전송]    |  |
+|  +----------------------------+  |
+----------------------------------+
+```
+
+## 7. 카드 템플릿 선택 화면
+
+```
+----------------------------------+
+|  [뒤로]     템플릿 선택         |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |       템플릿 카테고리      |  |
+|  |                            |  |
+|  |  [전체] [인기] [최신] [저장됨] |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |  |     | |     | |     |   |  |
+|  |  |  T1 | |  T2 | |  T3 |   |  |
+|  |  |     | |     | |     |   |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |                            |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |  |     | |     | |     |   |  |
+|  |  |  T4 | |  T5 | |  T6 |   |  |
+|  |  |     | |     | |     |   |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |                            |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |  |     | |     | |     |   |  |
+|  |  |  T7 | |  T8 | |  T9 |   |  |
+|  |  |     | |     | |     |   |  |
+|  |  +-----+ +-----+ +-----+   |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  [더 불러오기]                   |
+|                                  |
+----------------------------------+
+|  [빈 카드]      [선택하기]       |
+----------------------------------+
+```
+
+## 8. 팔로워/팔로잉 화면
+
+```
+----------------------------------+
+|  [뒤로]    팔로워 (125)         |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |  [검색어 입력]    [검색]   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  [사용자 소개]              |  |
+|  |  [팔로우 중 ◉] [팔로우 ◯]  |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  [사용자 소개]              |  |
+|  |  [팔로우 중 ◉] [팔로우 ◯]  |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  [사용자 소개]              |  |
+|  |  [팔로우 중 ◉] [팔로우 ◯]  |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |  [사용자 아이콘]           |  |
+|  |  [사용자 이름]              |  |
+|  |  [사용자 소개]              |  |
+|  |  [팔로우 중 ◉] [팔로우 ◯]  |  |
+|  +----------------------------+  |
+|                                  |
+|  [더 불러오기]                   |
+|                                  |
+----------------------------------+
+```
+
+## 디자인 노트
+
+### 1. 온보딩 화면
+- 사용자가 앱을 처음 실행할 때 핵심 기능을 소개하는 화면
+- 간결한 일러스트레이션과 짧은 텍스트로 핵심 기능 소개
+- 최대 4개 화면으로 제한하여 사용자 피로도 최소화
+- 건너뛰기 옵션 제공으로 사용자 선택권 보장
+
+### 2. 알림 화면
+- 사용자 활동과 관련된 모든 알림을 시간순으로 표시
+- 알림 유형별 아이콘으로 시각적 구분 제공
+- 각 알림은 관련 화면으로 직접 이동할 수 있는 링크 역할
+- 읽지 않은 알림은 시각적으로 구분 (배경색 또는 표시)
+
+### 3. 카드 보관함
+- 사용자가 생성, 저장, 좋아요한 모든 카드를 관리하는 중앙 허브
+- 필터링과 정렬 옵션으로 원하는 카드 쉽게 찾기 가능
+- 그리드/리스트 뷰 전환으로 사용자 선호에 맞는 보기 방식 제공
+- 길게 누르기로 다중 선택 및 일괄 작업 지원 (삭제, 공유 등)
+
+### 4. 설정 화면
+- 논리적으로 그룹화된 설정 옵션으로 쉬운 탐색
+- 토글 스위치와 드롭다운 메뉴로 직관적인 조작
+- 중요 설정(로그아웃, 계정 삭제)은 시각적으로 분리하여 실수 방지
+- 각 설정 항목은 충분한 터치 영역 확보
+
+### 5. 접근성 고려사항
+- 모든 인터랙티브 요소는 최소 44x44dp 크기 유지
+- 색상만으로 정보를 구분하지 않고 아이콘, 텍스트 등 보조 요소 활용
+- 스크린 리더 호환성을 위한 적절한 레이블 제공
+- 키보드 네비게이션 지원으로 모든 기능 접근 가능
--- a/note/03_UI_UX_설계/UI_와이어프레임_핵심화면.md
+++ b/note/03_UI_UX_설계/UI_와이어프레임_핵심화면.md
@@ -0,0 +1,362 @@
+# Zellyy - UI 와이어프레임 (핵심 화면)
+
+## 1. 로그인/회원가입 화면
+
+```
+----------------------------------+
+|                                  |
+|            [로고 이미지]           |
+|                                  |
+|             ZELLYY              |
+|                                  |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |      이메일 주소 입력       |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       비밀번호 입력        |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |          로그인           |  |
+|  +----------------------------+  |
+|                                  |
+|  비밀번호를 잊으셨나요?  [찾기]   |
+|                                  |
+|  --------- 또는 ---------        |
+|                                  |
+|  +----------------------------+  |
+|  |      소셜 로그인 버튼      |  |
+|  +----------------------------+  |
+|                                  |
+|  계정이 없으신가요?  [회원가입]   |
+|                                  |
+----------------------------------+
+
+----------------------------------+
+|                                  |
+|          회원가입 화면           |
+|                                  |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |         이름 입력          |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |      이메일 주소 입력       |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       비밀번호 입력        |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |     비밀번호 확인 입력     |  |
+|  +----------------------------+  |
+|                                  |
+|  [  ] 이용약관에 동의합니다      |
+|  [  ] 개인정보 처리방침에 동의합니다 |
+|                                  |
+|  +----------------------------+  |
+|  |        회원가입           |  |
+|  +----------------------------+  |
+|                                  |
+|  이미 계정이 있으신가요?  [로그인] |
+|                                  |
+----------------------------------+
+```
+
+## 2. 메인 대시보드 화면
+
+```
+----------------------------------+
+|  [메뉴]    대시보드    [알림]    |
+----------------------------------+
+|                                  |
+|  안녕하세요, [사용자 이름]님!     |
+|                                  |
+|  +----------------------------+  |
+|  |       카드 생성하기        |  |
+|  |                            |  |
+|  |  [+ 새 카드 만들기]        |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |     최근 생성한 카드       |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [카드 내용 1]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [카드 내용 2]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  [더 보기 >]               |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |     인기 있는 카드         |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [인기 카드 1]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [인기 카드 2]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  [더 보기 >]               |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+|  [홈]  [검색]  [+]  [보관함]  [프로필] |
+----------------------------------+
+```
+
+## 3. 카드 생성 화면
+
+```
+----------------------------------+
+|  [뒤로]    카드 생성    [저장]   |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |                            |  |
+|  |                            |  |
+|  |       [카드 편집 영역]      |  |
+|  |                            |  |
+|  |                            |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       배경색 선택          |  |
+|  |  [색상1] [색상2] [색상3]   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       텍스트 스타일        |  |
+|  |  [B] [I] [U] [A] [크기▼]   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       텍스트 색상          |  |
+|  |  [색상1] [색상2] [색상3]   |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       태그 추가            |  |
+|  |  [입력 필드] [추가]        |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       공개 설정            |  |
+|  |  [공개 ◯] [비공개 ◉]      |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+|  [템플릿] [텍스트] [이미지] [공유] |
+----------------------------------+
+```
+
+## 4. 카드 상세 화면
+
+```
+----------------------------------+
+|  [뒤로]    카드 상세    [메뉴]   |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |                            |  |
+|  |                            |  |
+|  |                            |  |
+|  |       [카드 내용 표시]      |  |
+|  |                            |  |
+|  |                            |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+|  작성자: [사용자 이름]           |
+|  작성일: 2025년 2월 27일         |
+|  태그: #태그1 #태그2             |
+|                                  |
+|  +----------------------------+  |
+|  |       공유 정보            |  |
+|  |  조회수: 125회             |  |
+|  |  좋아요: 45개              |  |
+|  |  공유: 12회                |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       관련 카드            |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [관련 카드 1]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [관련 카드 2]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+|  [좋아요] [댓글] [저장] [공유]   |
+----------------------------------+
+```
+
+## 5. 검색 화면
+
+```
+----------------------------------+
+|  [뒤로]       검색              |
+----------------------------------+
+|                                  |
+|  +----------------------------+  |
+|  |  [검색어 입력]    [검색]   |  |
+|  +----------------------------+  |
+|                                  |
+|  인기 검색어:                    |
+|  #여행 #요리 #독서 #영화 #음악   |
+|                                  |
+|  +----------------------------+  |
+|  |       검색 필터           |  |
+|  |                            |  |
+|  |  [✓] 전체                  |  |
+|  |  [ ] 카드                  |  |
+|  |  [ ] 사용자                |  |
+|  |  [ ] 태그                  |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       검색 결과           |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [검색 결과 1]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [검색 결과 2]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  +---------------------+   |  |
+|  |  |                     |   |  |
+|  |  |   [검색 결과 3]     |   |  |
+|  |  |                     |   |  |
+|  |  +---------------------+   |  |
+|  |                            |  |
+|  |  [더 불러오기]             |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+|  [홈]  [검색]  [+]  [보관함]  [프로필] |
+----------------------------------+
+```
+
+## 6. 프로필 화면
+
+```
+----------------------------------+
+|  [뒤로]     내 프로필    [설정]  |
+----------------------------------+
+|                                  |
+|       [프로필 이미지]            |
+|       [사용자 이름]              |
+|       [사용자 소개]              |
+|                                  |
+|  팔로워: 125  |  팔로잉: 78      |
+|                                  |
+|  +----------------------------+  |
+|  |       내 통계             |  |
+|  |                            |  |
+|  |  카드: 45개                |  |
+|  |  좋아요 받은 수: 230개     |  |
+|  |  조회수: 1,250회           |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       내 카드             |  |
+|  |                            |  |
+|  |  [그리드 형태로 카드 표시]  |  |
+|  |                            |  |
+|  |  [더 보기 >]               |  |
+|  +----------------------------+  |
+|                                  |
+|  +----------------------------+  |
+|  |       저장한 카드          |  |
+|  |                            |  |
+|  |  [그리드 형태로 카드 표시]  |  |
+|  |                            |  |
+|  |  [더 보기 >]               |  |
+|  +----------------------------+  |
+|                                  |
+----------------------------------+
+|  [홈]  [검색]  [+]  [보관함]  [프로필] |
+----------------------------------+
+```
+
+## 디자인 노트
+
+### 1. 색상 팔레트
+- **주요 색상**: #4A6FFF (파란색) - 앱의 주요 브랜드 색상
+- **보조 색상**: #FF6B6B (빨간색) - 액션 버튼, 알림 등
+- **중립 색상**: #F8F9FA ~ #212529 - 배경, 텍스트 등
+- **기능적 색상**:
+  - 성공: #40C057 - 성공 메시지, 완료 상태
+  - 경고: #FD7E14 - 주의 필요 상태
+  - 오류: #FA5252 - 오류 메시지, 실패 상태
+  - 정보: #339AF0 - 정보성 메시지
+
+### 2. 타이포그래피
+- **주요 폰트**: 
+  - iOS: San Francisco
+  - Android: Roboto
+  - 웹: Inter 또는 시스템 기본 글꼴
+- **크기 계층**:
+  - 헤더 1: 24sp/px
+  - 헤더 2: 20sp/px
+  - 헤더 3: 18sp/px
+  - 본문 텍스트: 16sp/px
+  - 보조 텍스트: 14sp/px
+  - 작은 텍스트: 12sp/px
+
+### 3. 아이콘 및 시각적 요소
+- 라인 스타일의 심플한 아이콘 사용
+- 카드는 기본적으로 정사각형 형태 (1:1 비율)
+- 그리드 뷰에서는 화면 너비에 따라 2열 또는 3열로 표시
+- 카드 간 간격: 16px
+
+### 4. 사용자 경험 고려사항
+- 한 손 조작을 위한 하단 탭 바 디자인
+- 카드 생성을 위한 플로팅 액션 버튼(+)
+- 카드 스와이프 제스처로 추가 작업 접근 (수정, 삭제 등)
+- 화면 전환: 부드러운 슬라이드 또는 페이드 효과
+
+### 5. 접근성 고려사항
+- 텍스트와 배경 간 최소 대비율: 4.5:1
+- 중요 텍스트와 배경 간 최소 대비율: 7:1
+- 최소 터치 영역: 44px x 44px
+- 터치 요소 간 최소 간격: 8px
+- 다크 모드 지원
--- a/note/03_UI_UX_설계/index.md
+++ b/note/03_UI_UX_설계/index.md
@@ -0,0 +1,39 @@
+# ZELLYY UI/UX 설계
+
+## 목차
+
+1. [UI/UX 가이드라인](UI_UX_가이드라인.md)
+2. [UI 와이어프레임 핵심화면](1.%20Project/2.%20ZELLYY/젤리의%20노트/03_UI_UX_설계/UI_와이어프레임_핵심화면.md)
+3. [UI 와이어프레임 추가화면](1.%20Project/2.%20ZELLYY/젤리의%20노트/03_UI_UX_설계/UI_와이어프레임_추가화면.md)
+4. [사용자 스토리](1.%20Project/2.%20ZELLYY/젤리의%20노트/03_UI_UX_설계/사용자_스토리.md)
+5. [사용자 페르소나](1.%20Project/2.%20ZELLYY/젤리의%20노트/03_UI_UX_설계/사용자_페르소나.md)
+
+## UI/UX 설계 개요
+
+ZELLYY 프로젝트의 UI/UX 설계는 사용자 중심 디자인 원칙을 기반으로, 직관적이고 효율적인 사용자 경험을 제공하는 것을 목표로 합니다. 모바일 환경에 최적화된 인터페이스와 워크플로우를 설계하여, 사용자가 최소한의 단계로 원하는 작업을 완료할 수 있도록 합니다.
+
+## 주요 문서
+
+- **UI/UX 가이드라인**: 디자인 원칙, 색상 팔레트, 타이포그래피, 컴포넌트 등 디자인 시스템을 정의한 문서
+- **UI 와이어프레임 핵심화면**: 앱의 핵심 화면(홈, 에디터, 갤러리 등)의 와이어프레임
+- **UI 와이어프레임 추가화면**: 보조 화면(설정, 프로필, 알림 등)의 와이어프레임
+- **사용자 스토리**: 사용자 관점에서의 주요 기능 및 가치 정의
+- **사용자 페르소나**: ZELLYY의 주요 타겟 사용자 유형과 특성
+
+## 디자인 원칙
+
+1. **단순함(Simplicity)**: 복잡한 기능을 단순한 인터페이스로 제공하여 사용자의 인지 부하 최소화
+2. **직관성(Intuitiveness)**: 사용자가 별도의 학습 없이도 앱을 사용할 수 있도록 직관적인 디자인 적용
+3. **효율성(Efficiency)**: 최소한의 탭과 제스처로 작업을 완료할 수 있는 효율적인 워크플로우 설계
+4. **일관성(Consistency)**: 모든 화면과 기능에서 일관된 디자인 언어와 상호작용 패턴 유지
+5. **피드백(Feedback)**: 사용자 행동에 대한 명확한 시각적, 촉각적 피드백 제공
+
+## 디자인 프로세스
+
+1. **리서치 및 분석**: 사용자 니즈, 경쟁 앱 분석, 트렌드 조사
+2. **아이디어 발상**: 디자인 컨셉 및 방향성 설정
+3. **와이어프레임 제작**: 주요 화면 및 사용자 흐름 설계
+4. **프로토타입 개발**: 인터랙티브 프로토타입 제작
+5. **사용성 테스트**: 실제 사용자 대상 테스트 및 피드백 수집
+6. **디자인 개선**: 테스트 결과를 반영한 디자인 개선
+7. **최종 디자인 전달**: 개발팀에 최종 디자인 및 가이드라인 전달
--- a/note/03_UI_UX_설계/사용자_스토리.md
+++ b/note/03_UI_UX_설계/사용자_스토리.md
@@ -0,0 +1,273 @@
+# Zellyy 사용자 스토리
+
+## 1. 사용자 등록 및 온보딩
+
+### 1.1 신규 사용자 등록
+- **스토리**: 사용자로서, 나는 앱에 가입하여 개인 계정을 만들고 싶다.
+- **인수 기준**:
+  - 이메일, 소셜 미디어 계정(구글, 페이스북, 애플)으로 가입 가능
+  - 필수 정보(이름, 이메일, 비밀번호) 입력 후 계정 생성
+  - 개인정보 처리방침 및 이용약관 동의 절차 포함
+  - 가입 완료 후 확인 이메일 발송
+
+### 1.2 온보딩 경험
+- **스토리**: 신규 사용자로서, 나는 앱의 주요 기능을 빠르게 이해하고 사용 방법을 배우고 싶다.
+- **인수 기준**:
+  - 핵심 기능을 소개하는 4단계 이하의 온보딩 화면 제공
+  - 각 화면은 하나의 핵심 기능에 집중하여 설명
+  - 온보딩 건너뛰기 옵션 제공
+  - 마지막 단계에서 사용자 프로필 설정 안내
+
+### 1.3 로그인 및 인증
+- **스토리**: 기존 사용자로서, 나는 쉽고 안전하게 내 계정에 로그인하고 싶다.
+- **인수 기준**:
+  - 이메일/비밀번호 또는 소셜 미디어 계정으로 로그인
+  - 비밀번호 재설정 기능 제공
+  - 생체인식(지문, 얼굴인식) 로그인 지원
+  - 자동 로그인 옵션 제공
+
+## 2. 카드 생성 및 편집
+
+### 2.1 새 카드 생성
+- **스토리**: 사용자로서, 나는 새로운 카드를 쉽고 빠르게 생성하고 싶다.
+- **인수 기준**:
+  - 홈 화면에서 1-2단계 내에 카드 생성 시작 가능
+  - 빈 카드 또는 템플릿 선택 옵션 제공
+  - 카드 생성 중 자동 저장 기능
+  - 카드 생성 취소 시 확인 메시지 표시
+
+### 2.2 템플릿 사용
+- **스토리**: 사용자로서, 나는 다양한 템플릿을 활용해 전문적인 카드를 빠르게 만들고 싶다.
+- **인수 기준**:
+  - 카테고리별로 정리된 템플릿 라이브러리 제공
+  - 인기/최신/저장된 템플릿 필터링 옵션
+  - 템플릿 미리보기 및 상세 정보 확인 가능
+  - 선택한 템플릿 기반으로 쉽게 커스터마이징 가능
+
+### 2.3 텍스트 편집
+- **스토리**: 사용자로서, 나는 카드의 텍스트를 내 필요에 맞게 편집하고 스타일링하고 싶다.
+- **인수 기준**:
+  - 텍스트 추가, 수정, 삭제 기능
+  - 글꼴, 크기, 색상, 정렬, 강조(굵게, 기울임, 밑줄) 옵션
+  - 텍스트 블록 이동 및 크기 조절 가능
+  - 여러 텍스트 스타일 프리셋 제공
+
+### 2.4 시각적 요소 편집
+- **스토리**: 사용자로서, 나는 카드의 배경, 색상, 이미지 등을 조정하여 시각적으로 매력적인 카드를 만들고 싶다.
+- **인수 기준**:
+  - 다양한 배경 색상, 그라데이션, 패턴 옵션
+  - 이미지 추가, 크기 조절, 필터 적용 기능
+  - 아이콘 및 스티커 라이브러리 제공
+  - 레이아웃 조정 및 요소 정렬 도구
+
+### 2.5 카드 저장 및 관리
+- **스토리**: 사용자로서, 나는 내가 만든 카드를 저장하고 나중에 쉽게 찾아 편집하고 싶다.
+- **인수 기준**:
+  - 카드 제목 및 태그 설정 기능
+  - 카드 저장 시 성공 메시지 표시
+  - 저장된 카드는 보관함에서 확인 가능
+  - 카드 복제, 이동, 삭제 기능 제공
+
+## 3. 카드 공유 및 소셜 기능
+
+### 3.1 카드 공유
+- **스토리**: 사용자로서, 나는 내가 만든 카드를 다양한 플랫폼에 쉽게 공유하고 싶다.
+- **인수 기준**:
+  - 주요 소셜 미디어 플랫폼으로 직접 공유 기능
+  - 링크 복사 및 QR 코드 생성 옵션
+  - 이미지 형식으로 저장 기능
+  - 공유 시 공개 범위 설정 가능
+
+### 3.2 공개 설정
+- **스토리**: 사용자로서, 나는 내 카드의 공개 범위를 제어하고 싶다.
+- **인수 기준**:
+  - 전체 공개/친구만/비공개 옵션 제공
+  - 카드별로 다른 공개 설정 가능
+  - 공개 설정 변경 시 확인 메시지 표시
+  - 기본 공개 설정 지정 기능
+
+### 3.3 좋아요 및 댓글
+- **스토리**: 사용자로서, 나는 다른 사용자의 카드에 반응하고 소통하고 싶다.
+- **인수 기준**:
+  - 카드에 좋아요 표시 기능
+  - 댓글 작성, 수정, 삭제 기능
+  - 댓글에 답글 달기 기능
+  - 부적절한 댓글 신고 옵션
+
+### 3.4 팔로우 기능
+- **스토리**: 사용자로서, 나는 관심 있는 사용자를 팔로우하여 그들의 콘텐츠를 지속적으로 확인하고 싶다.
+- **인수 기준**:
+  - 사용자 프로필에서 팔로우/언팔로우 기능
+  - 팔로잉/팔로워 목록 확인 가능
+  - 팔로우한 사용자의 새 콘텐츠 알림 설정
+  - 팔로우 추천 기능
+
+## 4. 탐색 및 발견
+
+### 4.1 카드 검색
+- **스토리**: 사용자로서, 나는 특정 주제나 키워드에 관한 카드를 검색하고 싶다.
+- **인수 기준**:
+  - 키워드, 태그, 사용자명으로 검색 가능
+  - 검색 결과 필터링 및 정렬 옵션
+  - 최근 검색어 기록 및 인기 검색어 표시
+  - 검색 중 자동 완성 제안
+
+### 4.2 탐색 피드
+- **스토리**: 사용자로서, 나는 새롭고 인기 있는 카드를 발견하여 영감을 얻고 싶다.
+- **인수 기준**:
+  - 개인화된 추천 카드 피드 제공
+  - 인기 카드, 최신 카드, 트렌딩 카드 섹션
+  - 카테고리별 탐색 옵션
+  - 무한 스크롤로 지속적인 콘텐츠 로딩
+
+### 4.3 컬렉션 및 북마크
+- **스토리**: 사용자로서, 나는 마음에 드는 카드를 저장하고 컬렉션으로 정리하고 싶다.
+- **인수 기준**:
+  - 카드 저장(북마크) 기능
+  - 사용자 정의 컬렉션 생성 및 관리
+  - 저장된 카드를 컬렉션에 추가/제거
+  - 컬렉션 공개/비공개 설정 옵션
+
+## 5. 사용자 프로필 및 설정
+
+### 5.1 프로필 관리
+- **스토리**: 사용자로서, 나는 내 프로필을 관리하고 개인화하고 싶다.
+- **인수 기준**:
+  - 프로필 사진, 이름, 소개 편집 기능
+  - 내가 만든 카드 및 저장한 카드 확인
+  - 팔로워/팔로잉 관리
+  - 프로필 통계(카드 수, 좋아요 수 등) 표시
+
+### 5.2 알림 설정
+- **스토리**: 사용자로서, 나는 중요한 활동에 대한 알림을 받고 관리하고 싶다.
+- **인수 기준**:
+  - 알림 유형별(좋아요, 댓글, 팔로우 등) 설정
+  - 푸시 알림 및 이메일 알림 옵션
+  - 방해 금지 시간 설정
+  - 알림 센터에서 모든 알림 확인 및 관리
+
+### 5.3 앱 설정
+- **스토리**: 사용자로서, 나는 앱 경험을 내 선호도에 맞게 조정하고 싶다.
+- **인수 기준**:
+  - 테마 설정(라이트/다크 모드)
+  - 언어 설정
+  - 데이터 사용 및 저장 옵션
+  - 접근성 설정
+
+### 5.4 계정 관리
+- **스토리**: 사용자로서, 나는 내 계정 정보를 안전하게 관리하고 싶다.
+- **인수 기준**:
+  - 비밀번호 변경 기능
+  - 연결된 소셜 계정 관리
+  - 개인정보 다운로드 옵션
+  - 계정 삭제 기능
+
+## 6. 고급 기능 및 프리미엄
+
+### 6.1 고급 디자인 도구
+- **스토리**: 프리미엄 사용자로서, 나는 더 다양하고 고급스러운 디자인 옵션을 사용하고 싶다.
+- **인수 기준**:
+  - 확장된 템플릿 및 요소 라이브러리
+  - 고급 텍스트 효과 및 애니메이션
+  - 커스텀 폰트 업로드 기능
+  - 레이어 관리 및 고급 편집 도구
+
+### 6.2 협업 기능
+- **스토리**: 팀 사용자로서, 나는 팀원들과 함께 카드를 만들고 관리하고 싶다.
+- **인수 기준**:
+  - 공동 편집 기능
+  - 팀 워크스페이스 생성 및 관리
+  - 역할 및 권한 설정
+  - 변경 이력 및 버전 관리
+
+### 6.3 분석 및 인사이트
+- **스토리**: 콘텐츠 크리에이터로서, 나는 내 카드의 성과와 사용자 반응을 분석하고 싶다.
+- **인수 기준**:
+  - 카드별 조회수, 좋아요, 공유 통계
+  - 시간대별 참여율 그래프
+  - 인구통계학적 데이터(가능한 경우)
+  - 성과 개선을 위한 인사이트 제공
+
+### 6.4 구독 관리
+- **스토리**: 사용자로서, 나는 프리미엄 구독을 쉽게 시작, 관리, 취소할 수 있기를 원한다.
+- **인수 기준**:
+  - 명확한 요금제 및 혜택 정보
+  - 간편한 결제 프로세스
+  - 구독 상태 및 갱신일 확인
+  - 구독 변경 및 취소 옵션
+
+## 7. 접근성 및 다국어 지원
+
+### 7.1 접근성 기능
+- **스토리**: 장애가 있는 사용자로서, 나는 앱의 모든 기능을 불편 없이 사용하고 싶다.
+- **인수 기준**:
+  - 스크린 리더 호환성
+  - 키보드 네비게이션 지원
+  - 고대비 모드 및 텍스트 크기 조정
+  - 색상 구분 없이 정보 인식 가능
+
+### 7.2 다국어 지원
+- **스토리**: 비영어권 사용자로서, 나는 내 모국어로 앱을 사용하고 싶다.
+- **인수 기준**:
+  - 주요 언어(한국어, 영어, 일본어, 중국어 등) 지원
+  - 언어별 적절한 폰트 및 레이아웃 조정
+  - 지역에 맞는 날짜, 시간, 숫자 형식
+  - 사용자 언어 자동 감지 및 수동 설정 옵션
+
+## 8. 성능 및 안정성
+
+### 8.1 오프라인 기능
+- **스토리**: 사용자로서, 나는 인터넷 연결이 불안정할 때도 기본적인 기능을 사용하고 싶다.
+- **인수 기준**:
+  - 오프라인 상태에서 저장된 카드 확인 가능
+  - 오프라인에서 새 카드 작성 및 임시 저장
+  - 연결 복구 시 자동 동기화
+  - 오프라인 상태 알림 및 가이드
+
+### 8.2 성능 최적화
+- **스토리**: 사용자로서, 나는 앱이 빠르고 부드럽게 작동하기를 원한다.
+- **인수 기준**:
+  - 빠른 앱 시작 및 화면 전환
+  - 이미지 및 콘텐츠 최적화 로딩
+  - 배터리 효율적 사용
+  - 다양한 기기 성능에 맞는 최적화
+
+### 8.3 데이터 백업 및 복구
+- **스토리**: 사용자로서, 나는 내 데이터가 안전하게 백업되고 필요시 복구할 수 있기를 원한다.
+- **인수 기준**:
+  - 클라우드 자동 백업 기능
+  - 수동 백업 옵션
+  - 기기 변경 시 데이터 이전 가이드
+  - 실수로 삭제한 콘텐츠 복구 옵션
+
+## 우선순위 매트릭스
+
+### 높은 가치 / 높은 우선순위
+1. 새 카드 생성 (2.1)
+2. 템플릿 사용 (2.2)
+3. 텍스트 편집 (2.3)
+4. 시각적 요소 편집 (2.4)
+5. 카드 공유 (3.1)
+6. 카드 저장 및 관리 (2.5)
+
+### 높은 가치 / 중간 우선순위
+1. 신규 사용자 등록 (1.1)
+2. 로그인 및 인증 (1.3)
+3. 탐색 피드 (4.2)
+4. 카드 검색 (4.1)
+5. 프로필 관리 (5.1)
+
+### 중간 가치 / 중간 우선순위
+1. 온보딩 경험 (1.2)
+2. 좋아요 및 댓글 (3.3)
+3. 공개 설정 (3.2)
+4. 컬렉션 및 북마크 (4.3)
+5. 알림 설정 (5.2)
+
+### 향후 개발 고려 사항
+1. 고급 디자인 도구 (6.1)
+2. 협업 기능 (6.2)
+3. 분석 및 인사이트 (6.3)
+4. 다국어 지원 (7.2)
+
+이 사용자 스토리는 Zellyy 앱의 개발 및 개선 과정에서 사용자 중심 접근 방식을 유지하기 위한 기준으로 활용됩니다. 각 스토리는 실제 사용자의 니즈와 목표를 반영하며, 인수 기준은 해당 기능이 성공적으로 구현되었는지 평가하는 기준이 됩니다.
--- a/note/03_UI_UX_설계/사용자_페르소나.md
+++ b/note/03_UI_UX_설계/사용자_페르소나.md
@@ -0,0 +1,172 @@
+# Zellyy 사용자 페르소나
+
+## 페르소나 1: 콘텐츠 크리에이터 지민
+
+![페르소나 이미지: 20대 여성]
+
+### 기본 정보
+- **이름**: 김지민
+- **나이**: 27세
+- **직업**: 프리랜서 콘텐츠 크리에이터
+- **거주지**: 서울시 마포구
+- **기술 수준**: 중상 (디지털 네이티브, 다양한 앱 사용에 능숙)
+
+### 배경 및 상황
+지민은 인스타그램, 유튜브 등에서 라이프스타일 콘텐츠를 제작하는 프리랜서입니다. 주로 일상, 여행, 독서 등의 콘텐츠를 만들고 있으며, 팔로워와 소통하는 것을 중요하게 생각합니다. 항상 새로운 아이디어를 찾고 있으며, 자신만의 독특한 콘텐츠를 만들기 위해 노력합니다.
+
+### 목표와 동기
+- 자신의 생각과 아이디어를 시각적으로 매력있게 표현하고 싶음
+- 팔로워들과 더 효과적으로 소통할 수 있는 방법을 찾고 있음
+- 다른 크리에이터의 아이디어를 탐색하고 영감을 얻고 싶음
+- 자신의 브랜드 아이덴티티를 일관되게 유지하면서 콘텐츠 제작 시간 단축 희망
+
+### 좌절 및 고충
+- 콘텐츠 아이디어를 정리하고 시각화하는 데 많은 시간이 소요됨
+- 여러 앱을 오가며 콘텐츠를 제작하는 과정이 번거로움
+- 기존 디자인 도구는 배우기 어렵고 복잡함
+- 모바일에서 고품질 콘텐츠를 제작하기 어려움
+
+### 행동 패턴
+- 하루에 3-4시간을 콘텐츠 기획 및 제작에 사용
+- 주로 스마트폰으로 작업하며, 이동 중에도 아이디어를 기록
+- 다양한 소셜 미디어 플랫폼을 활발히 사용
+- 새로운 앱과 도구를 빠르게 시도하고 적응함
+
+### Zellyy 사용 시나리오
+지민은 Zellyy를 사용해 자신의 여행 경험, 책 리뷰, 일상 팁 등을 시각적으로 매력적인 카드로 만들어 인스타그램 스토리나 피드에 공유합니다. 템플릿을 활용해 시간을 절약하면서도 자신만의 스타일로 커스터마이징하여 브랜드 일관성을 유지합니다. 또한 다른 크리에이터들의 카드를 탐색하며 새로운 아이디어와 영감을 얻습니다.
+
+---
+
+## 페르소나 2: 직장인 현우
+
+![페르소나 이미지: 30대 남성]
+
+### 기본 정보
+- **이름**: 이현우
+- **나이**: 34세
+- **직업**: IT 기업 프로젝트 매니저
+- **거주지**: 경기도 분당구
+- **기술 수준**: 중 (업무용 앱에 익숙하지만 창의적 도구 사용 경험 적음)
+
+### 배경 및 상황
+현우는 바쁜 IT 기업에서 프로젝트 매니저로 일하고 있습니다. 업무 중 많은 아이디어와 정보를 정리하고 팀원들과 공유해야 합니다. 프레젠테이션과 회의 자료를 자주 준비하지만, 디자인 능력이 부족해 시각적으로 매력적인 자료를 만드는 데 어려움을 겪습니다. 퇴근 후에는 취미 생활과 자기 계발에 관심이 많습니다.
+
+### 목표와 동기
+- 업무 아이디어와 정보를 효과적으로 정리하고 공유하고 싶음
+- 디자인 전문가가 아니어도 전문적으로 보이는 자료를 만들고 싶음
+- 개인 생활에서 배운 내용이나 인사이트를 기록하고 정리하고 싶음
+- 시간을 효율적으로 사용하면서 더 나은 결과물을 만들고 싶음
+
+### 좌절 및 고충
+- 디자인 도구 사용이 어렵고 시간이 많이 소요됨
+- 기존 노트 앱은 시각적 표현이 제한적임
+- 여러 도구를 사용하다 보니 정보가 분산되어 관리가 어려움
+- 모바일에서 작업할 때 PC만큼 효율적이지 못함
+
+### 행동 패턴
+- 출퇴근 시간에 모바일로 정보 소비 및 간단한 작업
+- 주로 저녁 시간에 다음 날 회의나 발표 자료 준비
+- 주말에는 자기 계발 관련 내용 정리 및 학습
+- 효율성을 중시하며 시간 절약 가능한 도구 선호
+
+### Zellyy 사용 시나리오
+현우는 Zellyy를 사용해 프로젝트 아이디어, 회의 요약, 팀 공지사항 등을 시각적으로 정리합니다. 템플릿을 활용해 빠르게 전문적인 카드를 만들고 팀 채팅방이나 이메일로 공유합니다. 또한 개인적으로 관심 있는 주제(투자, 건강, 취미 등)에 대한 정보를 카드로 만들어 저장하고, 필요할 때 쉽게 찾아볼 수 있습니다.
+
+---
+
+## 페르소나 3: 대학생 수진
+
+![페르소나 이미지: 20대 초반 여성]
+
+### 기본 정보
+- **이름**: 박수진
+- **나이**: 22세
+- **직업**: 대학생 (디자인학과)
+- **거주지**: 서울시 관악구
+- **기술 수준**: 중상 (디자인 도구 사용 경험 있음, 새로운 앱 적응 빠름)
+
+### 배경 및 상황
+수진은 디자인을 전공하는 대학생으로, 학업과 함께 다양한 동아리 활동에 참여하고 있습니다. 수업 노트, 프로젝트 아이디어, 영감을 주는 디자인 등을 수집하고 정리하는 것을 좋아합니다. 소셜 미디어를 활발히 사용하며 친구들과 아이디어를 공유하고 소통합니다. 제한된 학생 예산으로 무료 또는 저렴한 도구를 선호합니다.
+
+### 목표와 동기
+- 수업 내용과 프로젝트 아이디어를 시각적으로 정리하고 싶음
+- 포트폴리오용 작품을 쉽게 만들고 공유하고 싶음
+- 영감을 주는 디자인과 아이디어를 수집하고 정리하고 싶음
+- 동아리 활동에 필요한 포스터, 공지사항 등을 쉽게 만들고 싶음
+
+### 좌절 및 고충
+- 전문 디자인 소프트웨어는 비용이 부담스럽고 학습 곡선이 가파름
+- 모바일에서 작업할 때 기능 제한으로 불편함
+- 다양한 플랫폼에 맞는 콘텐츠를 각각 제작해야 하는 번거로움
+- 아이디어는 많지만 실현하는 데 시간과 도구의 제약이 있음
+
+### 행동 패턴
+- 수업 중이나 이동 중에 스마트폰으로 아이디어 기록
+- 주로 밤에 프로젝트 작업이나 창작 활동
+- 인스타그램, 핀터레스트 등에서 디자인 영감 탐색
+- 친구들과 온라인으로 아이디어와 작업물 공유
+
+### Zellyy 사용 시나리오
+수진은 Zellyy를 사용해 수업 노트, 프로젝트 아이디어, 무드보드 등을 시각적인 카드로 만들어 정리합니다. 동아리 행사 포스터나 공지사항을 템플릿을 활용해 빠르게 제작하고 SNS에 공유합니다. 또한 다른 디자이너들의 카드를 탐색하며 영감을 얻고, 자신의 디자인 작업을 카드로 만들어 미니 포트폴리오처럼 활용합니다.
+
+---
+
+## 페르소나 4: 소상공인 민석
+
+![페르소나 이미지: 40대 남성]
+
+### 기본 정보
+- **이름**: 강민석
+- **나이**: 42세
+- **직업**: 카페 운영자
+- **거주지**: 부산시 해운대구
+- **기술 수준**: 초중 (기본적인 스마트폰 사용은 가능하나 복잡한 앱 사용에 어려움)
+
+### 배경 및 상황
+민석은 2년 전부터 작은 카페를 운영하고 있습니다. 소셜 미디어를 통한 홍보의 중요성을 알고 있지만, 디자인 지식이나 기술이 부족해 전문적인 콘텐츠 제작에 어려움을 겪고 있습니다. 메뉴 소개, 이벤트 공지, 영업시간 안내 등의 콘텐츠를 직접 만들고 싶지만, 기존 디자인 도구는 너무 복잡하게 느껴집니다.
+
+### 목표와 동기
+- 카페 홍보를 위한 전문적인 이미지와 공지사항을 만들고 싶음
+- 복잡한 디자인 도구 없이도 매력적인 콘텐츠를 제작하고 싶음
+- 시간을 많이 들이지 않고 효과적인 마케팅 자료를 만들고 싶음
+- 고객들에게 일관된 브랜드 이미지를 전달하고 싶음
+
+### 좌절 및 고충
+- 디자인 도구 사용법을 배울 시간이 부족함
+- 기존 템플릿은 카페 분위기와 맞지 않거나 너무 획일적임
+- 디자인 외주는 비용 부담이 큼
+- 바쁜 업무 중에 마케팅 콘텐츠 제작까지 하기 어려움
+
+### 행동 패턴
+- 주로 영업 준비 시간이나 마감 후 짧은 시간에 콘텐츠 제작
+- 스마트폰으로 대부분의 업무와 개인 활동 처리
+- 다른 카페의 SNS를 참고하여 아이디어 수집
+- 간단하고 직관적인 도구 선호
+
+### Zellyy 사용 시나리오
+민석은 Zellyy를 사용해 신메뉴 소개, 영업시간 변경 안내, 이벤트 홍보 등의 카드를 만들어 카페 인스타그램과 카카오톡 채널에 공유합니다. 카페 분위기에 맞는 템플릿을 선택하고 간단히 수정하여 일관된 브랜드 이미지를 유지합니다. 또한 자주 사용하는 디자인 요소를 저장해두고 재활용하여 시간을 절약합니다.
+
+---
+
+## 사용자 페르소나 요약 및 시사점
+
+### 공통 니즈
+1. **간편한 디자인 제작**: 모든 페르소나가 복잡한 디자인 도구 없이도 시각적으로 매력적인 콘텐츠를 만들고 싶어함
+2. **모바일 최적화**: 이동 중이나 PC가 없는 환경에서도 효율적으로 작업할 수 있는 모바일 경험 중요
+3. **시간 절약**: 바쁜 일상 속에서 빠르게 콘텐츠를 제작할 수 있는 템플릿과 도구 필요
+4. **공유 용이성**: 다양한 플랫폼에 쉽게 공유할 수 있는 기능 중요
+
+### 차별화된 니즈
+1. **콘텐츠 크리에이터(지민)**: 브랜드 일관성 유지와 창의적 커스터마이징 균형
+2. **직장인(현우)**: 전문적이고 깔끔한 비즈니스 콘텐츠 제작 및 정보 관리
+3. **대학생(수진)**: 다양한 아이디어 수집 및 학업/동아리 활동 지원
+4. **소상공인(민석)**: 마케팅 자료의 간편한 제작과 브랜드 이미지 구축
+
+### 디자인 시사점
+1. **직관적인 UI/UX**: 다양한 기술 수준의 사용자가 쉽게 사용할 수 있는 인터페이스 설계
+2. **다양한 템플릿**: 각 페르소나의 목적에 맞는 다양한 템플릿 제공 (비즈니스, 소셜 미디어, 학업, 마케팅 등)
+3. **커스터마이징 옵션**: 템플릿의 편의성과 개인화의 균형 유지
+4. **효율적인 워크플로우**: 최소한의 단계로 완성도 높은 결과물 제작 가능하도록 설계
+5. **영감 탐색 기능**: 다른 사용자의 콘텐츠를 탐색하고 영감을 얻을 수 있는 커뮤니티 기능
+
+이러한 페르소나 분석을 바탕으로 Zellyy는 다양한 사용자의 니즈를 충족시키는 동시에, 각 사용자 그룹에 특화된 기능과 콘텐츠를 제공하여 차별화된 가치를 전달할 수 있습니다.
--- a/note/03_개발_단계/index.md
+++ b/note/03_개발_단계/index.md
@@ -0,0 +1,53 @@
+# ZELLYY 개발 단계
+
+## 목차
+
+1. [개발 로드맵](개발_로드맵.md)
+2. [스프린트 계획](스프린트_계획.md)
+3. [개발 가이드라인](./개발_가이드라인.md)
+4. [테스트 전략](./테스트_전략.md)
+
+## 개발 단계 개요
+
+ZELLYY 프로젝트의 개발 단계에서는 애자일 방법론을 기반으로 2주 단위의 스프린트로 진행합니다. 각 스프린트마다 사용 가능한 기능을 구현하고 테스트하는 방식으로 진행하며, MVP(Minimum Viable Product) 접근법을 통해 핵심 기능을 우선적으로 개발하고, 사용자 피드백을 바탕으로 점진적으로 기능을 확장해 나갈 계획입니다.
+
+## 주요 문서
+
+- **개발 로드맵**: 전체 개발 일정, 마일스톤, 주요 단계별 계획을 정의한 문서
+- **스프린트 계획**: 각 스프린트의 목표, 작업 항목, 우선순위를 정의한 문서
+- **개발 가이드라인**: 코드 스타일, 아키텍처 패턴, 개발 프로세스 등을 정의한 문서
+- **테스트 전략**: 단위 테스트, 통합 테스트, E2E 테스트 등 테스트 방법론을 정의한 문서
+
+## 개발 접근 방식
+
+1. **애자일 개발**: 2주 단위 스프린트로 진행, 지속적인 피드백 및 개선
+2. **MVP 우선**: 핵심 기능을 우선적으로 개발하여 빠른 시장 검증
+3. **사용자 중심**: 사용자 피드백을 적극 반영한 기능 개발 및 개선
+4. **품질 중심**: 자동화된 테스트와 코드 리뷰를 통한 품질 보증
+5. **지속적 통합/배포**: CI/CD 파이프라인을 통한 빠른 개발 사이클
+
+## 개발 단계 일정
+
+### 1단계: 기본 인프라 구축 (2024년 1월)
+- 개발 환경 설정
+- 프로젝트 구조 설정
+- 기본 UI 컴포넌트 개발
+- 네비게이션 구조 구현
+
+### 2단계: 핵심 기능 개발 (2024년 2-3월)
+- 사용자 인증 시스템 구현
+- 카드 작성 및 편집 기능 개발
+- 기본 스타일링 옵션 구현
+- 카드 관리 기능 구현
+- 기본 SNS 공유 기능 구현
+
+### 3단계: 베타 테스트 및 개선 (2024년 4-6월)
+- 기능 통합 및 안정화
+- UI/UX 개선 및 폴리싱
+- 베타 테스트 진행
+- 피드백 기반 개선
+
+### 4단계: 출시 및 확장 (2024년 7-9월)
+- 공식 출시
+- 클라우드 동기화 구현
+- 프리미엄 기능 개발
--- a/note/03_개발_단계/개발_로드맵.md
+++ b/note/03_개발_단계/개발_로드맵.md
@@ -0,0 +1,265 @@
+# ZELLYY 개발 로드맵
+
+## 개발 접근 방식
+
+ZELLYY 프로젝트는 애자일 방법론을 기반으로 개발될 예정입니다. 2주 단위의 스프린트로 진행하며, 각 스프린트마다 사용 가능한 기능을 구현하고 테스트하는 방식으로 진행합니다. MVP(Minimum Viable Product) 접근법을 통해 핵심 기능을 우선적으로 개발하고, 사용자 피드백을 바탕으로 점진적으로 기능을 확장해 나갈 계획입니다.
+
+## 개발 단계
+
+### 1단계: 기획 및 설계 (2023년 Q4)
+
+#### 10월: 요구사항 분석 및 기획
+- [x] 사용자 요구사항 수집 및 분석
+- [x] 경쟁 앱 분석 및 차별화 전략 수립
+- [x] 핵심 기능 정의 및 우선순위 설정
+- [x] 사용자 페르소나 및 사용자 여정 맵 작성
+
+#### 11월: UI/UX 설계
+- [x] 앱 정보 구조 설계
+- [x] 주요 화면 와이어프레임 작성
+- [x] 디자인 시스템 구축 (색상, 타이포그래피, 컴포넌트)
+- [x] 프로토타입 제작 및 사용성 테스트
+
+#### 12월: 기술 설계
+- [x] 시스템 아키텍처 설계
+- [x] 데이터베이스 스키마 설계
+- [x] API 명세 작성
+- [x] 보안 및 개인정보 보호 전략 수립
+
+### 2단계: 모바일 앱 MVP 개발 (2024년 Q1)
+
+#### 1월: 기본 인프라 구축
+- [ ] 개발 환경 설정
+- [ ] 프로젝트 구조 설정
+- [ ] 기본 UI 컴포넌트 개발
+- [ ] 네비게이션 구조 구현
+
+#### 2월: 핵심 기능 개발 (1)
+- [ ] 사용자 인증 시스템 구현 (이메일, 소셜 로그인)
+- [ ] 카드 작성 및 편집 기능 개발
+- [ ] 기본 스타일링 옵션 구현 (폰트, 색상, 정렬)
+- [ ] 로컬 저장 기능 구현
+
+#### 3월: 핵심 기능 개발 (2)
+- [ ] 카드 관리 기능 구현 (목록, 검색, 필터링)
+- [ ] 기본 SNS 공유 기능 구현 (인스타그램, 페이스북)
+- [ ] 설정 및 프로필 관리 기능 구현
+- [ ] 오프라인 모드 지원
+
+### 3단계: 베타 테스트 및 개선 (2024년 Q2)
+
+#### 4월: 베타 버전 완성
+- [ ] 기능 통합 및 안정화
+- [ ] UI/UX 개선 및 폴리싱
+- [ ] 성능 최적화
+- [ ] 베타 테스트 환경 구축
+
+#### 5월: 베타 테스트 진행
+- [ ] 클로즈드 베타 테스트 진행 (100명 규모)
+- [ ] 사용자 피드백 수집 및 분석
+- [ ] 버그 수정 및 UI/UX 개선
+- [ ] 성능 모니터링 및 최적화
+
+#### 6월: 개선 및 추가 기능 개발
+- [ ] 베타 테스트 피드백 기반 개선사항 적용
+- [ ] 추가 SNS 플랫폼 지원 (스레드, 트위터)
+- [ ] 태그 시스템 구현
+- [ ] 앱 안정성 및 성능 최적화
+
+### 4단계: 출시 및 클라우드 동기화 (2024년 Q3)
+
+#### 7월: 공식 출시
+- [ ] 앱스토어 및 구글 플레이 스토어 등록
+- [ ] 마케팅 캠페인 실행
+- [ ] 사용자 지원 시스템 구축
+- [ ] 실시간 모니터링 및 이슈 대응
+
+#### 8월: 클라우드 동기화 구현
+- [ ] Supabase 연동 및 설정
+- [ ] 클라우드 저장 및 동기화 기능 구현
+- [ ] 사용자 데이터 마이그레이션 지원
+- [ ] 동기화 충돌 해결 메커니즘 구현
+
+#### 9월: 프리미엄 기능 개발
+- [ ] 구독 모델 구현 (인앱 결제)
+- [ ] 고급 커스터마이징 옵션 개발
+- [ ] 워터마크 제거 옵션 구현
+- [ ] 프리미엄 사용자 분석 대시보드 개발
+
+### 5단계: 웹 서비스 개발 (2024년 Q4)
+
+#### 10월: 웹 서비스 기본 구조 개발
+- [ ] 웹 프론트엔드 프로젝트 설정
+- [ ] 사용자 인증 및 기본 UI 구현
+- [ ] 반응형 디자인 구현
+- [ ] 모바일 앱과의 디자인 일관성 확보
+
+#### 11월: 웹 카드 관리 기능 개발
+- [ ] 카드 조회 및 관리 기능 구현
+- [ ] 웹용 카드 에디터 개발
+- [ ] 모바일-웹 동기화 기능 구현
+- [ ] 대량 관리 기능 구현 (웹 전용)
+
+#### 12월: 웹 고급 기능 개발
+- [ ] 고급 편집 도구 구현 (웹 전용)
+- [ ] 템플릿 갤러리 구현
+- [ ] 대시보드 및 통계 기능 개발
+- [ ] API 개발 (외부 서비스 연동용)
+
+### 6단계: 커뮤니티 기능 및 확장 (2025년 Q1-Q2)
+
+#### 1-2월: 공개 갤러리 기능 개발
+- [ ] 공개 갤러리 UI 구현
+- [ ] 카드 공개 설정 및 관리 기능
+- [ ] 인기 카드 알고리즘 개발
+- [ ] 검색 및 발견 기능 구현
+
+#### 3-4월: 사용자 상호작용 기능 개발
+- [ ] 좋아요 및 댓글 기능 구현
+- [ ] 사용자 팔로우 시스템 개발
+- [ ] 알림 시스템 구현
+- [ ] 콘텐츠 신고 및 모더레이션 기능 개발
+
+#### 5-6월: 플랫폼 확장 및 고도화
+- [ ] 다국어 지원 구현
+- [ ] 고급 분석 및 인사이트 기능 개발
+- [ ] API 확장 및 개발자 도구 제공
+- [ ] 파트너십 통합 (콘텐츠 제작자, 브랜드 등)
+
+## 개발 팀 구성
+
+### 핵심 팀 (초기 단계)
+- **프로젝트 매니저**: 1명 - 전체 프로젝트 조정 및 일정 관리
+- **UI/UX 디자이너**: 1명 - 사용자 경험 설계 및 시각적 디자인
+- **모바일 개발자**: 2명 - React Native 기반 모바일 앱 개발
+- **백엔드 개발자**: 1명 - Supabase 및 서버 기능 개발
+- **QA 엔지니어**: 1명 - 품질 보증 및 테스트
+
+### 확장 팀 (후기 단계)
+- **웹 프론트엔드 개발자**: 1명 - 웹 서비스 개발
+- **DevOps 엔지니어**: 1명 - 인프라 관리 및 배포 자동화
+- **마케팅 전문가**: 1명 - 사용자 확보 및 브랜딩 전략
+- **콘텐츠 매니저**: 1명 - 공개 갤러리 및 커뮤니티 관리
+- **고객 지원 담당자**: 1명 - 사용자 문의 대응 및 지원
+
+## 개발 환경 및 도구
+
+### 개발 환경
+- **프론트엔드**: React Native, Redux, TypeScript
+- **백엔드**: Supabase, Node.js (필요시)
+- **웹 프론트엔드**: React.js, Next.js
+- **인프라**: Supabase 자체 호스팅 (Debian 12 서버)
+
+### 개발 도구
+- **프로젝트 관리**: Notion, Jira
+- **소스 코드 관리**: GitHub
+- **CI/CD**: GitHub Actions
+- **커뮤니케이션**: Slack, Zoom
+- **디자인**: Figma
+- **테스트**: Jest, Detox, Cypress
+
+## 품질 보증 전략
+
+### 테스트 전략
+- **단위 테스트**: 개별 함수 및 컴포넌트 테스트
+- **통합 테스트**: 컴포넌트 간 상호작용 테스트
+- **E2E 테스트**: 사용자 시나리오 기반 전체 흐름 테스트
+- **성능 테스트**: 로드 테스트 및 스트레스 테스트
+- **사용성 테스트**: 실제 사용자 대상 테스트
+
+### 코드 품질 관리
+- **코드 리뷰**: 모든 코드 변경에 대한 동료 검토
+- **정적 코드 분석**: ESLint, TypeScript
+- **코드 컨벤션**: 일관된 코딩 스타일 가이드
+- **문서화**: 코드 및 API 문서 자동화
+
+## 위험 관리
+
+### 잠재적 위험 및 대응 전략
+1. **기술적 복잡성**
+   - **위험**: React Native의 네이티브 모듈 통합 문제, 다양한 기기 호환성 이슈
+   - **대응**: 철저한 테스트, 점진적 기능 구현, 대안 라이브러리 검토
+   - **완화**: 기술 스파이크를 통한 사전 검증, 경험 있는 개발자 확보
+
+2. **일정 지연**
+   - **위험**: 기능 구현 복잡성 증가, 예상치 못한 기술적 장애물
+   - **대응**: 우선순위 재조정, 스프린트 계획 유연성 확보
+   - **완화**: 버퍼 시간 확보, 주기적 진행 상황 검토
+
+3. **사용자 채택 저조**
+   - **위험**: 경쟁 앱과의 차별화 부족, 사용자 가치 제안 불명확
+   - **대응**: 사용자 피드백 기반 개선, 마케팅 전략 조정
+   - **완화**: 초기 사용자 테스트, 명확한 가치 제안 개발
+
+4. **성능 및 확장성 문제**
+   - **위험**: 사용자 증가에 따른 성능 저하, 동기화 충돌
+   - **대응**: 성능 최적화, 아키텍처 개선
+   - **완화**: 초기부터 확장성 고려한 설계, 성능 테스트 자동화
+
+5. **보안 및 개인정보 이슈**
+   - **위험**: 데이터 유출, 개인정보 보호 규정 위반
+   - **대응**: 즉각적인 취약점 패치, 투명한 커뮤니케이션
+   - **완화**: 정기적인 보안 감사, 개인정보 보호 설계 원칙 적용
+
+## 성공 기준
+
+### 기술적 성공 기준
+- 앱 크래시 비율 0.5% 미만
+- 평균 앱 로딩 시간 2초 이내
+- 카드 저장 및 공유 작업 완료 시간 3초 이내
+- 오프라인 모드에서의 완전한 기능성
+- 99.9% 이상의 서비스 가용성
+
+### 비즈니스 성공 기준
+- 출시 6개월 내 50,000명 이상의 활성 사용자 확보
+- 무료 사용자의 5% 이상 유료 구독 전환
+- 사용자당 월 평균 10개 이상의 카드 작성
+- 작성된 카드의 30% 이상이 SNS에 공유됨
+- 앱스토어 평점 4.5/5.0 이상
+
+## 마일스톤 및 주요 일정
+
+### 주요 마일스톤
+1. **개념 증명 (PoC)**: 2023년 12월
+2. **알파 버전**: 2024년 2월
+3. **베타 버전**: 2024년 4월
+4. **모바일 앱 출시**: 2024년 7월
+5. **클라우드 동기화 및 프리미엄 기능**: 2024년 9월
+6. **웹 서비스 출시**: 2024년 12월
+7. **커뮤니티 기능 출시**: 2025년 3월
+
+### 주요 일정
+- **디자인 시스템 완성**: 2023년 11월 30일
+- **기술 아키텍처 확정**: 2023년 12월 15일
+- **MVP 개발 완료**: 2024년 3월 31일
+- **베타 테스트 시작**: 2024년 4월 15일
+- **앱스토어 제출**: 2024년 6월 30일
+- **공식 출시 이벤트**: 2024년 7월 15일
+- **프리미엄 구독 출시**: 2024년 9월 1일
+- **웹 서비스 베타 오픈**: 2024년 11월 15일
+
+## 예산 계획
+
+### 개발 비용
+- **인건비**: 핵심 팀 6명 × 12개월 = 약 360,000,000원
+- **개발 도구 및 라이선스**: 약 10,000,000원
+- **서버 및 인프라**: 약 15,000,000원 (연간)
+- **테스트 및 QA**: 약 20,000,000원
+
+### 마케팅 및 운영 비용
+- **초기 마케팅 캠페인**: 약 50,000,000원
+- **앱스토어 및 플레이스토어 수수료**: 매출의 15-30%
+- **사용자 지원 및 운영**: 약 30,000,000원 (연간)
+- **콘텐츠 제작 및 파트너십**: 약 25,000,000원
+
+### 총 예상 예산
+- **1년차**: 약 510,000,000원
+- **2년차**: 약 450,000,000원 (팀 확장 및 운영 비용 포함)
+
+## 결론
+
+ZELLYY 개발 로드맵은 사용자 중심의 접근 방식과 애자일 방법론을 기반으로 설계되었습니다. MVP 접근법을 통해 핵심 기능을 우선적으로 개발하고, 사용자 피드백을 지속적으로 반영하여 서비스를 개선해 나갈 계획입니다.
+
+개발 과정에서 발생할 수 있는 위험을 사전에 식별하고 대응 전략을 마련하여, 프로젝트의 성공적인 완수를 위한 기반을 마련하였습니다. 또한, 명확한 성공 기준을 설정하여 프로젝트의 진행 상황을 객관적으로 평가할 수 있도록 하였습니다.
+
+이 로드맵은 프로젝트의 진행 상황과 사용자 피드백에 따라 유연하게 조정될 수 있으며, 궁극적으로는 사용자들이 자신의 생각과 아이디어를 쉽고 매력적으로 표현할 수 있는 플랫폼을 제공하는 것을 목표로 합니다.
--- a/note/03_개발_단계/스프린트_계획.md
+++ b/note/03_개발_단계/스프린트_계획.md
@@ -0,0 +1,480 @@
+# ZELLYY - 스프린트 계획
+
+## 스프린트 개요
+
+ZELLYY 프로젝트는 2주 단위의 스프린트로 개발을 진행합니다. 각 스프린트는 계획, 실행, 리뷰, 회고의 4단계로 구성됩니다. 이 문서는 초기 MVP 개발을 위한 스프린트 계획을 정의합니다.
+
+## 스프린트 일정
+
+### 스프린트 0: 개발 환경 설정 (2024년 1월 1일 ~ 1월 14일)
+
+#### 목표
+- 개발 환경 구축 및 프로젝트 초기 설정
+- 기본 프로젝트 구조 설계
+- 핵심 라이브러리 및 도구 선정
+
+#### 주요 작업 항목
+1. **개발 환경 설정**
+   - React Native 프로젝트 초기화
+   - TypeScript 설정
+   - ESLint, Prettier 설정
+   - Jest 테스트 환경 구성
+   - CI/CD 파이프라인 구축 (GitHub Actions)
+
+2. **프로젝트 구조 설계**
+   - 폴더 구조 설계
+   - 네이밍 컨벤션 정의
+   - 코드 스타일 가이드 작성
+   - 컴포넌트 구조 설계
+
+3. **핵심 라이브러리 선정 및 통합**
+   - 상태 관리: Redux Toolkit 설정
+   - 네비게이션: React Navigation 설정
+   - UI 컴포넌트: 자체 컴포넌트 vs 라이브러리 결정
+   - 스타일링: Styled Components 설정
+   - 로컬 저장소: AsyncStorage 설정
+
+4. **기본 아키텍처 구현**
+   - API 클라이언트 설계
+   - 에러 처리 전략 수립
+   - 로깅 시스템 구축
+   - 앱 초기화 프로세스 구현
+
+#### 담당자
+- 프로젝트 매니저: 전체 조정
+- 모바일 개발자 1: React Native 프로젝트 설정, 네비게이션
+- 모바일 개발자 2: 상태 관리, 로컬 저장소
+- 백엔드 개발자: API 클라이언트, 인증 시스템 설계
+- QA 엔지니어: 테스트 환경 구성
+
+#### 산출물
+- 기본 프로젝트 구조
+- 개발 환경 설정 문서
+- 코드 스타일 가이드
+- 기술 스택 문서
+
+---
+
+### 스프린트 1: 기본 UI 컴포넌트 개발 (2024년 1월 15일 ~ 1월 28일)
+
+#### 목표
+- 디자인 시스템 구현
+- 핵심 UI 컴포넌트 개발
+- 기본 네비게이션 구조 구현
+
+#### 주요 작업 항목
+1. **디자인 시스템 구현**
+   - 색상 팔레트 구현
+   - 타이포그래피 시스템 구현
+   - 간격 및 크기 시스템 구현
+   - 테마 관리 시스템 구현
+
+2. **기본 UI 컴포넌트 개발**
+   - 버튼 컴포넌트
+   - 입력 필드 컴포넌트
+   - 카드 컴포넌트
+   - 모달 및 다이얼로그 컴포넌트
+   - 탭 및 네비게이션 바 컴포넌트
+   - 로딩 및 에러 상태 컴포넌트
+
+3. **네비게이션 구조 구현**
+   - 탭 기반 메인 네비게이션
+   - 스택 네비게이션 구조
+   - 화면 전환 애니메이션
+   - 딥 링크 지원
+
+4. **컴포넌트 문서화**
+   - Storybook 설정
+   - 컴포넌트 사용 예제 작성
+   - 컴포넌트 속성 문서화
+
+#### 담당자
+- UI/UX 디자이너: 디자인 시스템 가이드 제공
+- 모바일 개발자 1: 디자인 시스템 구현, 기본 컴포넌트
+- 모바일 개발자 2: 네비게이션 구조, 고급 컴포넌트
+- QA 엔지니어: 컴포넌트 테스트
+
+#### 산출물
+- 디자인 시스템 구현 코드
+- 기본 UI 컴포넌트 라이브러리
+- 네비게이션 구조 구현
+- 컴포넌트 문서 및 Storybook
+
+---
+
+### 스프린트 2: 사용자 인증 및 기본 화면 (2024년 1월 29일 ~ 2월 11일)
+
+#### 목표
+- 사용자 인증 시스템 구현
+- 온보딩 화면 개발
+- 홈 화면 및 기본 화면 구조 개발
+
+#### 주요 작업 항목
+1. **사용자 인증 시스템**
+   - 회원가입 화면 및 로직
+   - 로그인 화면 및 로직
+   - 소셜 로그인 통합 (Google, Apple)
+   - 비밀번호 재설정 기능
+   - 인증 상태 관리
+
+2. **온보딩 화면**
+   - 앱 소개 슬라이드
+   - 주요 기능 하이라이트
+   - 사용자 환영 화면
+   - 온보딩 상태 관리
+
+3. **홈 화면**
+   - 최근 작업 카드 표시
+   - 추천 템플릿 섹션
+   - 빠른 액션 버튼
+   - 사용 통계 요약
+
+4. **기본 화면 구조**
+   - 설정 화면
+   - 프로필 화면
+   - 알림 센터
+   - 도움말 및 지원 화면
+
+#### 담당자
+- UI/UX 디자이너: 화면 디자인 및 사용자 흐름
+- 모바일 개발자 1: 인증 시스템, 홈 화면
+- 모바일 개발자 2: 온보딩 화면, 기본 화면 구조
+- 백엔드 개발자: 인증 API 연동
+- QA 엔지니어: 인증 흐름 테스트
+
+#### 산출물
+- 사용자 인증 시스템
+- 온보딩 화면 구현
+- 홈 화면 및 기본 화면 구조
+- 인증 관련 테스트 케이스
+
+---
+
+### 스프린트 3: 카드 에디터 기본 기능 (2024년 2월 12일 ~ 2월 25일)
+
+#### 목표
+- 카드 에디터 기본 UI 구현
+- 텍스트 편집 기능 개발
+- 기본 스타일링 옵션 구현
+
+#### 주요 작업 항목
+1. **카드 에디터 UI**
+   - 에디터 레이아웃 구현
+   - 도구 모음 UI
+   - 실시간 미리보기
+   - 저장 및 취소 기능
+
+2. **텍스트 편집 기능**
+   - 텍스트 입력 및 편집
+   - 여러 텍스트 블록 지원
+   - 텍스트 정렬 옵션
+   - 텍스트 크기 조정
+
+3. **기본 스타일링 옵션**
+   - 폰트 선택 기능
+   - 텍스트 색상 변경
+   - 배경 색상 및 그라데이션
+   - 기본 레이아웃 옵션
+
+4. **에디터 상태 관리**
+   - 작업 히스토리 관리 (실행 취소/다시 실행)
+   - 자동 저장 기능
+   - 에디터 상태 지속성
+
+#### 담당자
+- UI/UX 디자이너: 에디터 UI 디자인
+- 모바일 개발자 1: 에디터 UI 구현, 텍스트 편집
+- 모바일 개발자 2: 스타일링 옵션, 상태 관리
+- QA 엔지니어: 에디터 기능 테스트
+
+#### 산출물
+- 카드 에디터 기본 UI
+- 텍스트 편집 기능
+- 기본 스타일링 옵션
+- 에디터 상태 관리 시스템
+
+---
+
+### 스프린트 4: 템플릿 시스템 및 카드 저장 (2024년 2월 26일 ~ 3월 10일)
+
+#### 목표
+- 템플릿 시스템 구현
+- 카드 저장 및 관리 기능 개발
+- 기본 갤러리 뷰 구현
+
+#### 주요 작업 항목
+1. **템플릿 시스템**
+   - 템플릿 데이터 구조 설계
+   - 기본 템플릿 세트 구현
+   - 템플릿 선택 및 적용 기능
+   - 템플릿 카테고리 관리
+
+2. **카드 저장 및 관리**
+   - 로컬 저장소 구현
+   - 카드 메타데이터 관리
+   - 카드 수정 및 삭제 기능
+   - 카드 복제 기능
+
+3. **갤러리 뷰**
+   - 카드 목록 표시
+   - 그리드 및 리스트 뷰 옵션
+   - 정렬 및 필터링 기능
+   - 카드 검색 기능
+
+4. **성능 최적화**
+   - 이미지 캐싱
+   - 리스트 렌더링 최적화
+   - 메모리 사용 최적화
+   - 로딩 상태 관리
+
+#### 담당자
+- UI/UX 디자이너: 템플릿 디자인, 갤러리 UI
+- 모바일 개발자 1: 템플릿 시스템, 갤러리 뷰
+- 모바일 개발자 2: 카드 저장 및 관리, 성능 최적화
+- 백엔드 개발자: 데이터 구조 설계 지원
+- QA 엔지니어: 저장 및 로딩 테스트
+
+#### 산출물
+- 템플릿 시스템 구현
+- 카드 저장 및 관리 기능
+- 갤러리 뷰 구현
+- 성능 최적화 보고서
+
+---
+
+### 스프린트 5: 소셜 미디어 공유 및 내보내기 (2024년 3월 11일 ~ 3월 24일)
+
+#### 목표
+- 소셜 미디어 공유 기능 구현
+- 이미지 내보내기 기능 개발
+- 워터마크 및 브랜딩 옵션 구현
+
+#### 주요 작업 항목
+1. **소셜 미디어 공유**
+   - 네이티브 공유 기능 통합
+   - 인스타그램 스토리/피드 공유 최적화
+   - 페이스북 공유 최적화
+   - 기타 소셜 플랫폼 지원
+
+2. **이미지 내보내기**
+   - 다양한 해상도 및 형식 지원
+   - 플랫폼별 최적 크기 자동 조정
+   - 이미지 품질 옵션
+   - 갤러리 저장 기능
+
+3. **워터마크 및 브랜딩**
+   - 기본 워터마크 구현
+   - 워터마크 위치 및 투명도 옵션
+   - 사용자 브랜딩 요소 추가 기능
+   - 워터마크 제거 옵션 (프리미엄)
+
+4. **공유 분석**
+   - 공유 이벤트 추적
+   - 기본 공유 통계
+   - 사용자 피드백 수집
+
+#### 담당자
+- UI/UX 디자이너: 공유 UI, 워터마크 디자인
+- 모바일 개발자 1: 소셜 미디어 공유, 이미지 내보내기
+- 모바일 개발자 2: 워터마크 및 브랜딩, 공유 분석
+- QA 엔지니어: 다양한 기기 및 플랫폼 테스트
+
+#### 산출물
+- 소셜 미디어 공유 기능
+- 이미지 내보내기 기능
+- 워터마크 및 브랜딩 옵션
+- 공유 분석 시스템
+
+---
+
+### 스프린트 6: 설정 및 사용자 환경설정 (2024년 3월 25일 ~ 4월 7일)
+
+#### 목표
+- 앱 설정 화면 구현
+- 사용자 환경설정 기능 개발
+- 알림 시스템 구현
+- 오프라인 모드 지원
+
+#### 주요 작업 항목
+1. **앱 설정 화면**
+   - 설정 화면 UI 구현
+   - 계정 관리 옵션
+   - 앱 환경설정
+   - 도움말 및 지원 섹션
+
+2. **사용자 환경설정**
+   - 테마 설정 (라이트/다크 모드)
+   - 기본 템플릿 설정
+   - 기본 스타일 프리셋
+   - 언어 설정 (향후 다국어 지원)
+
+3. **알림 시스템**
+   - 푸시 알림 설정
+   - 인앱 알림 센터
+   - 알림 환경설정
+   - 알림 히스토리
+
+4. **오프라인 모드**
+   - 오프라인 상태 감지
+   - 오프라인 작업 지원
+   - 데이터 동기화 전략
+   - 오프라인 모드 UI 피드백
+
+#### 담당자
+- UI/UX 디자이너: 설정 화면 디자인, 알림 UI
+- 모바일 개발자 1: 설정 화면, 사용자 환경설정
+- 모바일 개발자 2: 알림 시스템, 오프라인 모드
+- 백엔드 개발자: 푸시 알림 서버 설정
+- QA 엔지니어: 설정 및 오프라인 모드 테스트
+
+#### 산출물
+- 앱 설정 화면
+- 사용자 환경설정 기능
+- 알림 시스템
+- 오프라인 모드 지원
+
+---
+
+### 스프린트 7: 통합 테스트 및 안정화 (2024년 4월 8일 ~ 4월 21일)
+
+#### 목표
+- 전체 기능 통합 테스트
+- 성능 최적화 및 안정화
+- 버그 수정 및 UI 폴리싱
+- 베타 테스트 준비
+
+#### 주요 작업 항목
+1. **통합 테스트**
+   - 엔드투엔드 테스트 시나리오 작성
+   - 주요 사용자 흐름 테스트
+   - 에지 케이스 및 오류 상황 테스트
+   - 다양한 기기 및 OS 버전 테스트
+
+2. **성능 최적화**
+   - 앱 시작 시간 최적화
+   - 메모리 사용량 분석 및 최적화
+   - 배터리 사용량 최적화
+   - 네트워크 요청 최적화
+
+3. **UI 폴리싱**
+   - 애니메이션 및 전환 효과 개선
+   - 일관된 UI 스타일 확인
+   - 접근성 개선
+   - 사용자 피드백 기반 UI 조정
+
+4. **베타 테스트 준비**
+   - 베타 테스트 계획 수립
+   - 테스트 그룹 구성
+   - 피드백 수집 시스템 구축
+   - 베타 버전 배포 준비
+
+#### 담당자
+- 프로젝트 매니저: 베타 테스트 계획
+- UI/UX 디자이너: UI 폴리싱, 접근성 검토
+- 모바일 개발자 1: 통합 테스트, 버그 수정
+- 모바일 개발자 2: 성능 최적화, 안정화
+- QA 엔지니어: 테스트 시나리오 작성 및 실행
+
+#### 산출물
+- 통합 테스트 보고서
+- 성능 최적화 보고서
+- UI 폴리싱 완료
+- 베타 테스트 계획 및 준비
+
+---
+
+### 스프린트 8: 베타 출시 및 피드백 수집 (2024년 4월 22일 ~ 5월 5일)
+
+#### 목표
+- 베타 버전 출시
+- 사용자 피드백 수집 및 분석
+- 주요 이슈 해결
+- 앱스토어 제출 준비
+
+#### 주요 작업 항목
+1. **베타 출시**
+   - TestFlight (iOS) 배포
+   - Google Play 베타 프로그램 설정
+   - 베타 테스터 온보딩
+   - 베타 테스트 모니터링
+
+2. **피드백 수집**
+   - 인앱 피드백 시스템 구현
+   - 사용자 설문조사 설계
+   - 사용 데이터 분석
+   - 버그 리포트 수집
+
+3. **이슈 해결**
+   - 우선순위에 따른 버그 수정
+   - 사용자 피드백 기반 개선
+   - 성능 이슈 해결
+   - 안정성 개선
+
+4. **앱스토어 준비**
+   - 앱스토어 스크린샷 및 프리뷰 비디오 제작
+   - 앱 설명 및 메타데이터 작성
+   - 개인정보 처리방침 및 이용약관 최종화
+   - 앱 심사 대비 체크리스트
+
+#### 담당자
+- 프로젝트 매니저: 베타 테스트 관리, 앱스토어 준비
+- UI/UX 디자이너: 앱스토어 자료 제작
+- 모바일 개발자 1: 베타 배포, 주요 이슈 해결
+- 모바일 개발자 2: 피드백 시스템, 버그 수정
+- QA 엔지니어: 베타 테스트 모니터링, 이슈 트래킹
+
+#### 산출물
+- 베타 버전 출시
+- 사용자 피드백 분석 보고서
+- 이슈 해결 보고서
+- 앱스토어 제출 자료
+
+## 스프린트 진행 방식
+
+### 스프린트 계획 미팅
+- **시기**: 스프린트 시작일
+- **참석자**: 전체 팀
+- **목적**: 스프린트 목표 설정, 작업 항목 선정, 담당자 할당
+- **산출물**: 스프린트 백로그, 작업 항목 세부 내용
+
+### 일일 스크럼
+- **시기**: 매일 오전 10시
+- **참석자**: 개발팀
+- **목적**: 진행 상황 공유, 장애물 식별, 일일 계획 수립
+- **형식**: 15분 이내의 짧은 미팅 (각자 어제 한 일, 오늘 할 일, 장애물 공유)
+
+### 스프린트 리뷰
+- **시기**: 스프린트 마지막 날
+- **참석자**: 전체 팀 및 이해관계자
+- **목적**: 완료된 작업 시연, 피드백 수집
+- **산출물**: 피드백 목록, 다음 스프린트 고려사항
+
+### 스프린트 회고
+- **시기**: 스프린트 리뷰 직후
+- **참석자**: 개발팀
+- **목적**: 스프린트 프로세스 개선점 논의
+- **산출물**: 액션 아이템, 프로세스 개선 사항
+
+## 작업 추적 및 관리
+
+### 작업 항목 상태
+- **To Do**: 아직 시작되지 않은 작업
+- **In Progress**: 현재 진행 중인 작업
+- **Review**: 코드 리뷰 중인 작업
+- **Done**: 완료된 작업
+
+### 작업 항목 우선순위
+- **Critical**: 즉시 해결해야 하는 작업
+- **High**: 현재 스프린트에서 반드시 완료해야 하는 작업
+- **Medium**: 현재 스프린트에서 가능하면 완료해야 하는 작업
+- **Low**: 시간이 허락하면 진행할 작업
+
+### 작업 추적 도구
+- GitHub Projects: 작업 항목 관리
+- GitHub Issues: 세부 작업 및 버그 추적
+- Slack: 일상적인 커뮤니케이션
+- Figma: 디자인 공유 및 협업
+
+## 결론
+
+이 스프린트 계획은 ZELLYY 앱의 MVP 개발을 위한 로드맵을 제공합니다. 각 스프린트는 명확한 목표와 작업 항목을 가지고 있으며, 점진적으로 앱의 핵심 기능을 구현해 나갑니다. 이 계획은 프로젝트 진행 상황과 사용자 피드백에 따라 유연하게 조정될 수 있습니다.
--- a/note/04_참고자료/Git_이슈_트래킹_시스템.md
+++ b/note/04_참고자료/Git_이슈_트래킹_시스템.md
@@ -0,0 +1,293 @@
+# ZELLYY - Git 이슈 트래킹 시스템
+
+## 개요
+
+ZELLYY 프로젝트는 GitHub를 활용하여 이슈 트래킹 및 프로젝트 관리를 진행합니다. 이 문서는 개발팀이 일관된 방식으로 이슈를 생성, 관리, 해결하기 위한 가이드라인을 제공합니다.
+
+## 이슈 유형 분류
+
+ZELLYY 프로젝트에서는 다음과 같은 이슈 유형을 사용합니다:
+
+### 1. 기능 요청 (Feature Request)
+새로운 기능 개발이나 기존 기능 확장에 관한 이슈입니다.
+
+### 2. 버그 리포트 (Bug Report)
+애플리케이션의 오작동이나 예상치 못한 동작에 관한 이슈입니다.
+
+### 3. 개선 사항 (Enhancement)
+기존 기능의 사용성, 성능, 디자인 등을 개선하기 위한 이슈입니다.
+
+### 4. 문서화 (Documentation)
+코드, API, 사용자 가이드 등의 문서화에 관한 이슈입니다.
+
+### 5. 기술 부채 (Technical Debt)
+코드 리팩토링, 아키텍처 개선 등 기술적 부채 해소를 위한 이슈입니다.
+
+### 6. 질문 (Question)
+프로젝트에 관한 질문이나 논의가 필요한 사항에 대한 이슈입니다.
+
+## 이슈 라벨 시스템
+
+### 우선순위 라벨
+- `priority:critical` - 즉시 해결해야 하는 중대한 이슈
+- `priority:high` - 높은 우선순위로 다음 스프린트에서 처리해야 하는 이슈
+- `priority:medium` - 중간 우선순위로 향후 스프린트에서 처리할 이슈
+- `priority:low` - 낮은 우선순위로 여유가 있을 때 처리할 이슈
+
+### 상태 라벨
+- `status:backlog` - 아직 스프린트에 할당되지 않은 이슈
+- `status:ready` - 개발 준비가 완료된 이슈
+- `status:in-progress` - 현재 개발 중인 이슈
+- `status:review` - 코드 리뷰 중인 이슈
+- `status:blocked` - 다른 이슈나 외부 요인으로 인해 진행이 막힌 이슈
+
+### 유형 라벨
+- `type:feature` - 새로운 기능
+- `type:bug` - 버그 수정
+- `type:enhancement` - 기능 개선
+- `type:documentation` - 문서화 작업
+- `type:refactor` - 코드 리팩토링
+- `type:test` - 테스트 관련 작업
+
+### 컴포넌트 라벨
+- `component:ui` - UI 관련 이슈
+- `component:api` - API 관련 이슈
+- `component:database` - 데이터베이스 관련 이슈
+- `component:auth` - 인증 관련 이슈
+- `component:editor` - 카드 에디터 관련 이슈
+- `component:sharing` - 공유 기능 관련 이슈
+- `component:storage` - 저장 및 동기화 관련 이슈
+
+### 기타 라벨
+- `good-first-issue` - 신규 기여자에게 적합한 이슈
+- `help-wanted` - 외부 도움이 필요한 이슈
+- `discussion` - 추가 논의가 필요한 이슈
+- `wontfix` - 해결하지 않기로 결정된 이슈
+- `duplicate` - 중복된 이슈
+
+## 이슈 템플릿
+
+### 기능 요청 템플릿
+
+```markdown
+## 기능 설명
+[기능에 대한 간결한 설명]
+
+## 사용자 스토리
+[사용자 관점에서의 기능 설명, "사용자로서, ~할 수 있기를 원합니다. 그래서 ~할 수 있습니다." 형식]
+
+## 상세 요구사항
+- [요구사항 1]
+- [요구사항 2]
+- [요구사항 3]
+
+## 수용 기준
+- [ ] [기준 1]
+- [ ] [기준 2]
+- [ ] [기준 3]
+
+## 디자인 참조
+[관련 디자인 문서, 와이어프레임, 목업 등의 링크]
+
+## 추가 컨텍스트
+[기능 구현에 도움이 될 추가 정보]
+```
+
+### 버그 리포트 템플릿
+
+```markdown
+## 버그 설명
+[버그에 대한 간결한 설명]
+
+## 재현 단계
+1. [단계 1]
+2. [단계 2]
+3. [단계 3]
+
+## 예상 동작
+[정상적으로 작동했을 때 예상되는 동작]
+
+## 실제 동작
+[실제로 발생한 동작]
+
+## 스크린샷
+[가능한 경우 스크린샷 첨부]
+
+## 환경 정보
+- 기기: [예: iPhone 13 Pro]
+- OS: [예: iOS 16.2]
+- 앱 버전: [예: 1.2.0]
+- 기타 관련 정보
+
+## 가능한 해결 방법
+[알고 있는 경우, 가능한 해결 방법 제안]
+
+## 추가 컨텍스트
+[문제 해결에 도움이 될 추가 정보]
+```
+
+## 이슈 생성 가이드라인
+
+### 이슈 제목 작성법
+- 명확하고 간결하게 작성
+- 행동 지향적인 동사로 시작 (예: "구현", "수정", "개선")
+- 이슈의 핵심을 포함 (예: "카드 에디터에 텍스트 크기 조절 기능 구현")
+
+### 이슈 설명 작성법
+- 관련 템플릿 사용
+- 충분한 컨텍스트 제공
+- 명확한 요구사항 또는 문제점 설명
+- 가능한 경우 시각적 자료 첨부 (스크린샷, 다이어그램 등)
+- 관련 문서나 이슈 링크 제공
+
+### 이슈 할당 및 마일스톤 설정
+- 담당자가 명확한 경우 이슈 생성 시 할당
+- 적절한 마일스톤에 이슈 연결 (스프린트 또는 릴리스 버전)
+- 예상 완료 일자 설정 (가능한 경우)
+
+## 이슈 관리 워크플로우
+
+### 1. 이슈 생성
+- 적절한 템플릿을 사용하여 이슈 생성
+- 관련 라벨 적용
+- 필요한 경우 담당자 할당
+
+### 2. 이슈 트라이아지 (분류)
+- 주간 트라이아지 미팅에서 새 이슈 검토
+- 우선순위 및 마일스톤 설정
+- 필요한 추가 정보 요청
+
+### 3. 이슈 처리
+- 담당자는 이슈를 `status:in-progress`로 변경
+- 관련 브랜치 생성 (명명 규칙: `issue/[이슈번호]-[간략한-설명]`)
+- 작업 진행 및 커밋
+
+### 4. 코드 리뷰
+- 작업 완료 후 Pull Request 생성
+- 이슈 상태를 `status:review`로 변경
+- 코드 리뷰 진행 및 피드백 반영
+
+### 5. 이슈 종료
+- Pull Request가 승인되고 병합되면 이슈 종료
+- 이슈에 해결 방법 간략히 기록
+- 관련 문서 업데이트 필요 시 언급
+
+## GitHub 프로젝트 보드 구성
+
+ZELLYY 프로젝트는 GitHub 프로젝트 보드를 사용하여 이슈와 작업을 시각적으로 관리합니다.
+
+### 보드 컬럼
+1. **Backlog**: 아직 스프린트에 할당되지 않은 이슈
+2. **To Do**: 현재 스프린트에 할당되었지만 아직 시작되지 않은 이슈
+3. **In Progress**: 현재 작업 중인 이슈
+4. **Review**: 코드 리뷰 중인 이슈
+5. **Done**: 완료된 이슈
+
+### 자동화 규칙
+- 새 이슈는 자동으로 Backlog에 추가
+- `status:in-progress` 라벨이 적용된 이슈는 In Progress로 이동
+- `status:review` 라벨이 적용된 이슈는 Review로 이동
+- 이슈가 종료되면 자동으로 Done으로 이동
+
+## 브랜치 및 커밋 전략
+
+### 브랜치 명명 규칙
+- 기능 개발: `feature/[이슈번호]-[간략한-설명]`
+- 버그 수정: `bugfix/[이슈번호]-[간략한-설명]`
+- 문서 작업: `docs/[이슈번호]-[간략한-설명]`
+- 리팩토링: `refactor/[이슈번호]-[간략한-설명]`
+
+### 커밋 메시지 형식
+```
+[이슈번호] 유형: 간결한 설명
+
+상세 설명 (필요한 경우)
+```
+
+예시:
+```
+[#42] feat: 카드 에디터에 텍스트 크기 조절 기능 추가
+
+- 슬라이더를 사용하여 텍스트 크기 조절 가능
+- 8pt에서 72pt까지 조절 가능
+- 기본값은 16pt로 설정
+```
+
+### 커밋 유형
+- `feat`: 새로운 기능 추가
+- `fix`: 버그 수정
+- `docs`: 문서 변경
+- `style`: 코드 포맷팅, 세미콜론 누락 등 (코드 변경 없음)
+- `refactor`: 코드 리팩토링
+- `test`: 테스트 코드 추가 또는 수정
+- `chore`: 빌드 프로세스, 도구 변경 등
+
+## Pull Request 프로세스
+
+### PR 템플릿
+
+```markdown
+## 관련 이슈
+[관련 이슈 번호 및 링크]
+
+## 변경 사항
+[변경 사항에 대한 간결한 설명]
+
+## 변경 유형
+- [ ] 새로운 기능
+- [ ] 버그 수정
+- [ ] 성능 개선
+- [ ] 코드 리팩토링
+- [ ] 스타일 변경 (코드 기능에 영향 없음)
+- [ ] 문서 업데이트
+- [ ] 기타 (설명: )
+
+## 테스트 방법
+[변경 사항을 테스트하는 방법 설명]
+
+## 스크린샷 (UI 변경의 경우)
+[변경 전/후 스크린샷]
+
+## 체크리스트
+- [ ] 코드가 스타일 가이드를 준수합니다
+- [ ] 자체 코드 리뷰를 수행했습니다
+- [ ] 관련 문서를 업데이트했습니다
+- [ ] 테스트를 추가/수정했습니다
+- [ ] 모든 테스트가 통과합니다
+```
+
+### PR 리뷰 가이드라인
+- 최소 1명의 승인이 필요
+- 코드 품질, 테스트 커버리지, 문서화 확인
+- 건설적인 피드백 제공
+- 24시간 이내에 리뷰 완료 (가능한 경우)
+
+### 병합 전략
+- Squash and merge 사용 (여러 커밋을 하나로 압축)
+- 병합 전 CI 파이프라인 통과 확인
+- 병합 후 관련 이슈 자동 종료 (키워드 사용: "Closes #이슈번호")
+
+## 릴리스 프로세스
+
+### 버전 관리
+ZELLYY는 [Semantic Versioning](https://semver.org/) 체계를 따릅니다:
+- **Major 버전 (X.0.0)**: 이전 버전과 호환되지 않는 API 변경
+- **Minor 버전 (0.X.0)**: 이전 버전과 호환되는 새로운 기능 추가
+- **Patch 버전 (0.0.X)**: 버그 수정 및 작은 개선
+
+### 릴리스 브랜치
+- 릴리스 준비: `release/vX.Y.Z` 브랜치 생성
+- 릴리스 후보 테스트 및 버그 수정
+- 최종 릴리스: 메인 브랜치에 병합 및 태그 생성
+
+### 릴리스 노트
+- GitHub Releases 기능 활용
+- 주요 기능, 개선 사항, 버그 수정 등 카테고리별 정리
+- 사용자 관점에서 이해하기 쉬운 설명 제공
+- 스크린샷 또는 GIF 포함 (UI 변경의 경우)
+
+## 결론
+
+이 Git 이슈 트래킹 시스템은 ZELLYY 프로젝트의 효율적인 개발 관리를 위한 가이드라인입니다. 모든 팀원은 이 가이드라인을 따라 일관된 방식으로 이슈를 생성하고 관리함으로써, 프로젝트의 투명성과 협업 효율성을 높일 수 있습니다.
+
+이 문서는 프로젝트의 진행 상황과 팀의 필요에 따라 지속적으로 업데이트될 예정입니다.
--- a/note/04_참고자료/index.md
+++ b/note/04_참고자료/index.md
@@ -0,0 +1,34 @@
+# ZELLYY 참고자료
+
+## 목차
+
+1. [경쟁 앱 분석](경쟁_앱_분석.md)
+2. [시장 조사 자료](./시장_조사_자료.md)
+3. [디자인 참고 리소스](./디자인_참고_리소스.md)
+4. [기술 참고 자료](./기술_참고_자료.md)
+
+## 참고자료 개요
+
+ZELLYY 프로젝트의 참고자료 섹션에서는 프로젝트 개발에 참고할 수 있는 다양한 자료와 리소스를 제공합니다. 경쟁 앱 분석, 시장 조사 자료, 디자인 참고 리소스, 기술 참고 자료 등이 포함됩니다.
+
+## 주요 문서
+
+- **경쟁 앱 분석**: 주요 경쟁 앱의 기능, UI/UX, 비즈니스 모델 등을 분석한 문서
+- **시장 조사 자료**: 타겟 시장, 사용자 니즈, 트렌드 등에 관한 조사 자료
+- **디자인 참고 리소스**: UI/UX 디자인 참고 자료, 디자인 트렌드, 가이드라인 등
+- **기술 참고 자료**: 개발에 참고할 수 있는 기술 문서, 튜토리얼, 라이브러리 정보 등
+
+## 자료 수집 및 관리 원칙
+
+1. **최신성**: 최신 트렌드와 기술을 반영한 자료 수집
+2. **관련성**: 프로젝트의 목표와 방향성에 부합하는 자료 선별
+3. **다양성**: 다양한 관점과 접근 방식을 포함하는 자료 수집
+4. **신뢰성**: 신뢰할 수 있는 출처의 자료 활용
+5. **접근성**: 팀원 모두가 쉽게 접근하고 활용할 수 있는 형태로 자료 관리
+
+## 참고자료 활용 방법
+
+- 기획 및 설계 단계에서 경쟁 앱 분석과 시장 조사 자료 참고
+- UI/UX 설계 시 디자인 참고 리소스 활용
+- 개발 과정에서 기술 참고 자료 활용
+- 정기적인 자료 업데이트 및 공유를 통한 지식 확산
--- a/note/04_참고자료/경쟁_앱_분석.md
+++ b/note/04_참고자료/경쟁_앱_분석.md
@@ -0,0 +1,236 @@
+# ZELLYY - 경쟁 앱 분석
+
+## 개요
+
+이 문서는 ZELLYY와 유사한 기능을 제공하는 주요 경쟁 앱들을 분석하여, 시장 동향을 파악하고 ZELLYY의 차별화 전략을 수립하는 데 참고 자료로 활용됩니다.
+
+## 주요 경쟁 앱 분석
+
+### 1. Canva
+
+#### 기본 정보
+- **개발사**: Canva Pty Ltd
+- **출시일**: 2013년
+- **플랫폼**: 웹, iOS, Android
+- **가격 정책**: 프리미엄(무료 기본 기능, 유료 구독)
+- **주요 타겟**: 디자인 비전문가, 소규모 비즈니스, 소셜 미디어 마케터
+
+#### 주요 기능
+- 다양한 디자인 템플릿(소셜 미디어 포스트, 프레젠테이션, 인쇄물 등)
+- 드래그 앤 드롭 인터페이스
+- 이미지, 텍스트, 그래픽 요소 편집
+- 팀 협업 기능
+- 클라우드 저장 및 공유
+
+#### 강점
+- 방대한 템플릿 라이브러리
+- 직관적인 사용자 인터페이스
+- 다양한 디자인 에셋(폰트, 이미지, 아이콘 등)
+- 강력한 브랜드 인지도
+- 웹과 모바일 간 원활한 동기화
+
+#### 약점
+- 모바일 앱에서 제한된 기능
+- 복잡한 디자인 작업에는 부적합
+- 고급 기능은 유료 구독 필요
+- 사용자 인터페이스가 다소 복잡함
+- 모바일에서 작업 시 화면 크기 제약
+
+### 2. Adobe Spark Post
+
+#### 기본 정보
+- **개발사**: Adobe Inc.
+- **출시일**: 2016년
+- **플랫폼**: 웹, iOS, Android
+- **가격 정책**: 프리미엄(무료 기본 기능, Adobe Creative Cloud 구독)
+- **주요 타겟**: 소셜 미디어 콘텐츠 크리에이터, Adobe 사용자
+
+#### 주요 기능
+- 소셜 미디어 포스트 특화 템플릿
+- 애니메이션 및 동적 효과
+- Adobe 폰트 및 스톡 이미지 통합
+- 브랜드 키트 기능
+- 크기 조정 및 플랫폼별 최적화
+
+#### 강점
+- Adobe의 디자인 전문성 반영
+- 고품질 템플릿 및 디자인 에셋
+- 직관적인 모바일 인터페이스
+- Adobe Creative Cloud와의 통합
+- 애니메이션 및 동적 효과 지원
+
+#### 약점
+- 완전한 기능은 Adobe 구독 필요
+- 제한된 커스터마이징 옵션
+- 웹 버전과 모바일 버전 간 기능 차이
+- 학습 곡선이 다소 높음
+- 무거운 앱 크기
+
+### 3. Over (현 GoDaddy Studio)
+
+#### 기본 정보
+- **개발사**: GoDaddy (이전 Over)
+- **출시일**: 2012년 (2019년 GoDaddy 인수)
+- **플랫폼**: iOS, Android
+- **가격 정책**: 프리미엄(무료 기본 기능, 유료 구독)
+- **주요 타겟**: 소셜 미디어 인플루언서, 소규모 비즈니스
+
+#### 주요 기능
+- 모바일 중심 디자인 경험
+- 레이어 기반 편집
+- 소셜 미디어 최적화 템플릿
+- 폰트 및 그래픽 라이브러리
+- 사진 편집 및 필터
+
+#### 강점
+- 모바일에 최적화된 사용자 경험
+- 직관적인 레이어 관리
+- 트렌디한 디자인 템플릿
+- 소셜 미디어 포스트에 특화
+- 빠른 편집 워크플로우
+
+#### 약점
+- 웹 버전 부재
+- 복잡한 프로젝트 관리의 어려움
+- 제한된 협업 기능
+- 고급 기능은 유료 구독 필요
+- GoDaddy 인수 후 브랜드 정체성 변화
+
+### 4. Unfold
+
+#### 기본 정보
+- **개발사**: Squarespace (인수)
+- **출시일**: 2018년
+- **플랫폼**: iOS, Android
+- **가격 정책**: 프리미엄(무료 기본 기능, 유료 구독)
+- **주요 타겟**: 인스타그램 스토리 크리에이터, 소셜 미디어 인플루언서
+
+#### 주요 기능
+- 인스타그램 스토리 특화 템플릿
+- 미니멀한 디자인 스타일
+- 스토리 시퀀스 및 컬렉션 관리
+- 기본 텍스트 및 이미지 편집
+- 바이오 사이트 생성
+
+#### 강점
+- 세련되고 미니멀한 디자인 미학
+- 매우 직관적인 사용자 인터페이스
+- 스토리 시퀀스 관리에 최적화
+- 빠른 콘텐츠 제작 가능
+- 일관된 브랜드 이미지 유지 용이
+
+#### 약점
+- 제한된 커스터마이징 옵션
+- 특정 디자인 스타일에 국한됨
+- 웹 버전 부재
+- 다양한 소셜 미디어 플랫폼 지원 제한적
+- 고급 편집 기능 부족
+
+### 5. Hype Type
+
+#### 기본 정보
+- **개발사**: Lightricks Ltd.
+- **출시일**: 2017년
+- **플랫폼**: iOS, Android
+- **가격 정책**: 프리미엄(무료 기본 기능, 유료 구독)
+- **주요 타겟**: 소셜 미디어 콘텐츠 크리에이터, 인플루언서
+
+#### 주요 기능
+- 애니메이션 텍스트 효과
+- 비디오 및 이미지에 텍스트 오버레이
+- 다양한 텍스트 스타일 및 애니메이션
+- 소셜 미디어 직접 공유
+- 기본 비디오 편집
+
+#### 강점
+- 텍스트 애니메이션에 특화
+- 직관적인 모바일 인터페이스
+- 트렌디한 텍스트 효과
+- 빠른 콘텐츠 제작 가능
+- 소셜 미디어 통합
+
+#### 약점
+- 제한된 템플릿 옵션
+- 정적 이미지 편집 기능 제한적
+- 고급 기능은 유료 구독 필요
+- 협업 기능 부재
+- 웹 버전 부재
+
+## 시장 동향 분석
+
+### 주요 트렌드
+
+1. **모바일 중심 경험**
+   - 대부분의 경쟁 앱들이 모바일 우선 또는 모바일 전용으로 개발됨
+   - 모바일에서의 직관적인 터치 인터페이스 중요성 증가
+
+2. **템플릿 기반 접근**
+   - 사용자 경험 간소화를 위한 템플릿 중심 디자인
+   - 트렌디하고 다양한 템플릿 제공이 경쟁력의 핵심
+
+3. **소셜 미디어 최적화**
+   - 각 소셜 미디어 플랫폼별 최적화된 형식 지원
+   - 직접 공유 기능 통합
+
+4. **구독 기반 비즈니스 모델**
+   - 기본 기능은 무료, 고급 기능은 구독제로 제공
+   - 월간/연간 구독 옵션 제공
+
+5. **브랜딩 기능 강화**
+   - 일관된 브랜드 이미지 유지를 위한 기능 증가
+   - 브랜드 키트, 색상 팔레트, 폰트 세트 등 저장 기능
+
+### 기회 요소
+
+1. **텍스트 중심 특화**
+   - 대부분의 앱이 이미지 편집에 중점을 두는 반면, 텍스트 표현과 타이포그래피에 특화된 앱은 상대적으로 적음
+   - 인용구, 생각, 아이디어 등 텍스트 중심 콘텐츠에 특화된 기능 개발 기회
+
+2. **극도의 단순함**
+   - 경쟁 앱들이 점차 기능을 추가하며 복잡해지는 경향
+   - 핵심 기능에 집중한 매우 단순한 인터페이스로 차별화 가능
+
+3. **오프라인 기능**
+   - 대부분의 앱이 클라우드 중심으로 운영되어 오프라인 기능이 제한적
+   - 강력한 오프라인 모드 지원으로 차별화 가능
+
+4. **개인 아카이브 기능**
+   - 대부분의 앱이 공유 목적에 초점을 맞추고 있음
+   - 개인 지식 관리 및 아카이브 기능으로 확장 가능성
+
+5. **빠른 워크플로우**
+   - 경쟁 앱들은 다양한 기능을 제공하지만 작업 완료까지 여러 단계 필요
+   - "3탭 이내" 원칙으로 빠른 콘텐츠 제작 워크플로우 제공 가능
+
+## ZELLYY 차별화 전략
+
+### 1. 텍스트 중심 특화
+- 텍스트 표현과 타이포그래피에 특화된 기능 개발
+- 다양한 텍스트 레이아웃 및 스타일링 옵션 제공
+- 텍스트 중심 콘텐츠를 위한 최적화된 템플릿 제공
+
+### 2. 극도의 단순함
+- "3탭 이내" 원칙으로 설계된 워크플로우
+- 필수 기능만 포함하여 학습 곡선 최소화
+- 직관적인 디자인 가이드라인 내장
+
+### 3. 모바일 네이티브 경험
+- 모바일 환경에 완전히 최적화된 인터페이스
+- 터치 제스처를 활용한 직관적 조작
+- 오프라인 작업 지원
+
+### 4. 소셜 미디어 최적화
+- 주요 소셜 플랫폼에 최적화된 형식과 크기 지원
+- 플랫폼별 특성을 고려한 템플릿
+- 공유 과정의 마찰 최소화
+
+### 5. 개인화 및 브랜딩 지원
+- 사용자 브랜드 요소 저장 및 적용
+- 개인 스타일 프리셋 생성 및 적용
+- 일관된 시각적 아이덴티티 유지 지원
+
+## 결론
+
+ZELLYY는 경쟁이 치열한 디자인 앱 시장에서 텍스트 중심 특화, 극도의 단순함, 모바일 네이티브 경험을 통해 차별화할 수 있습니다. 대부분의 경쟁 앱들이 다양한 기능을 추가하며 복잡해지는 경향이 있는 반면, ZELLYY는 핵심 기능에 집중하여 사용자가 빠르고 쉽게 고품질 콘텐츠를 제작할 수 있도록 지원하는 것이 핵심 전략입니다.
+
+특히 텍스트 중심 콘텐츠 제작에 특화된 기능과 소셜 미디어 최적화 기능을 강화하여, 콘텐츠 크리에이터와 소규모 비즈니스 사용자들에게 차별화된 가치를 제공할 수 있을 것으로 기대됩니다.
--- a/note/04_참고자료/시장_조사_보고서.md
+++ b/note/04_참고자료/시장_조사_보고서.md
@@ -0,0 +1,327 @@
+# ZELLYY - 시장 조사 보고서
+
+## 1. 시장 개요
+
+### 1.1 모바일 디자인 앱 시장 현황
+
+모바일 디자인 및 콘텐츠 제작 앱 시장은 지속적인 성장세를 보이고 있습니다. 소셜 미디어의 보편화와 시각적 콘텐츠의 중요성 증가로 인해, 전문 디자인 지식 없이도 고품질 콘텐츠를 제작할 수 있는 도구에 대한 수요가 크게 증가하고 있습니다.
+
+**주요 시장 지표:**
+- 글로벌 모바일 디자인 앱 시장 규모: 2023년 기준 약 5.2억 달러
+- 연간 성장률(CAGR): 약 18.7% (2023-2028 예상)
+- 주요 성장 동력: 소셜 미디어 사용 증가, 콘텐츠 크리에이터 증가, 비전문가의 디자인 수요 증가
+- 주요 시장 세그먼트: 소셜 미디어 콘텐츠 제작, 마케팅 자료 제작, 개인 브랜딩
+
+### 1.2 주요 사용자 그룹
+
+시장 조사 결과, 모바일 디자인 앱의 주요 사용자 그룹은 다음과 같이 분류됩니다:
+
+1. **콘텐츠 크리에이터 (시장 점유율: 35%)**
+   - 인플루언서, 블로거, 유튜버 등 소셜 미디어에서 활동하는 개인
+   - 주요 니즈: 빠른 콘텐츠 제작, 브랜드 일관성, 다양한 플랫폼 지원
+
+2. **소상공인 및 스타트업 (시장 점유율: 28%)**
+   - 마케팅 전담 인력 없이 콘텐츠를 직접 제작하는 소규모 비즈니스
+   - 주요 니즈: 비용 효율성, 전문적인 결과물, 브랜드 일관성
+
+3. **마케팅 전문가 (시장 점유율: 20%)**
+   - 기업의 마케팅 담당자, 소셜 미디어 매니저
+   - 주요 니즈: 팀 협업, 브랜드 가이드라인 준수, 콘텐츠 일정 관리
+
+4. **개인 사용자 (시장 점유율: 17%)**
+   - 개인적인 용도로 시각 콘텐츠를 제작하는 일반 사용자
+   - 주요 니즈: 사용 용이성, 무료 옵션, 기본적인 디자인 기능
+
+## 2. 시장 트렌드 분석
+
+### 2.1 주요 트렌드
+
+1. **모바일 중심 경험**
+   - 데스크톱보다 모바일에서의 콘텐츠 제작 선호도 증가
+   - 모바일 최적화된 UI/UX에 대한 수요 증가
+   - 통계: 디자인 앱 사용자의 68%가 주로 모바일에서 콘텐츠 제작
+
+2. **AI 기반 디자인 지원**
+   - AI를 활용한 디자인 추천 및 자동화 기능 증가
+   - 텍스트 기반 디자인 생성 기능 인기
+   - 통계: AI 기능이 있는 디자인 앱의 사용자 만족도 23% 높음
+
+3. **구독 기반 비즈니스 모델**
+   - 일회성 구매보다 구독 모델로의 전환 가속화
+   - 프리미엄 기능에 대한 월간/연간 구독 옵션 제공
+   - 통계: 디자인 앱 수익의 75%가 구독 모델에서 발생
+
+4. **템플릿 중심 접근**
+   - 사용자 경험 간소화를 위한 템플릿 기반 디자인
+   - 트렌디한 템플릿에 대한 수요 증가
+   - 통계: 사용자의 82%가 처음부터 디자인하기보다 템플릿 활용 선호
+
+5. **소셜 미디어 최적화**
+   - 플랫폼별 최적화된 콘텐츠 제작 도구 수요 증가
+   - 인스타그램, 틱톡 등 새로운 플랫폼 지원 필요성
+   - 통계: 다중 플랫폼 지원 앱의 사용자 유지율 35% 높음
+
+### 2.2 사용자 행동 분석
+
+**콘텐츠 제작 빈도:**
+- 주 1-3회: 45%
+- 주 4-7회: 32%
+- 주 7회 이상: 23%
+
+**평균 콘텐츠 제작 시간:**
+- 10분 미만: 12%
+- 10-30분: 48%
+- 30분-1시간: 28%
+- 1시간 이상: 12%
+
+**주요 사용 시간대:**
+- 오전 (6AM-12PM): 22%
+- 오후 (12PM-6PM): 35%
+- 저녁 (6PM-12AM): 38%
+- 심야 (12AM-6AM): 5%
+
+**디자인 앱 선택 기준 (중요도 순):**
+1. 사용 용이성
+2. 템플릿 다양성
+3. 가격
+4. 결과물 품질
+5. 공유 기능
+
+## 3. 경쟁 환경 분석
+
+### 3.1 시장 점유율
+
+**주요 경쟁사 시장 점유율 (2023년 기준):**
+1. Canva: 34%
+2. Adobe Spark: 18%
+3. Over (GoDaddy Studio): 12%
+4. Unfold: 8%
+5. PicCollage: 6%
+6. 기타: 22%
+
+### 3.2 가격 전략 비교
+
+| 앱 이름 | 무료 버전 | 구독 가격 (월간) | 구독 가격 (연간) | 주요 프리미엄 기능 |
+|---------|-----------|-----------------|-----------------|-------------------|
+| Canva | 있음 | $12.99 | $119.99 ($10/월) | 프리미엄 템플릿, 배경 제거, 브랜드 키트 |
+| Adobe Spark | 있음 | $9.99 | $99.99 ($8.33/월) | 워터마크 제거, Adobe 폰트, 브랜딩 |
+| Over | 있음 | $14.99 | $89.99 ($7.50/월) | 프리미엄 그래픽, 폰트, 템플릿 |
+| Unfold | 있음 | $3.99 | $19.99 ($1.67/월) | 프리미엄 템플릿, 고급 폰트 |
+| ZELLYY (계획) | 있음 | $4.99 | $39.99 ($3.33/월) | 클라우드 동기화, 고급 템플릿, 워터마크 제거 |
+
+### 3.3 기능 비교 분석
+
+| 기능 | Canva | Adobe Spark | Over | Unfold | ZELLYY (계획) |
+|------|-------|-------------|------|--------|--------------|
+| 템플릿 수 | 250,000+ | 30,000+ | 20,000+ | 5,000+ | 10,000+ (목표) |
+| 모바일 최적화 | 중간 | 중간 | 높음 | 높음 | 매우 높음 |
+| 텍스트 편집 기능 | 높음 | 높음 | 중간 | 낮음 | 매우 높음 |
+| 소셜 미디어 통합 | 높음 | 높음 | 중간 | 높음 | 높음 |
+| 오프라인 기능 | 제한적 | 제한적 | 제한적 | 제한적 | 광범위 |
+| 사용 용이성 | 중간 | 중간 | 높음 | 매우 높음 | 매우 높음 |
+| 협업 기능 | 있음 | 제한적 | 없음 | 없음 | 계획 중 |
+| AI 기능 | 있음 | 있음 | 제한적 | 없음 | 계획 중 |
+
+## 4. 타겟 시장 분석
+
+### 4.1 지역별 시장 기회
+
+**지역별 시장 규모 및 성장률:**
+1. 북미: 38% (CAGR 15.2%)
+2. 유럽: 27% (CAGR 16.8%)
+3. 아시아태평양: 22% (CAGR 22.5%)
+4. 중동 및 아프리카: 8% (CAGR 19.3%)
+5. 남미: 5% (CAGR 17.6%)
+
+**주요 타겟 국가 (우선순위):**
+1. 미국
+2. 한국
+3. 일본
+4. 영국
+5. 호주
+6. 캐나다
+7. 독일
+
+### 4.2 인구통계학적 분석
+
+**연령대별 사용자 분포:**
+- 18-24세: 28%
+- 25-34세: 42%
+- 35-44세: 18%
+- 45-54세: 8%
+- 55세 이상: 4%
+
+**성별 분포:**
+- 여성: 62%
+- 남성: 38%
+
+**직업별 분포:**
+- 마케팅/PR: 22%
+- 학생: 18%
+- 프리랜서: 15%
+- 소상공인: 14%
+- 기업 직원: 12%
+- 교육자: 8%
+- 기타: 11%
+
+### 4.3 사용자 니즈 분석
+
+**해결되지 않은 사용자 니즈:**
+1. **시간 효율성**: 현재 앱들은 여전히 콘텐츠 제작에 많은 시간 소요
+   - 기회: 3탭 이내 완성 원칙으로 차별화
+   
+2. **텍스트 중심 디자인**: 대부분의 앱이 이미지 중심으로 설계됨
+   - 기회: 텍스트 표현과 타이포그래피에 특화된 기능 개발
+
+3. **모바일 최적화**: 기존 앱들은 데스크톱 기능을 모바일로 축소한 경향
+   - 기회: 모바일 네이티브 경험 제공
+
+4. **오프라인 기능**: 대부분의 앱이 온라인 연결 필요
+   - 기회: 강력한 오프라인 모드 지원
+
+5. **개인화**: 사용자별 맞춤형 추천 및 설정 부족
+   - 기회: 사용 패턴 기반 개인화된 템플릿 및 기능 추천
+
+## 5. SWOT 분석
+
+### 5.1 강점 (Strengths)
+- 텍스트 중심 특화로 차별화된 포지셔닝
+- 모바일 네이티브 경험에 최적화된 설계
+- "3탭 이내" 원칙으로 사용 용이성 극대화
+- 강력한 오프라인 기능 지원
+- 경쟁사 대비 합리적인 가격 책정
+
+### 5.2 약점 (Weaknesses)
+- 신생 앱으로서의 낮은 인지도
+- 제한된 초기 템플릿 라이브러리
+- 경쟁사 대비 제한된 개발 리소스
+- 이미지 편집 기능의 제한
+- 초기 사용자 기반 부족
+
+### 5.3 기회 (Opportunities)
+- 텍스트 중심 콘텐츠의 인기 증가
+- 모바일에서의 콘텐츠 제작 수요 증가
+- 소셜 미디어 플랫폼의 지속적 성장
+- 비전문가의 디자인 수요 증가
+- 구독 기반 모델의 수용성 증가
+
+### 5.4 위협 (Threats)
+- 기존 대형 경쟁사의 시장 지배력
+- 유사 기능을 제공하는 신규 앱의 등장
+- 소셜 미디어 플랫폼의 자체 디자인 도구 개발
+- 무료 대안의 증가로 인한 가격 압박
+- 빠르게 변화하는 디자인 트렌드와 기술
+
+## 6. 시장 진입 전략
+
+### 6.1 차별화 전략
+
+ZELLYY는 다음과 같은 핵심 차별화 포인트를 중심으로 시장에 진입할 계획입니다:
+
+1. **텍스트 중심 특화**
+   - 텍스트 표현과 타이포그래피에 특화된 기능 개발
+   - 다양한 텍스트 레이아웃 및 스타일링 옵션 제공
+   - 텍스트 중심 콘텐츠를 위한 최적화된 템플릿 제공
+
+2. **극도의 단순함**
+   - "3탭 이내" 원칙으로 설계된 워크플로우
+   - 필수 기능만 포함하여 학습 곡선 최소화
+   - 직관적인 디자인 가이드라인 내장
+
+3. **모바일 네이티브 경험**
+   - 모바일 환경에 완전히 최적화된 인터페이스
+   - 터치 제스처를 활용한 직관적 조작
+   - 오프라인 작업 지원
+
+### 6.2 가격 전략
+
+ZELLYY는 프리미엄(freemium) 모델을 채택하여 기본 기능은 무료로 제공하고, 고급 기능은 구독 모델을 통해 수익화할 계획입니다:
+
+**무료 버전:**
+- 기본 카드 제작 및 편집 기능
+- 제한된 템플릿 세트 (50개)
+- 기본 소셜 미디어 공유 기능
+- 워터마크 포함 내보내기
+- 로컬 저장 기능
+
+**프리미엄 구독 ($4.99/월 또는 $39.99/년):**
+- 모든 템플릿 접근 권한
+- 워터마크 제거
+- 고급 텍스트 효과 및 스타일링
+- 클라우드 저장 및 동기화
+- 우선 고객 지원
+
+**초기 프로모션:**
+- 출시 후 첫 3개월간 연간 구독 30% 할인
+- 얼리 어답터 특별 혜택 (평생 20% 할인)
+- 인플루언서 파트너십 프로그램
+
+### 6.3 마케팅 전략
+
+**디지털 마케팅:**
+- 인스타그램, 페이스북, 틱톡 등 소셜 미디어 광고
+- 구글 검색 및 앱스토어 최적화 (ASO)
+- 콘텐츠 마케팅 (블로그, 튜토리얼, 디자인 팁)
+- 이메일 마케팅 캠페인
+
+**인플루언서 협업:**
+- 디자인, 마케팅, 소셜 미디어 관련 인플루언서 파트너십
+- 인플루언서 제작 튜토리얼 및 사용 사례
+- 공동 브랜딩 템플릿 개발
+
+**커뮤니티 구축:**
+- 사용자 커뮤니티 플랫폼 구축
+- 디자인 챌린지 및 콘테스트 개최
+- 사용자 제작 템플릿 공유 시스템
+
+**파트너십:**
+- 소셜 미디어 플랫폼과의 공식 파트너십
+- 소규모 비즈니스 지원 프로그램
+- 교육 기관 할인 프로그램
+
+## 7. 결론 및 권장사항
+
+### 7.1 시장 기회 요약
+
+ZELLYY는 다음과 같은 시장 기회를 활용할 수 있습니다:
+
+1. 텍스트 중심 콘텐츠 제작에 특화된 앱에 대한 수요 증가
+2. 모바일에서의 콘텐츠 제작 선호도 증가
+3. 비전문가의 디자인 도구 사용 증가
+4. 소셜 미디어 플랫폼의 지속적 성장
+5. 사용 용이성에 대한 높은 가치 부여
+
+### 7.2 주요 권장사항
+
+1. **단계적 출시 전략**
+   - MVP 출시 후 사용자 피드백 기반 기능 확장
+   - 핵심 차별화 요소에 집중하여 초기 사용자 확보
+
+2. **타겟 사용자 집중**
+   - 초기에는 콘텐츠 크리에이터와 소상공인에 집중
+   - 사용자 성공 사례 구축 및 홍보
+
+3. **지속적인 템플릿 업데이트**
+   - 트렌드를 반영한 정기적 템플릿 업데이트
+   - 사용자 생성 템플릿 시스템 구축
+
+4. **데이터 기반 개선**
+   - 사용자 행동 분석을 통한 지속적 UX 개선
+   - A/B 테스트를 통한 전환율 최적화
+
+5. **확장 계획**
+   - 웹 버전 개발을 통한 크로스 플랫폼 지원
+   - AI 기능 도입을 통한 경쟁력 강화
+
+### 7.3 성공 지표
+
+ZELLYY의 시장 진입 성공을 측정하기 위한 주요 지표:
+
+1. **사용자 확보**: 출시 6개월 내 50,000명 이상의 활성 사용자
+2. **구독 전환율**: 무료 사용자의 5% 이상 유료 구독 전환
+3. **사용자 참여**: 사용자당 월 평균 10개 이상의 카드 작성
+4. **공유율**: 작성된 카드의 30% 이상이 SNS에 공유됨
+5. **사용자 유지율**: 30일 사용자 유지율 40% 이상
+6. **앱스토어 평점**: 4.5/5.0 이상 유지
+
+이 시장 조사 보고서는 ZELLYY의 시장 진입 및 성장 전략 수립을 위한 기초 자료로 활용될 수 있으며, 시장 상황 변화에 따라 정기적으로 업데이트될 예정입니다.
--- a/note/README.md
+++ b/note/README.md
@@ -0,0 +1,48 @@
+# ZELLYY 프로젝트
+
+## 프로젝트 개요
+
+ZELLYY는 모바일 중심의 카드 제작 애플리케이션으로, 사용자들이 디자인 전문 지식 없이도 고품질의 시각적 콘텐츠를 쉽고 빠르게 제작할 수 있도록 돕는 서비스입니다. 특히 소셜 미디어에 공유하기 위한 텍스트 중심의 카드(인용구, 생각, 아이디어 등)를 직관적인 인터페이스로 제작하고 관리할 수 있습니다.
+
+## 폴더 구조
+
+- **00_프로젝트_개요/**: 프로젝트의 비전, 미션, 핵심 문제 정의, 사용자 페르소나 등
+- **01_기획_및_설계/**: 요구사항 분석, MVP 기능 목록, 주요 사용 시나리오, UI/UX 설계 등
+- **02_기술_문서/**: 시스템 아키텍처, 데이터 모델, API 명세 등
+- **03_개발_단계/**: 개발 로드맵, 스프린트 계획, 개발 가이드라인 등
+- **04_참고자료/**: 경쟁 앱 분석, 시장 조사 자료, 참고 리소스 등
+
+## 주요 문서
+
+- [프로젝트 개요](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/01_프로젝트_소개.md)
+- [핵심 문제 정의](핵심_문제_정의.md)
+- [사용자 페르소나](1.%20Project/2.%20ZELLYY/젤리의%20노트/00_프로젝트_개요/사용자_페르소나.md)
+- [MVP 기능 목록](1.%20Project/2.%20ZELLYY/젤리의%20노트/01_기획_및_설계/MVP_기능_목록.md)
+- [주요 사용 시나리오](주요_사용_시나리오.md)
+- [시스템 아키텍처](./04_시스템_아키텍처.md)
+- [개발 로드맵](./05_개발_로드맵.md)
+- [데이터 모델 설계](./06_데이터_모델_설계.md)
+
+## 개발 환경
+
+- **프론트엔드**: React Native, Redux, TypeScript
+- **백엔드**: Supabase, Node.js (필요시)
+- **웹 프론트엔드**: React.js, Next.js (향후 개발)
+- **인프라**: Supabase 자체 호스팅 (Debian 12 서버)
+
+## 팀 구성
+
+- **프로젝트 매니저**: 1명
+- **UI/UX 디자이너**: 1명
+- **모바일 개발자**: 2명
+- **백엔드 개발자**: 1명
+- **QA 엔지니어**: 1명
+
+## 프로젝트 일정
+
+- **기획 및 설계**: 2023년 Q4
+- **모바일 앱 MVP 개발**: 2024년 Q1
+- **베타 테스트 및 개선**: 2024년 Q2
+- **출시 및 클라우드 동기화**: 2024년 Q3
+- **웹 서비스 개발**: 2024년 Q4
+- **커뮤니티 기능 및 확장**: 2025년 Q1-Q2
--- a/subscription/api_design.md
+++ b/subscription/api_design.md
@@ -0,0 +1,245 @@
+# Subscription Manager - API 설계
+
+## 개요
+이 문서는 Subscription Manager 앱의 API 설계를 정의합니다. 초기 MVP에서는 로컬 데이터베이스만 사용하지만, 향후 클라우드 동기화 및 외부 서비스 연동을 위한 API 설계를 미리 준비합니다.
+
+## API 설계 원칙
+- **RESTful 원칙 준수**: 자원 중심 설계, HTTP 메소드 활용
+- **JSON 포맷**: 모든 요청/응답은 JSON 형식 사용
+- **버전 관리**: API 경로에 버전 정보 포함 (예: /api/v1/...)
+- **인증 필수**: 모든 API 요청은 인증 필요 (JWT 토큰 기반)
+- **에러 처리 표준화**: 일관된 에러 응답 형식 제공
+
+## 인증 및 보안
+- **인증 방식**: JWT (JSON Web Token)
+- **토큰 갱신**: Refresh Token 메커니즘 활용
+- **HTTPS 필수**: 모든 API 통신은 HTTPS로 암호화
+- **Rate Limiting**: 과도한 요청 방지를 위한 제한 적용
+
+## API 엔드포인트
+
+### 사용자 관리
+```
+POST   /api/v1/auth/register     - 사용자 등록
+POST   /api/v1/auth/login        - 로그인
+POST   /api/v1/auth/refresh      - 토큰 갱신
+POST   /api/v1/auth/logout       - 로그아웃
+GET    /api/v1/users/me          - 현재 사용자 정보 조회
+PUT    /api/v1/users/me          - 사용자 정보 업데이트
+```
+
+### 구독 관리
+```
+GET    /api/v1/subscriptions     - 구독 목록 조회
+POST   /api/v1/subscriptions     - 새 구독 추가
+GET    /api/v1/subscriptions/:id - 특정 구독 조회
+PUT    /api/v1/subscriptions/:id - 구독 정보 업데이트
+DELETE /api/v1/subscriptions/:id - 구독 삭제
+```
+
+### 카테고리 관리
+```
+GET    /api/v1/categories        - 카테고리 목록 조회
+POST   /api/v1/categories        - 새 카테고리 추가
+GET    /api/v1/categories/:id    - 특정 카테고리 조회
+PUT    /api/v1/categories/:id    - 카테고리 정보 업데이트
+DELETE /api/v1/categories/:id    - 카테고리 삭제
+```
+
+### 결제 내역
+```
+GET    /api/v1/payments                      - 결제 내역 목록 조회
+POST   /api/v1/payments                      - 새 결제 내역 추가
+GET    /api/v1/payments/:id                  - 특정 결제 내역 조회
+PUT    /api/v1/payments/:id                  - 결제 내역 업데이트
+DELETE /api/v1/payments/:id                  - 결제 내역 삭제
+GET    /api/v1/subscriptions/:id/payments    - 특정 구독의 결제 내역 조회
+```
+
+### 사용량 관리
+```
+GET    /api/v1/usages                       - 사용량 목록 조회
+POST   /api/v1/usages                       - 새 사용량 기록 추가
+GET    /api/v1/usages/:id                   - 특정 사용량 기록 조회
+PUT    /api/v1/usages/:id                   - 사용량 기록 업데이트
+DELETE /api/v1/usages/:id                   - 사용량 기록 삭제
+GET    /api/v1/subscriptions/:id/usages     - 특정 구독의 사용량 기록 조회
+```
+
+### 분석 및 통계
+```
+GET    /api/v1/analytics/monthly            - 월별 비용 분석
+GET    /api/v1/analytics/category           - 카테고리별 비용 분석
+GET    /api/v1/analytics/trend              - 비용 추이 분석
+GET    /api/v1/analytics/summary            - 요약 통계
+```
+
+### 설정 및 환경설정
+```
+GET    /api/v1/settings          - 설정 조회
+PUT    /api/v1/settings          - 설정 업데이트
+```
+
+### 데이터 동기화
+```
+POST   /api/v1/sync              - 데이터 동기화 요청
+GET    /api/v1/sync/status       - 동기화 상태 확인
+```
+
+### 미리 정의된 서비스
+```
+GET    /api/v1/predefined-services          - 미리 정의된 서비스 목록 조회
+GET    /api/v1/predefined-services/:id      - 특정 미리 정의된 서비스 조회
+```
+
+## 요청/응답 형식
+
+### 성공 응답 형식
+```json
+{
+  "success": true,
+  "data": { ... },
+  "message": "성공 메시지"
+}
+```
+
+### 에러 응답 형식
+```json
+{
+  "success": false,
+  "error": {
+    "code": "ERROR_CODE",
+    "message": "에러 메시지",
+    "details": { ... }
+  }
+}
+```
+
+## 주요 데이터 모델 (API 요청/응답용)
+
+### 구독 (Subscription)
+```json
+{
+  "id": "uuid-string",
+  "name": "서비스 이름",
+  "description": "서비스 설명",
+  "amount": 9.99,
+  "currency": "USD",
+  "billingCycle": "monthly",
+  "cycleDays": null,
+  "startDate": "2023-01-01T00:00:00Z",
+  "nextBillingDate": "2023-02-01T00:00:00Z",
+  "categoryId": "category-uuid",
+  "logoPath": "path/to/logo.png",
+  "color": "#3A86FF",
+  "reminderDays": 3,
+  "notes": "사용자 메모",
+  "isActive": true,
+  "createdAt": "2023-01-01T00:00:00Z",
+  "updatedAt": "2023-01-01T00:00:00Z"
+}
+```
+
+### 카테고리 (Category)
+```json
+{
+  "id": "uuid-string",
+  "name": "카테고리 이름",
+  "icon": "icon_code",
+  "color": "#FF006E",
+  "createdAt": "2023-01-01T00:00:00Z",
+  "updatedAt": "2023-01-01T00:00:00Z"
+}
+```
+
+### 결제 내역 (Payment)
+```json
+{
+  "id": "uuid-string",
+  "subscriptionId": "subscription-uuid",
+  "amount": 9.99,
+  "currency": "USD",
+  "paymentDate": "2023-01-01T00:00:00Z",
+  "status": "paid",
+  "notes": "메모",
+  "createdAt": "2023-01-01T00:00:00Z"
+}
+```
+
+### 사용량 (Usage)
+```json
+{
+  "id": "uuid-string",
+  "subscriptionId": "subscription-uuid",
+  "date": "2023-01-01T00:00:00Z",
+  "amount": 100,
+  "unit": "API 호출",
+  "notes": "메모",
+  "createdAt": "2023-01-01T00:00:00Z"
+}
+```
+
+## 페이지네이션
+목록 조회 API는 페이지네이션을 지원합니다.
+
+### 요청 파라미터
+```
+GET /api/v1/subscriptions?page=1&limit=10&sort=name&order=asc
+```
+
+### 응답 형식
+```json
+{
+  "success": true,
+  "data": {
+    "items": [ ... ],
+    "pagination": {
+      "total": 100,
+      "page": 1,
+      "limit": 10,
+      "pages": 10
+    }
+  }
+}
+```
+
+## 필터링 및 검색
+목록 조회 API는 필터링 및 검색을 지원합니다.
+
+### 요청 파라미터
+```
+GET /api/v1/subscriptions?search=netflix&category=entertainment&minAmount=5&maxAmount=15
+```
+
+## API 버전 관리
+API 변경 시 하위 호환성을 유지하기 위해 버전 관리를 적용합니다.
+- 메이저 변경: 새 버전 경로 사용 (예: /api/v2/...)
+- 마이너 변경: 기존 버전 유지하면서 기능 추가
+
+## 에러 코드
+- `AUTH_001`: 인증 실패
+- `AUTH_002`: 토큰 만료
+- `AUTH_003`: 권한 없음
+- `VALIDATION_001`: 유효성 검사 실패
+- `RESOURCE_001`: 리소스 찾을 수 없음
+- `SERVER_001`: 서버 내부 오류
+
+## API 사용량 제한
+- 기본 제한: 분당 60 요청
+- 프리미엄 사용자: 분당 300 요청
+
+## API 문서화
+- Swagger/OpenAPI 스펙을 사용한 API 문서 자동화
+- 각 엔드포인트에 대한 상세 설명, 파라미터, 응답 예시 제공
+
+## 클라이언트 구현 가이드
+- HTTP 클라이언트: Dio 패키지 사용
+- 인증 토큰 관리: 안전한 저장소에 JWT 토큰 저장
+- 오프라인 지원: 요청 큐잉 및 자동 재시도 구현
+- 에러 처리: 표준화된 에러 핸들링 적용
+
+## 향후 확장 계획
+- GraphQL API 추가 지원
+- 웹훅 기능 추가
+- 실시간 알림을 위한 WebSocket 지원
+- 서드파티 API 연동 (구독 서비스 제공업체)
--- a/subscription/architecture.md
+++ b/subscription/architecture.md
@@ -0,0 +1,130 @@
+# Subscription Manager - 아키텍처 설계
+
+## 개요
+이 문서는 Subscription Manager 앱의 전체 아키텍처와 주요 컴포넌트 간의 관계를 설명합니다. Flutter 기반의 모바일 앱으로, 로컬 데이터베이스를 활용한 구독 서비스 관리 기능을 제공합니다.
+
+## 아키텍처 원칙
+- **관심사 분리**: UI, 비즈니스 로직, 데이터 액세스 계층을 명확히 분리
+- **단방향 데이터 흐름**: 상태 관리의 예측 가능성 보장
+- **모듈화**: 기능별 모듈 분리로 유지보수성 향상
+- **확장성**: 향후 클라우드 연동 등을 고려한 설계
+
+## 아키텍처 다이어그램
+```
+┌─────────────────────────────────────────────────────────────┐
+│                        Presentation Layer                    │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │  Screens│  │  Widgets│  │  Themes │  │  Routes │         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                        Business Logic Layer                  │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │ Providers│ │ Services│  │ Helpers │  │ Models  │         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└───────────────────────────┬─────────────────────────────────┘
+                            │
+┌───────────────────────────▼─────────────────────────────────┐
+│                        Data Layer                            │
+│  ┌─────────┐  ┌─────────┐  ┌─────────┐  ┌─────────┐         │
+│  │Repository│ │ Database│  │ Storage │  │ API     │         │
+│  └─────────┘  └─────────┘  └─────────┘  └─────────┘         │
+└─────────────────────────────────────────────────────────────┘
+```
+
+## 주요 컴포넌트 설명
+
+### 1. Presentation Layer (프레젠테이션 계층)
+- **Screens**: 사용자에게 표시되는 화면 (홈, 구독 목록, 상세 정보 등)
+- **Widgets**: 재사용 가능한 UI 컴포넌트 (구독 카드, 차트, 입력 폼 등)
+- **Themes**: 앱 전체 테마 및 스타일 정의
+- **Routes**: 화면 간 네비게이션 관리
+
+### 2. Business Logic Layer (비즈니스 로직 계층)
+- **Providers**: 상태 관리 및 UI와 데이터 계층 연결 (Provider 패턴 활용)
+- **Services**: 비즈니스 로직 처리 (구독 관리, 알림, 분석 등)
+- **Helpers**: 유틸리티 함수 (날짜 계산, 통화 변환 등)
+- **Models**: 데이터 모델 클래스 (구독, 카테고리, 결제 등)
+
+### 3. Data Layer (데이터 계층)
+- **Repository**: 데이터 액세스 추상화 계층
+- **Database**: SQLite 데이터베이스 관리 (sqflite)
+- **Storage**: 로컬 저장소 관리 (shared_preferences, secure_storage)
+- **API**: 향후 클라우드 연동을 위한 API 클라이언트 (MVP 이후)
+
+## 디렉토리 구조
+```
+lib/
+├── main.dart                 # 앱 진입점
+├── app.dart                  # 앱 설정 및 테마
+├── screens/                  # 화면 컴포넌트
+│   ├── home/                 # 홈 화면 관련 파일
+│   ├── subscriptions/        # 구독 관리 화면 관련 파일
+│   ├── analytics/            # 분석 화면 관련 파일
+│   └── settings/             # 설정 화면 관련 파일
+├── widgets/                  # 공통 위젯
+│   ├── subscription_card.dart
+│   ├── charts/
+│   └── forms/
+├── providers/                # 상태 관리
+│   ├── subscription_provider.dart
+│   ├── settings_provider.dart
+│   └── analytics_provider.dart
+├── services/                 # 비즈니스 로직
+│   ├── subscription_service.dart
+│   ├── notification_service.dart
+│   └── analytics_service.dart
+├── models/                   # 데이터 모델
+│   ├── subscription.dart
+│   ├── category.dart
+│   └── payment.dart
+├── repositories/             # 데이터 액세스
+│   ├── subscription_repository.dart
+│   └── settings_repository.dart
+├── database/                 # 데이터베이스 관리
+│   ├── database_helper.dart
+│   └── migrations/
+├── utils/                    # 유틸리티
+│   ├── date_utils.dart
+│   ├── currency_utils.dart
+│   └── constants.dart
+└── localization/             # 다국어 지원
+    ├── app_localizations.dart
+    ├── en.dart
+    └── ko.dart
+```
+
+## 데이터 흐름
+1. **사용자 입력**: UI 이벤트 발생 (버튼 클릭, 폼 제출 등)
+2. **Provider 호출**: 상태 관리 계층에서 이벤트 처리
+3. **Service 호출**: 비즈니스 로직 실행
+4. **Repository 호출**: 데이터 액세스 추상화 계층 통해 데이터 요청
+5. **Database 접근**: 로컬 데이터베이스에서 데이터 읽기/쓰기
+6. **결과 반환**: 데이터베이스 → Repository → Service → Provider → UI
+
+## 상태 관리 전략
+- **Provider 패턴**: Flutter의 Provider 패키지를 활용한 상태 관리
+- **단방향 데이터 흐름**: 상태 변경은 Provider를 통해서만 이루어짐
+- **반응형 UI**: 상태 변경 시 자동으로 UI 업데이트
+- **상태 격리**: 기능별로 별도의 Provider를 사용하여 상태 관리 복잡성 감소
+
+## 오프라인 지원
+- 모든 데이터는 로컬 데이터베이스에 저장되어 오프라인에서도 앱 사용 가능
+- 향후 클라우드 동기화 기능 추가 시에도 오프라인 우선 전략 유지
+
+## 보안 전략
+- 민감한 결제 정보는 flutter_secure_storage를 사용하여 암호화 저장
+- 앱 잠금 기능 제공 (PIN, 생체 인증 등)
+- 데이터 백업 파일 암호화
+
+## 확장성 계획
+- **클라우드 동기화**: 향후 Firebase 또는 자체 백엔드 서버와 연동
+- **웹 버전**: 동일한 비즈니스 로직을 공유하는 웹 클라이언트 개발
+- **API 연동**: 구독 서비스 제공업체의 API와 연동하여 자동 데이터 수집
+
+## 성능 최적화
+- 데이터베이스 인덱싱 전략
+- 이미지 캐싱 및 최적화
+- 지연 로딩 및 페이지네이션 적용
+- 메모리 사용량 모니터링 및 최적화
--- a/subscription/data_model.md
+++ b/subscription/data_model.md
@@ -0,0 +1,137 @@
+# Subscription Manager - 데이터 모델
+
+## 개요
+이 문서는 Subscription Manager 앱의 데이터 구조를 정의합니다. 앱은 로컬 저장소(SQLite)를 사용하여 사용자의 구독 정보와 설정을 저장합니다.
+
+## 데이터베이스 스키마
+
+### 1. Subscription (구독)
+사용자가 등록한 구독 서비스 정보를 저장합니다.
+
+```
+Table: subscriptions
+- id: INTEGER PRIMARY KEY AUTOINCREMENT
+- name: TEXT NOT NULL                     // 서비스 이름
+- description: TEXT                       // 서비스 설명
+- amount: REAL NOT NULL                   // 구독 비용
+- currency: TEXT NOT NULL                 // 통화 (USD, KRW 등)
+- billing_cycle: TEXT NOT NULL            // 결제 주기 (monthly, yearly, weekly, custom)
+- cycle_days: INTEGER                     // custom 주기일 경우 일수
+- start_date: TEXT NOT NULL               // 구독 시작일 (ISO 8601 형식)
+- next_billing_date: TEXT NOT NULL        // 다음 결제일 (ISO 8601 형식)
+- category_id: INTEGER                    // 카테고리 외래 키
+- logo_path: TEXT                         // 로고 이미지 경로
+- color: TEXT                             // 서비스 대표 색상 (HEX)
+- reminder_days: INTEGER                  // 결제일 몇 일 전에 알림을 받을지
+- notes: TEXT                             // 사용자 메모
+- is_active: INTEGER NOT NULL DEFAULT 1   // 활성 상태 (1: 활성, 0: 비활성)
+- created_at: TEXT NOT NULL               // 생성일 (ISO 8601 형식)
+- updated_at: TEXT NOT NULL               // 수정일 (ISO 8601 형식)
+- FOREIGN KEY (category_id) REFERENCES categories(id)
+```
+
+### 2. Category (카테고리)
+구독 서비스의 카테고리 정보를 저장합니다.
+
+```
+Table: categories
+- id: INTEGER PRIMARY KEY AUTOINCREMENT
+- name: TEXT NOT NULL                     // 카테고리 이름
+- icon: TEXT                              // 카테고리 아이콘 코드
+- color: TEXT                             // 카테고리 색상 (HEX)
+- created_at: TEXT NOT NULL               // 생성일 (ISO 8601 형식)
+- updated_at: TEXT NOT NULL               // 수정일 (ISO 8601 형식)
+```
+
+### 3. Payment (결제 내역)
+구독 서비스의 결제 내역을 저장합니다.
+
+```
+Table: payments
+- id: INTEGER PRIMARY KEY AUTOINCREMENT
+- subscription_id: INTEGER NOT NULL       // 구독 외래 키
+- amount: REAL NOT NULL                   // 결제 금액
+- currency: TEXT NOT NULL                 // 통화
+- payment_date: TEXT NOT NULL             // 결제일 (ISO 8601 형식)
+- status: TEXT NOT NULL                   // 상태 (paid, pending, failed)
+- notes: TEXT                             // 메모
+- created_at: TEXT NOT NULL               // 생성일 (ISO 8601 형식)
+- FOREIGN KEY (subscription_id) REFERENCES subscriptions(id)
+```
+
+### 4. Usage (사용량)
+구독 서비스의 사용량 정보를 저장합니다.
+
+```
+Table: usages
+- id: INTEGER PRIMARY KEY AUTOINCREMENT
+- subscription_id: INTEGER NOT NULL       // 구독 외래 키
+- date: TEXT NOT NULL                     // 사용일 (ISO 8601 형식)
+- amount: REAL                            // 사용량 (서비스에 따라 다름)
+- unit: TEXT                              // 단위 (API 호출, 토큰, 시간 등)
+- notes: TEXT                             // 메모
+- created_at: TEXT NOT NULL               // 생성일 (ISO 8601 형식)
+- FOREIGN KEY (subscription_id) REFERENCES subscriptions(id)
+```
+
+### 5. Settings (설정)
+앱 설정 정보를 저장합니다.
+
+```
+Table: settings
+- id: INTEGER PRIMARY KEY AUTOINCREMENT
+- key: TEXT NOT NULL UNIQUE               // 설정 키
+- value: TEXT NOT NULL                    // 설정 값
+- updated_at: TEXT NOT NULL               // 수정일 (ISO 8601 형식)
+```
+
+### 6. PredefinedService (미리 정의된 서비스)
+앱에서 기본적으로 제공하는 서비스 정보를 저장합니다.
+
+```
+Table: predefined_services
+- id: INTEGER PRIMARY KEY AUTOINCREMENT
+- name: TEXT NOT NULL                     // 서비스 이름
+- description: TEXT                       // 서비스 설명
+- logo_path: TEXT                         // 로고 이미지 경로
+- color: TEXT                             // 서비스 대표 색상 (HEX)
+- category_id: INTEGER                    // 기본 카테고리
+- website: TEXT                           // 서비스 웹사이트
+- created_at: TEXT NOT NULL               // 생성일 (ISO 8601 형식)
+- updated_at: TEXT NOT NULL               // 수정일 (ISO 8601 형식)
+- FOREIGN KEY (category_id) REFERENCES categories(id)
+```
+
+## 초기 데이터
+
+### 기본 카테고리
+- AI 서비스
+- 개발 도구
+- 엔터테인먼트
+- 생산성
+- 클라우드 스토리지
+- 기타
+
+### 미리 정의된 서비스
+- OpenAI (ChatGPT, DALL-E)
+- Anthropic (Claude)
+- GitHub (GitHub Copilot)
+- Cursor
+- Windsurf
+- 기타 인기 구독 서비스
+
+## 데이터 관계
+- 하나의 구독은 하나의 카테고리에 속합니다.
+- 하나의 구독은 여러 결제 내역을 가질 수 있습니다.
+- 하나의 구독은 여러 사용량 기록을 가질 수 있습니다.
+
+## 데이터 마이그레이션
+앱 업데이트 시 데이터베이스 스키마 변경이 필요한 경우, 마이그레이션 스크립트를 통해 기존 데이터를 보존하면서 스키마를 업데이트합니다.
+
+## 데이터 백업
+사용자가 앱을 재설치하거나 기기를 변경할 때 데이터 손실을 방지하기 위해, 로컬 백업 기능을 제공합니다. 향후 클라우드 동기화 기능이 추가될 예정입니다.
+
+## 데이터 보안
+- 민감한 결제 정보는 기기의 보안 저장소에 암호화하여 저장합니다.
+- 앱 잠금 기능을 통해 무단 접근을 방지합니다.
+- 백업 파일은 암호화됩니다.
--- a/subscription/deployment_strategy.md
+++ b/subscription/deployment_strategy.md
@@ -0,0 +1,217 @@
+# Subscription Manager - 배포 및 릴리스 전략
+
+## 개요
+이 문서는 Subscription Manager 앱의 배포 및 릴리스 전략을 정의합니다. 효율적인 배포 프로세스와 지속적인 업데이트 관리 방법을 설명합니다.
+
+## 배포 환경
+
+### 앱스토어
+- **Google Play Store**: Android 사용자 대상
+- **Apple App Store**: iOS 사용자 대상
+- **향후 확장**: 웹 버전, 데스크톱 버전
+
+### 배포 채널
+- **프로덕션**: 일반 사용자 대상 안정 버전
+- **베타**: 테스트 참여자 대상 사전 출시 버전
+- **알파**: 내부 테스터 대상 개발 버전
+
+## 버전 관리
+
+### 버전 번호 체계
+- **시맨틱 버전 관리 (Semantic Versioning)** 사용: `X.Y.Z`
+  - **X (메이저)**: 호환되지 않는 API 변경
+  - **Y (마이너)**: 이전 버전과 호환되는 기능 추가
+  - **Z (패치)**: 버그 수정 및 사소한 개선
+
+### 빌드 번호
+- 각 플랫폼별 빌드 번호 관리
+- Android: `versionCode` (정수)
+- iOS: `buildNumber` (정수)
+- 자동 증가 시스템 구현
+
+## CI/CD 파이프라인
+
+### 지속적 통합 (CI)
+- **GitHub Actions** 활용
+- 코드 푸시 시 자동 빌드 및 테스트
+- 코드 품질 검사 (정적 분석)
+- 단위 테스트 및 통합 테스트 실행
+
+### 지속적 배포 (CD)
+- 테스트 통과 시 자동 배포
+- 알파/베타 채널 자동 업데이트
+- 프로덕션 배포는 수동 승인 후 진행
+
+### 자동화 스크립트
+- 빌드 자동화
+- 코드 서명 자동화
+- 앱스토어 업로드 자동화
+- 릴리스 노트 생성 자동화
+
+## 릴리스 프로세스
+
+### 릴리스 계획
+- 정기 릴리스 일정 (2-4주 주기)
+- 주요 기능 릴리스 (분기별)
+- 긴급 패치 릴리스 (필요 시)
+
+### 릴리스 단계
+1. **개발 완료**: 기능 개발 및 내부 테스트 완료
+2. **코드 프리즈**: 새 기능 추가 중단, 버그 수정만 허용
+3. **알파 릴리스**: 내부 테스터 대상 배포
+4. **베타 릴리스**: 외부 테스터 대상 배포
+5. **RC (Release Candidate)**: 최종 검증
+6. **프로덕션 릴리스**: 일반 사용자 대상 배포
+
+### 릴리스 승인 과정
+- 테스트 결과 검토
+- 품질 기준 충족 확인
+- 릴리스 노트 검토
+- 최종 승인 및 배포
+
+## 앱스토어 최적화 (ASO)
+
+### 앱 메타데이터
+- 앱 이름 및 설명 최적화
+- 키워드 선정 및 최적화
+- 스크린샷 및 프리뷰 비디오 제작
+
+### 앱 리스팅 자료
+- 고품질 앱 아이콘
+- 매력적인 스크린샷 (기기별 최적화)
+- 앱 기능 하이라이트 비디오
+- 상세하고 명확한 앱 설명
+
+### 현지화
+- 영어 및 한국어 지원
+- 앱 설명 및 스크린샷 현지화
+- 키워드 현지화
+
+## 모니터링 및 분석
+
+### 성능 모니터링
+- **Firebase Performance Monitoring** 활용
+- 앱 시작 시간, 화면 로딩 시간 모니터링
+- 네트워크 요청 성능 추적
+- 메모리 및 배터리 사용량 모니터링
+
+### 크래시 보고
+- **Firebase Crashlytics** 활용
+- 실시간 크래시 보고 및 알림
+- 크래시 원인 분석 및 우선순위 지정
+- 버전별 안정성 추적
+
+### 사용자 분석
+- **Firebase Analytics** 활용
+- 사용자 행동 및 패턴 분석
+- 기능별 사용률 추적
+- 사용자 유지율 및 이탈률 분석
+
+## 사용자 피드백 관리
+
+### 피드백 채널
+- 앱 내 피드백 기능
+- 앱스토어 리뷰 모니터링
+- 이메일 지원
+- 소셜 미디어 채널
+
+### 피드백 처리 프로세스
+1. 피드백 수집 및 분류
+2. 우선순위 지정
+3. 개발 백로그에 추가
+4. 구현 및 테스트
+5. 사용자에게 응답
+
+### 사용자 참여 프로그램
+- 베타 테스터 프로그램
+- 사용자 설문조사
+- 기능 요청 투표 시스템
+
+## 업데이트 전략
+
+### 점진적 롤아웃
+- 단계적 사용자 확대 (5% → 20% → 50% → 100%)
+- 초기 피드백 기반 빠른 대응
+- 문제 발생 시 롤백 계획
+
+### 인앱 업데이트 (Android)
+- 유연한 업데이트 옵션 제공
+- 중요 업데이트 시 강제 업데이트 고려
+- 업데이트 알림 및 안내
+
+### 기능 플래그
+- 원격 기능 활성화/비활성화
+- A/B 테스트 지원
+- 점진적 기능 출시
+
+## 보안 및 규정 준수
+
+### 앱 보안
+- 코드 난독화
+- 안전한 네트워크 통신 (HTTPS)
+- 민감 정보 암호화 저장
+
+### 규정 준수
+- **개인정보 보호정책** 준비 및 게시
+- **이용약관** 준비 및 게시
+- 앱스토어 가이드라인 준수
+- GDPR, CCPA 등 개인정보 보호법 준수
+
+## 마케팅 및 프로모션
+
+### 출시 마케팅
+- 프리 런칭 페이지
+- 소셜 미디어 홍보
+- 인플루언서 협업
+- 제품 헌트, 레딧 등 커뮤니티 공유
+
+### 지속적 프로모션
+- 주요 업데이트 시 보도자료
+- 사용자 성공 사례 공유
+- 시즌별 프로모션
+- 리퍼럴 프로그램
+
+## 유지보수 계획
+
+### 정기 유지보수
+- 월간 성능 검토
+- 분기별 코드 리팩토링
+- 종속성 업데이트
+
+### 기술 부채 관리
+- 기술 부채 식별 및 추적
+- 우선순위 지정 및 해결 계획
+- 정기적인 코드 품질 개선
+
+### 장기 지원 계획
+- 최소 지원 OS 버전 정책
+- 레거시 기능 관리 계획
+- 주요 플랫폼 업데이트 대응 계획
+
+## 위험 관리
+
+### 출시 위험
+- 앱스토어 심사 거부 대응 계획
+- 초기 버그 발견 시 빠른 패치 계획
+- 사용자 피드백 급증 대응 계획
+
+### 운영 위험
+- 서버 장애 대응 계획 (향후 클라우드 연동 시)
+- 데이터 손실 방지 및 복구 계획
+- 보안 취약점 발견 시 대응 계획
+
+## 성공 지표
+
+### 배포 성공 지표
+- 출시 후 24시간 내 크래시 비율 < 0.1%
+- 앱스토어 평점 4.5 이상
+- 첫 주 목표 다운로드 수 달성
+
+### 지속적 성공 지표
+- 월간 활성 사용자 증가율
+- 사용자 유지율 (1일, 7일, 30일)
+- 프리미엄 전환율
+- 사용자당 평균 수익 (ARPU)
+
+## 결론
+체계적인 배포 및 릴리스 전략을 통해 안정적인 앱 출시와 지속적인 개선을 보장합니다. 사용자 피드백을 적극 반영하고 데이터 기반 의사결정을 통해 앱의 품질과 사용자 만족도를 지속적으로 향상시킬 것입니다.
--- a/subscription/development_plan.md
+++ b/subscription/development_plan.md
@@ -0,0 +1,144 @@
+# Subscription Manager - 개발 계획
+
+## 개요
+이 문서는 Subscription Manager 앱의 개발 계획과 일정을 정의합니다. 제한된 예산으로 MVP(Minimum Viable Product)를 빠르게 개발하는 것을 목표로 합니다.
+
+## 개발 단계
+
+### 1단계: 프로젝트 설정 및 기본 구조 (1주)
+- Flutter 프로젝트 생성 및 설정
+- 기본 프로젝트 구조 설계
+- 필요한 패키지 선정 및 설치
+- 데이터베이스 스키마 구현
+- 기본 테마 및 스타일 설정
+- 다국어 지원 기반 구축 (영어/한국어)
+
+### 2단계: 핵심 기능 개발 (3주)
+- 구독 관리 기능 구현
+  - 구독 추가/편집/삭제
+  - 구독 목록 표시
+  - 구독 상세 정보 화면
+- 비용 분석 기능 구현
+  - 월별 총 비용 계산
+  - 카테고리별 비용 분석
+  - 기본 차트 및 그래프 구현
+- 알림 시스템 구현
+  - 결제일 알림 기능
+  - 알림 설정 기능
+
+### 3단계: UI/UX 개선 (2주)
+- 미니멀 디자인 및 라인 아트 스타일 적용
+- 애니메이션 및 전환 효과 추가
+- 다크/라이트 모드 구현
+- 반응형 레이아웃 최적화
+- 접근성 개선
+
+### 4단계: 테스트 및 버그 수정 (2주)
+- 단위 테스트 작성 및 실행
+- 통합 테스트 작성 및 실행
+- 내부 알파 테스트 진행
+- 버그 수정 및 성능 최적화
+- 사용성 테스트 및 피드백 반영
+
+### 5단계: 출시 준비 (1주)
+- 앱 스토어 등록 준비 (스크린샷, 설명 등)
+- 앱 아이콘 및 스플래시 화면 최종화
+- 개인정보 처리방침 작성
+- 최종 빌드 및 테스트
+- 앱 스토어 제출
+
+## 기술 스택
+
+### 프론트엔드
+- **프레임워크**: Flutter
+- **언어**: Dart
+- **상태 관리**: Provider 또는 Riverpod
+- **UI 컴포넌트**: Flutter Material Components, Custom Widgets
+- **차트 라이브러리**: fl_chart 또는 syncfusion_flutter_charts
+
+### 백엔드 (로컬)
+- **데이터베이스**: SQLite (sqflite 패키지)
+- **로컬 저장소**: shared_preferences
+- **보안 저장소**: flutter_secure_storage
+
+### 기타 주요 패키지
+- **로컬라이제이션**: flutter_localizations, intl
+- **날짜/시간 처리**: intl, jiffy
+- **알림**: flutter_local_notifications
+- **이미지 처리**: cached_network_image
+- **애니메이션**: flutter_animate
+- **테스트**: flutter_test, mockito
+
+## 개발 환경
+- **IDE**: Android Studio 또는 VS Code
+- **버전 관리**: Git
+- **CI/CD**: GitHub Actions (선택적)
+- **디자인 도구**: Figma 또는 Adobe XD
+
+## 비용 최소화 전략
+
+### 개발 비용 절감
+- 오픈 소스 패키지 활용
+- 서버리스 아키텍처 (초기에는 로컬 저장소만 사용)
+- 무료 디자인 리소스 활용 (아이콘, 일러스트레이션 등)
+
+### 마케팅 비용 절감
+- 앱스토어 최적화 (ASO)
+- 소셜 미디어 활용
+- 제품 헌트, 레딧 등 무료 플랫폼 활용
+- 초기 사용자 커뮤니티 구축
+
+### 운영 비용 절감
+- 초기에는 클라우드 서비스 사용 최소화
+- 사용자 지원을 위한 FAQ 및 자동화된 응답 시스템 구축
+
+## 수익화 계획
+- **무료 버전**: 최대 5개 구독 서비스 등록 가능
+- **프리미엄 버전**: 
+  - 일회성 구매 또는 구독 모델 (결정 필요)
+  - 무제한 구독 서비스 등록
+  - 고급 분석 기능
+  - 데이터 백업 기능
+  - 광고 제거
+
+## 위험 요소 및 대응 계획
+
+### 기술적 위험
+- **데이터 손실 위험**: 로컬 백업 기능 구현, 데이터 검증 강화
+- **성능 이슈**: 정기적인 성능 테스트, 데이터 구조 최적화
+- **기기 호환성 문제**: 다양한 기기에서 테스트, 반응형 디자인 적용
+
+### 비즈니스 위험
+- **사용자 획득 어려움**: ASO 최적화, 타겟 마케팅 전략 수립
+- **경쟁 앱과의 차별화 부족**: AI 서비스 특화 기능 강조, UX 차별화
+- **수익화 어려움**: 다양한 수익 모델 테스트, 사용자 피드백 기반 조정
+
+## 향후 확장 계획 (MVP 이후)
+
+### 기능 확장
+- 클라우드 동기화 기능
+- 웹 버전 개발
+- API 연동을 통한 자동 사용량 추적
+- 고급 분석 및 예측 기능
+- 구독 최적화 추천 기능
+
+### 플랫폼 확장
+- 웹 애플리케이션
+- 데스크톱 애플리케이션 (Windows, macOS)
+- 위젯 및 확장 프로그램
+
+### 비즈니스 확장
+- 구독 서비스 제공업체와의 제휴
+- 추천 프로그램
+- 프리미엄 기능 확대
+
+## 성공 지표
+- 다운로드 수
+- 활성 사용자 수 (DAU/MAU)
+- 사용자 유지율
+- 프리미엄 전환율
+- 사용자 만족도 (리뷰 평점)
+- 앱 사용 시간
+
+## 결론
+제한된 예산으로 MVP를 빠르게 개발하여 시장에 진입한 후, 사용자 피드백을 기반으로 점진적으로 기능을 확장해 나갈 계획입니다. 초기에는 로컬 저장소만 사용하여 서버 비용을 최소화하고, 사용자 기반이 확보된 후에 클라우드 기능을 추가할 예정입니다.
--- a/subscription/development_schedule.md
+++ b/subscription/development_schedule.md
@@ -0,0 +1,122 @@
+# Subscription Manager - 개발 일정
+
+## 개요
+이 문서는 ZELLYY Subscription Manager 앱의 구체적인 개발 일정을 정의합니다. 2025년 3월 1일부터 시작하여 3월 31일까지 MVP(Minimum Viable Product)를 출시하는 것을 목표로 합니다.
+
+## 프로젝트 타임라인
+
+### 기획 및 준비 단계 (2025년 3월 1일 ~ 3월 7일)
+- **3월 1일 ~ 3월 3일**: 프로젝트 요구사항 분석 및 문서화
+  - 핵심 기능 정의
+  - 사용자 페르소나 작성
+  - 경쟁 앱 분석
+  - 기술 스택 결정
+  
+- **3월 4일 ~ 3월 5일**: 디자인 및 아키텍처 설계
+  - UI/UX 디자인 초안 작성
+  - 데이터 모델 설계
+  - 앱 아키텍처 설계
+  
+- **3월 6일 ~ 3월 7일**: 개발 환경 설정
+  - 개발 도구 설치 및 구성
+  - 버전 관리 시스템 설정
+  - 프로젝트 기본 구조 생성
+  - 필요한 라이브러리 및 패키지 선정
+
+### 1단계: 프로젝트 설정 및 기본 구조 (3월 8일 ~ 3월 12일)
+- **3월 8일 ~ 3월 9일**: Flutter 프로젝트 생성 및 기본 설정
+  - 프로젝트 생성
+  - 필요한 패키지 설치
+  - 기본 테마 설정
+  
+- **3월 10일 ~ 3월 11일**: 데이터베이스 구현
+  - SQLite 데이터베이스 스키마 설계
+  - 데이터 모델 클래스 구현
+  - 데이터베이스 헬퍼 클래스 구현
+  
+- **3월 12일**: 다국어 지원 및 기본 구조 완성
+  - 다국어 지원 설정 (영어/한국어)
+  - 라우팅 시스템 구현
+  - 상태 관리 기본 설정 (Provider/Riverpod)
+
+### 2단계: 핵심 기능 개발 (3월 13일 ~ 3월 24일)
+- **3월 13일 ~ 3월 16일**: 구독 관리 기본 기능 구현
+  - **3월 13일 ~ 3월 14일**: 구독 추가 기능
+  - **3월 15일 ~ 3월 16일**: 구독 편집 및 삭제 기능
+  
+- **3월 17일 ~ 3월 20일**: 비용 분석 기능 구현
+  - **3월 17일 ~ 3월 18일**: 월별 총 비용 계산 기능
+  - **3월 19일 ~ 3월 20일**: 카테고리별 비용 분석
+  
+- **3월 21일 ~ 3월 24일**: 알림 시스템 구현
+  - **3월 21일 ~ 3월 22일**: 로컬 알림 시스템 설정
+  - **3월 23일 ~ 3월 24일**: 결제일 알림 기능
+
+### 3단계: UI/UX 개선 (3월 25일 ~ 3월 28일)
+- **3월 25일 ~ 3월 26일**: 디자인 시스템 구현
+  - 공통 UI 컴포넌트 개발
+  - 미니멀 디자인 및 라인 아트 스타일 적용
+  - 색상 테마 구현
+  
+- **3월 27일 ~ 3월 28일**: 다크/라이트 모드 구현
+  - 테마 전환 시스템
+  - 다크 모드 색상 조정
+  - 테마별 에셋 최적화
+
+### 4단계: 테스트 및 버그 수정 (3월 29일 ~ 3월 31일)
+- **3월 29일 ~ 3월 30일**: 단위 테스트 및 통합 테스트
+  - 핵심 기능 단위 테스트 작성
+  - 통합 테스트 시나리오 구현
+  - 자동화 테스트 설정
+  
+- **3월 31일**: 버그 수정 및 최종 검증
+  - 알파 테스트 피드백 반영
+  - 성능 병목 지점 식별 및 최적화
+  - 메모리 누수 및 크래시 해결
+
+## 마일스톤 및 주요 일정
+
+### 주요 마일스톤
+1. **프로젝트 킥오프**: 2025년 3월 1일
+2. **알파 버전 완료**: 2025년 3월 28일
+3. **최종 버전 완료**: 2025년 3월 31일
+
+### 주간 회의 일정
+- **개발 진행 상황 점검**: 매주 월요일 오전 10시
+- **기술 검토 회의**: 매주 수요일 오후 2시
+- **스프린트 계획 및 회고**: 격주 금요일 오후 4시
+
+## 팀 구성 및 역할
+
+### 핵심 팀
+- **프로젝트 관리자**: 전체 프로젝트 조정 및 일정 관리
+- **Flutter 개발자 (2명)**: 앱 개발 및 구현
+- **UI/UX 디자이너**: 사용자 인터페이스 및 경험 디자인
+- **QA 엔지니어**: 품질 보증 및 테스트
+
+## 개발 방법론
+
+### 애자일 스크럼 프레임워크
+- **스프린트 기간**: 1주
+- **일일 스탠드업**: 매일 오전 9시 30분 (15분)
+- **스프린트 계획**: 스프린트 시작일
+- **스프린트 리뷰 및 회고**: 스프린트 마지막 날
+
+## 위험 관리
+
+### 잠재적 위험 및 대응 계획
+1. **일정 지연 위험**
+   - 대응: 핵심 기능 우선순위화, 필요시 MVP 범위 조정
+   - 모니터링: 주간 진행 상황 점검, 번다운 차트 활용
+
+2. **기술적 장애물**
+   - 대응: 사전 기술 검증, 대안 솔루션 준비
+   - 모니터링: 기술 부채 관리, 정기적 코드 품질 검토
+
+3. **팀원 가용성 변동**
+   - 대응: 핵심 지식 문서화, 크로스 트레이닝
+   - 모니터링: 리소스 할당 및 작업 분배 정기 검토
+
+4. **외부 의존성 지연**
+   - 대응: 주요 외부 의존성 사전 식별, 대안 준비
+   - 모니터링: 외부 의존성 상태 정기 확인
--- a/subscription/marketing_strategy.md
+++ b/subscription/marketing_strategy.md
@@ -0,0 +1,243 @@
+# Subscription Manager - 마케팅 전략
+
+## 개요
+이 문서는 ZELLYY Subscription Manager 앱의 마케팅 및 사용자 획득 전략을 정의합니다. 제한된 예산으로 효과적인 사용자 기반을 구축하기 위한 전략적 접근 방식을 설명합니다.
+
+## 시장 분석
+
+### 타겟 시장
+- **주요 타겟**: AI 서비스 및 다양한 구독 서비스를 사용하는 25-45세 디지털 소비자
+- **지역 타겟**: 한국, 미국, 일본, 유럽 주요 국가
+- **세컨더리 타겟**: 예산 관리에 관심 있는 대학생 및 젊은 직장인
+
+### 시장 규모
+- 글로벌 구독 관리 앱 시장: 약 $500M (2024년 기준)
+- 연간 성장률: 약 15-20%
+- AI 서비스 구독 시장: 급성장 중 (연간 30% 이상)
+
+### 경쟁 분석
+- **직접 경쟁사**: Subscript, Truebill, Bobby
+- **간접 경쟁사**: 금융 관리 앱, 예산 계획 앱
+- **차별화 포인트**: AI 서비스 특화, 미니멀 디자인, 직관적 UX, 비용 최적화 추천
+
+## 브랜드 전략
+
+### 브랜드 아이덴티티
+- **브랜드 이름**: ZELLYY Subscription Manager
+- **브랜드 가치**: 단순함, 효율성, 투명성, 신뢰성
+- **브랜드 개성**: 현대적, 미니멀, 친근한, 전문적
+
+### 브랜드 메시지
+- **핵심 메시지**: "구독 비용을 스마트하게 관리하세요"
+- **부가 메시지**: 
+  - "AI 서비스 구독을 한눈에"
+  - "매월 불필요한 지출 줄이기"
+  - "구독 경제를 당신의 편으로"
+
+### 시각적 아이덴티티
+- **로고**: 미니멀한 라인 아트 스타일, 블루 그라디언트
+- **색상 팔레트**: 주 색상 - 블루, 보조 색상 - 화이트, 라이트 그레이, 다크 블루
+- **타이포그래피**: 산세리프, 깔끔하고 현대적인 폰트
+- **디자인 요소**: 라인 아이콘, 미니멀 그래픽, 깔끔한 데이터 시각화
+
+## 마케팅 채널 전략
+
+### 디지털 마케팅
+- **앱스토어 최적화 (ASO)**
+  - 키워드 최적화: "구독 관리", "AI 서비스", "비용 절감", "구독 추적"
+  - 앱 스크린샷 및 프리뷰 비디오 최적화
+  - 앱 설명 및 메타데이터 최적화
+  - 사용자 리뷰 관리 전략
+
+- **콘텐츠 마케팅**
+  - 블로그: 구독 경제, AI 서비스 활용법, 비용 절감 팁
+  - 인포그래픽: 구독 서비스 트렌드, 비용 비교
+  - 이메일 뉴스레터: 앱 업데이트, 팁, 프로모션
+
+- **소셜 미디어 마케팅**
+  - 주요 플랫폼: Instagram, Twitter, LinkedIn
+  - 콘텐츠 전략: 짧은 팁 비디오, 인포그래픽, 사용자 후기
+  - 해시태그 전략: #구독관리 #구독경제 #AI서비스 #비용절감
+
+- **인플루언서 마케팅**
+  - 마이크로 인플루언서: 테크 리뷰어, 생산성 전문가
+  - 협업 형태: 앱 리뷰, 튜토리얼, 프로모션 코드 제공
+
+### 커뮤니티 마케팅
+- **온라인 커뮤니티**
+  - 레딧: r/productivity, r/personalfinance, r/AI
+  - 페이스북 그룹: 생산성, 개인 재정, 테크 관련 그룹
+  - 디스코드 서버: 자체 커뮤니티 구축
+
+- **제품 헌트 및 스타트업 플랫폼**
+  - Product Hunt 출시 캠페인
+  - Hacker News, Indie Hackers 등 스타트업 커뮤니티 활용
+
+### 파트너십 및 제휴 마케팅
+- **AI 서비스 제공업체와 제휴**
+  - 상호 프로모션 및 할인 코드
+  - 공동 콘텐츠 제작
+  - API 통합 파트너십
+
+- **생산성 앱과 크로스 프로모션**
+  - 상호 보완적인 앱과 크로스 프로모션
+  - 번들 할인 제공
+
+## 사용자 획득 전략
+
+### 유료 광고
+- **제한된 예산으로 최대 효과**
+  - 초기 예산: 월 $500-1,000
+  - 주요 플랫폼: Google Ads, Apple Search Ads, Facebook/Instagram Ads
+  - 타겟팅: 관심사 (AI, 생산성, 개인 재정), 인구통계, 유사 잠재고객
+
+- **리타겟팅 전략**
+  - 앱 설치 후 미사용자 타겟팅
+  - 무료 사용자 → 유료 전환 유도
+
+### 오가닉 사용자 획득
+- **앱스토어 최적화 (ASO)**
+  - 키워드 연구 및 최적화
+  - 정기적인 앱 업데이트
+  - 사용자 리뷰 관리
+
+- **콘텐츠 마케팅**
+  - SEO 최적화된 블로그 콘텐츠
+  - 유튜브 튜토리얼 및 팁 비디오
+  - 인포그래픽 및 공유 가능한 콘텐츠
+
+- **입소문 마케팅**
+  - 리퍼럴 프로그램: 친구 초대 시 양측 혜택
+  - 공유 기능: 분석 결과 및 성과 공유
+  - 사용자 후기 및 성공 사례 홍보
+
+## 출시 전략
+
+### 소프트 런칭
+- **베타 테스트 프로그램**
+  - 300-500명의 초기 테스터 모집
+  - 피드백 수집 및 개선
+  - 초기 사용자 커뮤니티 구축
+
+- **지역별 단계적 출시**
+  - 1단계: 한국 시장
+  - 2단계: 영어권 시장 (미국, 영국)
+  - 3단계: 일본, 유럽 주요 국가
+
+### 공식 출시
+- **출시 이벤트**
+  - 온라인 출시 이벤트
+  - 미디어 보도자료 배포
+  - 인플루언서 협업 캠페인
+
+- **출시 프로모션**
+  - 초기 사용자 특별 할인 (30% 할인)
+  - 제한된 평생 이용권 프로모션
+  - 리퍼럴 보너스 2배 적용
+
+## 사용자 유지 전략
+
+### 사용자 참여 증진
+- **푸시 알림 전략**
+  - 가치 중심 알림: 결제일 알림, 비용 절감 기회
+  - 사용자 행동 기반 알림: 미완료 설정, 추천 기능
+  - 맞춤형 인사이트: 월간 지출 요약, 절감 가능 금액
+
+- **게이미피케이션 요소**
+  - 비용 절감 목표 및 배지
+  - 구독 최적화 점수
+  - 월간 챌린지
+
+### 사용자 피드백 루프
+- **인앱 피드백 시스템**
+  - 간편한 피드백 제출 기능
+  - 사용자 설문조사
+  - 베타 테스트 그룹
+
+- **지속적인 개선**
+  - 월간 업데이트 및 신규 기능
+  - 사용자 요청 기능 구현
+  - 버그 수정 및 성능 개선
+
+## 마케팅 캘린더
+
+### 분기별 마케팅 계획
+- **Q1 2025**: 앱 출시 및 초기 사용자 확보
+  - 베타 테스트 및 소프트 런칭
+  - ASO 최적화
+  - 초기 콘텐츠 마케팅 구축
+
+- **Q2 2025**: 사용자 기반 확장
+  - 유료 광고 캠페인 확대
+  - 인플루언서 협업
+  - 리퍼럴 프로그램 강화
+
+- **Q3 2025**: 수익화 강화
+  - 프리미엄 전환 캠페인
+  - 파트너십 확대
+  - 계절 프로모션 (여름 특별 할인)
+
+- **Q4 2025**: 연말 캠페인 및 2026년 계획
+  - 홀리데이 시즌 프로모션
+  - 연간 리뷰 콘텐츠
+  - 2026년 마케팅 계획 수립
+
+## 마케팅 예산 및 ROI
+
+### 예산 할당
+- **초기 6개월 (MVP 출시 후)**
+  - 총 예산: $6,000
+  - ASO 및 앱스토어 광고: 40% ($2,400)
+  - 소셜 미디어 광고: 30% ($1,800)
+  - 콘텐츠 마케팅: 15% ($900)
+  - 인플루언서 협업: 10% ($600)
+  - 기타 및 예비비: 5% ($300)
+
+- **6-12개월**
+  - 총 예산: $12,000
+  - 예산 할당은 초기 6개월 성과에 따라 조정
+
+### ROI 측정
+- **주요 지표**
+  - CAC (고객 획득 비용): 목표 $3-5
+  - LTV (고객 생애 가치): 목표 $15-30
+  - LTV:CAC 비율: 목표 5:1 이상
+  - 전환율: 무료→유료 목표 5-10%
+  - 유지율: 30일 유지율 목표 40% 이상
+
+- **채널별 성과 분석**
+  - 채널별 CAC 및 전환율 추적
+  - A/B 테스트를 통한 광고 최적화
+  - 예산 재할당 기준 설정
+
+## 위험 요소 및 대응 계획
+
+### 마케팅 관련 위험
+- **높은 CAC**: 타겟팅 최적화, 오가닉 채널 강화
+- **낮은 전환율**: 가치 제안 개선, 프리미엄 기능 강화
+- **경쟁 심화**: 차별화 포인트 강조, 틈새 시장 집중
+- **마케팅 피로도**: 콘텐츠 다양화, 사용자 참여 방식 개선
+
+### 기회 활용 계획
+- **구독 경제 트렌드**: 관련 뉴스 및 트렌드에 맞춘 콘텐츠 제작
+- **AI 서비스 성장**: AI 특화 기능 강조 및 관련 커뮤니티 타겟팅
+- **비용 절감 관심 증가**: 경제 상황에 맞춘 마케팅 메시지 조정
+
+## 성공 지표 및 평가
+
+### 단기 성공 지표 (6개월)
+- 다운로드 수: 10,000+
+- 활성 사용자 수: 3,000+ (MAU)
+- 유료 전환율: 3%+
+- 앱스토어 평점: 4.3+
+- 유지율: 30일 유지율 30%+
+
+### 장기 성공 지표 (12-18개월)
+- 다운로드 수: 50,000+
+- 활성 사용자 수: 15,000+ (MAU)
+- 유료 전환율: 7%+
+- 앱스토어 평점: 4.5+
+- 유지율: 30일 유지율 40%+, 90일 유지율 25%+
+
+## 결론
+ZELLYY Subscription Manager의 마케팅 전략은 제한된 예산으로 최대 효과를 내는 것에 중점을 둡니다. ASO, 콘텐츠 마케팅, 커뮤니티 구축을 통한 오가닉 성장을 우선시하고, 전략적인 유료 광고와 파트너십으로 보완할 계획입니다. AI 서비스 특화 기능과 미니멀한 디자인을 차별화 포인트로 강조하여 경쟁 앱과의 차별화를 추구합니다. 지속적인 사용자 피드백과 데이터 분석을 통해 마케팅 전략을 최적화하고 조정해 나갈 것입니다.
--- a/subscription/monetization_plan.md
+++ b/subscription/monetization_plan.md
@@ -0,0 +1,132 @@
+# Subscription Manager - 수익화 모델 상세 계획
+
+## 개요
+이 문서는 ZELLYY Subscription Manager 앱의 수익화 전략을 상세히 정의합니다. 사용자 경험을 해치지 않으면서 지속 가능한 수익 모델을 구축하는 것을 목표로 합니다.
+
+## 비즈니스 모델 요약
+- **프리미엄 앱 모델**: 기본 기능은 무료로 제공하고, 고급 기능은 유료로 제공
+- **타겟 사용자**: AI 서비스 및 다양한 구독 서비스를 사용하는 디지털 소비자
+- **가치 제안**: 구독 서비스 관리 효율화, 비용 절감, 예산 관리 개선
+
+## 수익 모델 상세
+
+### 1. 프리미엄 플랜 (구독 모델)
+- **월간 구독**: ₩3,900/월
+- **연간 구독**: ₩29,900/년 (약 36% 할인)
+- **평생 이용권**: ₩79,900 (한정 프로모션)
+
+#### 프리미엄 플랜 혜택
+- 무제한 구독 서비스 등록 (무료 버전: 최대 5개)
+- 고급 분석 대시보드 및 리포트
+- 다중 기기 동기화 (MVP 이후)
+- 데이터 백업 및 복원
+- 광고 제거
+- 우선 지원 및 신규 기능 얼리 액세스
+- 커스텀 테마 및 아이콘 팩
+
+### 2. 일회성 구매 옵션
+- **스탠다드 업그레이드**: ₩39,900
+  - 무제한 구독 서비스 등록
+  - 기본 분석 기능
+  - 광고 제거
+  
+- **프로 업그레이드**: ₩59,900
+  - 스탠다드 업그레이드의 모든 기능
+  - 고급 분석 대시보드 및 리포트
+  - 데이터 백업 및 복원
+  - 커스텀 테마
+
+### 3. 인앱 광고 (무료 버전)
+- **배너 광고**: 앱 하단에 표시되는 비침투적 배너 광고
+- **보상형 광고**: 추가 기능 일시적 잠금 해제를 위한 선택적 광고 시청
+- **광고 네트워크**: Google AdMob, Facebook Audience Network
+
+### 4. 인앱 구매 (소모성)
+- **일회성 분석 리포트**: ₩2,900
+- **추가 구독 슬롯 팩**: ₩4,900 (5개 추가)
+- **테마 및 아이콘 팩**: ₩1,900~3,900
+
+## 가격 전략
+
+### 가격 책정 근거
+- **경쟁사 분석**: 유사 앱 가격 조사 (평균 월 $2.99~$4.99)
+- **가치 기반 가격 책정**: 사용자가 절약할 수 있는 잠재적 비용 고려
+- **심리적 가격 책정**: 가격 포인트를 전략적으로 설정 (₩3,900 vs ₩4,000)
+
+### 지역별 가격 조정
+- 주요 시장별 구매력에 따른 가격 조정
+- 환율 변동에 따른 정기적인 가격 검토
+
+### 할인 및 프로모션 전략
+- **출시 프로모션**: 초기 사용자를 위한 30% 할인 (첫 3개월)
+- **계절 할인**: 연 4회 주요 시즌 할인 (20-40%)
+- **리퍼럴 할인**: 친구 초대 시 양측 20% 할인
+- **윈백 캠페인**: 구독 취소 사용자 대상 특별 할인
+
+## 수익 분배 및 비용 구조
+
+### 예상 수익 분배
+- **앱스토어 수수료**: 30% (첫해) / 15% (이후)
+- **광고 네트워크 수수료**: 약 40%
+- **결제 처리 수수료**: 약 3%
+- **순 수익**: 약 52-67%
+
+### 운영 비용
+- **개발 및 유지보수**: 초기 개발 후 월 유지보수 비용
+- **마케팅 비용**: 수익의 15-20% 재투자
+- **고객 지원**: 수익의 5-10%
+- **서버 비용** (MVP 이후): 사용자 증가에 따라 변동
+
+## 수익화 로드맵
+
+### 1단계: MVP 출시 (1-3개월)
+- 무료 버전 출시 (5개 구독 제한)
+- 기본 인앱 구매 옵션 (프리미엄 업그레이드)
+- 최소한의 광고 구현 (무료 버전)
+
+### 2단계: 수익 모델 확장 (4-6개월)
+- 구독 모델 도입 (월간/연간)
+- 추가 인앱 구매 항목 추가
+- A/B 테스트를 통한 가격 최적화
+
+### 3단계: 파트너십 및 제휴 (7-12개월)
+- 구독 서비스 제공업체와 제휴 마케팅
+- 추천 프로그램 도입
+- 프리미엄 콘텐츠 및 가이드 제공
+
+### 4단계: 비즈니스 모델 다각화 (12개월 이후)
+- 기업용 솔루션 개발
+- API 및 데이터 분석 서비스 제공
+- 화이트 라벨 솔루션 검토
+
+## 수익화 성과 측정
+
+### 주요 성과 지표 (KPI)
+- **전환율**: 무료 → 유료 사용자 전환 비율 (목표: 5-10%)
+- **ARPU**: 사용자당 평균 수익 (목표: $1.5-$3)
+- **LTV**: 사용자 생애 가치 (목표: $15-$30)
+- **이탈률**: 구독 취소율 (목표: <8%/월)
+- **ROI**: 마케팅 투자 수익률 (목표: >200%)
+
+### 분석 및 최적화
+- 월간 수익 분석 리포트 작성
+- 사용자 세그먼트별 수익 패턴 분석
+- 가격 및 프로모션 효과 측정
+- 이탈 원인 분석 및 대응 전략 수립
+
+## 위험 요소 및 대응 계획
+
+### 수익화 관련 위험
+- **낮은 전환율**: 무료 기능과 유료 기능 간 가치 격차 확대
+- **높은 이탈률**: 사용자 참여 전략 강화, 이탈 방지 프로그램 도입
+- **가격 저항**: 다양한 가격대 옵션 제공, 가치 커뮤니케이션 강화
+- **경쟁 심화**: 차별화된 기능 개발, 틈새 시장 집중
+
+### 법적 고려사항
+- 앱스토어 정책 준수
+- 구독 취소 및 환불 정책 명확화
+- 개인정보 보호법 준수
+- 세금 및 회계 규정 준수
+
+## 결론
+ZELLYY Subscription Manager는 무료 기본 버전과 다양한 유료 옵션을 제공하는 프리미엄 앱 모델을 채택합니다. 초기에는 기본적인 인앱 구매와 광고를 통해 수익을 창출하고, 점진적으로 구독 모델과 파트너십으로 수익 모델을 확장할 계획입니다. 사용자 경험을 최우선으로 하면서도 지속 가능한 비즈니스 모델을 구축하는 것이 목표입니다.
--- a/subscription/requirements.md
+++ b/subscription/requirements.md
@@ -0,0 +1,65 @@
+# Subscription Manager - 요구사항 문서
+
+## 프로젝트 개요
+Subscription Manager는 사용자가 다양한 구독 서비스(특히 AI 관련)를 효율적으로 관리할 수 있도록 도와주는 모바일 앱입니다. 사용자는 이 앱을 통해 구독 서비스의 비용, 사용량, 갱신일 등을 추적하고 관리할 수 있습니다.
+
+## 타겟 플랫폼
+- iOS
+- Android
+- (향후 확장) 웹 서비스
+
+## 개발 기술 스택
+- **프레임워크**: Flutter
+- **언어**: Dart
+- **데이터 저장**: 로컬 저장소 (SQLite)
+- **다국어 지원**: 영어, 한국어
+
+## 핵심 기능 (MVP)
+
+### 1. 구독 관리
+- 구독 서비스 추가, 편집, 삭제
+- 서비스별 정보 저장: 이름, 비용, 결제 주기, 다음 결제일, 카테고리
+- 기본 지원 서비스: OpenAI, Anthropic, Github, Cursor, Windsurf
+- 사용자 정의 서비스 추가 기능
+
+### 2. 비용 분석
+- 월별 총 구독 비용 계산
+- 카테고리별 비용 분석
+- 간단한 차트로 시각화
+
+### 3. 알림 시스템
+- 다가오는 결제일 알림
+- 예산 초과 알림
+
+### 4. 사용자 인터페이스
+- 미니멀 디자인, 라인 아트 스타일
+- 직관적인 대시보드
+- 다크/라이트 모드 지원
+
+### 5. 기본 설정
+- 언어 설정 (영어/한국어)
+- 통화 설정
+- 알림 설정
+
+## 비즈니스 모델
+- **무료 버전**: 최대 5개 구독 서비스 등록 가능
+- **프리미엄 버전**: 무제한 구독 서비스 등록, 추가 분석 기능
+
+## 향후 확장 기능 (MVP 이후)
+- 클라우드 동기화
+- 웹 서비스 확장
+- 추가 언어 지원
+- 고급 분석 기능
+- API 연동을 통한 자동 사용량 추적
+- 구독 최적화 추천
+
+## 제약 사항
+- 제한된 예산으로 개발
+- 초기에는 로컬 저장소만 사용
+- MVP 기능에 집중하여 빠른 출시
+
+## 성공 기준
+- 사용자가 쉽게 구독 서비스를 추가하고 관리할 수 있음
+- 월별 구독 비용을 명확하게 파악할 수 있음
+- 직관적이고 사용하기 쉬운 인터페이스
+- 안정적인 앱 성능
--- a/subscription/security_privacy.md
+++ b/subscription/security_privacy.md
@@ -0,0 +1,252 @@
+# Subscription Manager - 보안 및 개인정보 보호 전략
+
+## 개요
+이 문서는 ZELLYY Subscription Manager 앱의 보안 및 개인정보 보호 전략을 정의합니다. 사용자 데이터 보호와 안전한 앱 환경 구축을 위한 접근 방식과 구현 방법을 설명합니다.
+
+## 데이터 보안 원칙
+
+### 핵심 원칙
+- **최소 데이터 수집**: 필요한 데이터만 수집
+- **데이터 암호화**: 저장 및 전송 중인 모든 민감 데이터 암호화
+- **로컬 우선 처리**: 가능한 한 데이터를 로컬에서 처리
+- **투명성**: 데이터 수집 및 사용에 대한 명확한 커뮤니케이션
+- **사용자 통제**: 사용자에게 자신의 데이터에 대한 완전한 통제권 제공
+
+### 법적 준수
+- **GDPR**: 유럽 일반 데이터 보호 규정 준수
+- **CCPA**: 캘리포니아 소비자 개인정보 보호법 준수
+- **PIPA**: 한국 개인정보 보호법 준수
+- **앱스토어 정책**: Apple 및 Google의 개인정보 보호 정책 준수
+
+## 데이터 수집 및 저장
+
+### 수집하는 데이터 유형
+- **필수 데이터**
+  - 구독 서비스 정보 (이름, 비용, 결제 주기, 결제일)
+  - 앱 설정 및 환경설정
+  - 기기 정보 (앱 성능 최적화용)
+
+- **선택적 데이터**
+  - 사용자 프로필 (이름, 이메일 - 클라우드 동기화 시)
+  - 결제 카드 정보 (마스킹 처리)
+  - 사용 통계 (앱 개선용)
+
+### 데이터 저장 방식
+- **로컬 저장소**
+  - 기본 데이터: SQLite 데이터베이스
+  - 앱 설정: Shared Preferences
+  - 민감 정보: Flutter Secure Storage (암호화 저장)
+
+- **클라우드 저장소** (MVP 이후)
+  - 암호화된 백업
+  - 동기화 데이터
+  - 익명화된 사용 통계
+
+### 데이터 보존 및 삭제
+- **데이터 보존 기간**
+  - 로컬 데이터: 사용자가 삭제할 때까지
+  - 클라우드 데이터: 계정 삭제 후 30일 이내 완전 삭제
+  - 익명화된 분석 데이터: 최대 1년
+
+- **데이터 삭제 메커니즘**
+  - 앱 내 데이터 삭제 옵션
+  - 계정 삭제 시 모든 데이터 삭제
+  - 정기적인 불필요 데이터 정리
+
+## 암호화 및 보안 조치
+
+### 데이터 암호화
+- **저장 데이터 암호화**
+  - AES-256 암호화 (민감 정보)
+  - SQLCipher (암호화된 데이터베이스)
+  - 키 관리: 안전한 키 저장소 활용
+
+- **전송 데이터 암호화** (MVP 이후)
+  - TLS 1.3 사용
+  - 인증서 피닝
+  - 안전한 API 통신
+
+### 인증 및 권한 관리
+- **사용자 인증 옵션**
+  - 앱 잠금 (PIN, 패턴, 생체 인증)
+  - 클라우드 서비스용 이메일/비밀번호 인증
+  - OAuth 2.0 지원 (소셜 로그인)
+
+- **권한 관리**
+  - 최소 권한 원칙 적용
+  - 명시적 권한 요청 및 설명
+  - 권한 거부 시에도 핵심 기능 작동
+
+### 보안 코딩 및 테스트
+- **보안 코딩 관행**
+  - 입력 유효성 검사
+  - SQL 인젝션 방지
+  - 안전한 API 호출
+  - 디버그 정보 제한
+
+- **보안 테스트**
+  - 정적 코드 분석
+  - 취약점 스캔
+  - 침투 테스트 (주요 업데이트 전)
+  - 제3자 보안 감사 (MVP 이후)
+
+## 개인정보 보호 조치
+
+### 개인정보 처리방침
+- **명확하고 이해하기 쉬운 정책**
+  - 평이한 언어 사용
+  - 시각적 요소 활용
+  - 주요 포인트 강조
+
+- **정책 내용**
+  - 수집하는 데이터 유형
+  - 데이터 사용 목적
+  - 데이터 공유 정책
+  - 사용자 권리 및 선택
+  - 데이터 보안 조치
+  - 정책 변경 시 통지 방법
+
+### 사용자 동의 관리
+- **명시적 동의 획득**
+  - 초기 설정 시 동의 요청
+  - 선택적 데이터 수집에 대한 개별 동의
+  - 동의 철회 옵션 제공
+
+- **동의 기록 관리**
+  - 동의 버전 및 날짜 기록
+  - 동의 내역 확인 기능
+  - 정책 업데이트 시 재동의 요청
+
+### 사용자 권리 보장
+- **데이터 접근 권한**
+  - 수집된 데이터 확인 기능
+  - 데이터 내보내기 옵션
+
+- **수정 및 삭제 권한**
+  - 개인정보 수정 기능
+  - 데이터 삭제 요청 처리
+  - 계정 삭제 옵션
+
+- **개인정보 설정**
+  - 데이터 공유 설정
+  - 분석 데이터 수집 옵트아웃
+  - 마케팅 커뮤니케이션 설정
+
+## 제3자 서비스 및 데이터 공유
+
+### 제3자 서비스 이용
+- **분석 서비스**
+  - Firebase Analytics (익명화된 사용 데이터)
+  - Crashlytics (오류 보고)
+
+- **광고 서비스** (무료 버전)
+  - Google AdMob
+  - 최소한의 데이터 공유
+
+- **결제 처리**
+  - Apple App Store / Google Play 결제 시스템
+  - 직접적인 결제 정보 처리 없음
+
+### 데이터 공유 정책
+- **공유하는 데이터**
+  - 익명화된 사용 통계
+  - 앱 성능 데이터
+  - 집계된 사용자 행동 패턴
+
+- **공유하지 않는 데이터**
+  - 개인 식별 정보
+  - 구독 서비스 상세 정보
+  - 결제 정보
+
+- **데이터 공유 상황**
+  - 법적 요구가 있는 경우
+  - 명시적 사용자 동의가 있는 경우
+  - 서비스 제공에 필수적인 경우
+
+## 보안 인시던트 대응
+
+### 인시던트 대응 계획
+- **대응 팀 구성**
+  - 보안 책임자 지정
+  - 개발 및 법무 담당자 포함
+  - 외부 보안 전문가 협력
+
+- **대응 프로세스**
+  - 인시던트 감지 및 평가
+  - 피해 최소화 조치
+  - 복구 및 문제 해결
+  - 사후 분석 및 예방 조치
+
+### 사용자 통지 절차
+- **통지 기준**
+  - 개인정보 유출 가능성이 있는 모든 인시던트
+  - 법적 요구사항에 따른 통지
+
+- **통지 방법**
+  - 앱 내 알림
+  - 이메일 통지 (등록된 경우)
+  - 웹사이트 공지
+  - 필요시 언론 보도
+
+- **통지 내용**
+  - 인시던트 개요 및 영향
+  - 취해진 조치
+  - 사용자 권장 조치
+  - 문의 및 지원 방법
+
+## 지속적인 보안 관리
+
+### 보안 모니터링
+- **정기적인 보안 검토**
+  - 월간 보안 상태 점검
+  - 취약점 스캔
+  - 의심스러운 활동 모니터링
+
+- **업데이트 관리**
+  - 정기적인 보안 패치
+  - 종속성 취약점 관리
+  - 보안 관련 릴리스 우선 처리
+
+### 보안 교육 및 문화
+- **개발팀 교육**
+  - 보안 코딩 관행
+  - 개인정보 보호 인식
+  - 최신 보안 위협 교육
+
+- **보안 문화 구축**
+  - 보안 우선 개발 방법론
+  - 코드 리뷰에 보안 검토 포함
+  - 보안 개선 제안 장려
+
+## MVP 및 향후 보안 로드맵
+
+### MVP 단계 보안 조치
+- **필수 보안 기능**
+  - 로컬 데이터 암호화
+  - 앱 잠금 기능
+  - 기본 개인정보 보호 조치
+  - 명확한 개인정보 처리방침
+
+- **초기 보안 테스트**
+  - 기본 취약점 스캔
+  - 주요 기능 보안 검토
+  - 개인정보 처리 검증
+
+### 향후 보안 강화 계획
+- **클라우드 동기화 보안** (MVP 이후)
+  - 엔드-투-엔드 암호화
+  - 안전한 인증 시스템
+  - 데이터 동기화 보안 프로토콜
+
+- **고급 보안 기능**
+  - 2단계 인증
+  - 고급 암호화 옵션
+  - 보안 백업 및 복구
+
+- **보안 인증 및 규정 준수**
+  - 업계 표준 보안 인증 획득
+  - 국제 개인정보 보호 규정 준수
+  - 정기적인 제3자 보안 감사
+
+## 결론
+ZELLYY Subscription Manager는 사용자 데이터 보호를 최우선으로 합니다. 최소한의 데이터 수집, 강력한 암호화, 투명한 개인정보 처리방침을 통해 사용자가 안심하고 앱을 사용할 수 있는 환경을 제공합니다. MVP 단계에서는 기본적인 보안 조치에 집중하고, 이후 단계적으로 보안 기능을 강화해 나갈 계획입니다. 지속적인 보안 모니터링과 개선을 통해 변화하는 보안 위협에 대응하고, 사용자의 신뢰를 유지하겠습니다.
--- a/subscription/test_plan.md
+++ b/subscription/test_plan.md
@@ -0,0 +1,170 @@
+# Subscription Manager - 테스트 계획
+
+## 개요
+이 문서는 Subscription Manager 앱의 테스트 전략과 계획을 정의합니다. 앱의 품질을 보장하고 사용자 경험을 최적화하기 위한 다양한 테스트 방법을 설명합니다.
+
+## 테스트 환경
+
+### 모바일 기기
+- **iOS**: iPhone SE(2020), iPhone 12, iPhone 14 Pro
+- **Android**: Samsung Galaxy S10, Google Pixel 6, Xiaomi Mi 11
+
+### OS 버전
+- **iOS**: 14.0 이상
+- **Android**: 8.0 이상
+
+### 화면 크기
+- 작은 화면 (5.5인치 이하)
+- 중간 화면 (5.5-6.5인치)
+- 큰 화면 (6.5인치 이상)
+- 태블릿 (선택적)
+
+## 테스트 유형
+
+### 1. 기능 테스트
+앱의 각 기능이 요구사항에 맞게 올바르게 작동하는지 확인합니다.
+
+#### 구독 관리 테스트
+- 새 구독 추가 기능
+- 구독 정보 편집 기능
+- 구독 삭제 기능
+- 구독 활성화/비활성화 기능
+- 구독 목록 표시 및 정렬 기능
+
+#### 비용 분석 테스트
+- 월별 총 비용 계산 정확성
+- 카테고리별 비용 분석 정확성
+- 차트 및 그래프 표시 정확성
+
+#### 알림 테스트
+- 결제일 알림 기능
+- 알림 설정 및 해제 기능
+- 알림 클릭 시 앱 내 해당 화면으로 이동 기능
+
+#### 설정 테스트
+- 언어 변경 기능 (영어/한국어)
+- 통화 설정 기능
+- 테마 변경 기능 (라이트/다크 모드)
+
+### 2. 사용성 테스트
+사용자가 앱을 직관적으로 사용할 수 있는지 확인합니다.
+
+#### 테스트 시나리오
+1. 첫 사용자 온보딩 경험
+2. 새 구독 추가 프로세스
+3. 구독 정보 찾기 및 확인
+4. 월별 지출 분석 확인
+5. 설정 변경 및 적용
+
+#### 평가 기준
+- 작업 완료 시간
+- 오류 발생 횟수
+- 사용자 만족도 (1-5점 척도)
+- 직관성 평가 (1-5점 척도)
+
+### 3. 성능 테스트
+앱의 성능과 리소스 사용을 평가합니다.
+
+#### 측정 지표
+- 앱 시작 시간
+- 화면 전환 시간
+- 메모리 사용량
+- CPU 사용량
+- 배터리 소모율
+- 저장 공간 사용량
+
+#### 테스트 조건
+- 적은 수의 구독 (5개 이하)
+- 중간 수의 구독 (5-20개)
+- 많은 수의 구독 (20개 이상)
+
+### 4. 호환성 테스트
+다양한 기기와 OS 버전에서 앱이 올바르게 작동하는지 확인합니다.
+
+#### 테스트 항목
+- 다양한 화면 크기에서의 UI 표시
+- 다양한 OS 버전에서의 기능 작동
+- 다양한 기기 제조사의 기기에서의 호환성
+- 시스템 폰트 크기 변경에 따른 UI 적응성
+
+### 5. 로컬라이제이션 테스트
+다국어 지원이 올바르게 구현되었는지 확인합니다.
+
+#### 테스트 항목
+- 영어 텍스트 표시 정확성
+- 한국어 텍스트 표시 정확성
+- 날짜 및 시간 형식의 지역화
+- 통화 형식의 지역화
+
+### 6. 데이터 무결성 테스트
+앱의 데이터 저장 및 관리 기능을 검증합니다.
+
+#### 테스트 항목
+- 데이터 저장 정확성
+- 앱 재시작 후 데이터 유지
+- 데이터 백업 및 복원 기능
+- 잘못된 입력에 대한 유효성 검사
+
+## 테스트 일정
+
+### 알파 테스트 (내부)
+- 기간: 개발 완료 후 2주
+- 참가자: 개발팀, 기획팀
+- 목표: 주요 버그 및 기능 이슈 식별
+
+### 베타 테스트 (외부)
+- 기간: 알파 테스트 완료 후 2주
+- 참가자: 선별된 외부 테스터 (20-30명)
+- 목표: 사용성 개선 및 실제 환경에서의 성능 검증
+
+### 출시 전 최종 테스트
+- 기간: 베타 테스트 완료 후 1주
+- 참가자: QA팀, 개발팀
+- 목표: 모든 중요 이슈 해결 확인 및 출시 준비
+
+## 버그 추적 및 보고
+
+### 버그 심각도 분류
+1. **치명적 (Critical)**: 앱 충돌, 데이터 손실 등 사용 불가능한 상태
+2. **높음 (High)**: 주요 기능 작동 불가
+3. **중간 (Medium)**: 기능은 작동하나 사용성에 영향
+4. **낮음 (Low)**: 사소한 UI 이슈, 개선 사항
+
+### 버그 보고 템플릿
+- 버그 제목
+- 심각도
+- 재현 단계
+- 예상 결과
+- 실제 결과
+- 기기 정보 (모델, OS 버전)
+- 스크린샷/비디오 (가능한 경우)
+
+## 테스트 자동화
+
+### 단위 테스트
+- 데이터 모델 및 비즈니스 로직 검증
+- 계산 함수의 정확성 검증
+
+### 통합 테스트
+- 데이터베이스 연동 검증
+- 화면 간 데이터 전달 검증
+
+### UI 테스트
+- 기본 사용자 흐름 자동화 테스트
+- 다양한 화면 크기에서의 UI 검증
+
+## 출시 기준
+앱 출시를 위한 최소 품질 기준을 정의합니다.
+
+### 필수 조건
+- 치명적 버그 0개
+- 높은 심각도 버그 0개
+- 중간 심각도 버그 5개 이하
+- 모든 핵심 기능 정상 작동
+- 주요 기기에서 호환성 확인
+- 성능 지표 목표 달성 (앱 시작 3초 이내, 화면 전환 0.5초 이내)
+
+## 테스트 담당자 및 역할
+- 기획자: 사용성 테스트 주관, 요구사항 검증
+- 개발자: 단위 테스트, 통합 테스트 작성 및 실행
+- 외부 테스터: 베타 테스트 참여, 피드백 제공
--- a/subscription/ui_ux_design.md
+++ b/subscription/ui_ux_design.md
@@ -0,0 +1,108 @@
+# Subscription Manager - UI/UX 디자인 가이드
+
+## 디자인 철학
+Subscription Manager는 미니멀하고 직관적인 디자인을 추구합니다. 라인 아트 스타일의 시각적 요소를 활용하여 깔끔하고 현대적인 느낌을 줍니다. 사용자가 복잡한 구독 정보를 쉽게 이해하고 관리할 수 있도록 명확한 시각적 계층 구조를 제공합니다.
+
+## 색상 팔레트
+- **주 색상**: #3A86FF (밝은 파란색) - 브랜드 아이덴티티
+- **보조 색상**: #8338EC (보라색) - 강조 요소
+- **중립 색상**: 
+  - #FFFFFF (흰색) - 배경 (라이트 모드)
+  - #121212 (진한 회색) - 배경 (다크 모드)
+  - #F5F5F5 (연한 회색) - 카드 배경 (라이트 모드)
+  - #2A2A2A (중간 회색) - 카드 배경 (다크 모드)
+- **기능 색상**:
+  - #FF006E (핑크) - 경고/삭제
+  - #38B000 (녹색) - 성공/추가
+  - #FFBE0B (노란색) - 알림/주의
+
+## 타이포그래피
+- **기본 폰트**: Roboto (Android), San Francisco (iOS)
+- **제목**: 18-24pt, 볼드
+- **부제목**: 16pt, 미디엄
+- **본문**: 14pt, 레귤러
+- **작은 텍스트**: 12pt, 레귤러
+
+## 아이콘 스타일
+- 라인 아트 스타일의 심플한 아이콘
+- 2px 스트로크 두께
+- 둥근 모서리
+- 일관된 크기와 패딩
+
+## 주요 화면 구성
+
+### 1. 홈 화면 (대시보드)
+- 상단: 총 월간 구독 비용 요약
+- 중앙: 다가오는 결제 타임라인
+- 하단: 카테고리별 비용 분포 차트
+- 플로팅 액션 버튼: 새 구독 추가
+
+### 2. 구독 목록 화면
+- 구독 서비스 카드 리스트
+- 각 카드: 서비스 로고, 이름, 비용, 다음 결제일
+- 정렬 옵션: 가격순, 이름순, 다음 결제일순
+- 필터 옵션: 카테고리별
+
+### 3. 구독 상세 화면
+- 서비스 정보 (로고, 이름, 설명)
+- 비용 정보 (금액, 결제 주기)
+- 결제 일정 (다음 결제일, 이전 결제 내역)
+- 사용량 통계 (가능한 경우)
+- 편집/삭제 버튼
+
+### 4. 구독 추가/편집 화면
+- 서비스 선택 (미리 정의된 서비스 또는 사용자 정의)
+- 비용 입력
+- 결제 주기 선택
+- 시작일 선택
+- 카테고리 선택
+- 메모 추가 옵션
+
+### 5. 분석 화면
+- 시간별 비용 추이 그래프
+- 카테고리별 비용 분포 파이 차트
+- 가장 비용이 많이 드는 서비스 순위
+- 연간 총 비용 예측
+
+### 6. 설정 화면
+- 언어 설정 (영어/한국어)
+- 통화 설정
+- 알림 설정
+- 테마 설정 (라이트/다크 모드)
+- 앱 정보 및 피드백
+
+## 사용자 흐름
+
+### 초기 설정 흐름
+1. 앱 설치 후 첫 실행
+2. 언어 선택 화면
+3. 간단한 온보딩 (3-4 화면)
+4. 첫 구독 추가 안내
+
+### 구독 추가 흐름
+1. 홈 화면에서 '+' 버튼 클릭
+2. 서비스 선택 (검색 또는 목록에서 선택)
+3. 구독 정보 입력
+4. 저장 및 확인
+
+### 알림 흐름
+1. 결제 예정 알림 수신
+2. 알림 클릭
+3. 해당 구독 상세 화면으로 이동
+
+## 반응형 디자인
+- 다양한 화면 크기에 적응하는 레이아웃
+- 태블릿 지원을 위한 분할 화면 레이아웃
+- 향후 웹 버전을 위한 확장 가능한 디자인
+
+## 접근성
+- 고대비 모드 지원
+- 스크린 리더 호환성
+- 충분한 터치 타겟 크기 (최소 44x44pt)
+- 색상만으로 정보를 구분하지 않음
+
+## 애니메이션 및 전환
+- 부드러운 화면 전환 (페이드, 슬라이드)
+- 미묘한 피드백 애니메이션
+- 데이터 로딩 상태를 위한 스켈레톤 화면
+- 카드 확장/축소 애니메이션
--- a/subscription/user_onboarding.md
+++ b/subscription/user_onboarding.md
@@ -0,0 +1,229 @@
+# Subscription Manager - 사용자 온보딩 프로세스
+
+## 개요
+이 문서는 ZELLYY Subscription Manager 앱의 사용자 온보딩 프로세스를 정의합니다. 효과적인 온보딩은 사용자가 앱의 가치를 빠르게 이해하고, 핵심 기능을 쉽게 학습하며, 지속적인 사용을 유도하는 데 중요합니다.
+
+## 온보딩 목표
+
+### 주요 목표
+- **가치 전달**: 앱의 핵심 가치와 차별점을 명확히 전달
+- **기능 소개**: 주요 기능을 직관적으로 소개
+- **첫 성공 경험**: 사용자가 빠르게 첫 번째 성공 경험(구독 추가 및 관리)을 할 수 있도록 안내
+- **참여 유도**: 지속적인 앱 사용과 프리미엄 기능 탐색 유도
+
+### 성공 지표
+- 온보딩 완료율: 목표 85% 이상
+- 첫 구독 등록률: 목표 70% 이상
+- 두 번째 방문 전환율: 목표 60% 이상
+- 7일 유지율: 목표 40% 이상
+- 프리미엄 기능 탐색률: 목표 30% 이상
+
+## 온보딩 단계
+
+### 1. 첫 실행 경험
+
+#### 스플래시 화면
+- 앱 로고 및 브랜드 노출
+- 간결한 애니메이션 (2-3초)
+- 앱 로딩 중 표시
+
+#### 언어 선택
+- 기기 기본 언어 자동 감지
+- 지원 언어 선택 옵션 (한국어/영어)
+- 간결한 UI로 빠른 선택 유도
+
+### 2. 가치 소개 슬라이드 (워크스루)
+
+#### 슬라이드 1: 환영 메시지
+- 제목: "구독 관리의 새로운 시작"
+- 부제목: "ZELLYY와 함께 모든 구독 서비스를 스마트하게 관리하세요"
+- 일러스트레이션: 다양한 구독 서비스 아이콘과 중앙의 ZELLYY 로고
+
+#### 슬라이드 2: 핵심 가치 1
+- 제목: "한눈에 보는 구독 현황"
+- 부제목: "매월 얼마를 구독 서비스에 지출하는지 명확하게 파악하세요"
+- 일러스트레이션: 대시보드 화면 미리보기
+
+#### 슬라이드 3: 핵심 가치 2
+- 제목: "결제일 놓치지 않기"
+- 부제목: "다가오는 결제일을 알림으로 받고 예산을 효율적으로 관리하세요"
+- 일러스트레이션: 알림 화면 미리보기
+
+#### 슬라이드 4: 핵심 가치 3
+- 제목: "AI 서비스 특화 관리"
+- 부제목: "OpenAI, Anthropic 등 AI 서비스 구독을 효율적으로 관리하세요"
+- 일러스트레이션: AI 서비스 구독 관리 화면 미리보기
+
+#### 슬라이드 5: 시작하기
+- 제목: "지금 시작해보세요"
+- 부제목: "첫 구독을 추가하고 ZELLYY의 모든 기능을 경험해보세요"
+- 행동 버튼: "시작하기" (강조 버튼)
+- 건너뛰기 옵션: 모든 슬라이드에 "건너뛰기" 버튼 제공
+
+### 3. 권한 요청
+
+#### 알림 권한
+- 시점: 워크스루 완료 직후
+- 메시지: "결제일 알림을 받으시려면 알림 권한이 필요합니다"
+- 이점 설명: "중요한 결제일을 놓치지 않도록 도와드립니다"
+- 옵션: "허용" / "나중에"
+
+#### 기타 권한 (필요시)
+- 각 권한 요청 시 명확한 이유와 이점 설명
+- 필수적이지 않은 권한은 해당 기능 사용 시점에 요청
+
+### 4. 첫 구독 등록 안내
+
+#### 빈 상태 화면
+- 메시지: "아직 등록된 구독이 없습니다"
+- 부가 설명: "첫 번째 구독을 추가하고 관리를 시작해보세요"
+- 행동 버튼: "+ 구독 추가하기" (강조 버튼)
+- 일러스트레이션: 빈 상태를 나타내는 친근한 이미지
+
+#### 구독 추가 가이드
+- 단계별 툴팁 가이드:
+  1. "서비스 선택하기" (인기 서비스 목록 또는 직접 입력)
+  2. "구독 정보 입력하기" (비용, 결제 주기, 시작일)
+  3. "카테고리 선택하기" (AI, 엔터테인먼트, 유틸리티 등)
+- 진행 표시기: 단계별 진행 상황 시각화
+- 도움말 버튼: 각 단계에서 추가 정보 제공
+
+#### 첫 구독 등록 완료
+- 축하 메시지: "첫 번째 구독이 성공적으로 등록되었습니다!"
+- 다음 단계 안내: "대시보드에서 구독 현황을 확인하세요"
+- 행동 버튼: "대시보드 보기" / "더 추가하기"
+- 작은 축하 애니메이션: 성취감 제공
+
+### 5. 핵심 기능 소개
+
+#### 기능 발견 툴팁
+- 대시보드 첫 방문 시 주요 UI 요소 하이라이트
+- 간결한 설명과 함께 핵심 기능 소개
+- 순차적 표시: 한 번에 하나의 툴팁만 표시
+- 사용자 제어: "다음" / "건너뛰기" 옵션
+
+#### 주요 소개 기능
+1. 총 구독 비용 요약
+2. 다가오는 결제 타임라인
+3. 카테고리별 비용 분석
+4. 구독 추가 버튼
+5. 설정 메뉴
+
+#### 기능 탐색 유도
+- 완료 후 메시지: "이제 ZELLYY의 기본 사용법을 알게 되셨습니다"
+- 추가 탐색 유도: "더 많은 기능을 탐색해보세요"
+- 행동 버튼: "더 알아보기" (분석 화면으로 이동)
+
+### 6. 프리미엄 기능 소개
+
+#### 무료 기능 한도 도달 시
+- 메시지: "무료 버전에서는 최대 5개의 구독을 관리할 수 있습니다"
+- 프리미엄 가치 제안: "프리미엄으로 업그레이드하여 무제한 구독 관리와 고급 기능을 이용하세요"
+- 행동 버튼: "프리미엄 혜택 보기" / "나중에"
+
+#### 프리미엄 혜택 소개
+- 무제한 구독 관리
+- 고급 분석 대시보드
+- 데이터 백업 및 동기화 (MVP 이후)
+- 광고 제거
+- 커스텀 테마
+
+#### 프리미엄 체험 제안
+- 메시지: "7일 무료 체험으로 프리미엄 기능을 경험해보세요"
+- 가격 정보: 월간/연간 구독 옵션 및 할인 정보
+- 행동 버튼: "무료 체험 시작하기" / "다음에"
+
+## 지속적 온보딩
+
+### 기능 발견 유도
+- 새로운 기능 출시 시 하이라이트
+- 미사용 기능에 대한 주기적 팁 제공
+- 상황별 도움말 (예: 분석 화면 첫 방문 시)
+
+### 참여 유도 메시지
+- 앱 사용 3일 후: "새로운 구독을 추가해보세요"
+- 앱 사용 7일 후: "월간 분석 리포트를 확인해보세요"
+- 앱 사용 14일 후: "알림 설정을 통해 중요한 결제일을 놓치지 마세요"
+
+### 재참여 전략
+- 미사용 기간 7일 후: "놓치고 있는 결제가 있어요" 알림
+- 미사용 기간 14일 후: "구독 현황 업데이트가 필요합니다" 알림
+- 미사용 기간 30일 후: "이번 달 총 구독 비용: XX원" 요약 알림
+
+## 사용자 피드백 수집
+
+### 온보딩 피드백
+- 온보딩 완료 직후: 간단한 만족도 조사 (1-5점)
+- 첫 구독 등록 후: "구독 추가 과정이 쉬웠나요?" (예/아니오)
+- 앱 사용 3일 후: 상세 피드백 설문 (선택적)
+
+### 지속적 피드백 채널
+- 인앱 피드백 버튼 (설정 메뉴 내)
+- 이메일 지원 옵션
+- 앱스토어 리뷰 유도 (긍정적 경험 후)
+
+## 온보딩 테스트 및 최적화
+
+### A/B 테스트 계획
+- 워크스루 슬라이드 수 (3장 vs 5장)
+- 툴팁 표시 방식 (자동 vs 사용자 트리거)
+- 첫 구독 등록 가이드 상세도 (간략 vs 상세)
+
+### 사용자 행동 분석
+- 온보딩 단계별 이탈률 추적
+- 첫 세션 지속 시간 및 행동 패턴
+- 주요 기능 발견율 및 사용률
+
+### 최적화 주기
+- 초기 출시 후 2주마다 데이터 분석
+- 월간 온보딩 개선 계획 수립
+- 분기별 주요 온보딩 업데이트
+
+## 특별 사용자 그룹 온보딩
+
+### 파워 유저
+- 고급 기능 중심 소개
+- 단축키 및 효율적 사용법 강조
+- 데이터 마이그레이션 도구 제공 (다른 앱에서 이전)
+
+### 기술에 익숙하지 않은 사용자
+- 더 상세한 단계별 가이드
+- 추가 도움말 및 설명 제공
+- 간소화된 첫 경험 (고급 기능 단계적 소개)
+
+### 재방문 사용자
+- 새로운 기능 중심 소개
+- 이전 데이터 복원 안내 (해당하는 경우)
+- 맞춤형 환영 메시지 ("다시 만나서 반가워요!")
+
+## 다국어 지원
+
+### 지원 언어
+- 한국어 (기본)
+- 영어
+- (향후 확장) 일본어, 중국어
+
+### 현지화 전략
+- 단순 번역을 넘어선 문화적 맥락 고려
+- 지역별 인기 구독 서비스 맞춤 추천
+- 통화 및 날짜 형식 자동 조정
+
+## 접근성 고려사항
+
+### 시각적 접근성
+- 고대비 모드 지원
+- 확대 가능한 텍스트
+- 스크린 리더 호환성
+
+### 인지적 접근성
+- 명확하고 간결한 지시문
+- 단계별 진행으로 인지 부하 감소
+- 충분한 시간 제공 (타임아웃 없음)
+
+### 운동 능력 접근성
+- 충분한 터치 타겟 크기
+- 최소한의 제스처 요구
+- 대체 입력 방법 지원
+
+## 결론
+ZELLYY Subscription Manager의 사용자 온보딩 프로세스는 사용자가 앱의 가치를 빠르게 이해하고 핵심 기능을 쉽게 학습할 수 있도록 설계되었습니다. 단계적인 가이드와 상황에 맞는 도움말을 통해 모든 사용자가 앱을 효과적으로 활용할 수 있도록 지원합니다. 지속적인 데이터 분석과 사용자 피드백을 통해 온보딩 프로세스를 지속적으로 개선해 나갈 계획입니다.