원문 캡처 · github.com
원문 캡처 · github.com

Shifted는 여러 Gmail 계정과 Google Calendar를 한 창에서 관리하는 데스크톱 앱을 AI 코딩 에이전트가 만들도록 안내하는 오픈소스 프로젝트다. 저장소에는 앱 코드가 아니라 제작 프롬프트가 들어 있으며, 프롬프트만으로 완성된 앱을 만든 사람은 아직 없다.

에이전트로 앱 만들기

시작하려면 git, Node.js 22.12 이상, 파일을 읽고 폴더 안에서 명령어를 실행할 수 있는 코딩 에이전트, 테스트용 Google 계정이 필요하다. 예시로 든 에이전트는 Claude Code(claude), Codex CLI(codex), 에이전트 모드의 Cursor다. Node.js 버전은 node --version으로 확인한다.

전체 빌드는 다음과 같이 진행한다.

  • 앱을 만들 빈 폴더를 만들고 그 폴더에서 에이전트를 시작한다: mkdir -p ~/src/shifted-app cd ~/src/shifted-app claude # or: codex
  • 에이전트에 다음 메시지를 입력한다: Clone https://github.com/briandilley/shifted.git into a temporary folder outside this one. Then read prompts/build-all.md in that clone and do what it says.
  • 빌드가 끝났다는 에이전트의 안내를 받으면 앱을 실행하고 수동 테스트를 한다: npm run dev. 수동 테스트 목록은 앱 폴더의 docs/manual-tests.md에 있으며, Google 계정 로그인부터 시작한다.

에이전트는 10개 단계를 차례로 진행하며 사용자 확인을 위해 멈추지 않는다. 전체 빌드는 몇 분이 아니라 몇 시간이 걸린다. 진행 상황은 docs/build-progress.md에 기록한다. 필요한 도구가 없거나, 한 단계가 세 차례 수정 시도 뒤에도 실패하거나, 사양에 충돌이 있으면 빌드를 일찍 멈춘다.

빌드 중 에이전트가 명령어를 실행할 때마다 허가를 요청하면 진행이 멈춘다. Claude Code에서는 각 명령어에 대한 첫 질문에 다시 묻지 않는 옵션을 선택한다. 다른 에이전트에도 비슷한 모드가 있다. 이 설정은 새 앱 폴더에서만 사용한다.

빌드 재개와 로그인

빌드가 멈추면 같은 폴더에서 에이전트를 다시 시작하고 다음 메시지를 입력한다.

Read docs/spec/prompts/build-all.md and continue the build.

에이전트는 docs/build-progress.md를 읽고 완료되지 않은 첫 단계부터 이어서 진행한다. 폴더에 docs/spec/이 없다면 00단계에서 멈춘 것이다. 이 경우 두 번째 단계에서 사용한 메시지를 다시 입력한다.

macOS와 Linux에서는 Shifted에서 패스키가 작동하지 않는다. Google이 패스키를 요청하면 “Try another way”를 누른 뒤 비밀번호와 2단계 인증을 사용한다. 계정마다 한 번 로그인하면 되며, Shifted는 재시작 뒤에도 로그인 상태를 유지한다.

선택 프롬프트

프롬프트 10은 서명된 설치 파일과 자동 업데이트를 만든다. macOS에는 Apple Developer 계정이, Windows에는 코드 서명 인증서가 필요하다. 프롬프트 11은 macOS에서 Touch ID 패스키를 시도하며, 프롬프트 10의 서명된 빌드가 있어야 한다.

선택 프롬프트를 실행하려면 앱 폴더에서 에이전트에 다음과 같은 메시지를 입력한다.

Read docs/spec/prompts/10-installers-and-updates.md and do what it says.

단계를 하나씩 실행하기

각 단계를 지켜보고 다음 단계로 넘어가기 전에 테스트하려면 프롬프트를 하나씩 실행한다.

  • 저장소를 복제하고 앱을 만들 빈 폴더를 만든다: git clone https://github.com/briandilley/shifted.git ~/src/shifted-spec mkdir -p ~/src/shifted-app cd ~/src/shifted-app
  • 앱 폴더에서 에이전트를 시작하고 복제한 저장소의 전체 경로를 넣어 다음 메시지를 입력한다. 일부 에이전트는 ~를 확장하지 않으므로 echo ~/src/shifted-spec을 실행해 전체 경로를 확인한다: Read /Users/you/src/shifted-spec/prompts/00-bootstrap.md and do what it says. The spec repo is at /Users/you/src/shifted-spec.
  • 다음 프롬프트부터는 매번 새 에이전트 세션을 시작한다. Claude Code에서는 /clear를 입력한다. 다음 프롬프트 파일 이름을 넣어 다음 메시지를 입력한다: Read docs/spec/prompts/01-one-account.md and do what it says.
  • 각 프롬프트를 마친 뒤 해당 프롬프트 끝에 있는 수동 테스트를 실행한다. 테스트가 실패하면 무엇이 실패했고 어떤 결과를 봤는지 에이전트에 알린다. 다음 단계로 넘어가기 전에 에이전트가 문제를 수정하도록 한다.

