DEMO SITE

「坐修寺について」のセクションでは事業内容をお好きなだけ増減が可能なので、たくさんの取り組みをされているお寺・神社、企業などにとってピッタリの構成になっており、さらにマウスカーソルを当てる（ホバー）ことでその事業の詳細文章を掲載することが可能です。

ホバーで表示されるのちょっとしたオシャレにもなります。

また、タイムスケジュールが記載可能なので、お勤めや会社の一日の流れを明記することで、ユーザーにどんな企業かを具体的にイメージしてもらいやすくなるでしょう。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

さらに、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「PRODUCTS」と「LINEUP」のセクションではブロックをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成になっており、さらに「LINEUP」閲覧時の横スクロールアニメーションがスタイリッシュさを際立たせてくれます。

丸いボタンをホバーしたときの矢印のアニメーションもちょっとしたオシャレになります。

また、「LINEUP」すぐ下のギャラリーで多くの写真が掲載可能なので、商品やサービスなどの具体的なイメージを掲載することで、ユーザーにどんな商品やサービスかを具体的にイメージしてもらいやすくなるでしょう。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「CONCEPT」のすぐ下に問題提起のセクションが設けられており、問題解決に繋がるように事業内容が展開されるので、何かの悩みを持ったユーザーに対して的確な解答をもたらしてくれることでしょう。

「WORK」のシェイプが表示され消えてからコンテンツが表示されるアニメーションが、特にこだわっているセクションだということユーザーへ示しくれます。さらに、「WORK」のセクションではブロックをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

また、「VOICE」では実績として増減可能なお客様の声を掲載可能なので、商品やサービスなどの具体的な感想を掲載してもらうことで、ユーザーに信用してもらい後に続くお問い合わせ（コンバージョン）へよ繋げることができるでしょう。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「CONCEPT」の文章の横には、複数枚の画像をあえて「ずらし」テクニックを入れて配置したことでNordicの持つデザインのコンセプトを、ユーザに伝えることが可能です。

「ABOUT」のセクションではブロックをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。
また、英語と日本語の両方を掲載することでシンプルな多言語化対応すらも実現が可能です。

「PRODUCTS」では、縦長の写真を使用して、デザイン全体のスタイリッシュさと商品の雰囲気の両方を損なうことなくユーザーに伝えることが可能です。また、商品名も日本語と英語両方を掲載が可能です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「つくしえみとは」の上部に画像にずらしを入れて小さめに配置し、ファーストビューの背景色と統一することで、ユーザーに一貫したテーマを伝えることが可能です。

「つくしえみのコース内容」のセクションではブロックをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

また、横スクロールを任意にできるように設計しているので、ユーザーに押し売りを感じさせない雰囲気を伝えることが可能です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「事業紹介」では、各要素をスライダー形式で大きく見せることで、ユーザーに多くの事業内を紹介することが可能であり、多くの事業内容を適切な文章で紹介することで、実績と信頼をユーザーへ伝え、「この企業なら安心して任せたい」と思ってもらえることでしょう。

「製品紹介」のセクションでも、「事業紹介」同様で、ブロックをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

また、「求人情報」というセクションも設けているので、求人サイトとしても活用を検討されている方へも相性が良いでしょう。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「事業紹介」では、各要素をスライダー形式で見せることで、ユーザーに多くの事業内を紹介することが可能であり、多くの事業内容を適切な文章で紹介することで、実績と信頼をユーザーへ伝え、「この企業なら安心して任せたい」と思ってもらえることでしょう。

「ギャラリー」のセクションでも、「事業紹介」同様で、アイテムをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「CONCEPT」では、縦書きのコピーを取り入れることで、クライアントの理念をユーザーへ印象的に伝えることが可能です。
また、横書きも合わせて記載可能なので自然感溢れるイメージをふんだんに取り入れております。
「COMMITMENT」では、各要素をスライダー形式で見せることで、ユーザーに多くの事業内容に対するこだわりを紹介することが可能で、敢えて1画面内に収まるようにレイアウトすることで、こだわりをしっかりユーザーへ伝えつつ、引き締めるデザイン上の役割もになってくれることでしょう。
「PRODUCTS」のセクションでも、「GROW」同様で、アイテムをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

また、全体的に程よい自然の抜け感を感じれるように画面左側には、白の帯状のスペースを開けており、そちらに小さめのテキストを配置できるようにしていますので、ちょっとしたおしゃれにもなるように配慮しております。
会社概要で使用されているボーダーは、ただモノトーンの線を引くだけでは味気がないので、アクセントカラーを項目部分にだけ引くことで程よいアクセントを加えております。
会社概要のすぐ下にリクルートのバナーを設置しており、外部サイト（自社リクルートサイトや外部ECサイトなど）と連携させたい場合はこのセクションを利用してリンクさせることが可能です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

