【制作記録】架空のハンドメイドカフェのLP

こんにちは、まなてぃです。
受講していたオンラインのデザイン講座(Design Hacks)の課題で作成した成果物の記録です。

「ペライチを利用して、LP(ランディングページ)を作る」という課題に挑戦しました。
よろしければご覧ください！

ペライチというサービスについて

課題としてLPを作成するにあたってペライチというサービスを使用しました。

ペライチというサービスは、あらかじめ用意されたテンプレートやレイアウトを選び、初心者でも簡単にホームページ作成できるツールです。
今回の課題では無料版を使用させていただきました。

【完成品】架空カフェ Handmade Cafe MattariのLP

※本デザイン・LPは架空の店舗です。実在する人物・地名・団体とは一切関係ありません。
写真はフリー素材サイト、またはペライチのテンプレート内に設定されていたデフォルト画像をお借りしています。

制作期間：約7日(アイデア出し・構成・修正期間・添削期間含む)

使用ツール：

• ペライチ(LP作成)
• Adobe Photoshop(ヘッダー画像作成，画像サイズ調整)
• Adobe Illustrator(ロゴ作成，ファビコン作成)

ペライチで公開している作成したページ：
https://peraichi.com/landing_pages/view/samplecafelp12345

制作過程

制作過程についてです。

アイデア出し・構成

作成するLPのイメージを以下のように設定しました。

構成を考えるにあたり、ノートに簡単にイメージをまとめました。
今回はLPの内容・ロゴ・ヘッダー画像・ファビコンなどをオリジナルで作成することに決めました。

作成したオリジナル素材

ロゴを作成する前にロゴの案のラフを描きました。
ここでは、カフェらしくコーヒーカップのイラストを描くことと、カフェのコンセプトとしている「まったり」の文字を英字筆記体で「mattari」と入れることにしました。

完成品は以下のようになりました。

ラフ案に「Handmade Cafe」を足しました。
今後、このお店のロゴをwebサイト以外にもチラシやバナーに載せることを想定した時に、カフェお客さんにぱっと見で何のロゴなのかが分かった方が良いと考えたためです。

ペライチのファビコンは推奨サイズ : 縦32px、横32pxです。
(本ブログ上では拡大表示しているためすこし荒くなってしまっています)
コーヒーカップをイメージし、入れ立てのコーヒーの温かさを表現しました。

ロゴを作成してから、ヘッダー画像の作成を行いました。

ロゴと同じフォントを使いました。
カフェの店内の写真(フリー画像のチョイス)を使用し、LPを見た人へ落ち着きがあり「まったり」できる空間のイメージを与えられるように意識しました。

まとめ

受講していたオンラインのデザイン講座(Design Hacks)の「ペライチを利用して、LP(ランディングページ)を作る」という課題に挑戦しました。
オンラインのデザイン講座(Design Hacks)の課題としては、LP作成が総合課題でした。

架空のハンドメイドカフェページでしたが、LPへの訪問者(カフェの見込み客)にどんな情報を伝えたいか、どういった画像を使用したらイメージを損なわないかなど、たくさん考えることがありました。

デザイン講座の受講は完了となりましたが、これからは実際のデザインのお仕事にもぜひ挑戦していきたいです！

最後までご覧下さり、ありがとうございました。