Chrome 拡張機能

稼働時間を
かわいく、
スマートに。

クライアントごとにタイマーを切り替えて、
月の稼働をそのままスプレッドシートに。
54種のカラーテーマで、自分色にカスタマイズ。

導入してみる
稼働中
02:34:15
ハルカ企画
今月合計 47:22
ハルカ企画 2:34
ことり堂 0:48
FEATURES

すべての機能が
ワンクリックで手元に

クライアントワークの時間管理に必要な機能を、かわいいUIにギュッとまとめました。

⏱
リアルタイムタイマー
ポップアップを閉じても計測は継続。バッジに経過時間を表示して、いつでも確認できます。
👥
マルチクライアント対応
複数クライアントを登録して、色で区別。タップひとつで切り替えられます。
☕
休憩モード
「休憩」ボタンを押せば休憩時間だけ自動除外。正確な稼働時間だけを記録します。
📊
Sheetsに自動集計
月ごとのシートに自動書き込み。クライアント別にカラーコーディングされた、見やすいフォーマットで。
🎨
54種のカラーテーマ
「春のクローバー」「砂糖漬けのバラ」「地中海の港」… 詩的な名前のプリセットから選ぶか、自分でカスタマイズ。
📥
CSV・JSONエクスポート
請求書作成や月次報告にそのまま使えるデータをワンクリックで書き出し。
HOW TO USE

使い方は
4ステップだけ

難しい設定は不要。拡張機能を追加したら、すぐに使い始められます。

01
拡張機能を追加
Chromeにパッケージ化されていない拡張機能として読み込みます
02
クライアントを登録
設定画面で名前と色を登録。テーマも好きなものに変更
03
タイマーを開始
クライアントを選んで「開始」。終わったら「終了」を押すだけ
04
Sheetsに同期
📊ボタンで月次データをスプレッドシートに自動書き込み
SPREADSHEET

Googleスプレッドシート
と繋がる

ワンクリックで月次の稼働データを自動フォーマット。請求書作成がぐっとラクになります。

日付クライアント開始終了稼働時間
2026-05-12ハルカ企画09:0012:303:30
2026-05-12ことり堂14:0016:002:00
2026-05-13ハルカ企画10:0013:453:45
2026-05-13ことり堂15:0017:302:30

自動で整えてくれる

同期ボタンを押すだけで、月ごとのシートが作成されます。ヘッダーの固定、クライアント別カラーコーディングも自動。

  • 月ごとに自動でシートを作成
  • クライアント別にカラーコーディング
  • ヘッダー行を自動でフリーズ
  • カラム幅を自動調整
  • CSVとしても書き出し可能
COLOR THEMES
54
種類の
カラーテーマ

詩的な名前のプリセットから選ぶか、カラーピッカーで自分だけのテーマを作れます。

SETUP

導入は
3分でできます

Chrome Web Storeへの公開前でも、開発者モードで今すぐ使えます。

STEP 1
ファイルをダウンロードする
GitHub から ZIP ファイルをダウンロードして解凍するだけです。
1
GitHub のページを開く
上の「ファイルをダウンロードする」ボタンをクリック
緑色の Code ▼ ボタンをクリック
→ メニューが開いたら Download ZIP をクリック
2
ZIP ファイルを解凍する
ダウンロードした ZIP をダブルクリックするだけで OK
ダウンロードフォルダにある timecard-extension-main.zip を
ダブルクリック → フォルダが展開されます
💡 フォルダの中に manifest.json というファイルがあれば OK です
STEP 2
Chrome に拡張機能として入れる
Chrome の設定画面でフォルダを読み込みます。
1
拡張機能ページを開く
Chrome のアドレスバーにコピーして Enter
Chrome のアドレスバーに下の URL をコピーして貼り付け → Enter
（Chrome メニュー → 「拡張機能」→「拡張機能を管理」でも OK）
chrome://extensions を開いた状態
2
デベロッパーモードを ON にする
右上のスイッチを ON にする（一度だけの操作）
画面右上の デベロッパーモード スイッチをクリックして ON にする
→ 画面左上にボタンが 3 つ増えます
デベロッパーモードを ON にした状態
3
フォルダを読み込む
「パッケージ化されていない拡張機能を読み込む」をクリック
左上に現れた パッケージ化されていない拡張機能を読み込む ボタンをクリック
→ STEP 1 で解凍した timecard-extension-main フォルダを選択
→ 「開く」 をクリック
パッケージ化されていない拡張機能を読み込むボタン
💡 フォルダの中ではなく、フォルダ自体（timecard-extension-main）を選んでください
4
追加されたことを確認 → ピン留め
拡張機能一覧に Time!Time! が表示されれば成功！
一覧に 🌿 Time!Time! が表示されていれば完了です
ツールバーのパズル🧩アイコン → Time!Time! 横の 📌 をクリックして固定するとすぐ使えます
タイマー クライアント タグ メモ ポモドーロ テーマ Sheets Calendar 空き時間 請求書 レポート Slack
🌿 全機能ガイド

