ランディングページ制作:UHOLABO様

OVERVIEW

新商品のランディングページ制作

YEAR 2020

■使用ツール

Adobe XD、Illustrator、Canva

■言語

HTML、SCSS、CSS、jQuery、WordPress

■制作期間

2021年1月〜2月

■担当

デザイン、コーディング、ライティング、サーバーアップ

■制作概要

1. 目的

SNSからWebサイトにくることを想定して、『どんな製品なのか、どんなことができるのかをできるだけ分かりやすく伝える』ということが目的

2. トーン&マナー

シンプルなサイトがいいという要望を頂いていたので、ベースは白・黒・グレーを使い、アクセントカラーとしてロゴのハートマークの赤色を使用しました。ロゴがカジュアルでしたので全体的にカジュアルに仕上げました。

3.制作の流れ

AdobeXD:ワイヤーフレーム、デザインカンプ作成

Canva/AdobeIllustrator:画像加工

ローカル環境:LocalbyFlywheel

コーディング:html/SCSS/CSS/jQuery/WordPress

■まとめ

今回制作させて頂いたランディングページは短めのものでしたが、メインビジュアルはどんなものがいいのか、どんな配置でセクションを並べるのが良いのか、ボタンの配置や大きさなど、実際にデザインを作っていくことで多くのことを考えながら作って行く必要があると感じました。コーディングでは、YouTubeを埋め込むjQueryのライブラリを初めて使用しました、少し問題がおきましたが調べながら作っていくことで解決することができました。


WEBSITE