Google Workspace UI 확장

이 페이지에서는 Google Workspace 사용자 인터페이스 (UI)를 확장하는 옵션을 설명합니다. 다음과 같은 여러 가지 이유로 Google Workspace UI를 확장할 수 있습니다.

  • 사용자가 하나 이상의 Google Workspace 앱에서 직접 앱을 사용할 수 있도록 앱 또는 서비스를 Google Workspace에 통합합니다. 예를 들어 Google Docs 내에서 서비스의 스마트 칩과 링크 미리보기를 만드는 Google Workspace 부가기능을 빌드합니다.
  • Google Workspace 사용자가 생산성을 높이거나 워크플로를 개선할 수 있도록 지원하세요. 예를 들어 사용자가 Google Chat에서 바로 주간 시간표를 보고할 수 있는 Google Chat 앱을 빌드합니다.
  • Google Workspace에서 기본적으로 제공되지 않는 기능을 추가합니다. 예를 들어 Google Docs, Sheets 또는 Slides에 맞춤 메뉴를 추가합니다.

Google Workspace UI를 확장하기 위한 대부분의 옵션을 사용자가 Google Workspace와 통합되는 서드 파티 앱을 찾아 설치할 수 있는 온라인 상점인 Google Workspace Marketplace에 게시할 수 있습니다.

Google Workspace UI 확장 옵션 개요

다음 표에는 Google Workspace UI를 확장하는 옵션이 나와 있으며 다음과 같은 특성별로 비교됩니다.

  • 확장된 앱: 지정된 옵션으로 확장할 수 있는 Google Workspace 앱이 표시됩니다.
  • 코딩 옵션: 다음을 비롯하여 빌드할 수 있는 방법을 보여줍니다.
    • AppSheet: 코딩이 필요 없는 개발 플랫폼입니다.
    • Apps Script: JavaScript를 기반으로 하는 클라우드 기반 로우 코드 개발 플랫폼입니다.
    • 전체 개발: 선호하는 코딩 언어를 지원하는 자체 기술 스택입니다.
  • UI 프레임워크: 다음을 포함하여 각 옵션을 빌드하는 데 사용할 수 있는 UI 프레임워크 유형을 나타냅니다.
    • 카드 기반: 카드 인터페이스는 Apps Script를 사용하는 카드 서비스로 빌드되거나 적절한 형식의 JSON을 반환하여 원하는 기술 스택 (전체 개발자)으로 카드를 렌더링하는 사전 정의된 위젯 및 카드입니다. 카드 기반 인터페이스는 HTML 또는 CSS에 대한 지식이 필요하지 않으며 데스크톱 및 모바일 클라이언트에서 모두 잘 작동합니다.
    • HTML: Apps Script는 서버 측 Apps Script 함수와 상호작용할 수 있는 웹페이지를 개발하기 위한 HTML 서비스를 제공합니다. HTML 서비스로 개발된 인터페이스는 맞춤설정이 매우 쉽지만 우수한 사용자 환경을 만들기 위해서는 더 많은 수동 작업이 필요합니다.
    • iframe: iframe은 외부 콘텐츠를 Google Workspace에 삽입하고 사용자 인터페이스를 가장 맞춤설정할 수 있도록 지원합니다.

표 다음에는 각 옵션에 대한 설명이 나와 있습니다.

빌드할 수 있는 항목 미리보기 앱 확장 코딩 옵션 카드 기반 UI HTML UI iframe UI
Google Workspace 부가기능 Google Workspace 부가기능 예시
Gmail
Drive
Calendar
Docs
Sheets
Slides
Apps Script
전체 개발
링크 미리보기 및 스마트 칩 | Google Workspace 부가기능 Google Workspace 부가기능 링크 미리보기 예시
Docs
Sheets
Slides
AppSheet
Apps Script
전체 개발
이메일 초안 | Google Workspace 부가기능 이메일 초안용 Google Workspace 부가기능 예시
Gmail
Apps Script
전체 개발
회의 기본 화면 및 측면 패널 | Google Workspace 부가기능 Google Meet 부가기능
Meet
전체 개발
Calendar 회의 | Google Workspace 부가기능 Calendar 회의용 Google Workspace 부가기능 예시
Calendar
Apps Script

기존 UI 사용

편집기 부가기능 편집자 부가기능 예시
Docs
Sheets
Slides
양식
Apps Script
Google Chat 앱 Chat 앱 예시
채팅
AppSheet
Apps Script
전체 개발
맞춤 함수 맞춤 함수 예시
Sheets
Apps Script

기존 UI 사용

매크로 매크로 예시
Sheets
Apps Script

기존 UI 사용

맞춤 메뉴, 대화상자, 사이드바 메뉴 및 사이드바 예
Docs
Sheets
Slides
양식
Apps Script
Google Drive 앱 Drive 앱 예시
Drive
전체 개발

