Works

ポートフォリオサイト サムネイル画像

Omoka(当サイト)

https://omoka.site

概要

カテゴリ
ポートフォリオサイト
担当範囲
デザイン / コーディング / WordPress化
使用ツール
Illustrator / Photoshop / WordPress / Google Analytics
制作期間
1ヶ月
費用
¥200,000

制作のPOINT

メインビジュアルでは「想い」を淡い円で表し、その「想い」が広がり、相手に響く(伝わっていく)感じをグラデーションとアニメーションで表現しました。そして、メッセージが強調されるようにロゴの図形を文字(『カタチに』)の上に施しました。また、ロゴの図形を見出しにも加えることで見出しを目立たせつつ遊び心を加えました。
ServiceやAboutの箇所には歪んだ丸用いて、子ページフッターにはグラデーションを入れることで、全体的に柔らかく優しい雰囲気に仕上げました。
自分の人柄や強み、実績を伝え、お問い合わせ・ご依頼を頂くことがサイトの目的であるため、CTAのContentは目立つように横幅いっぱいに背景色を入れております。
Aboutの詳細ページのプロフィール写真にはオレンジの背景色をずらして置くことで、右側のカラムへ視線がいくように誘導しています。
制作実績の画像をホバーするとその実績のConceptが表示されるようにすることで、詳細ページを見てみたいと思ってもらえるように工夫をしました。また、子ページには「話を聞いてみる」ボタンを置き、話しかけやすい雰囲気(問合せしやすい雰囲気)を出しました。

サイトのキーワード

ポートフォリオで伝えたい印象が、話しかけやすい、安心感、信頼感、明るい気持ちにさせる、であったため、サイトのキーワードを「柔らかな」「清らかな」「元気」と決めデザイン制作いたしました。

カラーの意図

ベースカラー:#ffffff(清潔さ、明るい印象)
メインカラー:#e3dec3(安心感、穏やか、落ち着き、温もりの印象を与え、話しかけやすい雰囲気に)
アクセントカラー:#d8a380(親しみ、フレンドリー、温かい、元気な印象)

フォントの意図

フォントは丸ゴシック体を用いて柔らかな印象を与えつつ、直線や曲線が素直できれいなサンセリフ体で清らかな印象を与えることを意図としています。

キャプチャー

ポートフォリオサイトキャプチャー(PC)ポートフォリオサイトキャプチャー(SP)

一覧に戻る