CASE STUDY 04
自主制作
コーポレートサイト
HTML / CSS / JS

匠建設株式会社

企画・デザイン・コーディング

https://hiro329biz-cpu.github.io/Architectural-site/

匠建設株式会社のPC・スマートフォンモックアップ — DESKTOP / MOBILEHTML / CSS / JS

PROJECT DETAILSCASE STUDY 04 / 匠建設株式会社

匠建設株式会社 / CASE STUDY

43°03′N / 141°21′E

実績の強さを、企業の信頼へつなぐ。

SURFACE

実績を主役にした構成

施工現場の写真を大きく見せ、技術力と事業規模を直感的に伝えました。

PATH

複数事業を明快に整理

建築・土木・住宅の各事業を番号と写真で分け、目的の情報へ進みやすくしています。

SYSTEM

信頼から相談へつなぐ導線

会社情報、実績、ニュースを経て問い合わせへ進む、納得感のあるページ順序を設計しました。

TYPE自主制作 / Individual project
ROLE企画・デザイン・コーディング
TEAM1 person / 全工程を担当
STACKHTML / CSS / JavaScript / Responsive / Information Design
DEVICEResponsive

VIEW LIVE SITE ↗

IMPLEMENTATION NOTE

実装・検証内容

HTML・CSS・JavaScriptでコーポレートサイト全体を実装
事業案内、施工実績、ニュース、問い合わせを用途別に構造化
写真量の多い構成でも情報を追いやすいレスポンシブ設計
PC・スマートフォンの主要幅でナビゲーションと導線を確認

匠建設株式会社のPC版全体デザイン — 01DESKTOP1440px VIEW

匠建設株式会社のスマートフォン版全体デザイン — 02MOBILE390px VIEW