デザインやコーディングの知識は必要なし！直感的な操作でサクッとホームページを作成できる「Adobe Spark Page」とは

ホームページやランディングページなどを作成する場合は、ディレクターはもちろん、デザイナーやエンジニアなども必要となります。

多機能性が求められるホームページ作成では各業種のプロが集結する必要がありますが、特にランディングページなど簡易的なページで十分という場合や、実際のホームページ作成の前に簡単なワイヤーフレームを作成したい場合などは自分で作成できるとコスト削減にもつながります。

今回は、直感的な操作感で誰でも簡単にホームページを作成することができる無料アプリ「Adobe Spark Page」の使用方法をご紹介します。
特別な知識がなくとも、写真を選択してテキストやURLなどを入力するだけでホームページを作成することができますので、ぜひ試してみてはいかがでしょうか。

Adobe Spark Pageとは

App Store

Adobe Spark Pageとはとは、PhotoshopやIllustratorなどのツールを提供しているAdobe社が配信している、無料のホームページデザインアプリです。

このアプリを使用すれば、デザインやコーディングなどの知識がなくとも誰でも簡単にホームページを作成することができます。作成したホームページは独自ドメインを利用することはできず、すべて「spark.adobe.com」のドメインでの公開になりますが、無料ですぐに公開することも可能です。

基本的にはテンプレートに沿って作成するため自由度はあまり高くありませんが、例えばランディングページを作成したりキャンペーンなどを行う際に一時的にWebページを作成したりなどをする際は非常に便利です。

また、実際にデザイナーやエンジニアなどに作成したいホームページのおおまかなデザインなどを伝えたい場合のワイヤーフレームとしての使用もオススメです。

Adobe Spark Pageで簡単にホームページを作成する方法

step1.

アプリをインストールして起動すると、最初にログイン画面が表示されます。

Facebook・Googleのアカウントでログインするか、Adobe IDをお持ちの方はIDを使用してログインしてください。

「Sign up for free」をタップすればログインせずにアプリを使用することができますが、ログインをしておけば一度作成したホームページをその後再度見返すこともできます。

step2.

ログインをすると最初に「You’ve signed in」という画面が表示されますので「Done」をタップしてください。

step3.

メニュー画面が表示されますので、プラスアイコンをタップします。

step4.

新規作成画面が表示されます。まず最初に「Add a Title」をタップしてタイトルをキーボード記入してください。続いてこの画面上のプラスアイコンをタップすると、画面左側にメニューが表示されます。

「Find photos」をタップするとアプリ内で提供されている写真から、「Adobe Stock」をタップするとAdobe社が提供しているロイヤリティフリーの画像や写真から、「On my iPad」をタップするとiPad内に保存されている写真から、「Take a picture」をタップするとその場でiPadを使用して撮影した写真から、「Creative Cloud」または「Lightroom」をタップするとAdobe IDをお持ちの場合にCreative Cloud上またはLightroomに保存されている写真から、「Dropbox」をタップするとDropbox内に保存されている写真から、「Google Photos」をタップするとGoogleフォト内に保存されている写真から、背景写真を選択することができます。

step5.

タイトルを入力して背景画像を設定すると、上画像のようになります。

この画面で右上に表示されている4つのアイコンのうち、一番左にアイコン(画像赤枠部分)をタップすると、テンプレートを選択することができます。

step6.

画面右側に13種類のテンプレートが表示されますので、完成イメージに近いものを選択してください。

step7.

続いて画面下部に表示されている「Scroll to start writing your story」をタップします。
プラスアイコンが表示され、次のページを作成することができます。

step8.

メニューが表示されます。
各メニューでは以下の操作が可能です。

・photo：写真を選択することができます。step4と同様の画面が表示されますので、写真を選択してください。

・text：テキストを入力することができます。入力したテキストは太字にしたり斜め字にしたり、URLを付与させたリンクにする、箇条書きにするなどが可能です。

・button：タップすると指定したURLへ遷移させられるアクションボタンを設定することができます。

・video：動画を入れ込むことができます。iPadに保存されている動画をそのまま使用することはできませんので、YouTubeやvimeoなどのURLを指定してください。

・photo grid：分割写真を入れ込むことができます。iPad内に保存されている写真を複数枚選択してください。

・glidshow：画面をスクロールして表示させる写真を複数枚設定することができます。

step9.

ページを作成したら、画像赤枠部分のアイコンをタップして公開URLを作成します。

カテゴリや作成者名などを設定し「Create public link」をタップすると、公開URLが生成されます。

step10.

生成したホームページを削除する場合は、アプリを起動して画面下部のメニューより「My pages」をタップします。

すると生成したホームページの一覧が表示されますので、削除したい項目の三点アイコンをタップし、表示されたメニューから該当するメニューをタップしてください。

・Delate：iPad上またはWeb上からページを削除する
・Unpublish：生成したページを非公開にする
・Duplicate：生成したページを複製する
・Rename：タイトルを変更する
・Share：メールなどで生成したホームページを共有する
・Preview：生成したページをプレビューして確認する

これで作業は終了です。