「CASE」では、各要素を横スクロールアニメーションで見せることで、ユーザーにしっかり見せたい実績を紹介することが可能です。敢えて1画面内に収まるようにレイアウトすることで、技術力の高さもユーザーへ伝えつつ、引き締めるデザイン上の役割もになってくれることでしょう。

「OUR WORKS」のセクションでは、アイテムをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

また、全体的に程よい自然の抜け感を感じれるように画面左側には、白の帯状のスペースを開けており、そちらに小さめのテキストを配置できるようにしていますので、ちょっとしたおしゃれにもなるように配慮しております。

会社概要で使用されているボーダーは、ただモノトーンの線を引くだけでは味気がないので、アクセントカラーを項目部分にだけ引くことで程よいアクセントを加えております。

会社概要のすぐ下にリクルートのバナーを設置しており、外部サイト（自社リクルートサイトや外部ECサイトなど）と連携させたい場合はこのセクションを利用してリンクさせることが可能です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

ファーストビュー以降へスクロールすると、ロゴのサイズが少し小さくなるアニメーションを設定しており、ちょっとしたオシャレにもなります。こうしたさりげなさが必要以上にユーザーへアピールし過ぎないように配慮した、適度な演出となります。

「MENU」のセクションでは、アイテムをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。

また、全体的に、背景にノイズを加えたテクスチャを敷くことで程よいレトロ感を加え、単調にならないようにして工夫しております。

さらに、アルバイトなどの採用を考えているクライアントにも配慮し、ある程度の求人セクションとしても問題なく使用可能なよう、会社概要の後にリクルートのセクションを用意して、大きめの写真を掲載し、クライアントの店舗の雰囲気をユーザーに具体的なイメージでわかってもらえるようにしております。

外部サイト（自社リクルートサイトなど）と連携させたい場合はこのセクションを利用してリンクさせることも可能です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

ファーストビュー以降へスクロールすると、ロゴのサイズが少し小さくなるアニメーションを設定しており、ちょっとしたオシャレにもなります。
こうしたさりげなさが必要以上にユーザーへアピールし過ぎないように配慮した、適度な演出となりますし、ナビゲーションも上部に固定することでいつでも好きなコンテンツに遷移することが可能です。
ちなみにファーストビューでは背景にパーティクル（水玉模様）を散らばすことで賑やかさも適度に表現しております。

さらにCV（コンバージョン）へと誘導するボタンを設けているので、興味を持ったユーザーへの、資料のダウンロードやお問い合わせをしたいという気持ちにも配慮しております。

「FUNCTION」のセクションでは、アイテムをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。
「MISSION」のセクションでは、図の背景部分の丸いボーダーを回転させていることで、単調にならないように適度にアクセントをつけております。
さらに、「CASE STUDY」のセクションでは、導入を考えている企業の後押しをするために、会社名のロゴをスライド式で見せるように設計することで、サービスの信頼性を高めております。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。

ファーストビュー以降へスクロールすると、ロゴのサイズが少し小さくなるアニメーションを設定しており、ちょっとしたオシャレにもなります。
こうしたさりげなさが必要以上にユーザーへアピールし過ぎないように配慮した、適度な演出となりますし、ナビゲーションも上部に固定することでいつでも好きなコンテンツに遷移することが可能です。

ちなみにファーストビューでは、英語のタイポグラフィをオーバーレイ（文字色を背景写真に溶け込ませる手法）を使用することで、必要以上に強調させず程よい演出になります。
さらにCV（コンバージョン）へと誘導するボタンを画面右側（スマホ版では画面最下部に追従）に設けているので、求人内容に興味を持ったユーザーへの、エントリーをすぐにしたいという気持ちにも配慮しております。

「BUSINESS」のセクションでは、アイテムをお好きなだけ増減が可能なので、たくさんの商品やサービスを展開されている企業などにとってはピッタリの構成です。
「INTERVIEWS」のセクションでは、先輩社員の声を大きく取り上げつつ、1日のスケジュールも合わせて紹介することで、具体的な情報を得られ、これからエントリーしょうかを考えているユーザーにとっては、親切な設計になっております。

さらに、「MACHINE」のセクションでは、企業が保有している機材の説明を、テキストベースにてシンプルに紹介できるようにしており、もちろんアイテム数は増減可能です。

スマートフォンサイズでは、各コンテンツでPCサイズと共通の画像を使用しており、無駄の少ないレスポンシブ設計にしており、Webサイトとしてクオリティを凝縮させております。

そして、カラム数を1カラムにすることで小さい画面でもはっきりとコンテンツを閲覧できるように配慮しております。