생성형 AI는 인공지능을 사용하여 텍스트, 이미지, 음악, 오디오, 동영상 등의 새로운 콘텐츠를 만드는 것을 의미합니다. 생성형 AI는 머신러닝 (ML) 모델을 사용하여 사람이 만든 콘텐츠 데이터 세트의 패턴과 관계를 학습합니다.
이 기술은 Gemini와 같은 애플리케이션을 통해 놀라운 기능을 보여주었습니다. 생성형 AI 도구를 내 웹 제품에 구현하려면 어떻게 해야 하는지
일반적인 사용 사례 중 하나는 사용자에게 웹사이트 콘텐츠에 대해 질문할 수 있는 더 나은 인터페이스를 제공하는 것입니다. 머신러닝을 활용하면 사용자의 검색결과를 훨씬 개선할 수 있습니다
사이트별 검색 기능 개선
사용자가 질문을 작성한 후 Gemini와 같은 대규모 언어 모델 (LLM)로 전송하고 사용자에게 답변을 표시하는 인터페이스를 만들 수 있습니다.
사이트에 이러한 지형지물이 있다고 가정해 보겠습니다. 사용자가 Interop 2024에 포함된 API를 확인하고 다음 쿼리를 입력합니다.
What are the features included in Interop 24?
다음과 같은 이유로 출력이 정확하지 않을 수 있습니다.
- 사용자가 LLM에 질문에 관한 컨텍스트를 거의 제공하지 않았으므로 LLM이 잘못된 답변이나 할루시네이션을 반환할 가능성이 더 높습니다.
- LLM은 Interop 2024가 생성되거나 특성이 결정되기 전에 학습되었을 가능성이 높으므로 해당 정보를 인식하지 못합니다.
LLM이 보다 최신 정보를 찾을 수도 있지만 LLM 학습 데이터 세트는 본질적으로 오래되었습니다. 새로운 결과를 유지하려면 엄청난 시간과 비용이 들 수 있습니다.
프롬프트 엔지니어링 사용
프롬프트 엔지니어링은 LLM에서 최상의 출력을 얻기 위한 일련의 기법입니다.
한 가지 기법은 프롬프트에 추가 컨텍스트를 제공하여 LLM이 컨텍스트와 관련된 콘텐츠를 출력할 가능성을 높이는 것입니다.
상호 운용성 예에서 첫 번째 단계는 기사의 전체 콘텐츠를 컨텍스트로 제공하는 것입니다. 그런 다음 질문을 답변할 LLM의 입력으로 추가합니다 예를 들면 다음과 같습니다.
Context:
Following on from the success of Interop 2022 and Interop 2023, we
are excited about the opportunity to collaborate once again with
all key browser vendors and other relevant stakeholders...
(trimmed to fit in this article)
Input:
What are the features included in Interop 2024?
Gemini는 다음과 같은 결과를 출력합니다.
The features included in Interop 24 are Accessibility, CSS Nesting, Custom
Properties, Declarative Shadow DOM, font-size-adjust, HTTPS URLs for
WebSocket, IndexedDB, Layout, Pointer and Mouse Events, Popover, Relative
Color Syntax, requestVideoFrameCallback, Scrollbar Styling, @starting-style
and, transition-behavior, Text Directionality, text-wrap: balance,URL
대답은 제공된 컨텍스트를 기반으로 하므로 컨텍스트가 없는 프롬프트를 사용하는 경우보다 이 답변이 훨씬 나을 수 있습니다.
RAG로 수직 확장
예를 들어 LLM은 단일 기사에 대한 질문에 답하는 대신 web.dev에 관한 추가 질문에 답변하고 기사를 추가 컨텍스트로 사용합니다. 소규모 사이트에서는 이 방법이 가능할 수도 있지만 Gemini 1.5의 컨텍스트 창은 100만 개 토큰이므로 큰 프롬프트가 느리고 비용이 더 많이 듭니다.
LLM의 입력 및 출력 길이는 텍스트 입력에서 발견되는 일반적인 문자 시퀀스를 나타내는 방법인 토큰으로 측정 및 청구됩니다. 토큰 수는 일반적으로 단어 수보다 큽니다. 예를 들어 첫 번째 예의 입력에 포함된 단어는 775개이고, 이는 1,097개의 토큰으로 표시됩니다. LLM마다 토큰을 다르게 계산할 수 있으며 대부분 텍스트 입력에 사용할 토큰 수를 계산하는 API 또는 엔드포인트를 제공합니다.
한 가지 해결책은 LLM 프롬프트 관련 기사를 제공하는 것입니다. 이 작업은 다음 두 부분으로 이루어져야 합니다.
- LLM에 프롬프트를 표시할 때 주요 기사의 콘텐츠를 컨텍스트로 추가합니다.
- 'Interop 2024에 포함된 기능은 무엇인가요?'와 관련된 도움말 콘텐츠를 검색합니다.
Gemini 결과에서 다음 도움말을 기반으로 콘텐츠가 반환되기를 바랍니다.
- 도움말 1: web.dev/blog/submit-your-proposals-for-interop-2024
- 도움말 2: web.dev/blog/interop-2023-wrapup
- 도움말 3: web.dev/blog/interop-2024
다음과 같이 입력해야 합니다.
Context:
Article 1:
Over the past two years... (trimmed)
Article 2:
At the end of last year Interop 2023 wrapped up. This effort... (trimmed)
Article 3:
Following on from the success of Interop 2022... (trimmed)
Input:
What are the features included in Interop 2024?
이 컨텍스트는 예상 출력을 생성합니다.
* Accessibility * CSS Nesting * Custom Properties
* Declarative Shadow DOM * font-size-adjust
* HTTPS URLs for WebSocket * IndexedDB * Layout
* Pointer and Mouse Events * Popover * Relative Color Syntax
* requestVideoFrameCallback * Scrollbar Styling
* @starting-style and transition-behavior * Text Directionality
* text-wrap: balance * URL
AI 기술에 익숙한 사용자를 대상으로 이 접근 방식에서는 생성형 AI 도구에서 실제 답변 가능성을 높이기 위한 일반적인 방법인 RAG를 사용합니다.
시맨틱 검색으로 출력 개선
RAG 기법은 일반적인 전체 텍스트 검색에서 작동할 수 있지만 이 방법에는 단점이 있습니다.
- 전체 텍스트 검색은 AI가 정확한 키워드 일치 항목을 찾는 데 도움이 됩니다. 하지만 LLM이 사용자 쿼리에 숨겨진 의도된 의미를 파악할 수 없습니다. 이로 인해 출력이 불완전하거나 부정확할 수 있습니다.
- 단어가 여러 의미를 가지거나 동의어를 사용하는 경우 문제가 발생할 수 있습니다. 예를 들어 '은행' (금융 기관 또는 강은행)은 관련성 없는 결과를 초래할 수 있습니다.
- 전체 텍스트 검색에서는 키워드가 포함되어 있지만 사용자의 목표와 일치하지 않는 결과가 출력될 수 있습니다.
시맨틱 검색은 다음과 같은 주요 측면에 초점을 맞춰 검색 정확도를 개선하는 기법입니다.
- 검색자의 의도: 사용자가 무언가를 검색하는 이유를 파악하려고 합니다. 고객이 찾거나 달성하고자 하는 것은 무엇인가요?
- 맥락적 의미: 단어와 구문의 주변 텍스트뿐만 아니라 사용자의 위치나 검색 기록과 같은 기타 요소와 관련되어 있는 내용도 해석합니다.
- 개념 간의 관계: 시맨틱 검색은 지식 그래프 (관련 항목의 대규모 네트워크) 및 자연어 처리를 사용하여 단어와 개념이 연결되는 방식을 이해합니다.
따라서 시맨틱 검색으로 도구를 빌드하면 키워드 대신 쿼리의 전반적인 목적에 따라 검색 결과가 표시됩니다. 즉, 정확한 키워드가 없더라도 도구에서 관련 문서를 확인할 수 있습니다. 단어가 있지만 의미가 다른 결과도 피할 수 있습니다.
현재 시맨틱 검색을 사용하는 두 가지 검색 도구인 Vertex AI Search와 Algolia AI Search를 구현할 수 있습니다.
게시된 콘텐츠에서 답변 그리기
지금까지 프롬프트 엔지니어링을 사용하여 LLM이 프롬프트에 컨텍스트를 추가하여 보지 못한 콘텐츠와 관련된 답변을 제공할 수 있게 하는 방법을 배웠습니다. 검색 증강 생성 (RAG) 기법을 사용하여 개별 기사에서 전체 콘텐츠 자료로 이 접근 방식을 확장하는 방법을 알아봤습니다. 시맨틱 검색을 통해 사용자 검색어의 결과를 더욱 개선하고 RAG를 제품에 더 잘 구현하는 방법을 알아봤습니다.
생성형 AI 도구가 '할루시네이션'을 일으키기 때문에 생성형 AI 도구가 기껏해야 하거나, 때로는 신뢰할 수 없거나, 최악의 경우에는 비즈니스에 큰 해를 입힐 수 있다는 것은 잘 알려진 문제입니다. 이러한 기법을 통해 사용자와 개발자 모두 안정성을 개선하고 애플리케이션의 출력에 대한 신뢰를 구축할 수 있습니다.