ソトリスト様 サイトデザイン
カテゴリー: ウェブデザイン
サイトデザイン
DUNK（ダンク）／ダイビングショップ
ハイアットリージェンシー瀬良垣 アクティビティ
ハイアットリージェンシー瀬良垣 レストラン
client ／ Hyatt瀬良垣 レストラン
Planner ／ 株式会社URAKATA
Coder ／ TOGUCHI
Lanch ／ 2019.06
ハナサキマルシェ
株式会社コーカス
社会保険労務士法人エール_webdesign案
企業の特性から信頼・安心などをイメージさせるよう、明朝体を文字に使用しています。
メインビジュアルは、キャッチがインパクトあるので、元気が出る配色にしました。
「激変する労務管理 企業の不安を安心に。エールの顧問契約」
見出しはアイコンなどもデザインし、視線の導線が一度とまるように少し目立つ感じでデザイン。
詳しくはこちらのボタンは見出し配下に配置。
背景には街のシルエットをデザインし、親近感ある企業を演出しております、
「チームで企業経営をサポートします」
見出し→コンテンツと流したほうがレイアウト的に良かったので、
「新しい案件、複雑な相談もチームエールは議論が活発です。お客様の課題を共有しチームでバックアップします
」こちらの文言は割愛しています。
各カテゴリ毎にバナーっぽくデザインし、リンクできるコンテンツというのが分かるよう配慮しています。
「お知らせ・セミナー情報・今月の特集」
ラフでは右に写真とのことでしたが、背景に写真を配置しキレイに収まるようレイアウトしております。
「会社案内」
こちらはリンクできるのがわかるように正方形でキレイにレイアウト。
「MAP」
全体で表示するデザインにし、地図下部分の邪魔にならない箇所にボタンをレイアウト。
配下に説明文・SNSバナーを配置。
ラフにありましたバナーはこちらで一度デザインしています。
「フッター」
背景にはコンテンツ部分でも一度デザインで利用した街並をフッター部分でも利用し親近感あるデザインに。
コピーライト下のは、常時表示のバナーデザインです。
常時出ている要素なので、コンテンツなどを邪魔しないようにシンプルにデザイン。
歯科院専門コンサルティングWEBデザイン
Design
コンセプト
メインは動画で動きのあるビジュアルなので、邪魔しない程度のナビゲーションを配置。
キャッチの背景にはロゴで使用されているカラーを引用して統一感あるデザインにしてます。
「クライアントの声」
画像にホバーすると再生アイコンを表示しシンプルデザインにし、
クリックすると動画が再生されるようなイメージでデザインしています。
「サービス」
視覚導線に沿ったリズムあるレスポンシブなレイアウトにしています。
「ブログ」
スライド式でAUTOで流れてもアリなのかなと思います。
「採用情報」
Recruitの有料素材を利用しています。
キャッチーなテキストなのでインパクトあるデザインです。
「MAP」
MAPはフル幅で配置しています。
日本酒通販サイトトップページデザイン
▼デザインコンセプト
メインビジュアルは日本酒とファーストビューでわかるように、
稲穂を背景に、こだわりのある選別という意味も込めてデザインしています。（デザインパターンを2案提案致します。）
メイン下部の方にグローバルナビを配置していますが、スクロールするとヘッダー部分にロゴとナビゲーションが固定されるイメージです。
メイン右上にLanguage選択として日本語とEnglishを配置しています。
見出し部分には日本酒をイメージしたアイコンを配置しデザインしています。
コンテンツ部分は当方で勝手に構成を配置しているので、ラフがあれば柔軟に修正いたします。
商品一覧部分のリンクカラーは「鉄紺色」を配色しています。
日本酒のイメージと合うと思いデザインしました。
日本酒一覧はAUTOスライドするイメージです。
新着は左上に「new」アイコンが付属します。
ホバー時はカートに入れるボタンは若干薄くホバーします。
日本酒の画像の方は、抜粋した商品説明とテキストリンクで商品詳細ページへ遷移します。
デザイン案1
デザイン案2
ガテン系 求人WEBサイトデザイン
コンセプト
ガテン系の職種にフォーカスした求人サイトとの事ですので、インパクトあるパンチ力のある
メインビジュアルにあげております。
サイトカラーは既存サイトのイエローをベースに反対色として映える青紫を薄くした色をメインに配色しています。
メインビジュアルの右側にMAPと既存の区域をボタンクリックで遷移するように使いやすいよう考慮しています。
左側のキャッチ＆イラストでファーストビューで求人サイト・元気のあるサイトを訴求しています。
また、ロゴ部分はh1（SEO）にも考慮しています。
既存の「勤務地から探す」コンテンツがメインに配置し、
「職種から探す」コンテンツは、メイン下部に「希望条件で探す」の内容を
カテゴライスし、「業種から探す」「こだわりの条件から探す」を検索枠として設けています。
footer部分は、ガテン系のお仕事が支えているビル群をデザインとして落とし込んでいます。
デザインコンセプト（求人一覧ページ）
会社名と求人内容をtitleにしています。
正社員などのアイコン要素はそのまま引用し、
検索者としては気になる部分の給与と勤務地をファーストビューで認識できるように項目表示してます。
詳細をみるボタンで記事ページへ遷移します。
デザインコンセプト（求人詳細ページ）
情報が多くなるページですので、スッキリ見せたく余白などを多めに取り視認性の確保を優先にデザインしています。
ページ内にある写真はスライドで全て表示するようにしています。
歯科院デザイン改修案
歯科院デザイン改修案
コンセプト
「Header」「main」
メインビジュアルはスライドするイメージで、曲線的な柔らかい感じ（アットホームな雰囲気の写真素材でしたので）を出しています。
スライドする写真に少し被るような感じで既存のサイトのキャッチを引用してデザインしています。
またファーストビューで認識できるように歯のイラストもデザインしています。
「コンテンツ：BLOG」
全体的に画像が多様されているので、スッキリさせるため文字のみでリンク先に遷移するようにデザインしています。
「コンテンツ：当院は小児歯科に力を入れています!」
トップはサイトマップ的な要素で組みこむとの意とは若干ずれてしまうようですが、
歯科院の強みとしてLP的な要素として強み部分（小児歯科）をフォーカスしています。
buttonはゴーストボタンで全体の邪魔をしないスッキリしたデザインにしています。
「コンテンツ：診療科目」
このようなお悩みの要素と診療科目の要素が近いので、サイトマップ的な要素作りとしてユーザーが使いやすいように「写真」と「見出し文字」でデザインしています。
「MAP」
横幅全表示でデザイン。
「footer部分」
背景に院内写真を薄く表示し、テキストリンクを配置しております。