logo
emoji
검색하기
어제 가장 많이 검색된 기술
emoji
가장 많이 읽은 글
logo
NEW
Chrome 확장 프로그램 개발 가이드
2024년 6월 기준, 전 세계에서 가장 많이 사용되는 브라우저는구글 크롬(Chrome)으로 65.68%를 차지했습니다.브라우저를 단순히 웹서핑용으로 사용하시는 분들이 많을텐데요,구글이나 애플의 앱스토어처럼 크롬 브라우저에도 웹 스토어가 존재하며다양한 앱을 설치해서 웹서핑을 편리하게 사용할 수 있습니다.이번 포스팅에서는 크롬 확장 프로그램 개발에 대해 알아보도록 하겠습니다.Chrome 확장 프로그램으로 할 수 있는 것Chrome 확장 프로그램은 브라우저의 기능을 확장하고 사용자 경험을 개선하는 강력한 도구입니다.• None 웹페이지 UI 변경: 원하는 스타일을 적용하여 웹사이트의 디자인을 커스터마이징• None 자동화 기능: 반복적인 작업을 자동으로 실행 (예: 자동 로그인, 데이터 추출)• None API 연동: 외부 서비스와 연동하여 정보를 제공 (예: 번역기, 가격 비교 도구)• None 알림 및 데이터 저장: 중요 정보를 저장하고, 특정 이벤트 발생 시 알림 제공Chrome은 앞서 말씀드렸듯이 전 세계적으로 가장 많이 사용되는 브라우저이며,이에 따라 Chrome 확장 프로그램이 가지는 장점도 많습니다.Chrome 확장 프로그램의 주요 장점• None 광범위한 사용자층: Chrome은 글로벌 시장에서 가장 높은 점유율을 차지하는 브라우저이므로, 확장 프로그램을 개발하면 많은 사용자를 대상으로 서비스를 제공할 수 있습니다.• None 강력한 개발자 도구 및 API 지원: Chrome은 확장 프로그램 개발을 위해 다양한 API를 제공하며, 개발자 친화적인 도구와 문서가 잘 정리되어 있어 쉽게 개발할 수 있습니다.• None 플랫폼 독립성: Chrome 확장 프로그램은 Windows, macOS, Linux 등 다양한 운영체제에서 동일하게 작동하여 높은 접근성을 가집니다.• None 보안 및 성능 향상: Manifest V3 도입으로 인해 보안이 강화되었으며, Service Worker 기반으로 리소스 사용을 줄여 성능이 향상되었습니다.• None 웹사이트와의 통합 용이성: Content Script와 Shadow DOM을 활용하면 기존 웹사이트의 디자인과 기능을 유지하면서도 확장 프로그램의 기능을 추가할 수 있습니다.Chrome 확장 프로그램을 개발하려면 manifest.json 파일을 작성해야 합니다.Manifest 여러 버전이 있으나 현재는 V3로만 작성해야 합니다.V3는 기존 V2에 비해 보안과 성능이 향상되었으며, background.js가 service_worker로 대체되었습니다.Content Script는 웹페이지 내에서 실행되며, DOM을 조작하거나 스타일을 변경하는 등의 작업을 수행할 수 있습니다.위 스크립트는 구글 검색 페이지에서 확장 프로그램이 실행되었음을 알리는 간단한 메시지를 띄우는 역할을 합니다.Service Worker는 특정 이벤트가 발생할 때만 실행되어 리소스 사용을 최소화할 수 있습니다.푸시 알림, 주기적인 데이터 동기화, API 호출 등의 백그라운드 작업을 수행할 때 Service Worker가 사용됩
3/25/2025
logo
Chrome 확장 프로그램 개발 가이드
NEW
2024년 6월 기준, 전 세계에서 가장 많이 사용되는 브라우저는구글 크롬(Chrome)으로 65.68%를 차지했습니다.브라우저를 단순히 웹서핑용으로 사용하시는 분들이 많을텐데요,구글이나 애플의 앱스토어처럼 크롬 브라우저에도 웹 스토어가 존재하며다양한 앱을 설치해서 웹서핑을 편리하게 사용할 수 있습니다.이번 포스팅에서는 크롬 확장 프로그램 개발에 대해 알아보도록 하겠습니다.Chrome 확장 프로그램으로 할 수 있는 것Chrome 확장 프로그램은 브라우저의 기능을 확장하고 사용자 경험을 개선하는 강력한 도구입니다.• None 웹페이지 UI 변경: 원하는 스타일을 적용하여 웹사이트의 디자인을 커스터마이징• None 자동화 기능: 반복적인 작업을 자동으로 실행 (예: 자동 로그인, 데이터 추출)• None API 연동: 외부 서비스와 연동하여 정보를 제공 (예: 번역기, 가격 비교 도구)• None 알림 및 데이터 저장: 중요 정보를 저장하고, 특정 이벤트 발생 시 알림 제공Chrome은 앞서 말씀드렸듯이 전 세계적으로 가장 많이 사용되는 브라우저이며,이에 따라 Chrome 확장 프로그램이 가지는 장점도 많습니다.Chrome 확장 프로그램의 주요 장점• None 광범위한 사용자층: Chrome은 글로벌 시장에서 가장 높은 점유율을 차지하는 브라우저이므로, 확장 프로그램을 개발하면 많은 사용자를 대상으로 서비스를 제공할 수 있습니다.• None 강력한 개발자 도구 및 API 지원: Chrome은 확장 프로그램 개발을 위해 다양한 API를 제공하며, 개발자 친화적인 도구와 문서가 잘 정리되어 있어 쉽게 개발할 수 있습니다.• None 플랫폼 독립성: Chrome 확장 프로그램은 Windows, macOS, Linux 등 다양한 운영체제에서 동일하게 작동하여 높은 접근성을 가집니다.• None 보안 및 성능 향상: Manifest V3 도입으로 인해 보안이 강화되었으며, Service Worker 기반으로 리소스 사용을 줄여 성능이 향상되었습니다.• None 웹사이트와의 통합 용이성: Content Script와 Shadow DOM을 활용하면 기존 웹사이트의 디자인과 기능을 유지하면서도 확장 프로그램의 기능을 추가할 수 있습니다.Chrome 확장 프로그램을 개발하려면 manifest.json 파일을 작성해야 합니다.Manifest 여러 버전이 있으나 현재는 V3로만 작성해야 합니다.V3는 기존 V2에 비해 보안과 성능이 향상되었으며, background.js가 service_worker로 대체되었습니다.Content Script는 웹페이지 내에서 실행되며, DOM을 조작하거나 스타일을 변경하는 등의 작업을 수행할 수 있습니다.위 스크립트는 구글 검색 페이지에서 확장 프로그램이 실행되었음을 알리는 간단한 메시지를 띄우는 역할을 합니다.Service Worker는 특정 이벤트가 발생할 때만 실행되어 리소스 사용을 최소화할 수 있습니다.푸시 알림, 주기적인 데이터 동기화, API 호출 등의 백그라운드 작업을 수행할 때 Service Worker가 사용됩
2025.03.25
emoji
좋아요
emoji
별로에요
logo
나만의 Visual Studio Code Copilot 지침 만들고 활용하기
코드 작성에 AI의 도움을 받을 수 있는 가장 유명한 도구 중 하나로, GitHub이 2021년 발표한 GitHub Copilot이 있습니다. 2024년 12월 GitHub Copilot for VS Code 무료 플랜을 제공하기 시작해,제한적(2k/월 코드 어시스트, 50건/월 채팅)이긴 하지만 누구나 활용할 수 있게 되었습니다.그런데 Copilot의 도움을 받으려면 프롬프트로 질의를 작성해야 하며, Copilot이 각자의 환경에 맞춰 답변하게 하려면 매번 프롬프트로 상황을 전달해야 합니다. 이는 매우 귀찮고 불편한 작업일 수 있습니다.이 글에서는 이러한 불편함을 없애고 개인별 환경 또는 프로젝트 환경에서 VS Code Copilot 지침을 만들고 이를 활용하는 방법을 간단한 예시와 함께 소개합니다.커스텀 지침커스텀 지침(custom instruction)을 미리 정의해 두면, Visual Studio Code(이하 VS Code) 내에서 Copilot이 답변할 때 이 지침을 따르도록 설정할 수 있습니다.프로젝트 저장소에 지침서 파일을 저장하면 해당 프로젝트에 참여하는 이들이 모두 동일한 지침에 따라 답변을 얻을 수 있고, VS Code 설정 파일인 settings.json 파일에 개인용 지침을 설정할 수도 있습니다.프로젝트 공통 지침프로젝트 공통 지침을 사용하려면 프로젝트의 .github/copilot-instructions.md 파일에 지침을 작성해 저장소에 푸시합니다.지침서 파일에는 다음과 같이 Copilot 채팅 질의 시 사용자의 질문을 보완하기 위한 컨텍스트 또는 관련 정보를 자연어 형태의 짧은 문장으로 작성합니다.We always write JavaScript with double quotes and tabs for indentation, so when your responses include JavaScript code, please follow those conventions.Our team uses Jira for tracking items of work. 하지만 지침에서 다음과 같이 외부 리소스를 참조하도록 요청하거나 특정 세부 정보 응답을 요청하면 제대로 동작하지 않을 수 있습니다.Always conform to the coding styles defined in styleguide.md in repo my-org/my-repo when generating code.Use @terminal when answering questions about Git.Answer all questions in the style of a friendly colleague, using informal language.Answer all questions in less than 1000 characters, and words of no more than 12 characters. 다음은 지침을 작성하지 않았을 때 Copilot 채팅 질의 답변입니다. 영어로 질의하면 Python 코드와 영어로 답변합니다.이제 다음과 같은 지침을 작성하
github
javascript
reactjs
3/24/2025
logo
나만의 Visual Studio Code Copilot 지침 만들고 활용하기
코드 작성에 AI의 도움을 받을 수 있는 가장 유명한 도구 중 하나로, GitHub이 2021년 발표한 GitHub Copilot이 있습니다. 2024년 12월 GitHub Copilot for VS Code 무료 플랜을 제공하기 시작해,제한적(2k/월 코드 어시스트, 50건/월 채팅)이긴 하지만 누구나 활용할 수 있게 되었습니다.그런데 Copilot의 도움을 받으려면 프롬프트로 질의를 작성해야 하며, Copilot이 각자의 환경에 맞춰 답변하게 하려면 매번 프롬프트로 상황을 전달해야 합니다. 이는 매우 귀찮고 불편한 작업일 수 있습니다.이 글에서는 이러한 불편함을 없애고 개인별 환경 또는 프로젝트 환경에서 VS Code Copilot 지침을 만들고 이를 활용하는 방법을 간단한 예시와 함께 소개합니다.커스텀 지침커스텀 지침(custom instruction)을 미리 정의해 두면, Visual Studio Code(이하 VS Code) 내에서 Copilot이 답변할 때 이 지침을 따르도록 설정할 수 있습니다.프로젝트 저장소에 지침서 파일을 저장하면 해당 프로젝트에 참여하는 이들이 모두 동일한 지침에 따라 답변을 얻을 수 있고, VS Code 설정 파일인 settings.json 파일에 개인용 지침을 설정할 수도 있습니다.프로젝트 공통 지침프로젝트 공통 지침을 사용하려면 프로젝트의 .github/copilot-instructions.md 파일에 지침을 작성해 저장소에 푸시합니다.지침서 파일에는 다음과 같이 Copilot 채팅 질의 시 사용자의 질문을 보완하기 위한 컨텍스트 또는 관련 정보를 자연어 형태의 짧은 문장으로 작성합니다.We always write JavaScript with double quotes and tabs for indentation, so when your responses include JavaScript code, please follow those conventions.Our team uses Jira for tracking items of work. 하지만 지침에서 다음과 같이 외부 리소스를 참조하도록 요청하거나 특정 세부 정보 응답을 요청하면 제대로 동작하지 않을 수 있습니다.Always conform to the coding styles defined in styleguide.md in repo my-org/my-repo when generating code.Use @terminal when answering questions about Git.Answer all questions in the style of a friendly colleague, using informal language.Answer all questions in less than 1000 characters, and words of no more than 12 characters. 다음은 지침을 작성하지 않았을 때 Copilot 채팅 질의 답변입니다. 영어로 질의하면 Python 코드와 영어로 답변합니다.이제 다음과 같은 지침을 작성하
2025.03.24
github
javascript
reactjs
emoji
좋아요
emoji
별로에요
logo
AI와 협업하는 프로그래밍, 바이브 코딩
AI의 등장으로 자고 일어나면 새로운게 등장하는 시대가 되었다. 2025년 상반기 또 한번 프로그래밍의 세계에 신선한 바람이 불고 있다.바로 ‘바이브 코딩(Vibe Coding)’이라는 새로운 개념이다.이 용어는 테슬라와 xAI에서 AI 연구로 유명한 안드레이 카르파티(Andrej Karpathy)가 2025년 2월에 처음 소개한 것으로,불과 한 달 만에 *메리엄-웹스터 사전에 "속어 및 트렌드" 명사로 등재될 만큼 빠르게 주목받았다.그렇다면 바이브 코딩이란 무엇이고, 왜 이렇게 화제가 되고 있을까?(*위키피디아 참고)바이브 코딩이란 무엇인가?먼저, 글쓴이의 팀은 회사에서 (AI 조직을 제외하면) 비교적 젊은 구성원들로 이루어져 있는 편이다.그중에서도 내가 속한 파트는 특히 트렌드 변화에 대한 저항이 적은 편이었고,덕분에 작년부터 이미 GitHub Copilot, Cursor, Windsurf 같은 다양한 AI 코딩 보조 도구를 개인적으로 사용해보는 문화가 자리 잡고 있었다.그리고 올해는 전 세계적인 AI 열풍에 힘입어, 조직 차원에서 생산성 향상을 위해 AI 사용을 적극 권장하며 비용까지 지원해주기 시작했는데,이 배경에는 바이브 코딩의 등장이 있다고 생각한다.바이브 코딩은 무엇인가? 바이브 코딩은 한마디로 "AI와 협업하는 프로그래밍"이라고 정의할 수 있다.전통적인 코딩에서는 프로그래머가 문제를 분석하고, 알고리즘을 설계하며, 한 줄 한 줄 코드를 작성해왔다. 하지만 바이브 코딩은 이 과정을 완전히 뒤바꾼다.사용자는 몇 문장으로 원하는 프로그램의 기능을 설명하면, 코딩에 특화된 대규모 언어 모델(LLM, Large Language Model)이 그에 맞는 소프트웨어를 생성해준다.예를 들어, "사용자가 입력한 숫자의 합을 계산하는 프로그램을 만들어줘"라고 요청하면, AI가 즉시 해당 기능을 구현한 코드를 뱉어낸다.여기서 프로그래머의 역할은 코드를 직접 쓰는 대신,AI가 만든 코드를 검토하고, 테스트하며, 필요하면 수정 요청을 추가로 전달하는 식으로 바뀐다.마치 영화 감독이 배우에게 연기 지시를 내리듯, 프로그래머는 AI에게 "조금 더 이렇게 해봐"라고 방향을 제시하는 셈이다.(이름에 ‘바이브(Vibe)’가 들어간 이유도 이런 감성적인 이유가 아닐까?) 코드의 세세한 문법보다는 전체적인 ‘느낌’과 의도를 전달하는 데 중점을 둔다는 점에서 재미지다.바이브 코딩이 주목받게 된 데는 AI 기술의 비약적인 발전이 결정적인 역할을 했다. 2020년대 들어 GPT 계열 모델을 시작으로, 코드 생성에 특화된 LLM들이 속속 등장했다.GitHub의 Copilot이나 xAI의 최신 모델(Gork, 글쓴이는 코딩이 아닌 모든 경우에는 Grok을 사용하고 있다. 개인적으로 가장 좋게 느꼈다.) 같은 도구들은 이미 프로그래머의 생산성을 크게 높여왔다.하지만 이런 도구들은 여전히 보조적인 역할에 머물렀다. 반면, 바이브 코딩은 AI를 단순한 조력자가 아니라 주도적인 창작자로 내세운다.이는 코딩을 "기술자"의 영역에서 "아이디어 제공자"의 영역으로 확장한 혁신이라
3/24/2025
logo
AI와 협업하는 프로그래밍, 바이브 코딩
AI의 등장으로 자고 일어나면 새로운게 등장하는 시대가 되었다. 2025년 상반기 또 한번 프로그래밍의 세계에 신선한 바람이 불고 있다.바로 ‘바이브 코딩(Vibe Coding)’이라는 새로운 개념이다.이 용어는 테슬라와 xAI에서 AI 연구로 유명한 안드레이 카르파티(Andrej Karpathy)가 2025년 2월에 처음 소개한 것으로,불과 한 달 만에 *메리엄-웹스터 사전에 "속어 및 트렌드" 명사로 등재될 만큼 빠르게 주목받았다.그렇다면 바이브 코딩이란 무엇이고, 왜 이렇게 화제가 되고 있을까?(*위키피디아 참고)바이브 코딩이란 무엇인가?먼저, 글쓴이의 팀은 회사에서 (AI 조직을 제외하면) 비교적 젊은 구성원들로 이루어져 있는 편이다.그중에서도 내가 속한 파트는 특히 트렌드 변화에 대한 저항이 적은 편이었고,덕분에 작년부터 이미 GitHub Copilot, Cursor, Windsurf 같은 다양한 AI 코딩 보조 도구를 개인적으로 사용해보는 문화가 자리 잡고 있었다.그리고 올해는 전 세계적인 AI 열풍에 힘입어, 조직 차원에서 생산성 향상을 위해 AI 사용을 적극 권장하며 비용까지 지원해주기 시작했는데,이 배경에는 바이브 코딩의 등장이 있다고 생각한다.바이브 코딩은 무엇인가? 바이브 코딩은 한마디로 "AI와 협업하는 프로그래밍"이라고 정의할 수 있다.전통적인 코딩에서는 프로그래머가 문제를 분석하고, 알고리즘을 설계하며, 한 줄 한 줄 코드를 작성해왔다. 하지만 바이브 코딩은 이 과정을 완전히 뒤바꾼다.사용자는 몇 문장으로 원하는 프로그램의 기능을 설명하면, 코딩에 특화된 대규모 언어 모델(LLM, Large Language Model)이 그에 맞는 소프트웨어를 생성해준다.예를 들어, "사용자가 입력한 숫자의 합을 계산하는 프로그램을 만들어줘"라고 요청하면, AI가 즉시 해당 기능을 구현한 코드를 뱉어낸다.여기서 프로그래머의 역할은 코드를 직접 쓰는 대신,AI가 만든 코드를 검토하고, 테스트하며, 필요하면 수정 요청을 추가로 전달하는 식으로 바뀐다.마치 영화 감독이 배우에게 연기 지시를 내리듯, 프로그래머는 AI에게 "조금 더 이렇게 해봐"라고 방향을 제시하는 셈이다.(이름에 ‘바이브(Vibe)’가 들어간 이유도 이런 감성적인 이유가 아닐까?) 코드의 세세한 문법보다는 전체적인 ‘느낌’과 의도를 전달하는 데 중점을 둔다는 점에서 재미지다.바이브 코딩이 주목받게 된 데는 AI 기술의 비약적인 발전이 결정적인 역할을 했다. 2020년대 들어 GPT 계열 모델을 시작으로, 코드 생성에 특화된 LLM들이 속속 등장했다.GitHub의 Copilot이나 xAI의 최신 모델(Gork, 글쓴이는 코딩이 아닌 모든 경우에는 Grok을 사용하고 있다. 개인적으로 가장 좋게 느꼈다.) 같은 도구들은 이미 프로그래머의 생산성을 크게 높여왔다.하지만 이런 도구들은 여전히 보조적인 역할에 머물렀다. 반면, 바이브 코딩은 AI를 단순한 조력자가 아니라 주도적인 창작자로 내세운다.이는 코딩을 "기술자"의 영역에서 "아이디어 제공자"의 영역으로 확장한 혁신이라
2025.03.24
emoji
좋아요
emoji
별로에요
logo
효율적인 QA 프로세스를 위한 Sanity Test (feat. 에이닷 Sanity Test 프로세스)
Sanity Test는 기획자가 개발이 완료된 기능이 기획 의도대로 동작하는지 빠르게 확인하는 테스트입니다.개발 이후 QA 단계로 넘어가기 전에, 핵심 기능이 정상적으로 구현되었는지를 사전 검증하는 과정이라고 볼 수 있습니다.Sanity Test는 QA 프로세스에서 매우 중요한 초기 단계입니다.단순히 결함을 찾는 과정을 넘어, 핵심 기능이 정상적으로 동작하는지를 빠르게 확인하여 전체적인 QA 프로세스의 효율성을 높이고, 서비스 품질을 보장하는 역할을 합니다.이 테스트를 통해 개발된 기능이 예상대로 동작하는지, 주요 버그가 없는지를 검증함으로써, 기획자와 QA 담당자는 서비스가 실제로 사용될 준비가 되었는지 신속하게 판단할 수 있습니다.SanityTest가 무엇인지 위에서 설명하면서, 주요 목적에 대한 설명은 되었으리라 생각되는데요. 그 외 여러가지 목적은 아래와 같습니다.• None 신규 개발된 기능과 서비스 흐름이 정상적으로 작동하는지 빠르게 확인 합니다.• None 기획자는 본인의 기획한 Feature가 의도한 바에 맞게 적절하게 구현되었는지 Sanity Test를 통해 확인하고 개발에 Feedback을 전달할 수 있습니다.• None 기획 의도와 다르게 개발된 부분을 조기에 발견함으로써 불필요한 리소스가 낭비되는 것을 방지합니다.• None 기획 변경사항 또한 잘 반영되었는지 사전 검토함으로써, 개발과 QA 단계의 혼선을 감소 시킬 수 있습니다.• None 이를 통해 특정 빌드가 배포 가능한 수준인지 판단도 가능합니다.QA 시작 전 Sanity Test를 통해 미리 점검함으로써, 주요 이슈를 조기 발현하여 수정 시간을 단축할 수 있으며 서비스 안정성을 확보하게 되므로 결과적으로 테스트 품질과 정확도를 높일 수 있습니다.TC를 작성 하다 보면 자칫 세부적인 기능과 복잡도 높은 케이스까지 고려하여 작성하게 되는데요.의도한 바가 제대로 적용되었는지 확인하는 것이 주요 목적이기 때문에, 핵심 기능 위주로 간결하게 작성되어야 합니다.Sanity TestCase를 작성하기 위해서는 아래 기준들을 고려 합니다.• None 핵심 기능이 정상적으로 동작하는지 신속하게 검증할 수 있는 TC 선정• None 테스트 범위를 너무 넓히지 않고 주요 기능과 경로를 중심으로 검토• None 테스트 Data, 테스트 메뉴, 테스트 툴이 준비 되었는지 확인 필요하다면 포함세부적으로 아래와 같이 여러 기준에 따라 작성할 수 있습니다.에이닷에서의 Sanity Test 평가에이닷 서비스에서는 기존 개발 프로세스를 개선하는 과정에서,후반 품질 검증 단계에서 발생하는 리소스 부담과 일정 지연을 줄이기 위해 좀더 앞단에서 품질을 확보하고자, Sanity Test를 새롭게 도입하게 되었습니다.이를 통해 주요 기능에 대한 사전 품질을 확보하고, 초기 단계에서 결함을 조기에 발견하여 전반적인 테스트 효율성을 높이고자 했습니다.또한, 후반부 품질 검증에 집중되던 리소스를 분산 시켜 개발 생산성을 향상 시키고, 보다 안정적인 서비스 제공이 가능하도록 프로세스를 최적화 하였습니다.에
3/24/2025
logo
효율적인 QA 프로세스를 위한 Sanity Test (feat. 에이닷 Sanity Test 프로세스)
Sanity Test는 기획자가 개발이 완료된 기능이 기획 의도대로 동작하는지 빠르게 확인하는 테스트입니다.개발 이후 QA 단계로 넘어가기 전에, 핵심 기능이 정상적으로 구현되었는지를 사전 검증하는 과정이라고 볼 수 있습니다.Sanity Test는 QA 프로세스에서 매우 중요한 초기 단계입니다.단순히 결함을 찾는 과정을 넘어, 핵심 기능이 정상적으로 동작하는지를 빠르게 확인하여 전체적인 QA 프로세스의 효율성을 높이고, 서비스 품질을 보장하는 역할을 합니다.이 테스트를 통해 개발된 기능이 예상대로 동작하는지, 주요 버그가 없는지를 검증함으로써, 기획자와 QA 담당자는 서비스가 실제로 사용될 준비가 되었는지 신속하게 판단할 수 있습니다.SanityTest가 무엇인지 위에서 설명하면서, 주요 목적에 대한 설명은 되었으리라 생각되는데요. 그 외 여러가지 목적은 아래와 같습니다.• None 신규 개발된 기능과 서비스 흐름이 정상적으로 작동하는지 빠르게 확인 합니다.• None 기획자는 본인의 기획한 Feature가 의도한 바에 맞게 적절하게 구현되었는지 Sanity Test를 통해 확인하고 개발에 Feedback을 전달할 수 있습니다.• None 기획 의도와 다르게 개발된 부분을 조기에 발견함으로써 불필요한 리소스가 낭비되는 것을 방지합니다.• None 기획 변경사항 또한 잘 반영되었는지 사전 검토함으로써, 개발과 QA 단계의 혼선을 감소 시킬 수 있습니다.• None 이를 통해 특정 빌드가 배포 가능한 수준인지 판단도 가능합니다.QA 시작 전 Sanity Test를 통해 미리 점검함으로써, 주요 이슈를 조기 발현하여 수정 시간을 단축할 수 있으며 서비스 안정성을 확보하게 되므로 결과적으로 테스트 품질과 정확도를 높일 수 있습니다.TC를 작성 하다 보면 자칫 세부적인 기능과 복잡도 높은 케이스까지 고려하여 작성하게 되는데요.의도한 바가 제대로 적용되었는지 확인하는 것이 주요 목적이기 때문에, 핵심 기능 위주로 간결하게 작성되어야 합니다.Sanity TestCase를 작성하기 위해서는 아래 기준들을 고려 합니다.• None 핵심 기능이 정상적으로 동작하는지 신속하게 검증할 수 있는 TC 선정• None 테스트 범위를 너무 넓히지 않고 주요 기능과 경로를 중심으로 검토• None 테스트 Data, 테스트 메뉴, 테스트 툴이 준비 되었는지 확인 필요하다면 포함세부적으로 아래와 같이 여러 기준에 따라 작성할 수 있습니다.에이닷에서의 Sanity Test 평가에이닷 서비스에서는 기존 개발 프로세스를 개선하는 과정에서,후반 품질 검증 단계에서 발생하는 리소스 부담과 일정 지연을 줄이기 위해 좀더 앞단에서 품질을 확보하고자, Sanity Test를 새롭게 도입하게 되었습니다.이를 통해 주요 기능에 대한 사전 품질을 확보하고, 초기 단계에서 결함을 조기에 발견하여 전반적인 테스트 효율성을 높이고자 했습니다.또한, 후반부 품질 검증에 집중되던 리소스를 분산 시켜 개발 생산성을 향상 시키고, 보다 안정적인 서비스 제공이 가능하도록 프로세스를 최적화 하였습니다.에
2025.03.24
emoji
좋아요
emoji
별로에요
logo
QA 업무 개선하기 (feat. 불편함을 줄이고 효율성을 높이다)
안녕하세요 🙂저는 응용기술검증팀에서 “한컴피디아”, “한컴서비스 계정”을 검증하고 있는 6년차 QA 정지영입니다.이번에 저는 응용기술검증팀의 QA 업무를 소개하는 블로그를 작성하게 되었는데요.먼저 간단하게 ‘QA 업무를 소개’하고, 저희가 ‘QA 업무 과정에서 겪었던 불편함을 어떻게 개선했는지’, 그리고 ‘현재는 어떤 방식으로 효율적으로 업무를 진행하고 있는지’ 까지 자세한 히스토리를 설명해 드리도록 하겠습니다.먼저 저희 팀의 QA 업무를 소개해 드리겠습니다!QA는 프로그램의 오류를 발견하고 사용성 이슈를 개선하여 전반적인 품질을 향상하는 역할이라고 생각하시면 되는데요.그 중에서도 응용기술검증팀은 한글과컴퓨터에서 제공하고 있는 “AI 제품”, “솔루션 제품”, “웹 서비스 제품” 에 대한 품질을 보증하기 위해, 기능 및 사용성 동작에 대한 검증을 주 업무로 진행하는 팀 입니다.저희 팀의 QA 프로세스를 간단히 설명드리면 아래와 같습니다.저희 응용기술검증팀은 위 프로세스를 따라 검증 업무를 진행하면서, 몇 가지 불편함(?)을 경험해 왔는데요. 아마 QA 업무를 하다 보면 누구나 한 번쯤 겪어봤을 법한 불편함이라고 생각합니다.그 불편함을 개선하기 위해 개인 리서치부터 팀 세미나까지 다양한 방식으로 고민을 했고, 그 과정에서 몇 가지 개선점을 발견하였습니다.QA 프로세스 중, 생긴 불편함을 어떻게 개선할 수 있을까?2024년 초, 저희 팀은 한글과컴퓨터의 자사 sLLM과 AI 제품(한컴어시스턴트, 한컴피디아)의 품질 검증을 요청받았습니다. LLM이 표준을 충족하고 의도한 대로 답변을 생성하는지 확인하기 위해 검증이 필수적이었지만, 이를 평가할 대중적인 검증 방법이 부족했습니다. 또한, 약 20개의 다양한 LLM 평가 지표 중 어떤 기준을 우선적으로 활용해야 할지에 대한 명확한 가이드도 없어, 검증 방식을 정하는 데 어려움을 겪었습니다.그러던 중 LLM as a Judge 평가 방법을 접하게 되었습니다.이는 사람이 아닌 LLM이 다른 LLM의 성능을 평가하는 방식으로, 처음에는 새로운 접근법이라 신뢰성을 확신하기 어려웠습니다. 하지만 인간의 평가와 LLM 평가 간의 유사성(80% 이상)이 입증되었고, 이를 뒷받침하는 논문(Judging LLM-as-a-Judge with MT-Bench and Chatbot Arena)도 발표된 적이 있어 LLM as a Judge 방법을 신뢰할 수 있는 평가 방식으로 받아들이게 되었습니다.이러한 방법론을 바탕으로 현재 한글과컴퓨터 AI 제품인 한컴어시스턴트, 한컴피디아, (s)LLM의 품질을 검증하고 있습니다. 기존에는 사람이 직접 평가하던 방식에서 벗어나 LLM 기반 평가를 도입함으로써 평가의 일관성과 효율성을 높였으며, 보다 신뢰성 있는 AI 품질 검증 체계를 구축할 수 있었습니다.앞으로도 다양한 평가 지표를 반영하여 검증 프로세스를 고도화하고, 사용자 피드백도 참고하여 한글과컴퓨터 AI 제품의 품질을 지속적으로 개선해 나갈 계획입니다.2. 마인드맵 도구 도입 (검증 시나리오 작성 시)QA 업무는 검증뿐만 아니라, 검증을 준비하는 과정도 큰 비중을 차지하는데요. 그중 하나가 바로 “테스트 케이스(TC) 및 시나리오 작성과 관리”일 것입니다.많은 QA 담당자분들이 TC 관리를 위해 스프레드시트를 활용하고 있을 텐데요.개인적으로 저는 새로운 스펙에 대한 TC를 작성할 때, 스프레드시트에 바로바로 항목을 입력하는 것이 쉽지 않았습니다. 완벽하게 작성해야 한다는 부담감 때문에 산출물 작성이 어려워졌고, 그로 인해 예상보다 많은 시간이 소요되곤 했는데요.TC/시나리오 작성은 QA 업무에서 중요한 부분이지만, 검증이 더 중요한 비중을 차지하기 때문에 검증에 더 많은 시간을 투입할 수 있도록 산출물 작성 시간을 줄일 필요가 있었습니다.그래서 이 불편함을 해결하기 위해 다양한 업무 도구를 찾아본 결과, 마인드맵 도구를 활용하게 되었습니다.처음부터 완벽하게 작성하려 하기보다는 떠오르는 아이디어를 마인드맵 형식으로 먼저 정리한 뒤, 이를 스프레드시트로 옮겨 정돈된 산출물을 작성하는 방식을 이용했는데요. 꽤 도움이 되었습니다.처음에는 TC를 스프레드시트에 바로 작성하지 않고 마인드맵 도구를 활용하는 것이 산출물 작성에 더 많은 시간을 소모한다고 생각했지만, 마인드맵을 통해 생각을 정리하면서 결과적으로는 시간을 절약해 주었습니다. 그리고 자연스럽게 산출물 작성 시간이 줄어들어, 검증에 더 많은 시간을 확보할 수 있었습니다.뿐만 아니라, 마인드맵을 작성하는 과정에서 브레인스토밍 효과로 쉽게 떠올리지 못했던 시나리오 조합이나 사용성 오류를 발견할 수 있었고, 이러한 과정이 기능 검증의 커버리지를 자연스럽게 높여 전반적인 프로그램 품질을 향상할 수 있었습니다.저희 팀은 매 검증/배포 시마다 탐색적 검증과 TC 기반 검증을 진행해 왔습니다.신규 서비스를 런칭하거나 Major 업데이트를 진행할 경우에는 Full-TC를 기준으로 검증/배포를 진행하고, Minor 업데이트나 긴급 이슈를 수정해야하는 Hotfix 업데이트의 경우에는 Full-TC 중 중요한 기능 만을 필터링하여 검증하거나, 탐색적으로 검증한 후 배포를 진행해 왔는데요.Minor와 Hotfix 업데이트 검증 시 Full-TC를 기준으로 검증하기 어려운 경우가 많았는데, 이는 주로 검증 일정이 부족하기 때문이었습니다. 또한, 배포 후 빠르게 주요 기능을 확인해 배포 검증을 마무리해야 하는 상황에서, Full-TC를 기준으로 검증하는게 비효율적이라고 느껴지기도 했습니다.하지만 일정이 촉박하다는 이유만으로 불안정한 제품을 배포할 수는 없었고, 안정성이 확보되지 않은 상태에서 검증을 마무리할 수도 없었습니다.또한, 탐색적 검증이나 Full-TC를 필터링하여 검증하는 과정에서 검증 담당자의 주관이 개입되면서 담당자별로 검증 범위가 달라지는 문제가 발생했습니다. 이에 따라, 어떤 기능을 우선적으로 검증해야 할지에 대한 명확한 기준이 필요했습니다.이러한 문제를 해결하기 위해 Summary-TC를 도입하게 되었습니다.Summary-TC는 일반 사용자가 경험하는 기본적인 시나리오로 구성된 테스트 케이스로, 사용자가 기본적으
3/24/2025
logo
QA 업무 개선하기 (feat. 불편함을 줄이고 효율성을 높이다)
안녕하세요 🙂저는 응용기술검증팀에서 “한컴피디아”, “한컴서비스 계정”을 검증하고 있는 6년차 QA 정지영입니다.이번에 저는 응용기술검증팀의 QA 업무를 소개하는 블로그를 작성하게 되었는데요.먼저 간단하게 ‘QA 업무를 소개’하고, 저희가 ‘QA 업무 과정에서 겪었던 불편함을 어떻게 개선했는지’, 그리고 ‘현재는 어떤 방식으로 효율적으로 업무를 진행하고 있는지’ 까지 자세한 히스토리를 설명해 드리도록 하겠습니다.먼저 저희 팀의 QA 업무를 소개해 드리겠습니다!QA는 프로그램의 오류를 발견하고 사용성 이슈를 개선하여 전반적인 품질을 향상하는 역할이라고 생각하시면 되는데요.그 중에서도 응용기술검증팀은 한글과컴퓨터에서 제공하고 있는 “AI 제품”, “솔루션 제품”, “웹 서비스 제품” 에 대한 품질을 보증하기 위해, 기능 및 사용성 동작에 대한 검증을 주 업무로 진행하는 팀 입니다.저희 팀의 QA 프로세스를 간단히 설명드리면 아래와 같습니다.저희 응용기술검증팀은 위 프로세스를 따라 검증 업무를 진행하면서, 몇 가지 불편함(?)을 경험해 왔는데요. 아마 QA 업무를 하다 보면 누구나 한 번쯤 겪어봤을 법한 불편함이라고 생각합니다.그 불편함을 개선하기 위해 개인 리서치부터 팀 세미나까지 다양한 방식으로 고민을 했고, 그 과정에서 몇 가지 개선점을 발견하였습니다.QA 프로세스 중, 생긴 불편함을 어떻게 개선할 수 있을까?2024년 초, 저희 팀은 한글과컴퓨터의 자사 sLLM과 AI 제품(한컴어시스턴트, 한컴피디아)의 품질 검증을 요청받았습니다. LLM이 표준을 충족하고 의도한 대로 답변을 생성하는지 확인하기 위해 검증이 필수적이었지만, 이를 평가할 대중적인 검증 방법이 부족했습니다. 또한, 약 20개의 다양한 LLM 평가 지표 중 어떤 기준을 우선적으로 활용해야 할지에 대한 명확한 가이드도 없어, 검증 방식을 정하는 데 어려움을 겪었습니다.그러던 중 LLM as a Judge 평가 방법을 접하게 되었습니다.이는 사람이 아닌 LLM이 다른 LLM의 성능을 평가하는 방식으로, 처음에는 새로운 접근법이라 신뢰성을 확신하기 어려웠습니다. 하지만 인간의 평가와 LLM 평가 간의 유사성(80% 이상)이 입증되었고, 이를 뒷받침하는 논문(Judging LLM-as-a-Judge with MT-Bench and Chatbot Arena)도 발표된 적이 있어 LLM as a Judge 방법을 신뢰할 수 있는 평가 방식으로 받아들이게 되었습니다.이러한 방법론을 바탕으로 현재 한글과컴퓨터 AI 제품인 한컴어시스턴트, 한컴피디아, (s)LLM의 품질을 검증하고 있습니다. 기존에는 사람이 직접 평가하던 방식에서 벗어나 LLM 기반 평가를 도입함으로써 평가의 일관성과 효율성을 높였으며, 보다 신뢰성 있는 AI 품질 검증 체계를 구축할 수 있었습니다.앞으로도 다양한 평가 지표를 반영하여 검증 프로세스를 고도화하고, 사용자 피드백도 참고하여 한글과컴퓨터 AI 제품의 품질을 지속적으로 개선해 나갈 계획입니다.2. 마인드맵 도구 도입 (검증 시나리오 작성 시)QA 업무는 검증뿐만 아니라, 검증을 준비하는 과정도 큰 비중을 차지하는데요. 그중 하나가 바로 “테스트 케이스(TC) 및 시나리오 작성과 관리”일 것입니다.많은 QA 담당자분들이 TC 관리를 위해 스프레드시트를 활용하고 있을 텐데요.개인적으로 저는 새로운 스펙에 대한 TC를 작성할 때, 스프레드시트에 바로바로 항목을 입력하는 것이 쉽지 않았습니다. 완벽하게 작성해야 한다는 부담감 때문에 산출물 작성이 어려워졌고, 그로 인해 예상보다 많은 시간이 소요되곤 했는데요.TC/시나리오 작성은 QA 업무에서 중요한 부분이지만, 검증이 더 중요한 비중을 차지하기 때문에 검증에 더 많은 시간을 투입할 수 있도록 산출물 작성 시간을 줄일 필요가 있었습니다.그래서 이 불편함을 해결하기 위해 다양한 업무 도구를 찾아본 결과, 마인드맵 도구를 활용하게 되었습니다.처음부터 완벽하게 작성하려 하기보다는 떠오르는 아이디어를 마인드맵 형식으로 먼저 정리한 뒤, 이를 스프레드시트로 옮겨 정돈된 산출물을 작성하는 방식을 이용했는데요. 꽤 도움이 되었습니다.처음에는 TC를 스프레드시트에 바로 작성하지 않고 마인드맵 도구를 활용하는 것이 산출물 작성에 더 많은 시간을 소모한다고 생각했지만, 마인드맵을 통해 생각을 정리하면서 결과적으로는 시간을 절약해 주었습니다. 그리고 자연스럽게 산출물 작성 시간이 줄어들어, 검증에 더 많은 시간을 확보할 수 있었습니다.뿐만 아니라, 마인드맵을 작성하는 과정에서 브레인스토밍 효과로 쉽게 떠올리지 못했던 시나리오 조합이나 사용성 오류를 발견할 수 있었고, 이러한 과정이 기능 검증의 커버리지를 자연스럽게 높여 전반적인 프로그램 품질을 향상할 수 있었습니다.저희 팀은 매 검증/배포 시마다 탐색적 검증과 TC 기반 검증을 진행해 왔습니다.신규 서비스를 런칭하거나 Major 업데이트를 진행할 경우에는 Full-TC를 기준으로 검증/배포를 진행하고, Minor 업데이트나 긴급 이슈를 수정해야하는 Hotfix 업데이트의 경우에는 Full-TC 중 중요한 기능 만을 필터링하여 검증하거나, 탐색적으로 검증한 후 배포를 진행해 왔는데요.Minor와 Hotfix 업데이트 검증 시 Full-TC를 기준으로 검증하기 어려운 경우가 많았는데, 이는 주로 검증 일정이 부족하기 때문이었습니다. 또한, 배포 후 빠르게 주요 기능을 확인해 배포 검증을 마무리해야 하는 상황에서, Full-TC를 기준으로 검증하는게 비효율적이라고 느껴지기도 했습니다.하지만 일정이 촉박하다는 이유만으로 불안정한 제품을 배포할 수는 없었고, 안정성이 확보되지 않은 상태에서 검증을 마무리할 수도 없었습니다.또한, 탐색적 검증이나 Full-TC를 필터링하여 검증하는 과정에서 검증 담당자의 주관이 개입되면서 담당자별로 검증 범위가 달라지는 문제가 발생했습니다. 이에 따라, 어떤 기능을 우선적으로 검증해야 할지에 대한 명확한 기준이 필요했습니다.이러한 문제를 해결하기 위해 Summary-TC를 도입하게 되었습니다.Summary-TC는 일반 사용자가 경험하는 기본적인 시나리오로 구성된 테스트 케이스로, 사용자가 기본적으
2025.03.24
emoji
좋아요
emoji
별로에요
logo
문서에서 필요정보만 뽑아 LLM에 입력하는 방법 - Upstage Document Parse
안녕하세요. 상용개발센터 CV AI LAB 임은채 책임연구원입니다.CV AI LAB은 AI,LLM 기술의 PoC를 inhouse로 개발 및 검증하는 그룹입니다.오늘은 Upstage사에서 개발한 혁신적인 문서 Parsing 기술, Document Parse(DP)에 대해 심층적으로 소개해보도록 하겠습니다. DP는 단순한 OCR(광학 문자 인식) 기술을 넘어, 문서의 레이아웃과 구조를 정확하게 파악하고 필요한 정보를 추출하여 LLM에 입력하여 활용할 수 있는 포맷으로 변환하는 기술 입니다.문서 도메인의 핵심 과제와 DP의 역할문서 도메인에서 AI 기술은 크게 세 가지 핵심 요소, 즉 문서 OCR, 핵심 정보 추출, 문서 구조 이해에 집중됩니다. 기존 기술들은 워드 또는 라인 레벨의 결과에 국한되었지만, DP는 문서 전체의 맥락을 이해하고 다양한 레이아웃 요소를 정확하게 구분하여 정보를 추출합니다. 이는 복잡한 문서 구조를 가진 기업 환경에서 DP의 중요성을 더욱 부각시킵니다.1. DP의 주요 기능 및 특징DP는 기존 제품과 차별화된 방식으로 작동합니다. 단순히 텍스트 박스를 찾는 것이 아니라, 문서 내 다양한 레이아웃 항목을 구분하고 찾아냅니다. DP를 통해 해결할 수 있는 주요 과제는 다음과 같습니다.문서 레이아웃 정보 추출: 객체 감지 모델을 사용하여 레이아웃 정보를 정확하게 추출합니다.레이아웃 박스의 순서 파악: 레이아웃 박스를 사람이 읽는 순서대로 배열하여 정보의 맥락을 유지합니다.테이블 구조 정보 추출: 복잡한 테이블 구조를 정확하게 이해하고 추출하여 데이터 활용도를 높입니다.특히, 테이블 구조는 문서 도메인에서 가장 중요한 레이아웃 정보 중 하나입니다. DP는 별도의 모델을 사용하여 테이블 정보를 정확하게 추출하며, 이는 복잡한 문서에서 필요한 정보를 효율적으로 얻는 데 필수적입니다.2. OCR과 DP의 비교DP의 필요성을 명확히 보여주는 예시로, OCR과 DP의 결과 비교를 들 수 있습니다. OCR은 단순히 텍스트를 나열하는 반면, DP는 문서 구조를 고려하여 훨씬 더 정확하고 유용한 결과를 제공합니다. 이는 DP가 문서의 맥락을 이해하고 정보를 구조화하는 데 얼마나 뛰어난지를 보여줍니다.DP 파이프라인 및 모델 구성 심층 분석: 문서 이해의 핵심 기술DP(Document Parse)는 문서 처리의 전반적인 흐름을 체계적으로 관리하는 파이프라인을 통해 작동합니다. 이 파이프라인은 한 페이지를 처리하는 데 평균 1~2초가 소요되며, 각 단계별 모델들의 유기적인 협력을 통해 고도의 문서 이해 능력을 발휘합니다. 이제 DP 파이프라인을 구성하는 주요 모델들을 하나씩 자세히 살펴보겠습니다.1. 업스테이지 OCR 모델: 텍스트 인식의 핵심업스테이지 OCR 모델은 문서 내 텍스트를 정확하게 인식하는 핵심 역할을 수행합니다. 이 모델은 두 가지 주요 구성 요소로 나뉩니다.검출기(Detector): 글자의 위치를 정확하게 찾아내는 역할을 합니다. 세그멘테이션 기반 모델을 사용하여 워드 레벨 박스를 식별하며, 다양한 글꼴과 크기의 텍스트를 높은 정확도로 검출합니다.모델링 과정: 딥러닝 기반의 객체 감지 기술을 활용하여 텍스트 영역을 분리하고, 다양한 데이터셋을 학습하여 검출 성능을 극대화합니다.고민 및 기능: 다양한 문서 환경에서 텍스트를 안정적으로 검출하기 위해 조명 변화, 이미지 품질 저하 등에 강인한 모델을 개발합니다.인식기(Recognizer): 검출된 텍스트 박스 안의 글자를 정확하게 읽어내는 역할을 합니다. 다양한 언어(한글, 중국어, 일본어, 영어 등)를 지원하며, 최신 딥러닝 기술을 적용하여 인식 정확도를 지속적으로 개선합니다.모델링 과정: 순환 신경망(RNN) 또는 트랜스포머(Transformer) 기반의 모델을 사용하여 문맥을 이해하고 정확한 텍스트를 인식합니다.고민 및 기능: 복잡한 레이아웃, 다양한 글꼴, 노이즈가 많은 환경에서도 높은 인식률을 유지하기 위해 다양한 데이터 증강 기법과 모델 최적화 기술을 적용합니다.2. 레이아웃 모델: 문서 구조 이해의 핵심레이아웃 모델은 문서의 시각적 구조를 이해하고 분석하는 역할을 수행하며, 네 가지 주요 모델로 구성됩니다.검출기(Detector): 레이아웃 박스와 클래스 정보를 추출합니다. 트랜스포머 기반 인코더와 Detectron2의 Mask R-CNN을 결합하여 문서 내 다양한 레이아웃 요소(제목, 단락, 표, 이미지 등)를 정확하게 식별합니다.모델링 과정: 대규모 레이아웃 데이터셋을 학습하여 다양한 문서 구조에 대한 이해도를 높이고, 객체 감지 성능을 극대화합니다.고민 및 기능: 복잡한 레이아웃 구조, 다양한 문서 형식, 레이아웃 요소 간의 관계 등을 정확하게 파악하기 위해 다양한 모델 아키텍처와 학습 전략을 실험합니다.순서 모델(Order Model): 레이아웃 박스의 순서를 사람이 읽는 순서대로 배열합니다. CNN 기반 인코더와 트랜스포머 디코더를 사용하여 레이아웃 요소 간의 순서를 정확하게 예측합니다.모델링 과정: 레이아웃 박스와 이미지 정보를 입력으로 사용하여 순서 정보를 학습하고, 다양한 문서 레이아웃에 대한 순서 예측 성능을 향상시킵니다.고민 및 기능: 복잡한 다단 레이아웃, 비선형적인 읽기 순서, 레이아웃 요소 간의 관계 등을 정확하게 파악하기 위해 다양한 순서 예측 모델을 개발합니다.헤딩 분류기(Heading Classifier): 헤딩 역할을 하는 레이아웃 요소를 식별하고 분류합니다. 텍스트 정보와 레이아웃 정보를 결합하여 헤딩의 중요도와 수준을 정확하게 판단합니다.모델링 과정: 다양한 헤딩 스타일과 구조를 학습하고, 텍스트의 의미와 레이아웃의 시각적 특징을 분석하여 헤딩을 정확하게 분류합니다.고민 및 기능: 다양한 헤딩 스타일, 다국어 문서, 복잡한 문서 구조 등 다양한 환경에서 안정적인 헤딩 분류 성능을 제공하기 위해 노력합니다.수식 인식 모델(Equation Recognizer): 수식 영역을 LaTeX 형태로 변환합니다. OCR 결과와 레이아웃 정보를 결합하여 수식을 정확하게 인식하고 LaTeX 코드로 변환합니다.모델링 과정: 수식 이미지와 LaTeX 코드 쌍으로 구성된 데이터셋을 학습하
3/23/2025
logo
문서에서 필요정보만 뽑아 LLM에 입력하는 방법 - Upstage Document Parse
안녕하세요. 상용개발센터 CV AI LAB 임은채 책임연구원입니다.CV AI LAB은 AI,LLM 기술의 PoC를 inhouse로 개발 및 검증하는 그룹입니다.오늘은 Upstage사에서 개발한 혁신적인 문서 Parsing 기술, Document Parse(DP)에 대해 심층적으로 소개해보도록 하겠습니다. DP는 단순한 OCR(광학 문자 인식) 기술을 넘어, 문서의 레이아웃과 구조를 정확하게 파악하고 필요한 정보를 추출하여 LLM에 입력하여 활용할 수 있는 포맷으로 변환하는 기술 입니다.문서 도메인의 핵심 과제와 DP의 역할문서 도메인에서 AI 기술은 크게 세 가지 핵심 요소, 즉 문서 OCR, 핵심 정보 추출, 문서 구조 이해에 집중됩니다. 기존 기술들은 워드 또는 라인 레벨의 결과에 국한되었지만, DP는 문서 전체의 맥락을 이해하고 다양한 레이아웃 요소를 정확하게 구분하여 정보를 추출합니다. 이는 복잡한 문서 구조를 가진 기업 환경에서 DP의 중요성을 더욱 부각시킵니다.1. DP의 주요 기능 및 특징DP는 기존 제품과 차별화된 방식으로 작동합니다. 단순히 텍스트 박스를 찾는 것이 아니라, 문서 내 다양한 레이아웃 항목을 구분하고 찾아냅니다. DP를 통해 해결할 수 있는 주요 과제는 다음과 같습니다.문서 레이아웃 정보 추출: 객체 감지 모델을 사용하여 레이아웃 정보를 정확하게 추출합니다.레이아웃 박스의 순서 파악: 레이아웃 박스를 사람이 읽는 순서대로 배열하여 정보의 맥락을 유지합니다.테이블 구조 정보 추출: 복잡한 테이블 구조를 정확하게 이해하고 추출하여 데이터 활용도를 높입니다.특히, 테이블 구조는 문서 도메인에서 가장 중요한 레이아웃 정보 중 하나입니다. DP는 별도의 모델을 사용하여 테이블 정보를 정확하게 추출하며, 이는 복잡한 문서에서 필요한 정보를 효율적으로 얻는 데 필수적입니다.2. OCR과 DP의 비교DP의 필요성을 명확히 보여주는 예시로, OCR과 DP의 결과 비교를 들 수 있습니다. OCR은 단순히 텍스트를 나열하는 반면, DP는 문서 구조를 고려하여 훨씬 더 정확하고 유용한 결과를 제공합니다. 이는 DP가 문서의 맥락을 이해하고 정보를 구조화하는 데 얼마나 뛰어난지를 보여줍니다.DP 파이프라인 및 모델 구성 심층 분석: 문서 이해의 핵심 기술DP(Document Parse)는 문서 처리의 전반적인 흐름을 체계적으로 관리하는 파이프라인을 통해 작동합니다. 이 파이프라인은 한 페이지를 처리하는 데 평균 1~2초가 소요되며, 각 단계별 모델들의 유기적인 협력을 통해 고도의 문서 이해 능력을 발휘합니다. 이제 DP 파이프라인을 구성하는 주요 모델들을 하나씩 자세히 살펴보겠습니다.1. 업스테이지 OCR 모델: 텍스트 인식의 핵심업스테이지 OCR 모델은 문서 내 텍스트를 정확하게 인식하는 핵심 역할을 수행합니다. 이 모델은 두 가지 주요 구성 요소로 나뉩니다.검출기(Detector): 글자의 위치를 정확하게 찾아내는 역할을 합니다. 세그멘테이션 기반 모델을 사용하여 워드 레벨 박스를 식별하며, 다양한 글꼴과 크기의 텍스트를 높은 정확도로 검출합니다.모델링 과정: 딥러닝 기반의 객체 감지 기술을 활용하여 텍스트 영역을 분리하고, 다양한 데이터셋을 학습하여 검출 성능을 극대화합니다.고민 및 기능: 다양한 문서 환경에서 텍스트를 안정적으로 검출하기 위해 조명 변화, 이미지 품질 저하 등에 강인한 모델을 개발합니다.인식기(Recognizer): 검출된 텍스트 박스 안의 글자를 정확하게 읽어내는 역할을 합니다. 다양한 언어(한글, 중국어, 일본어, 영어 등)를 지원하며, 최신 딥러닝 기술을 적용하여 인식 정확도를 지속적으로 개선합니다.모델링 과정: 순환 신경망(RNN) 또는 트랜스포머(Transformer) 기반의 모델을 사용하여 문맥을 이해하고 정확한 텍스트를 인식합니다.고민 및 기능: 복잡한 레이아웃, 다양한 글꼴, 노이즈가 많은 환경에서도 높은 인식률을 유지하기 위해 다양한 데이터 증강 기법과 모델 최적화 기술을 적용합니다.2. 레이아웃 모델: 문서 구조 이해의 핵심레이아웃 모델은 문서의 시각적 구조를 이해하고 분석하는 역할을 수행하며, 네 가지 주요 모델로 구성됩니다.검출기(Detector): 레이아웃 박스와 클래스 정보를 추출합니다. 트랜스포머 기반 인코더와 Detectron2의 Mask R-CNN을 결합하여 문서 내 다양한 레이아웃 요소(제목, 단락, 표, 이미지 등)를 정확하게 식별합니다.모델링 과정: 대규모 레이아웃 데이터셋을 학습하여 다양한 문서 구조에 대한 이해도를 높이고, 객체 감지 성능을 극대화합니다.고민 및 기능: 복잡한 레이아웃 구조, 다양한 문서 형식, 레이아웃 요소 간의 관계 등을 정확하게 파악하기 위해 다양한 모델 아키텍처와 학습 전략을 실험합니다.순서 모델(Order Model): 레이아웃 박스의 순서를 사람이 읽는 순서대로 배열합니다. CNN 기반 인코더와 트랜스포머 디코더를 사용하여 레이아웃 요소 간의 순서를 정확하게 예측합니다.모델링 과정: 레이아웃 박스와 이미지 정보를 입력으로 사용하여 순서 정보를 학습하고, 다양한 문서 레이아웃에 대한 순서 예측 성능을 향상시킵니다.고민 및 기능: 복잡한 다단 레이아웃, 비선형적인 읽기 순서, 레이아웃 요소 간의 관계 등을 정확하게 파악하기 위해 다양한 순서 예측 모델을 개발합니다.헤딩 분류기(Heading Classifier): 헤딩 역할을 하는 레이아웃 요소를 식별하고 분류합니다. 텍스트 정보와 레이아웃 정보를 결합하여 헤딩의 중요도와 수준을 정확하게 판단합니다.모델링 과정: 다양한 헤딩 스타일과 구조를 학습하고, 텍스트의 의미와 레이아웃의 시각적 특징을 분석하여 헤딩을 정확하게 분류합니다.고민 및 기능: 다양한 헤딩 스타일, 다국어 문서, 복잡한 문서 구조 등 다양한 환경에서 안정적인 헤딩 분류 성능을 제공하기 위해 노력합니다.수식 인식 모델(Equation Recognizer): 수식 영역을 LaTeX 형태로 변환합니다. OCR 결과와 레이아웃 정보를 결합하여 수식을 정확하게 인식하고 LaTeX 코드로 변환합니다.모델링 과정: 수식 이미지와 LaTeX 코드 쌍으로 구성된 데이터셋을 학습하
2025.03.23
emoji
좋아요
emoji
별로에요
logo
4차 산업혁명 시대의 임베디드 개발자 안내문#2
안녕하세요, 현대자동차그룹에서 차량의 제어기를 연구/개발하고 있는 임베디드 개발자 김병건 연구원입니다! 2025년 새해가 밝았습니다! 모두 새해 복 많이 받으시고, 건강하고 행복한 한 해가 되시길 기원합니다. 올해는 을사년(乙巳年)인데요, 푸른 뱀의 해 로 불리기도 합니다. 뱀은 변화를 상징하고, 새로운 시작을 예고하는 동양적인 의미가 있는 만큼 2025년에는 더욱 변화와 성장을 이루기 좋은 한 해가 되지 않을까 싶습니다! 저에게도 2025년은 특별한 해인데요. 현대자동차그룹의 사내 스타트업 프로그램인 ZER01NE Company Builder에 참여하게 되면서, 제 커리어에도 새로운 시작과 변화를 맞이하게 되었기 때문입니다. 2025년 필진 활동에서도 제 다양한 경험 들을 여러분과 나눠볼 예정이니 많은 응원과 관심 부탁 드립니다! 모든 분들께서 2025년에 더 많은 발전과 성취가 함께하시길 바라며, 함께 성장하는 한 해가 되면 좋겠습니다. 으쌰! 자, 그럼 오늘은 지난 안내문#1에서 예고한 대로, 이번 안내문#2에서는 '임베디드 개발자에게 필요한 역량'에 대해 이야기해보려 하는데요. 임베디드 개발자라는 직업은 어떻게 보면 기술적 도전이 많고, 새로운 트렌드가 빠르게 반영되는 분야라 할 수 있습니다. 그래서 4차 산업혁명과 인공지능(AI) 시대에 어떤 역량을 갖춰야 할지, 제 생각을 본 글에서 풀어보려고 합니다. 그럼 시작할게요! 임베디드 개발자란? 임베디드 개발자는 지난 글에 말씀 드렸던 임베디드 시스템(특정 기능을 수행하도록 설계된 전용 컴퓨터 시스템)을 설계하고 개발하는 일을 합니다. 예를 들어, 우리가 사용하는 자동차, 스마트폰, 세탁기, 전기 밥솥 같은 일상 생활에서 접하는 많은 기기들이 사용자의 요구(Needs)에 맞게 원활히 작동되게 하는 개발자라 보시면 됩니다. 기술이 발전하면서 이런 임베디드 시스템들이 점점 더 스마트해지고, 서로 연결까지 되면서 사람들의 일상에 편리함을 주고 다양한 기능을 수행할 수 있는 스마트 기기들로 발전하고 있는데요. 이러한 기기들이 제대로 동작하려면 임베디드 개발자들의 역할이 정말 중요합니다!임베디드 개발자가 갖춰야 할 역량 제가 생각하는 임베디드 개발자로서 원활한 업무 수행을 위해 필요한 역량들은 다음과 같습니다!1. 기본적인 프로그래밍 능력임베디드 개발에서 프로그래밍은 필수적이며, C, C++가 많이 사용됩니다. 이 언어들은 하드웨어와 밀접하게 연관되어 있어 시스템 성능을 최적화에 유리합니다. 또한, Python은 빠른 프로토타입 개발과 알고리즘 구현에 유용하고, 코드 가독성도 높여 개발 속도를 빠르게 할 수 있습니다. 심한 경우에는 **어셈블리어(Assembly Language)**를 마주하기도 하는데요. 어셈블리어는 하드웨어와 직접적으로 상호 작용하는 저수준 언어로, CPU가 명령어를 어떻게 처리하는지 이해하고 최적화하는 데 중요한 역할을 하는데, 어셈블리어를 이해하면 하드웨어에 가까운 최적화 작업을 할 수 있으며, 성능을 극대화할 수도 있습니다. 이처럼, 임베디드 개발자는 저급 언어와 고급 언어를 모두 잘 활용해야 하기 때문에 폭 넓은 프로그래밍 경험이 있으면 도움이 됩니다.방대한 양의 깊은 공부가 필요하다고 부담을 느끼실 수도 있으나 겁먹을 필요는 없는데요. 최근에 발전하고 있는 AI 기술을 활용한 프로그래밍 도움도 받을 수 있으며, 문제 상황마다 다양한 해결 방법이 있을 수 있기 때문에 모든 내용을 처음부터 깊이 있게 알고 시작하시는 것 보다는 컴퓨팅 사고(Computational Thinking) 능력을 키워 적절한 솔루션을 도출하는게 중요해진 것 같습니다. (컴퓨팅 사고는 문제를 컴퓨터가 처리할 수 있도록 체계적으로 정의하고 해결하는 능력으로, 좋은 프로그래밍을 위한 필수적인 사고방식입니다.)2. 하드웨어에 대한 이해임베디드 시스템은 하드웨어와 소프트웨어가 밀접하게 연결된 시스템이기 때문에, 하드웨어에 대한 기본적인 이해가 필요합니다. 마이크로컨트롤러(MCU), 센서, 액추에이터 같은 핵심 부품들이 어떻게 동작하는지 기본적 원리를 알고 있어야 합니다.또한, 컴퓨터 구조에 대한 이해는 임베디드 시스템 개발에서 필수적입니다. 컴퓨터 구조를 알면, CPU와 메모리가 어떻게 상호작용하고 데이터를 처리하는지 이해할 수 있으며, 이를 바탕으로 성능 최적화나 효율적인 메모리 관리가 가능해집니다. 예를 들어, 캐시 메모리, 레지스터, 버스 아키텍처 같은 개념을 이해하면 성능을 극대화할 수 있으니 관련 지식들도 틈틈이 정리해두면 좋습니다!3. 리소스 관리와 최적화임베디드 시스템은 자원이 제한적이므로, 자원을 효율적으로 관리하고 최적화하는 능력이 매우 중요합니다. 이는 공대의 필수 덕목인 것 같습니다.(주어진 상황에서 최상의 결과를 얻기!) 예를 들어, 메모리와 전력의 부족은 시스템의 작동에 큰 영향을 미칩니다. 효율적인 알고리즘과 데이터 구조를 활용해 최소한의 자원으로 최대 성능을 낼 수 있는 방안을 늘 궁리해야 합니다.(그러면서도 요구되는 기능은 잘 수행할 수 있어야겠죠?)또한, 저전력 설계, 실시간 운영체제(RTOS) 사용 등 리소스 최적화 기술을 익히는 것도 중요합니다. 임베디드 시스템을 개발 하다 보면 성능 분석 툴을 활용하여 시스템의 성능을 정확히 진단하고 개선하는 업무도 수행하게 되는데, 이런 일련의 과정을 통해 시스템의 비용 효율성을 고려한 성능 최적화 역량을 발휘해야 합니다.4. 디버깅 및 문제 해결 능력임베디드 시스템에서 문제는 하드웨어와 소프트웨어가 결합된 환경에서 발생하기 때문에, 문제의 원인을 정확히 파악하는 것이 매우 중요합니다. 다양한 디버깅 도구들을 활용해 시스템의 문제를 추적하고 해결할 수 있어야 합니다.또한, 하드웨어와 소프트웨어 간의 상호작용을 정확히 이해하고, 복합적인 문제를 해결하는 능력이 요구됩니다. 소프트웨어의 버그 뿐만 아니라 하드웨어 오류를 진단하고 수정하는 기술도 임베디드 개발자의 역량 중 하나라 할 수 있습니다.개인적으로는 훌륭한 디버깅을 해내기 위해서는 끈기가 있어야 잘 할 수 있다고 생각하는데요. 복잡한 시스템을 디버깅 할 땐 시스템 전체의 상황을 모르는 상태에서 꼬인 부분이 있
3/23/2025
logo
4차 산업혁명 시대의 임베디드 개발자 안내문#2
안녕하세요, 현대자동차그룹에서 차량의 제어기를 연구/개발하고 있는 임베디드 개발자 김병건 연구원입니다! 2025년 새해가 밝았습니다! 모두 새해 복 많이 받으시고, 건강하고 행복한 한 해가 되시길 기원합니다. 올해는 을사년(乙巳年)인데요, 푸른 뱀의 해 로 불리기도 합니다. 뱀은 변화를 상징하고, 새로운 시작을 예고하는 동양적인 의미가 있는 만큼 2025년에는 더욱 변화와 성장을 이루기 좋은 한 해가 되지 않을까 싶습니다! 저에게도 2025년은 특별한 해인데요. 현대자동차그룹의 사내 스타트업 프로그램인 ZER01NE Company Builder에 참여하게 되면서, 제 커리어에도 새로운 시작과 변화를 맞이하게 되었기 때문입니다. 2025년 필진 활동에서도 제 다양한 경험 들을 여러분과 나눠볼 예정이니 많은 응원과 관심 부탁 드립니다! 모든 분들께서 2025년에 더 많은 발전과 성취가 함께하시길 바라며, 함께 성장하는 한 해가 되면 좋겠습니다. 으쌰! 자, 그럼 오늘은 지난 안내문#1에서 예고한 대로, 이번 안내문#2에서는 '임베디드 개발자에게 필요한 역량'에 대해 이야기해보려 하는데요. 임베디드 개발자라는 직업은 어떻게 보면 기술적 도전이 많고, 새로운 트렌드가 빠르게 반영되는 분야라 할 수 있습니다. 그래서 4차 산업혁명과 인공지능(AI) 시대에 어떤 역량을 갖춰야 할지, 제 생각을 본 글에서 풀어보려고 합니다. 그럼 시작할게요! 임베디드 개발자란? 임베디드 개발자는 지난 글에 말씀 드렸던 임베디드 시스템(특정 기능을 수행하도록 설계된 전용 컴퓨터 시스템)을 설계하고 개발하는 일을 합니다. 예를 들어, 우리가 사용하는 자동차, 스마트폰, 세탁기, 전기 밥솥 같은 일상 생활에서 접하는 많은 기기들이 사용자의 요구(Needs)에 맞게 원활히 작동되게 하는 개발자라 보시면 됩니다. 기술이 발전하면서 이런 임베디드 시스템들이 점점 더 스마트해지고, 서로 연결까지 되면서 사람들의 일상에 편리함을 주고 다양한 기능을 수행할 수 있는 스마트 기기들로 발전하고 있는데요. 이러한 기기들이 제대로 동작하려면 임베디드 개발자들의 역할이 정말 중요합니다!임베디드 개발자가 갖춰야 할 역량 제가 생각하는 임베디드 개발자로서 원활한 업무 수행을 위해 필요한 역량들은 다음과 같습니다!1. 기본적인 프로그래밍 능력임베디드 개발에서 프로그래밍은 필수적이며, C, C++가 많이 사용됩니다. 이 언어들은 하드웨어와 밀접하게 연관되어 있어 시스템 성능을 최적화에 유리합니다. 또한, Python은 빠른 프로토타입 개발과 알고리즘 구현에 유용하고, 코드 가독성도 높여 개발 속도를 빠르게 할 수 있습니다. 심한 경우에는 **어셈블리어(Assembly Language)**를 마주하기도 하는데요. 어셈블리어는 하드웨어와 직접적으로 상호 작용하는 저수준 언어로, CPU가 명령어를 어떻게 처리하는지 이해하고 최적화하는 데 중요한 역할을 하는데, 어셈블리어를 이해하면 하드웨어에 가까운 최적화 작업을 할 수 있으며, 성능을 극대화할 수도 있습니다. 이처럼, 임베디드 개발자는 저급 언어와 고급 언어를 모두 잘 활용해야 하기 때문에 폭 넓은 프로그래밍 경험이 있으면 도움이 됩니다.방대한 양의 깊은 공부가 필요하다고 부담을 느끼실 수도 있으나 겁먹을 필요는 없는데요. 최근에 발전하고 있는 AI 기술을 활용한 프로그래밍 도움도 받을 수 있으며, 문제 상황마다 다양한 해결 방법이 있을 수 있기 때문에 모든 내용을 처음부터 깊이 있게 알고 시작하시는 것 보다는 컴퓨팅 사고(Computational Thinking) 능력을 키워 적절한 솔루션을 도출하는게 중요해진 것 같습니다. (컴퓨팅 사고는 문제를 컴퓨터가 처리할 수 있도록 체계적으로 정의하고 해결하는 능력으로, 좋은 프로그래밍을 위한 필수적인 사고방식입니다.)2. 하드웨어에 대한 이해임베디드 시스템은 하드웨어와 소프트웨어가 밀접하게 연결된 시스템이기 때문에, 하드웨어에 대한 기본적인 이해가 필요합니다. 마이크로컨트롤러(MCU), 센서, 액추에이터 같은 핵심 부품들이 어떻게 동작하는지 기본적 원리를 알고 있어야 합니다.또한, 컴퓨터 구조에 대한 이해는 임베디드 시스템 개발에서 필수적입니다. 컴퓨터 구조를 알면, CPU와 메모리가 어떻게 상호작용하고 데이터를 처리하는지 이해할 수 있으며, 이를 바탕으로 성능 최적화나 효율적인 메모리 관리가 가능해집니다. 예를 들어, 캐시 메모리, 레지스터, 버스 아키텍처 같은 개념을 이해하면 성능을 극대화할 수 있으니 관련 지식들도 틈틈이 정리해두면 좋습니다!3. 리소스 관리와 최적화임베디드 시스템은 자원이 제한적이므로, 자원을 효율적으로 관리하고 최적화하는 능력이 매우 중요합니다. 이는 공대의 필수 덕목인 것 같습니다.(주어진 상황에서 최상의 결과를 얻기!) 예를 들어, 메모리와 전력의 부족은 시스템의 작동에 큰 영향을 미칩니다. 효율적인 알고리즘과 데이터 구조를 활용해 최소한의 자원으로 최대 성능을 낼 수 있는 방안을 늘 궁리해야 합니다.(그러면서도 요구되는 기능은 잘 수행할 수 있어야겠죠?)또한, 저전력 설계, 실시간 운영체제(RTOS) 사용 등 리소스 최적화 기술을 익히는 것도 중요합니다. 임베디드 시스템을 개발 하다 보면 성능 분석 툴을 활용하여 시스템의 성능을 정확히 진단하고 개선하는 업무도 수행하게 되는데, 이런 일련의 과정을 통해 시스템의 비용 효율성을 고려한 성능 최적화 역량을 발휘해야 합니다.4. 디버깅 및 문제 해결 능력임베디드 시스템에서 문제는 하드웨어와 소프트웨어가 결합된 환경에서 발생하기 때문에, 문제의 원인을 정확히 파악하는 것이 매우 중요합니다. 다양한 디버깅 도구들을 활용해 시스템의 문제를 추적하고 해결할 수 있어야 합니다.또한, 하드웨어와 소프트웨어 간의 상호작용을 정확히 이해하고, 복합적인 문제를 해결하는 능력이 요구됩니다. 소프트웨어의 버그 뿐만 아니라 하드웨어 오류를 진단하고 수정하는 기술도 임베디드 개발자의 역량 중 하나라 할 수 있습니다.개인적으로는 훌륭한 디버깅을 해내기 위해서는 끈기가 있어야 잘 할 수 있다고 생각하는데요. 복잡한 시스템을 디버깅 할 땐 시스템 전체의 상황을 모르는 상태에서 꼬인 부분이 있
2025.03.23
emoji
좋아요
emoji
별로에요
logo
멀티플랫폼 문서를 관리하는 한 가지 방법, 싱글 소싱
안녕하세요. LINE Plus Tech Content Strategy 팀 하성창입니다. 저희 팀은 테크니컬 라이터로 구성돼 있으며, LINE Plus에서 개발한 다양한 플랫폼의 기술 문서를 작성하는 한편 사내 용어집 사이트인 Words의 콘텐츠와 LY Corporation Tech Blog의 국문 콘텐츠를 담당하고 있습니다. 이 글에서는 LINE Planet이라는 VoIP 플랫폼의 문서에 싱글 소싱(single sourcing)을 적용해 문서 관리 효율성을 개선한 사례를 공유하려고 합니다.싱글 소싱은 하나의 소스에서 여러 가지 결과물을 생성하는 것을 뜻하는 용어입니다. 문서화에서는 아래와 같은 두 가지를 모두 의미합니다.• 단일 소스에서 여러 포맷(HTML, PDF, EPUB 등)으로 문서를 생성하기. 멀티 채널 퍼블리싱(multi-channel publishing)이라고도 합니다.• 단일 소스에서 맥락에 따라 여러 문서를 생성하기. 여기서 맥락은 문서화 요구사항에 따라 정의할 수 있습니다(배포 환경, 구동 플랫폼 등).예전에는 첫 번째 의미로 주로 사용했으나, 최근에는 두 번째 의미도 포함하여 더 넓게 사용하는 용어입니다. 이 글에서 '싱글 소싱'은 두 번째 의미에 해당합니다.싱글 소싱의 주요 목적은 문서 관리의 효율성과 문서의 품질을 개선하는 데 있습니다.• 문서 관리 효율성 측면에서는 '복사 및 붙여넣기' 작업을 최소화하여 유지 보수를 간소화할 수 있습니다. 콘텐츠를 재사용하여 불필요한 반복 작업을 줄이고 시간을 절약할 수 있습니다.• 문서 품질 측면에서는 단일 출처에서 정보를 가져옴으로써 각각의 문서가 따로 작성되었을 때에 비해 내용이나 스타일 면에서 일관성을 높이고 오류를 줄일 수 있습니다.다음과 같은 경우에 싱글 소싱을 적용할 수 있습니다.• 공통된 부분이 많지만 조금씩 차이가 있는 제품군의 문서를 관리해야 할 때• 소프트웨어 배포 환경에 따라 해당하는 내용의 문서를 만들고 싶을 때싱글 소싱의 주요 기법으로는 다음과 같은 것들이 있습니다.일정한 조건에 따라 콘텐츠 포함 여부를 결정하는 필터링 처리를 의미합니다. 다음과 같은 경우에 활용할 수 있습니다.• 특정 개발 환경에만 해당하는 내용이 있을 때• 멀티플랫폼 문서에서 플랫폼별로 조금씩 차이가 나는 부분이 있을 때예를 들어 'staging' 환경 문서에만 포함되어야 하는 내용을 조건부 콘텐츠로 관리하는 것을 의사코드로 나타내면 다음과 같습니다.값이나 용어를 변수화하는 것을 의미합니다. 다음과 같은 경우에 활용할 수 있습니다.• 특정 기능을 사용하는 데 필요한 최소 SDK 버전을 변수로 관리• 연락처, 고객 지원 채널 등의 URL을 변수로 관리예를 들어 SDK 최소 버전을 변수로 처리하는 것을 의사코드로 나타내면 다음과 같습니다.자주 쓰이는 콘텐츠를 재사용하는 것을 의미합니다. 다음과 같은 경우에 활용할 수 있습니다.• 여러 페이지에 동일하게 나타나야 하는 안내 문구를 재사용• 가이드나 튜토리얼에 반복되는 사전 절차(prerequisites)를 재사용예를 들어 오래된 문서에 대한
docusaurus
flutter
3/23/2025
logo
멀티플랫폼 문서를 관리하는 한 가지 방법, 싱글 소싱
안녕하세요. LINE Plus Tech Content Strategy 팀 하성창입니다. 저희 팀은 테크니컬 라이터로 구성돼 있으며, LINE Plus에서 개발한 다양한 플랫폼의 기술 문서를 작성하는 한편 사내 용어집 사이트인 Words의 콘텐츠와 LY Corporation Tech Blog의 국문 콘텐츠를 담당하고 있습니다. 이 글에서는 LINE Planet이라는 VoIP 플랫폼의 문서에 싱글 소싱(single sourcing)을 적용해 문서 관리 효율성을 개선한 사례를 공유하려고 합니다.싱글 소싱은 하나의 소스에서 여러 가지 결과물을 생성하는 것을 뜻하는 용어입니다. 문서화에서는 아래와 같은 두 가지를 모두 의미합니다.• 단일 소스에서 여러 포맷(HTML, PDF, EPUB 등)으로 문서를 생성하기. 멀티 채널 퍼블리싱(multi-channel publishing)이라고도 합니다.• 단일 소스에서 맥락에 따라 여러 문서를 생성하기. 여기서 맥락은 문서화 요구사항에 따라 정의할 수 있습니다(배포 환경, 구동 플랫폼 등).예전에는 첫 번째 의미로 주로 사용했으나, 최근에는 두 번째 의미도 포함하여 더 넓게 사용하는 용어입니다. 이 글에서 '싱글 소싱'은 두 번째 의미에 해당합니다.싱글 소싱의 주요 목적은 문서 관리의 효율성과 문서의 품질을 개선하는 데 있습니다.• 문서 관리 효율성 측면에서는 '복사 및 붙여넣기' 작업을 최소화하여 유지 보수를 간소화할 수 있습니다. 콘텐츠를 재사용하여 불필요한 반복 작업을 줄이고 시간을 절약할 수 있습니다.• 문서 품질 측면에서는 단일 출처에서 정보를 가져옴으로써 각각의 문서가 따로 작성되었을 때에 비해 내용이나 스타일 면에서 일관성을 높이고 오류를 줄일 수 있습니다.다음과 같은 경우에 싱글 소싱을 적용할 수 있습니다.• 공통된 부분이 많지만 조금씩 차이가 있는 제품군의 문서를 관리해야 할 때• 소프트웨어 배포 환경에 따라 해당하는 내용의 문서를 만들고 싶을 때싱글 소싱의 주요 기법으로는 다음과 같은 것들이 있습니다.일정한 조건에 따라 콘텐츠 포함 여부를 결정하는 필터링 처리를 의미합니다. 다음과 같은 경우에 활용할 수 있습니다.• 특정 개발 환경에만 해당하는 내용이 있을 때• 멀티플랫폼 문서에서 플랫폼별로 조금씩 차이가 나는 부분이 있을 때예를 들어 'staging' 환경 문서에만 포함되어야 하는 내용을 조건부 콘텐츠로 관리하는 것을 의사코드로 나타내면 다음과 같습니다.값이나 용어를 변수화하는 것을 의미합니다. 다음과 같은 경우에 활용할 수 있습니다.• 특정 기능을 사용하는 데 필요한 최소 SDK 버전을 변수로 관리• 연락처, 고객 지원 채널 등의 URL을 변수로 관리예를 들어 SDK 최소 버전을 변수로 처리하는 것을 의사코드로 나타내면 다음과 같습니다.자주 쓰이는 콘텐츠를 재사용하는 것을 의미합니다. 다음과 같은 경우에 활용할 수 있습니다.• 여러 페이지에 동일하게 나타나야 하는 안내 문구를 재사용• 가이드나 튜토리얼에 반복되는 사전 절차(prerequisites)를 재사용예를 들어 오래된 문서에 대한
2025.03.23
docusaurus
flutter
emoji
좋아요
emoji
별로에요
logo
데이터가 세상을 지배하는 시대 : 두 번의 대전환
요즘에 데이터 플랫폼 구축과 관련된 프로젝트를 시작하고 있습니다.데이터에 대해 다시 한 번 정리를 해 봐야 겠다는 생각을 하였고, 데이터의 히스토리를 다시 머리속으로 떠 올리고 자료도 확인해 보면서 정리해 보기로 했습니다.2000년대 초부터 시작하는 데이터, 구체적으로는 빅데이터의 시대 출현부터 기억을 되살려 보았고,그 이후에도 2010년대 초, 2020년대 초로 이어지면서 변화를 일으키고 있다는 사실을 확인하게 되었습니다.현재 우리는 데이터가 가장 중요한 자원으로 여겨지는 시대를 살고 있습니다.2000년대 초반부터 지금까지, 빅데이터와 인공지능의 발전은 기술 산업뿐 아니라 우리의 일상생활을 근본적으로 변화시켰습니다.이 글에서는 지난 20여 년간 일어난 두 번의 중요한 기술적 대전환을 살펴보며, 데이터가 현대 사회의 핵심 동력이 된 과정을 알아보겠습니다.첫 번째 대전환 : 빅데이터의 탄생과 성장 (2001-2010)2001년, 가트너의 애널리스트 더그 레이니는 데이터의 특성을 설명하는 '3V' 개념을 최초로 제시했습니다.그 이전까지 데이터는 단순히 컴퓨터에 저장된 정보였지만, 레이니의 개념은 데이터를 바라보는 관점을 완전히 전환시켰습니다.• None Volume(양): 전통적인 데이터베이스로는 처리할 수 없는 방대한 규모의 데이터• None Velocity(속도): 데이터가 생성되고 처리되는 빠른 속도• None Variety(다양성): 정형, 반정형, 비정형 등 다양한 형태의 데이터이 시기는 고요한 바다에 거대한 파도가 일기 시작하는 듯했습니다. 아직 그 파도의 정확한 크기를 예측하지 못했지만, 변화의 조짐은 분명했습니다.2005년, 아마존은 사용자의 클릭스트림 데이터 분석을 통해 추천 시스템의 정확도를 35% 향상시켰습니다.이는 데이터를 활용한 비즈니스 혁신의 대표적인 성공 사례가 되었고, 오늘날 우리가 당연하게 여기는 "이 상품을 구매한 사람들이 함께 구매한 상품" 추천 기능의 시초가 되었습니다.2008년, 유럽입자물리연구소(CERN)는 대형 하드론 충돌기(LHC) 실험에서 초당 1페타바이트(PB)의 데이터를 처리할 수 있는 시스템을 구축했습니다.이는 당시로서는 상상하기 어려운 데이터 처리 규모로, 빅데이터 기술이 과학 연구의 새로운 지평을 연 순간이었습니다.같은 해, 구글은 검색 데이터를 활용한 '구글 독감 트렌드'를 발표했습니다.사용자들의 검색어를 분석해 독감 유행을 예측하는 이 시스템은 빅데이터의 잠재력을 보여주는 혁신적인 사례였습니다.그러나 이후 예측 정확도에 문제가 발생하면서 데이터의 품질과 정제의 중요성이 부각되기 시작했습니다.빅데이터 인프라의 발전이 시기에 하둡(Hadoop)과 MapReduce 같은 분산 처리 기술이 등장하면서 대규모 데이터 처리의 새로운 지평이 열렸습니다.2006년 야후에서 시작된 하둡은 빅데이터 처리의 핵심 도구로 자리 잡았고, 기업들은 이전에는 엄두도 내지 못했던 규모의 데이터를 저장하고 분석할 수 있게 되었습니다.첫 번째 대전환의 시기는 데이터의 양적 폭발이 특징이었습니다.마치 미지의 대륙을 탐
3/21/2025
logo
데이터가 세상을 지배하는 시대 : 두 번의 대전환
요즘에 데이터 플랫폼 구축과 관련된 프로젝트를 시작하고 있습니다.데이터에 대해 다시 한 번 정리를 해 봐야 겠다는 생각을 하였고, 데이터의 히스토리를 다시 머리속으로 떠 올리고 자료도 확인해 보면서 정리해 보기로 했습니다.2000년대 초부터 시작하는 데이터, 구체적으로는 빅데이터의 시대 출현부터 기억을 되살려 보았고,그 이후에도 2010년대 초, 2020년대 초로 이어지면서 변화를 일으키고 있다는 사실을 확인하게 되었습니다.현재 우리는 데이터가 가장 중요한 자원으로 여겨지는 시대를 살고 있습니다.2000년대 초반부터 지금까지, 빅데이터와 인공지능의 발전은 기술 산업뿐 아니라 우리의 일상생활을 근본적으로 변화시켰습니다.이 글에서는 지난 20여 년간 일어난 두 번의 중요한 기술적 대전환을 살펴보며, 데이터가 현대 사회의 핵심 동력이 된 과정을 알아보겠습니다.첫 번째 대전환 : 빅데이터의 탄생과 성장 (2001-2010)2001년, 가트너의 애널리스트 더그 레이니는 데이터의 특성을 설명하는 '3V' 개념을 최초로 제시했습니다.그 이전까지 데이터는 단순히 컴퓨터에 저장된 정보였지만, 레이니의 개념은 데이터를 바라보는 관점을 완전히 전환시켰습니다.• None Volume(양): 전통적인 데이터베이스로는 처리할 수 없는 방대한 규모의 데이터• None Velocity(속도): 데이터가 생성되고 처리되는 빠른 속도• None Variety(다양성): 정형, 반정형, 비정형 등 다양한 형태의 데이터이 시기는 고요한 바다에 거대한 파도가 일기 시작하는 듯했습니다. 아직 그 파도의 정확한 크기를 예측하지 못했지만, 변화의 조짐은 분명했습니다.2005년, 아마존은 사용자의 클릭스트림 데이터 분석을 통해 추천 시스템의 정확도를 35% 향상시켰습니다.이는 데이터를 활용한 비즈니스 혁신의 대표적인 성공 사례가 되었고, 오늘날 우리가 당연하게 여기는 "이 상품을 구매한 사람들이 함께 구매한 상품" 추천 기능의 시초가 되었습니다.2008년, 유럽입자물리연구소(CERN)는 대형 하드론 충돌기(LHC) 실험에서 초당 1페타바이트(PB)의 데이터를 처리할 수 있는 시스템을 구축했습니다.이는 당시로서는 상상하기 어려운 데이터 처리 규모로, 빅데이터 기술이 과학 연구의 새로운 지평을 연 순간이었습니다.같은 해, 구글은 검색 데이터를 활용한 '구글 독감 트렌드'를 발표했습니다.사용자들의 검색어를 분석해 독감 유행을 예측하는 이 시스템은 빅데이터의 잠재력을 보여주는 혁신적인 사례였습니다.그러나 이후 예측 정확도에 문제가 발생하면서 데이터의 품질과 정제의 중요성이 부각되기 시작했습니다.빅데이터 인프라의 발전이 시기에 하둡(Hadoop)과 MapReduce 같은 분산 처리 기술이 등장하면서 대규모 데이터 처리의 새로운 지평이 열렸습니다.2006년 야후에서 시작된 하둡은 빅데이터 처리의 핵심 도구로 자리 잡았고, 기업들은 이전에는 엄두도 내지 못했던 규모의 데이터를 저장하고 분석할 수 있게 되었습니다.첫 번째 대전환의 시기는 데이터의 양적 폭발이 특징이었습니다.마치 미지의 대륙을 탐
2025.03.21
emoji
좋아요
emoji
별로에요
logo
여기어때 시스템 아이콘 개선기
김제린(Riny) / Visual graphic Designer아래 이미지에서 어떤 문장이 더 읽기 쉬워 보이시나요?디지털 환경에서 일관된 디자인 언어는 사용자 경험을 높이는 중요한 요소인데요, 여러 서체가 섞였을 때 가독성이 떨어지는 것처럼 시스템 아이콘에서도 일관된 그래픽 스타일을 유지하는 게 중요하죠. 시스템 아이콘은 디지털 인터페이스에서 기능이나 상태를 시각적으로 나타내는 그래픽 요소로, 사용자가 빠르게 이해하고 조작할 수 있도록 돕는 역할을 해요.하지만 기존 시스템 아이콘들은 각기 다른 스타일로 디자인되어 가독성이나 통일성 면에서 아쉬움이 있었어요. 2024년 하반기 앱 6.0 업데이트를 맞아 UI 디자인이 새롭게 개편되었는데요, 여기어때의 브랜드 아이덴티티를 반영한 일관된 그래픽 규칙을 수립하고, 가독성을 높이기 위한 시스템 아이콘 개선한 과정을 공유하고자 해요.시스템 아이콘이란?먼저 본격적으로 이야기를 하기에 앞서 시스템 아이콘이란 무엇인지 알아볼게요. 사실 시스템 아이콘은 단순한 그림이 아닙니다. 앞서 말씀드렸듯 디지털 제품에서 사용자가 기능이나 상태를 빠르게 인식할 수 있도록 돕는 중요한 시각적 도구예요. 내비게이션, 버튼, 상태 표시 등 여러 UI 요소에 적용되어 사용자 경험을 매끄럽게 만들어주는 핵심 요소입니다.그럼 시스템 아이콘의 역할은 무엇일까요?이처럼 시스템 아이콘은 단순히 장식적인 요소가 아니에요. 오히려 사용자 경험을 향상시키고, 제품 내에서 가독성과 접근성을 높이는 중요한 디자인 자산이죠. 그래픽 규칙이 명확하게 설정된 일관성 있는 아이콘은 브랜드 아이덴티티를 강화하고, 사용자에게는 더욱 직관적인 경험을 제공할 수 있게 돼요.기존 아이콘의 문제점시스템 아이콘은 제품의 일관성을 유지하는 중요한 요소이지만, 기존 아이콘들은 그래픽적인 통일성이 부족했어요. 이는 사용자 경험을 저해할 뿐만 아니라, 브랜드 아이덴티티를 일관되게 전달하는 데도 어려움을 만들었어요.이렇듯 기존 시스템 아이콘들은 각기 다른 스타일과 규칙으로 제작되어 디자인 일관성이 부족했어요. 대표적인 문제점은 다음과 같아요.또한, 기존 아이콘의 문제는 앱 6.0 업데이트를 통해 해결할 필요성이 더욱 커졌어요. 홈 화면부터 UI, 배너, 버튼 등 제품에서 전반적인 요소가 대규모 업데이트 되었는데, 이 과정에서 시스템 아이콘 또한 새로운 디자인 방향성에 맞춰 개선해야 할 필요성이 대두되었죠.이처럼 제품의 시각적 정체성을 확립하고, 사용자 경험을 향상시키기 위해 새로운 그래픽 규칙을 적용한 시스템 아이콘 업데이트가 필수적이었어요.해결 방법 ① 브랜드 아이덴티티 반영하기시스템 아이콘을 개선하면서 가장 중요한 목표는 여기어때의 브랜드 아이덴티티를 반영하는 것이었어요. 기존 아이콘들은 스타일이 일관되지 않아 브랜드의 시각적 정체성이 명확하지 않았고, 이를 해결하기 위해 여기어때 로고의 특징을 시스템 아이콘에 녹여내는 방향으로 디자인을 진행했죠.여기어때의 로고는 한글 로고타입으로, 폰트를 분석해 보면 윗면은 원형의 형태, 밑면은 사각형의 형태를 가지고 있어요. 이
3/20/2025
logo
여기어때 시스템 아이콘 개선기
김제린(Riny) / Visual graphic Designer아래 이미지에서 어떤 문장이 더 읽기 쉬워 보이시나요?디지털 환경에서 일관된 디자인 언어는 사용자 경험을 높이는 중요한 요소인데요, 여러 서체가 섞였을 때 가독성이 떨어지는 것처럼 시스템 아이콘에서도 일관된 그래픽 스타일을 유지하는 게 중요하죠. 시스템 아이콘은 디지털 인터페이스에서 기능이나 상태를 시각적으로 나타내는 그래픽 요소로, 사용자가 빠르게 이해하고 조작할 수 있도록 돕는 역할을 해요.하지만 기존 시스템 아이콘들은 각기 다른 스타일로 디자인되어 가독성이나 통일성 면에서 아쉬움이 있었어요. 2024년 하반기 앱 6.0 업데이트를 맞아 UI 디자인이 새롭게 개편되었는데요, 여기어때의 브랜드 아이덴티티를 반영한 일관된 그래픽 규칙을 수립하고, 가독성을 높이기 위한 시스템 아이콘 개선한 과정을 공유하고자 해요.시스템 아이콘이란?먼저 본격적으로 이야기를 하기에 앞서 시스템 아이콘이란 무엇인지 알아볼게요. 사실 시스템 아이콘은 단순한 그림이 아닙니다. 앞서 말씀드렸듯 디지털 제품에서 사용자가 기능이나 상태를 빠르게 인식할 수 있도록 돕는 중요한 시각적 도구예요. 내비게이션, 버튼, 상태 표시 등 여러 UI 요소에 적용되어 사용자 경험을 매끄럽게 만들어주는 핵심 요소입니다.그럼 시스템 아이콘의 역할은 무엇일까요?이처럼 시스템 아이콘은 단순히 장식적인 요소가 아니에요. 오히려 사용자 경험을 향상시키고, 제품 내에서 가독성과 접근성을 높이는 중요한 디자인 자산이죠. 그래픽 규칙이 명확하게 설정된 일관성 있는 아이콘은 브랜드 아이덴티티를 강화하고, 사용자에게는 더욱 직관적인 경험을 제공할 수 있게 돼요.기존 아이콘의 문제점시스템 아이콘은 제품의 일관성을 유지하는 중요한 요소이지만, 기존 아이콘들은 그래픽적인 통일성이 부족했어요. 이는 사용자 경험을 저해할 뿐만 아니라, 브랜드 아이덴티티를 일관되게 전달하는 데도 어려움을 만들었어요.이렇듯 기존 시스템 아이콘들은 각기 다른 스타일과 규칙으로 제작되어 디자인 일관성이 부족했어요. 대표적인 문제점은 다음과 같아요.또한, 기존 아이콘의 문제는 앱 6.0 업데이트를 통해 해결할 필요성이 더욱 커졌어요. 홈 화면부터 UI, 배너, 버튼 등 제품에서 전반적인 요소가 대규모 업데이트 되었는데, 이 과정에서 시스템 아이콘 또한 새로운 디자인 방향성에 맞춰 개선해야 할 필요성이 대두되었죠.이처럼 제품의 시각적 정체성을 확립하고, 사용자 경험을 향상시키기 위해 새로운 그래픽 규칙을 적용한 시스템 아이콘 업데이트가 필수적이었어요.해결 방법 ① 브랜드 아이덴티티 반영하기시스템 아이콘을 개선하면서 가장 중요한 목표는 여기어때의 브랜드 아이덴티티를 반영하는 것이었어요. 기존 아이콘들은 스타일이 일관되지 않아 브랜드의 시각적 정체성이 명확하지 않았고, 이를 해결하기 위해 여기어때 로고의 특징을 시스템 아이콘에 녹여내는 방향으로 디자인을 진행했죠.여기어때의 로고는 한글 로고타입으로, 폰트를 분석해 보면 윗면은 원형의 형태, 밑면은 사각형의 형태를 가지고 있어요. 이
2025.03.20
emoji
좋아요
emoji
별로에요
Copyright © 2025. Codenary All Rights Reserved.