Time!Time! できること

クライアントごとの時間管理から、請求書・Sheets同期・カレンダー連携まで。全機能をまるっと解説します。

⏱ タイマー基本操作 👥 クライアント管理 🏷️ タグ機能 📝 メモ機能 🍅 ポモドーロ 🎨 テーマ変更 📊 Sheets 同期 📅 Calendar 連携 🕒 空き時間検索 🧾 請求書 📈 レポート 💬 Slack 連携
01

タイマーの基本操作

クライアントを選んで「開始」を押すだけ。稼働中・休憩・終了をボタン1つで切り替えられます。

📅
📊
📈
⚙️
稼働中
02:34:15
ハルカ企画
今月合計 47:22
クライアント
ハルカ企画
2:34
ことり堂
0:48
1
クライアントをタップして選択（ハイライト表示になります）
2
「開始」ボタンを押すとタイマーがスタート。バッジにも経過時間が表示されます
3
休憩したいときは「休憩」を押すだけ。休憩時間は稼働時間から自動で除外されます
4
「終了」を押すとその場で記録が保存。メモを追加することもできます（任意）
💡
別のクライアントに切り替えたいときは、一度「終了」してから新しいクライアントを選んで「開始」します。
02

クライアント管理

取引先ごとにクライアントを登録。色・時給・月の目標時間を設定できます。

⚙️ 設定 — クライアント
ハルカ企画
クライアント名
カラー
時給（円）
月の目標時間（h）
1
拡張機能の⚙️ 設定を開く
2
「クライアントを追加」から名前・カラーを設定
3
時給を設定すると「今月の収益」がポップアップに表示されます
4
月の目標時間を設定するとゴールバーが表示され、達成時に通知が届きます
🎨
カラーは Sheets に同期したときの行の色にも使われます。クライアントごとに見分けやすい色を選ぶのがおすすめです。
03

タグで作業を分類

「ミーティング」「デザイン」「コーディング」など、作業の種類をタグで記録できます。クライアントごとに設定可能。

⚙️
稼働中
00:45:08
ことり堂
タグ
デザイン
ミーティング
コーディング
資料作成
1
設定 → クライアント → 「タグを追加」から名前を入力
2
タイマー起動中にタグをタップするとハイライト（複数選択可）
3
記録したタグはSheets に書き出したときに「タグ」列に表示されます
💡
タグはクライアントごとに独立しています。「ハルカ企画のデザイン」と「ことり堂のデザイン」は別々に管理されます。
04

終了後にメモを追加

「終了」を押した瞬間に記録が保存されます。その後、8秒間だけメモを追加できるバーが表示されます。

⚙️
メモを追加する（任意）
未開始
00:00:00
クライアント
ハルカ企画
ことり堂
1
「終了」を押した瞬間に稼働記録が保存されます
2
画面上部にメモバーが表示（8秒間）。入力して「追加する」で記録に紐付け
3
メモ不要なときは「スキップ」か Esc キーで閉じる
📝
メモは Sheets の「メモ」列に書き出されます。作業内容の詳細を残しておくと請求書作成時に役立ちます。
05

ポモドーロタイマー

25分作業 → 5分休憩を自動でサイクル。作業時間と休憩時間は自由に変更できます。終了時には癒し系のチャイム音でお知らせ🍀

🍅 作業中
09:28
⚙️
稼働中
00:15:32
ことり堂
🍅 ポモドーロ設定
ポモドーロ有効
作業時間（分）
休憩時間（分）
1
設定 → ポモドーロ から ON にする
2
タイマー起動中に画面上部の進捗バーで残り時間を確認
3
25分経過すると通知「○○分経過しました🍀」＋チャイム音が鳴ります
4
休憩が終わると「休憩終了です🌿」の通知で再開をお知らせ
⏱
ポモドーロをONにしても、通常の稼働タイマーは普通に動き続けます。ポモドーロはあくまで「お知らせ機能」です。
06

54種のカラーテーマ

「春のクローバー」「ドライフラワー」「焦がしキャラメル」など、54種類のテーマで自分色にカスタマイズ。カスタムカラーにも対応。

🎨 設定 — カラーテーマ
春の
クローバー
ドライ
フラワー
ピーチ
ラテ
カーキの
キャンバス
星空の
プラネタ
カスタムカラー
アクセント
ベース
テキスト
1
設定 → カラーテーマ を開く
2
54種類のプリセットからクリックで即適用
3
さらにカスタムカラーでアクセント・ベース・テキスト色を自由に設定
🎨
テーマはポップアップ・設定・レポート・請求書のすべてに適用されます。お気に入りの色で作業しましょう。
07

Google Sheets に月次データを書き出し

📊ボタンを押すだけで、当月の全稼働記録がスプレッドシートに書き出されます。クライアントの色で行がカラーリングされます。