기존 UI 사용

Google 클래스룸 부가기능 Google 클래스룸 부가기능
클래스룸
전체 개발

Google Workspace 부가기능

Google Workspace 부가기능 예시

Google Workspace 부가기능은 Google Workspace 앱과 통합되는 애플리케이션입니다. Google Workspace 부가기능은 여러 Google Workspace 앱을 확장할 수 있습니다. 대부분의 경우 앱은 확장하는 Google Workspace 앱 내의 사이드바에서 열립니다.

Google Workspace 부가기능 문서 보기

게시 가능



코딩 옵션:

Apps Script
전체 개발

다음 앱을 확장합니다.

Gmail
Drive
Calendar

Docs
Sheets
Slides

사용 가능한 UI 프레임워크:

카드 프레임워크



링크 미리보기 예시

Docs를 확장하는 Google Workspace 부가기능은 서드 파티 서비스에서 맞춤 링크 미리보기를 만들 수 있습니다. Docs에서 Google Workspace 애플리케이션 내의 사용자, 파일, 캘린더 일정 또는 기타 항목에 대한 언급을 위해 생성하는 스마트 칩과 마찬가지로 부가기능은 서드 파티 링크의 스마트 칩을 생성하고 사용자가 칩 위로 마우스를 가져가면 미리보기 카드를 표시할 수 있습니다.

기존 Google Workspace 부가기능에 링크 미리보기를 추가하거나 링크 미리보기 전용 별도의 Google Workspace 부가기능을 만들 수 있습니다.

링크 미리보기 및 스마트 칩 문서 보기

게시 가능



코딩 옵션:

AppSheet
Apps Script
전체 개발

다음 앱을 확장합니다.

Docs
Sheets
Slides

사용 가능한 UI 프레임워크:

카드 프레임워크



이메일 초안 | Google Workspace 부가기능

이메일 초안 예시

Gmail을 확장하는 Google Workspace 부가기능은 사용자가 새 메일을 작성하거나 기존 메일에 답장할 때 맞춤 인터페이스를 제공할 수 있습니다. 이 인터페이스를 사용하려면 사용자가 이메일 초안 내에서 초안 하단 또는 옵션 더보기 메뉴에서 부가기능을 엽니다.

이메일 초안 문서 보기

게시 가능



코딩 옵션:

Apps Script
전체 개발

다음 앱을 확장합니다.

Gmail

사용 가능한 UI 프레임워크:

카드 프레임워크



회의 메인 스테이지 및 측면 패널 | Google Workspace 부가기능

Meet 부가기능

Meet을 확장하는 Google Workspace 부가기능을 사용하면 앱을 회의의 기본 스테이지 또는 측면 패널 인터페이스에 삽입할 수 있습니다. 그러면 사용자가 Meet을 나가지 않고도 앱을 검색, 공유, 공동작업할 수 있습니다.

다른 Google Workspace 부가기능과 달리 Meet 부가기능은 카드 프레임워크 UI를 사용하지 않습니다. 대신 iframe을 사용하여 앱을 삽입합니다.

Meet 부가기능 SDK 문서 보기

게시 가능



코딩 옵션:

전체 개발

다음 앱을 확장합니다.

Meet

사용 가능한 UI 프레임워크:

iframe



Calendar 회의 | Google Workspace 부가기능

Calendar 회의 예

웹 회의 제공업체는 회의 솔루션으로 Google Calendar를 확장하는 Google Workspace 부가기능을 빌드할 수 있습니다. 이 부가기능을 사용하면 Calendar 일정에 회의 옵션이 추가되어 사용자가 Calendar에서 직접 회의를 만들고 참여할 수 있습니다.

Calendar 회의 문서 보기

게시 가능



코딩 옵션:

Apps Script

다음 앱을 확장합니다.

Calendar

사용 가능한 UI 프레임워크:

기존 UI 사용


편집기 부가기능

편집자 부가기능 예시

편집기 부가기능은 Docs, Sheets, Slides 또는 Forms를 확장하는 앱입니다. 편집기 부가기능은 부가기능당 하나의 앱만 확장할 수 있지만 동일한 Marketplace 등록정보에 여러 편집기 부가기능을 게시할 수 있습니다. 사용자는 확장하는 앱의 확장 프로그램 메뉴에서 편집기 부가기능을 엽니다.

편집기 부가기능에는 다음 인터페이스를 사용할 수 있습니다.

  • 확장하는 애플리케이션 옆에 있는 사이드바
  • 확장하는 앱을 오버레이하는 대화상자
  • 스크립트를 실행하는 메뉴 항목입니다.
  • Google Sheets 스프레드시트의 맞춤 함수

