Python에서 Gradio를 사용하여 AI 응용 프로그램을위한 사용자 인터페이스 구축

오늘날의 AI 모델의 유용성은 액세스 가능한 사용자 인터페이스없이 크게 줄어 듭니다. 오픈 소스 파이썬 웹 UI 라이브러리 인 Gradio를 사용하면 LLM과 비 기술적 인 최종 사용자 간의 격차를 해소 할 수 있습니다. AI 프로젝트를위한 빠른 프로토 타입을 만들고 더 많은 청중에게 배포를 단순화 할 수 있습니다.

. 이 튜토리얼은 일반적으로 웹 개발 경험이없는 기계 학습 엔지니어를 대상으로합니다. 여기에는 Gradio 기본 사항 및 핵심 개념, 다양한 AI 모델 유형의 인터페이스 생성, UX 및 상호 작용의 고급 기능, 배포 및 모범 사례를 다룹니다. 시작하자. gradio 로 시작하는 것

설치 우리는 가상 환경 (바람직하게는 콘다)을 만들어 시작할 것입니다 :

그런 다음 PIP를 사용하여 Gradio 및 그 종속성을 설치할 수 있습니다.

우리는 또한 Jupyter 노트북 내에 그라디오 인터페이스를 표시 할 수 있도록 ipykernel 패키지를 설치했습니다. 이 프로세스를 사용하려면 Jupyter Lab에 커널로 만든 가상 환경을 추가해야합니다. 다음은이를 수행하라는 명령입니다

이를 통해 Gradio가 설치된 커널이있는 노트북을 만들 수 있습니다. 확인하려면 표준 별칭으로 가져 와서 버전을 인쇄하십시오.

기본 개념과 용어 우리는“Hello World”를 통해 주요 개념과 용어를 배우음으로써 Gradio로 뛰어들 것입니다 : 셀에서 위의 코드를 실행하면 출력은 사용자 정의 인사말 메시지를 반환하는 작은 대화식 인터페이스가됩니다.

Gradio는 몇 가지 주요 개념을 중심으로 회전합니다

인터페이스

: UIS를 생성하기위한 핵심 클래스 구성 요소 : 텍스트 상자, 이미지 및 오디오와 같은 입력 및 출력 요소. 현재 30 개 이상의 내장 구성 요소가 있습니다.

$ conda create -n gradio_tutorial python=3.9 -y
$ conda activate gradio_tutorial

함수 런치

: Gradio 앱을 시작하는 메소드

위의 우리는 텍스트 입력을 취하고 반환하는 인사 기능을 만들었습니다. 이러한 이유로 입력 및 출력 구성 요소는 인터페이스 클래스 내부의 텍스트로 지정됩니다. 결국, 우리는 로컬 서버를 시작하는 시작 방법을 호출하고 있습니다. UI를 누구나 사용할 수 있도록하기 위해 공유 매개 변수를 true로 설정할 수 있습니다. SSH 터널을 시작하고 Gradio 앱을 공개적으로 공유 가능한 웹 페이지에 배포합니다.

$ pip install gradio ipykernel

Gradio 구성 요소 당신은 대부분의 시간을 다른 구성 요소와 그라디오 앱을 구축하는 동안 페이지에 배치하는 방법을 주위에 땜질하는 데 소비합니다. 그러니, 당신의 처분에 무엇이 있는지 자세히 살펴 보겠습니다.

입력 및 출력 구성 요소 Gradio는 대화식 인터페이스를 구축하기위한 다양한 구성 요소를 제공합니다. 이 구성 요소는 일반적으로 입력 및 출력의 두 가지 범주로 나뉩니다. 입력 구성 요소를 사용하면 사용자가 기본 프로세서에 데이터를 제공 할 수 있습니다 (이는 파이썬 기능이 될 수 있음). 일부 일반적인 입력은 다음과 같습니다.

textbox

이미지 오디오

