<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
  <channel>
    <title>somiru03 님의 블로그</title>
    <link>https://somiru03.tistory.com/</link>
    <description>somiru03 님의 블로그 입니다.</description>
    <language>ko</language>
    <pubDate>Wed, 20 May 2026 20:41:38 +0900</pubDate>
    <generator>TISTORY</generator>
    <ttl>100</ttl>
    <managingEditor>somiru03</managingEditor>
    <item>
      <title>[UX] - 화면정의서(1)</title>
      <link>https://somiru03.tistory.com/2</link>
      <description>&lt;p id=&quot;SE-38bedef4-73e7-47f3-be3d-cbc79e160e37&quot; style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333;&quot;&gt;&lt;b&gt;화면정의서는 &lt;/b&gt;기획자가 기획한 서비스 화면&lt;/span&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333;&quot;&gt;이 어떤 형태로, &lt;/span&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333;&quot;&gt;&lt;b&gt;어떤 기능을 제공하는지를 상세히 적은 문서&lt;/b&gt;이다.&lt;/span&gt;&lt;/p&gt;
&lt;p id=&quot;SE-2718a676-934b-4ef3-a067-8de33f662093&quot; style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333;&quot;&gt;화면을 어떻게 표현할지를 그려 놓은 &lt;/span&gt;&lt;span style=&quot;background-color: #fff8b2; color: #333333;&quot;&gt;&lt;b&gt;와이어 프레임과 함께&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;background-color: #fff8b2; color: #333333;&quot;&gt; &lt;/span&gt;&lt;span style=&quot;background-color: #fff8b2; color: #333333;&quot;&gt;&lt;b&gt;기능을 구현하기 위해 작성하는 기능 정의서를 합친 기획서&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;color: #333333;&quot;&gt;라고한다.&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #333333;&quot;&gt;화면정의서에 필수적으로 들어가야하는 내용은&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #333333;&quot;&gt;&lt;b&gt;수정 내역, 플로우차트 , IA 구조도, 와이어프레임, 디스크립션(기능에 대한 설명)&lt;/b&gt;이 필수적으로 들어가게 된다.&amp;nbsp;&lt;/span&gt;&lt;span style=&quot;color: #333333;&quot;&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;background-color: #ffffff; color: #000000; text-align: left;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;1. 화면 정의서 작성&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;[표지]&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 제목&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 소제목(업데이트 목록)&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 버전&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 작성일&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 소속 및 작성자&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;[문서 히스토리 (문서 업데이트 목록)]&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 업데이트 날짜&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 화면 정의서 버전&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 작성자&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imagegridblock&quot;&gt;
  &lt;div class=&quot;image-container&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bU2hw6/dJMcafsFuyk/fdB1EyAJi9pZSY1mUu60g0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bU2hw6/dJMcafsFuyk/fdB1EyAJi9pZSY1mUu60g0/img.png&quot; data-origin-width=&quot;1287&quot; data-origin-height=&quot;704&quot; data-is-animation=&quot;false&quot; width=&quot;556&quot; height=&quot;304&quot; data-widthpercent=&quot;29.15&quot; style=&quot;width: 28.815%; margin-right: 10px;&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bU2hw6/dJMcafsFuyk/fdB1EyAJi9pZSY1mUu60g0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbU2hw6%2FdJMcafsFuyk%2FfdB1EyAJi9pZSY1mUu60g0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;1287&quot; height=&quot;704&quot;/&gt;&lt;/span&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bldMCE/dJMcafM0WhH/0Wui88oCZc8UZQPh8Aj080/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bldMCE/dJMcafM0WhH/0Wui88oCZc8UZQPh8Aj080/img.png&quot; data-origin-width=&quot;1235&quot; data-origin-height=&quot;278&quot; data-is-animation=&quot;false&quot; style=&quot;width: 70.0222%;&quot; data-widthpercent=&quot;70.85&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bldMCE/dJMcafM0WhH/0Wui88oCZc8UZQPh8Aj080/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbldMCE%2FdJMcafM0WhH%2F0Wui88oCZc8UZQPh8Aj080%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;1235&quot; height=&quot;278&quot;/&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-origin-width=&quot;1280&quot; data-origin-height=&quot;706&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/PWRPh/dJMcahD0tTe/invFmzRqFLHmw8GTGoUhH0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/PWRPh/dJMcahD0tTe/invFmzRqFLHmw8GTGoUhH0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/PWRPh/dJMcahD0tTe/invFmzRqFLHmw8GTGoUhH0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FPWRPh%2FdJMcahD0tTe%2FinvFmzRqFLHmw8GTGoUhH0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;702&quot; height=&quot;387&quot; data-origin-width=&quot;1280&quot; data-origin-height=&quot;706&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;[본문]&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 와이어프레임&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;- 디스크립션(기능 작성)&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;와이어프레임에 번호를 달아, &lt;b&gt;각 기능이 어떤 작동을 하는지, 어떻게 이동되는지, 스크롤 영역은 어떻게 되어있는지&lt;/b&gt; 상세하게 작성해 주면 타작업자들이 확인 후 빠른 작업이 가능하다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;IA 구조도는 다음에 작성해보고자한다.&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>UX공부</category>
      <author>somiru03</author>
      <guid isPermaLink="true">https://somiru03.tistory.com/2</guid>
      <comments>https://somiru03.tistory.com/2#entry2comment</comments>
      <pubDate>Sat, 11 Apr 2026 23:25:15 +0900</pubDate>
    </item>
    <item>
      <title>[UX] - 시작하기</title>
      <link>https://somiru03.tistory.com/1</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;어플리케이션을 제작하면서 느낀 경험, 고민점에 대해 작성해보려한다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;원래 UX를 공부하지않아 어설픈 부분들이 많아, 스스로 공부하고, 그 공부한 내용들을 어떻게 적용해보았는지에 대해 작성해보려한다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;나는 현재 이 팀에서 서비스 기획자로써 유저의 흐름과 사용을 할때 번거롭지 않고, 원하는 기능까지 원활하게 어떻게 도달할 수 있을지에 대해 고민중에 있다.&amp;nbsp;&lt;/p&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;1. UX와 UI&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;UI는 &lt;b&gt;User Interface&lt;/b&gt; 말 그대로 유저가 보게되는 화면을 의미한다. 사용자가 화면을 켰을때 보이는 디자인들을 UI라고 부르고, 서비스 기획자들은 이걸 UI 디자이너들이 잘 구성할 수 있게 와이어프레임을 구성해준다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;UX는 &lt;b&gt;User Experience은&amp;nbsp;&lt;/b&gt;유저 경험. 즉, 사용자가 화면을 키고 종료하는 그 모든 과정이 어떻게 이루어지는지, 어떤 부분에서 불편함을 느끼고, 그걸 해소하기 위해 어떻게 해야하는지에 대해 고민을 지속적으로 해야하는 분야이다.&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-origin-width=&quot;1079&quot; data-origin-height=&quot;1079&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bJ5tBm/dJMcabDFtWM/NerKevsTFKcN0PgZKZzO6k/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bJ5tBm/dJMcabDFtWM/NerKevsTFKcN0PgZKZzO6k/img.png&quot; data-alt=&quot;내가 UIUX를 잘 이해하게된 이미지이다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bJ5tBm/dJMcabDFtWM/NerKevsTFKcN0PgZKZzO6k/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbJ5tBm%2FdJMcabDFtWM%2FNerKevsTFKcN0PgZKZzO6k%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;395&quot; height=&quot;395&quot; data-origin-width=&quot;1079&quot; data-origin-height=&quot;1079&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;내가 UIUX를 잘 이해하게된 이미지이다.&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;나는 이 UI와 UX 중 UX를 주로 공부를 하고있는중이다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;2. 이 둘은 어떻게 소통을 할까?&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;현재 우리팀에서는 Figma와 PPT로 화면 정의서를 제작해 디자이너와 소통을 진행하고있는중이다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;과거에는 xd라는 어도비의 프로그램을 사용했다고 하지만, 최근 Figma라는 협업 프로그램이 서비스 기획자와 디자이너에게 좋은 프로그램이 있어 이걸 사용중에 있다. Figma는 동시작업이 가능하다는 장점이 있지만, 내가 작업을 하면서 제일 좋다고 생각한 점은 플러그인과 아이폰 혹은 갤럭시 UI의 템플릿 등 사용할 수 있는 요소들이 많아 와이어프레임을 기획할때, UI 디자이너가 디자인을 할때, 조금 더 장점이 있어 Fimga를 사용하게 되는것 같다.&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>UX공부</category>
      <author>somiru03</author>
      <guid isPermaLink="true">https://somiru03.tistory.com/1</guid>
      <comments>https://somiru03.tistory.com/1#entry1comment</comments>
      <pubDate>Fri, 3 Apr 2026 16:39:37 +0900</pubDate>
    </item>
  </channel>
</rss>