編集キット

SmartHR社、制作パートナー、グループ会社の従業員は、SmartHRのサービス画面キャプチャを以下の方法で編集できます。

端末モックに合成する方法

サービス画面キャプチャを端末モック画像に合成するのには3つの方法があります。 いずれかの方法で、合成・ダウンロードしてください。

1. Figmaを利用する

Fimgaのアカウントをお持ちの方は「端末モック合成 | Figma」を利用して合成してください。
詳細は従業員限定コンテンツとして動画で解説しています。

🔓パスワードを入力すると従業員限定コンテンツを閲覧できます。
従業員は必ずパスワードを入力して閲覧・利用してください。

パスワード入力

2. 端末モック透過画像を利用する

KeynoteやGoogleスライドなどのスライド資料の場合、サービス画面と端末モック透過画像を重ねて配置することで、簡易的な合成ができます。

🔓パスワードを入力すると従業員限定コンテンツを閲覧できます。
従業員は必ずパスワードを入力して閲覧・利用してください。

パスワード入力

3. コミュニケーションデザイングループに依頼する

社内Slackより作成を依頼してください。

  • 社内Slack #design_comm_依頼

キャプチャ用装飾素材

キャプチャ用装飾素材とは、サービス画面キャプチャの一部を加工して表現する際に、装飾として使用する素材のことです。

省略線

省略線とは、縦に長いキャプチャ画像などの一部をレイアウトの都合で省略して表示する際に、画像の一部が省略されていることを示すために使用する、波線の形状の素材です。png形式で作成されているので、KeynoteやPowerPointなどさまざまなアプリケーションで利用できます。

一覧

用途素材イメージ使用イメージダウンロード
キャプチャ中央部省略用 省略線-center-image   省略線-center-example  PC / SP
キャプチャ下部省略用  省略線-bottom-image   省略線-bottom-example  PC / SP
キャプチャ上部省略用  省略線-top-image   省略線-top-example  PC / SP

ダウンロード

下記よりまとめてダウンロードできます。

素材_省略線 | Googleドライブ

色(注釈)

サービス画面キャプチャなどに、枠線やテキストといった注釈をつける場合に使用します。

Annotaion
#fc0c59
rgba(252,12,89)

キャプチャの機能に特化したアプリケーションSkitchの、デフォルトのカラーに合わせています。プロダクトキャプチャを利用した説明画像などを作成する際は、この色を使用して注釈やガイド線などを記入してください。

Skitchカラーイメージ

使用イメージ

指定色を使用して、注釈を記載したキャプチャのイメージです。 色(注釈)使用イメージ

ライセンス情報

本ページ内のコンテンツについては、画面キャプチャのライセンス情報を参照のうえご利用ください。