jpskill.com
📦 その他 コミュニティ 🟡 少し慣れが必要 👤 幅広いユーザー

📦 Hig Components Status

hig-components-status

Appleのヒューマンインターフェースガイドライン（HIG

⚡ ⏱ この作業 数時間 → 数分

📺 まず動画で見る(YouTube)

▶ 【Claude Code完全入門】誰でも使える/Skills活用法/経営者こそ使うべき ↗

※ jpskill.com 編集部が参考用に選んだ動画です。動画の内容と Skill の挙動は厳密には一致しないことがあります。

📜 元の英語説明(参考)

Apple HIG guidance for status and progress UI components including progress indicators, status bars, and activity rings.

🇯🇵 日本人クリエイター向け解説

一言でいうと

Appleのヒューマンインターフェースガイドライン（HIG

※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux 
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o hig-components-status.zip https://jpskill.com/download/2970.zip && unzip -o hig-components-status.zip && rm hig-components-status.zip
🪟 Windows (PowerShell) 
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/2970.zip -OutFile "$d\hig-components-status.zip"; Expand-Archive "$d\hig-components-status.zip" -DestinationPath $d -Force; ri "$d\hig-components-status.zip"

完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。

💾 手動でダウンロードしたい(コマンドが難しい人向け)
  1. 1. 下の青いボタンを押して hig-components-status.zip をダウンロード
  2. 2. ZIPファイルをダブルクリックで解凍 → hig-components-status フォルダができる
  3. 3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
  4. 4. Claude Code を再起動
⬇ .zip でダウンロード(推奨) ⬇ .skill 形式(上級者用) 元のソース ↗

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →
最終更新
2026-05-17
取得日時
2026-05-17
同梱ファイル
4

💬 こう話しかけるだけ — サンプルプロンプト

  • › Hig Components Status の使い方を教えて
  • › Hig Components Status で何ができるか具体例で見せて
  • › Hig Components Status を初めて使う人向けにステップを案内して

これをClaude Code に貼るだけで、このSkillが自動発動します。

📖 Claude が読む原文 SKILL.md(中身を展開)

この本文は AI(Claude)が読むための原文(英語または中国語)です。日本語訳は順次追加中。

Apple HIG: Status Components

Check for .claude/apple-design-context.md before asking questions. Use existing context and only ask for information not already covered.

Key Principles

Progress Indicators

  1. Show progress for operations longer than a second or two.

  2. Determinate when duration/percentage is known. A filling progress bar gives users a clear sense of remaining work. Use for downloads, uploads, or any measurable process.

  3. Indeterminate when duration is unknown. A spinner communicates work is happening without promising a timeframe. Use for unpredictable network requests.

  4. Prefer progress bars over spinners. Determinate progress feels faster and more trustworthy.

  5. Place indicators where content will appear. Inline progress near the content area, not modal or distant.

  6. Don't stack multiple indicators. Aggregate simultaneous operations into one representation or show the most relevant.

Status Bars

  1. Don't hide the status bar without good reason. Reserve hiding for immersive experiences (full-screen media, games, AR).

  2. Match status bar style to your content. Light or dark for adequate contrast.

  3. Respect safe areas. No interactive content behind the status bar.

  4. Restore promptly when exiting immersive contexts.

Activity Rings

  1. Activity rings are for Move, Exercise, and Stand goals. Don't repurpose the ring metaphor for unrelated data.

  2. Respect ring color conventions. Red (Move), green (Exercise), blue (Stand) are strongly associated with Apple Fitness.

  3. Use HealthKit APIs for activity data rather than manual tracking.

  4. Celebrate completions with animation and haptics when rings close.

Reference Index

Reference Topic Key content
progress-indicators.md Progress bars and spinners Determinate, indeterminate, inline placement, duration
status-bars.md iOS/iPadOS status bar System info, visibility, style, safe areas
activity-rings.md watchOS activity rings Move/Exercise/Stand, HealthKit, fitness tracking, color

Output Format

  1. Indicator type recommendation with rationale (determinate vs indeterminate).
  2. Timing and animation guidance -- duration thresholds, animation style, transitions.
  3. Accessibility -- VoiceOver progress announcements, live region updates.
  4. Platform-specific behavior across targeted platforms.

Questions to Ask

  1. Is the duration known or unknown?
  2. Which platforms?
  3. How long does the operation typically take?
  4. System-level or in-app indicator?

Related Skills

  • hig-components-system -- Widgets and complications displaying progress or status
  • hig-inputs -- Gestures triggering progress states (pull-to-refresh)
  • hig-technologies -- HealthKit for activity ring data; VoiceOver for progress announcements

Built by Raintree Technology · More developer tools

When to Use

This skill is applicable to execute the workflow or actions described in the overview.

Limitations

  • Use this skill only when the task clearly matches the scope described above.
  • Do not treat the output as a substitute for environment-specific validation, testing, or expert review.
  • Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.

同梱ファイル

※ ZIPに含まれるファイル一覧。`SKILL.md` 本体に加え、参考資料・サンプル・スクリプトが入っている場合があります。