슬라이더
드롭 다운
• 위의 일부 구성 요소를 사용하는 더미 인터페이스가 있습니다.
이 예에서 Process_Inputs 함수에는 5 개의 매개 변수가 필요합니다. 따라서 5 개의 입력 구성 요소를 작성하여 입력으로 전달해야합니다. 입력 구성 요소의 수는 필요한 기능 매개 변수 수와 일치해야하지만 이는 엄격한 규칙이 아닙니다. 오류 및 경고를 피하려면 UI에서 사용자 입력이 필요하지 않은 매개 변수의 기본값을 설정합니다.
첫 번째 예제와 같은 일반 문자열 텍스트 대신 입력 구성 요소를 지정하기 위해 텍스트 상자 클래스를 사용하는 방법에주의하십시오. 항상 전용 클래스를 사용하여 입력 및 출력 구성 요소를 지정하여 사용자 정의 할 수 있도록하는 것이 좋습니다. 예를 들어, 모든 구성 요소 클래스에는 유용한 레이블 속성이 있으며 슬라이더와 드롭 다운은 범위와 사용 가능한 옵션을 지정할 인수가 있습니다. 많은 입력 구성 요소를 사용하여 출력을 표시 할 수 있습니다. 몇 가지 일반적인 시나리오는 다음과 같습니다.
레이블 : 텍스트 또는 분류 결과를 표시하기 위해
• 이미지 : 처리 된 또는 생성 된 이미지를 표시하기위한
오디오 : 처리 또는 생성 된 오디오를 재생합니다 플롯 : 그래프 또는 차트를 표시하는 경우 입력, 출력 구성 요소의 수는 처리 함수의 반환 된 값 수와 일치해야합니다. 구성 요소 외관 사용자 정의
Gradio를 사용하면 필요에 맞게 구성 요소의 모양을 사용자 정의 할 수 있습니다. 다음은 맞춤형 텍스트 상자를 사용하는 예입니다

$ conda create -n gradio_tutorial python=3.9 -y
$ conda activate gradio_tutorial

이 예에서는 선수 수를 지정하고 자리 표시 자 및 정보 텍스트를 추가하고 출력에 대한 복사 버튼을 포함하여 TextBox 구성 요소를 사용자 정의했습니다. 다른 구성 요소와 그 속성을 실험하여 AI 응용 프로그램의 요구 사항에 가장 적합한 인터페이스를 만듭니다. 구성 요소에 대해 어떤 종류의 속성을 변경할 수 있는지 알아 보려면 문서를 방문하거나 더 나은 것을 방문 할 수 있습니까? 클래스 이름 이후 Jupyter Lab의 오페라 :

llms의 계면 빌딩 LLMS로 구동되는 두 개의 실제 텍스트와 이미지 기반 인터페이스를 만들어 배운 모든 것을 함께합시다. 먼저, 우리는 영어에서 터키어, 스페인어 또는 중국어에 이르기까지 언어 번역가를 구축 할 것입니다.

처음에는 TransLate_Text 함수를 정의합니다. 본문에서 OpenAI API 키를 설정하고 언어 맵을 만듭니다. 그런 다음 번역 프롬프트를 구성합니다. 그런 다음 Try-Excrect 블록 내부에서 시스템 프롬프트와 함께 ChatCompletion 엔드 포인트에 요청을 보냅니다. 결국, 우리는 첫 번째 선택을 반환합니다.

이제 우리는 인터페이스를 만들 수 있습니다 :

$ conda create -n gradio_tutorial python=3.9 -y
$ conda activate gradio_tutorial

코드는 이전 인터페이스의 코드와 마찬가지로 간단하지만 몇 가지 새로운 속성을 소개합니다.

텍스트 상자의 인수 유형 인수는 일반 텍스트 입력 필드를 암호 입력으로 변경하여 텍스트를 숨기고 있습니다. 인터페이스 클래스의 제목 및 설명 인수는 페이지의 상단 중앙에 H1 제목과 자막을 추가합니다.

결과는 다음과 같습니다
왜 우리가 사용자의 API 키를 앱의 일부로 스스로에게 제공하지 않고 앱의 일부로 요청하는지 궁금 할 것입니다. 그 이유는 Gradio가 UIS를 배치하는 방법과 관련이 있습니다.

$ pip install gradio ipykernel

우리가 자신의 API 키를 환경 변수 (표준 실습)로 제공 한 경우 공개적으로 공유 가능한 앱 버전은 환경 변수에 액세스 할 수 없으므로 작동하지 않습니다. 배포 섹션에서는 앱을 Huggingface 공간에 배치하여이를 수정하는 방법을 볼 수 있습니다. 이미지를 생성하기위한 또 다른 UI를 만들어 봅시다 :
우리는 dall-e-3에 요청을 보내고 초현실 주의적 프롬프트를 사용하여 생성 된 이미지 URL을 반환하는 generate_surrealist_art라는 함수를 만듭니다. 그런 다음이 기능을 다시 인터페이스 클래스로 공급합니다.
우리는 API 키에 대한 두 가지 입력과 초현실주의 이미지에서 캡처하려는 개념을 지정합니다. 그런 다음 이미지 클래스를 사용하여 생성 된 이미지에 대해 하나의 출력 구성 요소를 만듭니다. 값 인수를 STR로 설정하면 구성 요소는 URL에서 이미지를 다운로드하여 표시 할 수 있습니다. 이것이 바로 필요한 것입니다. 그리고 결과는 다음과 같습니다
클래식 ML 모델을위한 인터페이스 빌딩 이제 클래식 테이블 회귀 모델에 대한 인터페이스를 작성해 봅시다. Seaborn에서 사용할 수있는 다이아몬드 데이터 세트를 사용할 것입니다. 새로운 작업 디렉토리와 App.py Inside라는 새로운 스크립트를 작성하여 시작하십시오. 그런 다음 데이터를로드하고 Scikit-Learn 파이프 라인을 사용하여 처리하고 RandomforestRregression 모델을 훈련시키는이 GitHub Gist에서 코드를 붙여 넣습니다.

