---
title: "デザインレビューを画面上のコメントで完結させる方法"
description: "「左上のあたりが」「3つ目のカードが」という説明では指摘箇所が正確に伝わらないと感じているデザイナー向け。画面そのものにコメントを残して対象を一目で示すレビューフローを実現できるかを確認できます。"
image: "https://giga-site.com/og-image.png"
canonical: "https://giga-site.com/articles/design-review-on-screen"
markdown: "https://giga-site.com/articles/design-review-on-screen/index.md"
category: "社内レビュー"
publishedAt: "2026-06-22"
updatedAt: "2026-06-25"
readingMinutes: 5
---
# デザインレビューを画面上のコメントで完結させる方法

デザインのレビューを言葉だけでやり取りすると、「左上のあたりの余白が」「3つ目のカードの色味が」といった説明に手間がかかり、指摘箇所が正しく伝わらないことがあります。画面そのものにコメントを残せれば、対象を選んで一言添えるだけで意図が伝わります。この記事では、デザインレビューを画面上のコメントで完結させる方法を整理します。

> Source HTML: https://giga-site.com/articles/design-review-on-screen
> Article index: https://giga-site.com/articles/index.md

## 言葉だけのデザイン指摘は伝わりにくい

デザインの指摘を文章だけで伝えると、書く側も読む側も負担が大きくなります。位置や対象を言葉で特定する必要があるため、「画面右側の中段にある見出し」のような回りくどい説明が増え、それでも誤解が生じることがあります。

指摘の往復が増えると、レビュー全体が長引きます。とくに視覚的な要素は、文章よりも対象を直接指し示すほうが正確に伝わります。

## 一般的なデザインレビューの進め方

デザインレビューでは、対象を指し示しながら指摘できる手段を用意することが大切です。スクリーンショットに注釈を入れたり、画面共有しながら口頭で説明したりする方法が広く使われています。

ただし、スクリーンショットへの注釈は元のデザインと別管理になりがちで、口頭説明は記録が残りません。指摘が成果物そのものに紐づいて残る形が、後から見返すときに便利です。

- 対象を指し示しながら指摘する
- 指摘を成果物に紐づけて残す
- やり取りの履歴を後から見返せるようにする

## そのまま使えるレビュー依頼文テンプレ

デザインレビューを画面上のコメントで完結させる方法は、URLを送るだけではレビューが進みません。確認してほしい観点、締切、返信先、差し替え時の扱いを依頼文に含めます。

例文: 「以下のURLで確認できます。今回はスマホ表示・文言・CTAだけ見てください。修正後も同じURLに反映します。締切は◯日◯時でお願いします。」 レビュー中は新しいリンクを何度も作るより、同じURLで差し替えて「最新版はこのURL」と統一すると確認漏れを減らせます。

- 観点: デザイン、文言、スマホ表示、フォーム、CTAなどを3つ以内に絞る
- 期限: いつまでに返答が必要かを明記する
- 返信先: Slack、メール、コメントなど回収先をひとつにする
- 差し替え: 最新版URLが変わるのか、同じURLで更新するのかを伝える

## 画面上コメントを使うときの注意点

画面上の要素にコメントを残す機能は便利ですが、利用できるプランが決まっています。ギガサイト便では、要素に紐づくレビューコメントはProで使えます。チームでデザインレビューを行うなら、この機能が大きな助けになります。

また、コメントを残してもらうには、レビューする人がそのページを開ける必要があります。認証を設定している場合は、開き方をあわせて案内しておきましょう。

## 要素に紐づくコメントでレビューを完結させる

ギガサイト便のProでは、画面上の要素を指定してコメントをピン留めできます。気になったボタンや見出しをクリックして一言添えるだけで、どこへの指摘かが一目で分かります。文章で位置を説明する手間がなくなり、指摘の往復が減ります。

コメントは成果物そのものに紐づいて残るため、後から見返したときも「どこへの指摘だったか」を確認できます。スクリーンショットへの注釈のように別管理にならず、レビューがその場で完結します。

## ギガサイト便で画面上コメントを使う手順

Proで、デザインのHTMLを公開し、要素にコメントをピン留めしてもらう流れです。認証と期限も忘れずに設定しておきましょう。

レビュアーには、文章で位置を説明するのではなく、対象の要素を選んでコメントを残してもらうよう伝えるのがポイントです。これだけで指摘の伝わり方が大きく変わります。

1. Proでギガサイト便にログインする
2. トップにレビューしたいデザインのHTMLまたはZIPをドラッグ&ドロップする
3. 認証方式を選び、公開期限をレビューの締め切りに合わせて設定する
4. 発行されたURLをレビュアーに送り、画面上の要素にコメントを残してほしいと伝える
5. レビュアーは画面上の要素を指定してコメントをピン留めし、指摘箇所を明確にする
6. ピン留めされたコメントを確認しながら修正し、同じURLで中身を差し替えて再確認してもらう

