大阪市中央区の不用品・粗大ゴミ回収業者オーケー 家具家電や廃品を処分

MV

全体的なレイアウト

一般的なコピー左、具体的イメージを伝える写真が右、訴求ポイントに順位を付けて散らすというレイアウト

メインコピー部分

ドン！とデカ太文字で訴求ポイントを記載

文字色・テキストの上の点で訴求ポイントに順位を付けて明確に提示

フォントは「源暎エムゴ」フリーフォント使ってるの初めてみた

白フチはヤケクソみたいな量のtext-shadowで実装してある。

text-shadow: rgb(255, 255, 255) 7px 0px 0px, rgb(255, 255, 255) 6.92869px 0.996602px 0px, rgb(255, 255, 255) 6.71622px 1.9729px 0px, rgb(255, 255, 255) 6.36692px 2.909px 0px, rgb(255, 255, 255) 5.8879px 3.78584px 0px, rgb(255, 255, 255) 5.28893px 4.58555px 0px, rgb(255, 255, 255) 4.5822px 5.29183px 0px, rgb(255, 255, 255) 3.78212px 5.8903px 0px, rgb(255, 255, 255) 2.90498px 6.36876px 0px, rgb(255, 255, 255) 1.96865px 6.71747px 0px, rgb(255, 255, 255) 0.992221px 6.92932px 0px, rgb(255, 255, 255) -0.00442571px 7px 0px, rgb(255, 255, 255) -1.00098px 6.92806px 0px, rgb(255, 255, 255) -1.97715px 6.71498px 0px, rgb(255, 255, 255) -2.91303px 6.36508px 0px, rgb(255, 255, 255) -3.78956px 5.88551px 0px, rgb(255, 255, 255) -4.58889px 5.28603px 0px, rgb(255, 255, 255) -5.29472px 4.57885px 0px, rgb(255, 255, 255) -5.89269px 3.77839px 0px, rgb(255, 255, 255) -6.3706px 2.90095px 0px, rgb(255, 255, 255) -6.71871px 1.96441px 0px, rgb(255, 255, 255) -6.92995px 0.98784px 0px, rgb(255, 255, 255) -6.99999px -0.00885142px 0px, rgb(255, 255, 255) -6.92743px -1.00536px 0px, rgb(255, 255, 255) -6.71372px -1.98139px 0px, rgb(255, 255, 255) -6.36324px -2.91705px 0px, rgb(255, 255, 255) -5.88311px -3.79328px 0px, rgb(255, 255, 255) -5.28313px -4.59223px 0px, rgb(255, 255, 255) -4.57551px -5.29762px 0px, rgb(255, 255, 255) -3.77466px -5.89507px 0px, rgb(255, 255, 255) -2.89692px -6.37243px 0px, rgb(255, 255, 255) -1.96016px -6.71995px 0px, rgb(255, 255, 255) -0.983458px -6.93057px 0px, rgb(255, 255, 255) 0.0132771px -6.99999px 0px, rgb(255, 255, 255) 1.00974px -6.92679px 0px, rgb(255, 255, 255) 1.98564px -6.71247px 0px, rgb(255, 255, 255) 2.92107px -6.36139px 0px, rgb(255, 255, 255) 3.797px -5.88071px 0px, rgb(255, 255, 255) 4.59557px -5.28022px 0px, rgb(255, 255, 255) 5.30051px -4.57215px 0px, rgb(255, 255, 255) 5.89746px -3.77094px 0px, rgb(255, 255, 255) 6.37426px -2.89289px 0px, rgb(255, 255, 255) 6.72119px -1.95591px 0px, rgb(255, 255, 255) 6.93119px -0.979076px 0px;

文字の上の点もcssで書いてある…！

大阪市中央区

に対して、

.dots {
    background-image: radial-gradient(circle at center, #e7605e 20%, transparent 20%);
    background-position: top right;
    background-repeat: repeat-x;
    background-size: 1.05em 0.25em;
    padding-top: .4em;
}

フリーフォントな分、「！」マークの行間とかイマイチな印象

スタッフの写真

こういうちゃんとしたスタッフの素材があるサイトっていいよなぁ…。

三つのアイコン部分

全体的にフラットな印象のデザインに合わせて、輝き方などが若干マイルドめな金色、若干グラデーションが入った白文字に黄色の星、白い円で括って、ギザギザのフチ、こういうのってなんて呼ぶんだろう。

影が入ってる、透過pngだから普通の影。背景の写真でも立たせたい写真には影が入ってる。

背景の写真

丸でトリミングしたものをスタッフの後ろに配置、写真関係はまとめて訴求って感じなのかな？

白フチは無いとデザイン的に寂しかったからだと思われる。

「年中無休」「迅速＆丁寧」は背景の色の薄さに対して絶対負けないので何の処理もせずに配置。デザインのメリハリっていう意味でも強い色が良い機能になってるかなと思う。

問い合わせ実績ラベル

ここはおそらくペロッと一本で置くとつまらない＆コンテンツとしての区切りを付けて理解をさせやすくする目的で、真ん中で折れ曲がったラベルを使用している。

数字を立たせたいから赤字、意味合いとして「以上」にも目を行かせたいから黄色マーカーをそこまで引いている
→やっぱりマーカーで線引くのってそんなに悪くないんだな。

背景

メインカラーの赤色にくすみのトーンをあわせているが若干明るめの青色で青空を作っている。

背景には町のイラスト、町に根付いたサービスだよ、という印象

空の上に改修するものをカラフルに散らして、町の不用品改修だよ、という意味合いをフワッと伝えてくる。

各不要分の背景のカラーは若干濃いめでくすみ方は同じ感じ

丸でトリミングした写真の上には、斜めボーダー透過の円を被せて、ちょっと目立たせてある、こういったちょっとでも目立たせる様な意味合いの工夫は大事だなぁと思う。

MV下の口コミの部分

赤ベタだとちょっと埋もれそうかな、という判断かな、斜めボーダーを被せてちょっとだけ目立たせてある。

情報の優劣も、黄色文字＋点、黄色文字、白文字で順位付け。口コミの数は一番少なめ

文字横のborderは無しでも成立しそうな気もするけどダメ押しで追加してる感じかな？

なんか見てたらそこまでセンスあるか不安になってきたのでこのくらいにしておく