각 단계는 커밋 하나로 끝난다. 예를 들어 Phase 01: one account와 같은 커밋이 만들어진다. 완료된 단계는 git log --oneline으로 확인할 수 있다.

사양이 바뀐 경우

앱 폴더에는 00단계를 실행했을 당시의 사양 사본이 들어 있다. 최신 사양을 받으려면 저장소를 업데이트한 다음 에이전트에 다음 메시지를 입력한다.

The spec repo at /Users/you/src/shifted-spec changed. Compare it with docs/spec/. Copy the changes into docs/spec/, and list the code changes that the new spec needs. Do not change the code yet.

프롬프트 구성

prompts/build-all.md는 마스터 프롬프트다. 00부터 09까지의 프롬프트를 매번 새 컨텍스트에서 차례로 실행하고 진행 상황을 추적한다.

  • prompts/00-bootstrap.md: 코드 저장소와 사양 사본, AGENTS.md, React와 TypeScript를 사용하는 Electron, Vitest, Playwright, 가짜 Google 테스트 서버를 준비한다.
  • prompts/01-one-account.md: 한 계정의 세션, 로그인 창, Gmail, 로그아웃 상태, 재시작 뒤에도 유지되는 로그인을 다룬다.
  • prompts/02-many-accounts.md: 사이드바, 색 테두리가 있는 프로필 사진, 계정 순서 변경, 컨텍스트 메뉴, 탭 표시줄, 설정 창을 다룬다.
  • prompts/03-links.md: 링크 규칙, 자식 창, Calendar 링크, 기본 브라우저, 페이지 권한, 다운로드를 다룬다.
  • prompts/04-unread-badges.md: Atom 피드, 계정별 피드 선택, 읽지 않은 메일 배지, 앱 배지를 다룬다.
  • prompts/05-notifications.md: 피드에서 가져오는 새 메일 알림, Calendar 및 Chat 알림, 알림 스위치, 일시 중지, 방해 금지 시간을 다룬다.
  • prompts/06-mailto.md: 계정 선택기, 새 메시지 작성, 기본 이메일 앱을 다룬다.
  • prompts/07-shortcuts-and-background.md: 키보드 단축키, 백그라운드 로딩, 닫을 때 숨기기, 트레이 아이콘, 로그인 시 자동 실행을 다룬다.
  • prompts/08-hardening.md: 보안, 충돌 및 오프라인 상태, 접근성, 세 플랫폼에서의 테스트를 다룬다.
  • prompts/09-release.md: 사양의 모든 규칙을 추적하고, 수동 테스트 목록 하나와 코드 저장소의 README를 만든다.
  • prompts/10-installers-and-updates.md: 선택 항목으로, 서명된 설치 파일과 자동 업데이트를 다룬다.
  • prompts/11-touch-id-passkeys.md: 선택 항목으로, macOS의 Touch ID 패스키를 다루며 프로토타입부터 시작한다.

prompts/의 각 프롬프트는 독립적으로 사용할 수 있으며 다음 항목으로 구성된다.

  • 목표: 해당 단계의 결과를 한두 문장으로 설명한다.
  • 먼저 읽을 내용: 에이전트가 작업 전에 읽을 사양 파일이다. 에이전트는 코드 저장소의 docs/spec/에서 파일을 읽는다.
  • 범위: 해당 단계에서 에이전트가 만드는 항목이다.
  • 범위 밖: 해당 단계에서 만들지 않는 항목이다.
  • 자동 테스트: 해당 단계에서 추가하는 단위 테스트와 엔드투엔드 테스트다.
  • 수동 테스트: 단계가 작동하는지 확인하기 위해 사용자가 직접 하는 절차다.

저장소에는 앱의 기능과 제외 항목을 설명하는 PRODUCT.md, 기술 스택과 빌드 도구, 아이콘, 단계별 테스트 방법을 정리한 BUILD.md, 문서에서 사용하는 단어의 의미를 정의한 GLOSSARY.md가 있다. PRIOR-ART.md는 Shift가 무엇인지, Shifted가 무엇을 유지하고 제외하는지 설명한다. docs/adr/에는 결정과 그 이유가, prompts/에는 번호순 빌드 프롬프트가 들어 있다. assets/에는 SVG 앱 아이콘과 1024픽셀 PNG 아이콘이 있으며, docs/agents/에는 문서 작성에 사용하는 에이전트 스킬 설정이 담겨 있다.

저장소: Shifted