편집기 부가기능 문서 보기

게시 가능



코딩 옵션:

Apps Script

다음 앱을 확장합니다.

Docs
Sheets
Slides
양식

사용 가능한 UI 프레임워크:

HTML
iframe



채팅 앱

Chat 앱 예시

채팅 앱은 리소스와 서비스를 Chat으로 가져옵니다. 다음을 비롯한 다양한 방법으로 사용자와 상호작용할 수 있도록 Chat 앱을 설계할 수 있습니다.

  • 슬래시 명령어에 문자 메시지 또는 카드 메시지로 응답합니다.
  • 사용자가 양식 데이터를 입력하는 등 다단계 프로세스를 완료할 수 있도록 대화상자를 엽니다.
  • 사용자가 대화에서 바로 조치를 취할 수 있는 유용한 정보가 포함된 카드를 첨부하여 링크를 미리 봅니다.

채팅 앱 문서 보기

게시 가능



코딩 옵션:

AppSheet
Apps Script
전체 개발

다음 앱을 확장합니다.

채팅

사용 가능한 UI 프레임워크:

카드 프레임워크



커스텀 함수

맞춤 함수 예시

맞춤 함수를 사용하면 Sheets에 더 많은 함수를 추가할 수 있습니다. 사용자는 Sheets에서 사용할 수 있는 수백 개의 기본 제공 함수와 마찬가지로 이러한 함수를 찾아 사용할 수 있습니다. 맞춤 함수를 편집기 부가기능으로 게시할 수 있습니다.

커스텀 함수 문서 보기

게시 가능



코딩 옵션:

Apps Script

다음 앱을 확장합니다.

Sheets

사용 가능한 UI 프레임워크:

기존 UI 사용


매크로

매크로 예시

매크로는 Sheets에서 녹화된 것으로, 사용자가 정의한 특정 UI 상호작용 시리즈를 복제합니다. 매크로를 단축키에 연결하거나 확장 프로그램 > 매크로 메뉴에서 실행할 수 있습니다.

매크로를 기록하면 Sheets에서 UI 상호작용을 복제하는 Apps Script 함수를 자동으로 만듭니다. Apps Script 편집기에서 바로 매크로를 수정할 수 있습니다. Apps Script에서 매크로를 처음부터 작성하거나 이미 작성한 함수를 가져와 매크로로 변환할 수 있습니다.

매크로 문서 보기

코딩 옵션:

Apps Script

다음 앱을 확장합니다.

Sheets

사용 가능한 UI 프레임워크:

기존 UI 사용


맞춤 메뉴, 대화상자, 사이드바

맞춤 메뉴 예시

Docs, Sheets, Slides, Forms의 파일에 맞춤 메뉴, 프롬프트, 알림, HTML 기반 대화상자 및 사이드바를 추가할 수 있습니다. 맞춤 메뉴는 확장하는 앱의 기본 메뉴 옆에 표시됩니다. 대화상자, 사이드바, 메시지, 알림은 일반적으로 메뉴 항목 클릭과 같은 사용자 작업이나 이벤트 기반 트리거와 같은 트리거에 의해 활성화됩니다.

커스텀 메뉴, 대화상자, 사이드바 문서 보기

코딩 옵션:

Apps Script

다음 앱을 확장합니다.

Docs
Sheets
Slides
양식

사용 가능한 UI 프레임워크:

HTML
iframe



Drive 앱

Drive 앱 예시

앱에서 Drive 파일을 지원하는 경우 Drive 사용자 인터페이스와 통합하여 앱을 파일 만들기 또는 열기 옵션으로 표시할 수 있습니다. 사용자가 Drive에서 파일을 마우스 오른쪽 버튼으로 클릭하면 앱이 새로 만들기 > 더보기 메뉴와 이 도구로 열기 메뉴에 표시될 수 있습니다. 사용자가 두 메뉴 중 하나에서 앱을 선택하면 앱이 새 창에서 열립니다.

Drive 앱 문서 보기

게시 가능



코딩 옵션:

전체 개발

다음 앱을 확장합니다.

Drive

사용 가능한 UI 프레임워크:

기존 UI 사용


Google 클래스룸 부가기능

클래스룸 부가기능

교육자는 Google 클래스룸 부가기능을 사용하여 과정, 공지사항 또는 과정 자료에 첨부파일을 만들 수 있습니다. 이러한 첨부파일은 클래스룸의 iframe에서 서드 파티 콘텐츠를 엽니다. iframe은 사용자 유형과 클래스룸 컨텍스트에 따라 별도의 URL을 엽니다.

클래스룸 부가기능 문서 보기

게시 가능



코딩 옵션:

전체 개발

다음 앱을 확장합니다.

클래스룸

사용 가능한 UI 프레임워크:

iframe