다음 단계는 다이아몬드 데이터 세트에 기능이있는 것과 동일한 수의 입력을 받아들이는 처리 함수를 작성하는 것입니다.

$ conda create -n gradio_tutorial python=3.9 -y
$ conda activate gradio_tutorial

함수는 해당 입력을 데이터 프레임으로 변환하여 훈련 된 모델 파이프 라인의 .predict () 메소드로 전달합니다. 결국, 그것은 예측 된 가격으로 문자열을 반환합니다.

이제 인터페이스 클래스는이 기능의 시그니처와 일치해야합니다. 기능을 처리하기위한 9 개의 입력 구성 요소와 예측 가격을 표시하기위한 1 개의 출력 :

>

클래스 내에서, 우리는 범주 형 기능에 대한 세 가지 드롭 다운을 만듭니다. 옵션은 각 기능에서 고유 한 범주로 채워집니다. 또한 숫자 기능을 허용하기 위해 6 개의 슬라이더 구성 요소를 만듭니다. 슬라이더의 범위는 각 기능의 최소 및 최대 값에 의해 결정됩니다. 지금 우리가해야 할 일은 앱을 실행하고 배포하기 위해 스크립트를 실행하는 것뿐입니다.

결과는 다음과 같습니다

$ pip install gradio ipykernel

모범 사례 및 최적화 팁은 아래 모범 사례 섹션으로 건너 뜁니다. Gradio Apps 배포 우리는 이미 단일 인수를 활성화하여 Gradio 앱을 배포하는 것이 얼마나 쉬운 지 이미 보았습니다. 물론,이 방법의 단점은 데모가 72 시간 내에 만료된다는 것입니다. 따라서 Gradio를 배포하는 권장되는 방법은 포옹 페이스 공간을 통해 이루어집니다. Huggingface는 2021 년에 Gradio를 인수하여 두 플랫폼 사이의 통합을 완벽하게 만들었습니다. 따라서,이 튜토리얼 또는 Gradio로 작성한 향후 앱의 경우 Huggingface.co에서 무료 계정에 가입하고 Settings & gt로 이동하십시오. 액세스 토큰을 생성하기위한 토큰 :

토큰은 한 번만 표시되므로 안전한 곳에 보관하십시오. 이 토큰을 사용하면 공간에서 영구 호스팅을 통해 원하는만큼 많은 Gradio 앱을 배포 할 수 있습니다. 예를 들어, 우리는 이전 섹션에서 다이아몬드 가격 예측 모델을 배포 할 것이며 놀랍게도 쉽게 찾을 수 있습니다.

. UI 스크립트가있는 디렉토리로 이동하고 터미널에 Gradio를 통화하는 것입니다.

$ ipython kernel install --user --name=gradio_tutorial
$ jupyter lab  # Start the lab

터미널은 스크립트를 기능하는 포옹 페이스 공간으로 변환하는 것을 안내합니다. 다음과 같은 세부 사항을 묻습니다

생성 한 액세스 토큰 우주 제목 : 배포 후 공간 URL의 일부가됩니다. Gradio UI 코드 (App.py Default)가 포함 된 스크립트의 이름 공간의 하드웨어; CPU 만 사용하려면 비워 두십시오 스크립트가 사용하는 모든 환경 변수 (이것은 API 키와 사용자 비밀을 단단히 저장하는 곳)

종속성 - Enter를 눌러 하나씩 입력하십시오 및 터미널에는 배포 된 공간 링크가 있습니다. 다음은 다음과 같습니다.