日付
クライアント
開始
終了
稼働時間
メモ
2026-05-18
ハルカ企画
09:30
12:00
2:30
LP修正
2026-05-18
ことり堂
13:00
13:48
0:48
MTG
2026-05-17
ハルカ企画
10:00
14:30
4:30
バナー制作
📊 Sheets 設定
スプレッドシート ID
URL の /d/ここ/ の部分
ポップアップ終了時に自動同期
1
設定 → Sheets にスプレッドシート ID を入力
2
ポップアップの📊 ボタンを押すと当月のデータを書き出し
3
「2026-05」のような月別シートタブが自動作成されます
4
クライアントの色で行がカラーリングされ見やすく整形
⚠️
初回は Google の認証画面が開いてポップアップが閉じることがあります。認証完了後にもう一度📊を押してください。
08

Google Calendar に自動投入

「終了」ボタンを押すと、その稼働時間が Google カレンダーに自動で予定として登録されます。クライアントの色に合わせて色分けも。

📅 設定 — Calendar 連携
📅 Calendar 設定
終了時にカレンダーへ自動投入
カレンダー ID
タイトルテンプレート
クライアントのカラーに合わせて自動色分け
📅 カレンダーに登録される予定のイメージ
⏱ ハルカ企画｜LP修正
09:30 〜 12:00 (2h30m)
⏱ ことり堂｜MTG
13:00 〜 13:48 (0h48m)
1
設定 → Calendar 連携 を ON にする
2
タイマーを「終了」すると自動でカレンダーに予定が作成されます
3
タイトルは{client}{note}で自由にカスタマイズ
4
自動色分け ON にするとクライアントカラーに近いカレンダー色が自動適用
09

カレンダーから空き時間を検索

今後1週間の Google カレンダーの予定を読み込んで、作業可能な空き時間を自動で一覧表示。コピーしてそのままクライアントに送れます。

📅 空き時間
5/19（月）
10:00 〜 12:30 （2時間30分）
14:00 〜 18:00 （4時間）
5/20（火）
10:00 〜 15:30 （5時間30分）
5/21（水）✕ 空き枠なし
1
ポップアップ上部の📅 カレンダーアイコンをクリック
2
「空き時間を見る」を押すと今後 7日分の空き枠が一覧表示
3
📋 コピーでテキスト形式にコピー → メール・チャットに貼り付け可能
⚙️
設定 → 空き時間 で「稼働時間帯（10〜18時など）」「最低スロット時間」「何日先まで見るか」をカスタマイズできます。
10

クライアント別請求書を発行

稼働データからワンクリックで請求書を生成。PDF として印刷・保存できます。税率・支払い情報・備考も設定可能。

請求書
発行日：2026年05月31日
No. 2026-05-001
請求先
ハルカ企画 御中
請求元
山田 花子
hanako@example.com
作業内容時間単価金額
稼働（2026年5月）47:22¥3,500/h¥165,750
小計¥165,750
消費税（10%）¥16,575
合計¥182,325
1
ポップアップの📈 レポートボタン → レポート画面から「請求書」を開く
2
クライアント・月を選ぶと稼働データが自動集計
3
税率・支払期限・備考などを調整してブラウザの印刷 → PDF保存
💡
時給を設定してあれば金額も自動計算されます。設定 → 「お名前」に自分の名前を入れておくと請求書に自動で入ります。
11

月次レポートを確認

クライアントごとの稼働時間・収益・目標達成率をグラフと数字で確認。CSV / JSON でのエクスポートも可能。

📈 Time!Time! レポート
2026年5月 — 稼働サマリー
今月合計
47:22
収益（概算）
¥165,750
稼働日数
12日
ハルカ企画
32:14
ことり堂
10:08
デザイン屋
5:00
1
ポップアップの📈 ボタンでレポート画面を開く
2
月を選ぶとクライアント別の稼働時間・収益が一覧表示
3
CSV / JSON でエクスポートして Excel・スプレッドシートで加工可能
📊
毎週月曜の朝9時に「先週の稼働合計」を通知でお知らせする週次レポート機能もあります。
12

Slack 連携・離席を自動検知

稼働開始・休憩・終了に合わせて Slack のステータスを自動更新。また、PC が一定時間操作されないと休憩モードへの切り替えを通知します。

💬 設定 — Slack 連携
💬 Slack
Slack ステータスを自動更新
Slack User Token（xoxp-...）
稼働中テキスト
稼働中 絵文字
休憩中テキスト
休憩中 絵文字
🚶 離席検知
離席を自動検知する
検知するまでの時間（分）
1
Slack のUser Token（xoxp-...）を設定に入力
2
稼働開始 → 「:computer: 稼働中」、休憩 → 「:coffee: 休憩中」に自動更新
3
離席検知 ON：PC を10分間操作しないとタイマーが動いていても通知が届きます
4
通知のボタンから「休憩に切り替える」「そのまま続ける」を選択できます
🔑
Slack Token の取得は api.slack.com → Your Apps → OAuth & Permissions → users.profile:write スコープが必要です。