製品紹介画像の作り方：Webサイト・SNS・アプリの告知に

一つの利用場面から始める

アイデアを整理する機能なら、空の開始画面よりも、内容が整理された状態を見せます。Lilacpaneに画像を読み込み、見出し、背景、必要に応じてフレームを追加します。装飾を増やす前に、画面が見出しの内容を裏付けているか確認します。

Webサイトでは周囲の説明文とのバランスを考えて余白を残します。SNSでは画像だけでも意味が分かるように補足を短くし、スマホ表示で読みやすさを確認します。横長の画像を正方形や縦長にするときは、切り抜くだけでなく文字と画面を配置し直しましょう。

主な価値、具体的な操作、その結果という三つの内容を考えます。字体、背景、余白をそろえ、各画像では別の情報を伝えます。同じ構図を使い回す場合も、画像を差し替えた後の切れや見出しの改行を一枚ずつ確認します。

モックアップは利用場面を伝えるのに便利ですが、UIの細部には大きな画面表示が必要です。複数デバイスを並べる場合は主役を一つ決め、他の画面は関係を説明するために使います。書き出した画像を実際の掲載サイズでも確認してください。

このWebページで編集できますか？

このページは制作ガイドです。素材の読み込みと編集にはApp StoreからLilacpaneをダウンロードしてください。

同じ画像をすべてのSNSで使えますか？

テーマや色は共通にできますが、掲載先に合わせて比率、文字サイズ、構図を調整しましょう。

無料でダウンロードできます。アプリ内課金があり、利用できる機能と書き出し設定はアプリ内で確認できます。