이 배포 방법에 대한 또 다른 가장 큰 장점은 Gradio가 데모를 자동으로 Working REST API로 변환한다는 것입니다. 액세스 및 쿼리에 대한 지침은 항상 맨 아래에 있습니다.
따라서, 한 번에, 당신은 비 기술적 인 사용자를위한 신청에 대한 영구 UI 호스팅과 동료 및 개발자 친구를위한 REST API를 모두 가지고 있습니다. 웹 페이지에 데모를 포함시키고 Google 인증 추가 앱에 추가 된 더 많은 배포 및 공유 옵션을 보려면 Gradio 문서의 "앱 공유"섹션을 방문하십시오. Gradio 모범 사례 및 팁 Gradio와의 사용자 인터페이스를 개발할 때 모범 사례에 따라 사용자 경험과 애플리케이션 유지 관리를 크게 향상시킬 수 있습니다. 다음은 몇 가지 주요 권장 사항입니다.

1. 조직 및 유지 관리에 스크립트를 사용하십시오 더 나은 버전 제어, 협업 및 배포를 위해 Python 스크립트로 Gradio 응용 프로그램을 구성합니다.

2. 구성 요소에 대한 공간 할당을 최적화하십시오 균형 잡힌 반응 형 인터페이스를 보장하기 위해 적절한 크기 및 레이아웃 도구 (예 : gr.column (), gr.row ())를 사용하십시오.

3. 포괄적 인 정보를 제공 각 구성 요소에 대한 명확한 지침과 컨텍스트를 제공하기 위해 '정보'및 '레이블'속성을 활용하십시오.

4. 대형 기능 세트를 효율적으로 처리합니다

많은 기능이있는 모델의 경우 파일 입력 (CSV, JSON)을 사용하여 배치 예측을 활성화하고 인터페이스를 단순화하십시오.

5. 환경 변수를 올바르게 관리합니다 지역 개발에 Python-dotenv를 사용하고 배치를 위해 얼굴 공간을 안고있는 변수를 설정하십시오.

6. 오류 처리 및 유효성 검사를 구현하십시오 입력 유효성 검증, 명확한 오류 메시지를 제공하며 우아한 오류 처리를 위해 Try-Excrect 블록을 사용하십시오.

7. 성능을 최적화하십시오

대형 모델의 캐싱, 게으른 하중을 구현하고 장기 실행 작업에 gr.loadingstatus ()를 사용하십시오.

8. 접근성을위한 설계 높은 대비를 보장하고 이미지에 대한 텍스트를 제공하며 모든 대화식 요소에 대한 키보드 탐색을 활성화합니다.

9. 진보적 인 공개

를 구현하십시오 아코디언 또는 탭을 사용하여 복잡한 인터페이스를 구성하여 필요에 따라 고급 옵션을 드러냅니다.

10. 정기적으로 업데이트하고 를 유지 관리합니다 사용자 피드백을 기반으로 종속성을 업데이트하고 버그를 모니터링하며 지속적으로 개선하십시오.

11. Huggingface Resources를 활용하십시오 모델 리포지토리 및 데이터 세트를 포함하여 Gradio와 완벽하게 통합하기 위해 Huggingface 도구 및 리소스를 활용하십시오.

12. huggingface hub

에 큰 모델을 주최합니다 대형 표면 모델의 경우 Huggingface Hub에 업로드하고 Gradio 스크립트에 직접로드하여 성능을 향상시키고 로컬 스토리지 요구 사항을 줄입니다.

13. Huggingface 데이터 세트를 활용

대형 데이터 세트의 경우 Huggingface Hub에 업로드하고 Gradio 응용 프로그램에서 직접 액세스하여 데이터 관리를 간소화하고로드 시간을 개선하십시오. 결론 및 추가 자원 이 기사에서는 Gradio를 사용하여 AI 응용 프로그램을위한 사용자 인터페이스를 구축하는 기본 사항을 배웠습니다. Gradio는 복잡한 인터페이스를 구축하기위한 더 많은 기능을 제공하기 때문에 표면 아래에 떨어졌습니다. 예를 들어, 인터페이스 상태를 사용하면 앱이 한 기능 호출에서 다른 기능 호출로 출력을 기억할 수 있습니다. 반응성 인터페이스는 사용자가 입력하자마자 UI를 동적으로 변경합니다. 블록을 사용하면 맞춤형 레이아웃 및 디자인으로 앱을 구축 할 수 있습니다. 마찬가지로 더 많은 콘텐츠에 대해서는 이러한 관련 리소스를 확인하십시오
데이터 과학 스택에 추가 할 Python 패키지 10 개 5 Gen AI 모델로 구축 할 수있는 프로젝트 기계 학습 과정을위한 CI/CD 주제 율 지식 정보

위 내용은 Python에서 Gradio를 사용하여 AI 응용 프로그램을위한 사용자 인터페이스 구축의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!