## よくある質問

### 画面上の要素にコメントを残す機能はどのプランで使えますか？

要素に紐づくレビューコメント（画面上の要素を指定してコメントをピン留めする機能）はProで利用できます。無料プランには含まれないため、チームでデザインレビューを行う場合はProの利用を検討してください。

### コメントは成果物に紐づいて残りますか？

はい。要素に紐づくコメントは画面上の対象にピン留めされるため、どこへの指摘かが一目で分かります。スクリーンショットへの注釈のように別ファイルで管理する必要がなく、レビューがその場で完結します。

### 修正したデザインを同じレビューで見てもらえますか？

はい。ギガサイト便は同じURLのまま中身を差し替えられるため、コメントを受けて修正したデザインを、同じリンクでそのまま再確認してもらえます。リンクを送り直す必要がないので、レビューを止めずに進められます。

### レビュアーがコメントを残すのに登録は必要ですか？

コメントを残してもらうには、まずレビュアーがそのページを開ける必要があります。認証を設定している場合は開き方を案内してください。コメント機能の利用条件はプランに依存するため、Proで公開したページに対してコメントを受け付ける形になります。

### レビュー依頼文には何を書けばよいですか？

URL、確認観点、締切、返信先、差し替え時の扱いを書きます。特に「今回は何を見なくてよいか」まで書くと、不要な指摘や手戻りを減らせます。

## 関連記事

- [文章担当とデザイン担当でレビュー観点を分けて依頼する方法](https://giga-site.com/articles/split-review-by-role-content-vs-design/index.md)
- [社内レビューのフィードバックを効率よく集める方法](https://giga-site.com/articles/collect-review-feedback/index.md)
- [Canva Magic Designで作ったデザインを共有する方法](https://giga-site.com/articles/canva-magic-design-share/index.md)
- [エラーページ・メンテナンス画面HTMLを共有する方法](https://giga-site.com/articles/error-page-design-html/index.md)
- [社内レビュー用にLPを一時公開する方法](https://giga-site.com/articles/internal-lp-review/index.md)
- [修正版を同じURLで見せ続けてレビューを止めない方法](https://giga-site.com/articles/keep-review-moving-same-url/index.md)

```json
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "デザインレビューを画面上のコメントで完結させる方法",
  "description": "「左上のあたりが」「3つ目のカードが」という説明では指摘箇所が正確に伝わらないと感じているデザイナー向け。画面そのものにコメントを残して対象を一目で示すレビューフローを実現できるかを確認できます。",
  "datePublished": "2026-06-22",
  "dateModified": "2026-06-25",
  "mainEntityOfPage": "https://giga-site.com/articles/design-review-on-screen",
  "url": "https://giga-site.com/articles/design-review-on-screen",
  "inLanguage": "ja",
  "image": "https://giga-site.com/og-image.png",
  "articleSection": "社内レビュー",
  "author": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "publisher": {
    "@type": "Organization",
    "name": "ギガサイト便"
  },
  "mainEntity": [
    {
      "@type": "Question",
      "name": "画面上の要素にコメントを残す機能はどのプランで使えますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "要素に紐づくレビューコメント（画面上の要素を指定してコメントをピン留めする機能）はProで利用できます。無料プランには含まれないため、チームでデザインレビューを行う場合はProの利用を検討してください。"
      }
    },
    {
      "@type": "Question",
      "name": "コメントは成果物に紐づいて残りますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "はい。要素に紐づくコメントは画面上の対象にピン留めされるため、どこへの指摘かが一目で分かります。スクリーンショットへの注釈のように別ファイルで管理する必要がなく、レビューがその場で完結します。"
      }
    },
    {
      "@type": "Question",
      "name": "修正したデザインを同じレビューで見てもらえますか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "はい。ギガサイト便は同じURLのまま中身を差し替えられるため、コメントを受けて修正したデザインを、同じリンクでそのまま再確認してもらえます。リンクを送り直す必要がないので、レビューを止めずに進められます。"
      }
    },
    {
      "@type": "Question",
      "name": "レビュアーがコメントを残すのに登録は必要ですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "コメントを残してもらうには、まずレビュアーがそのページを開ける必要があります。認証を設定している場合は開き方を案内してください。コメント機能の利用条件はプランに依存するため、Proで公開したページに対してコメントを受け付ける形になります。"
      }
    },
    {
      "@type": "Question",
      "name": "レビュー依頼文には何を書けばよいですか？",
      "acceptedAnswer": {
        "@type": "Answer",
        "text": "URL、確認観点、締切、返信先、差し替え時の扱いを書きます。特に「今回は何を見なくてよいか」まで書くと、不要な指摘や手戻りを減らせます。"
      }
    }
  ]
}
```