Works

制作実績

krate:Cre

krate:Cre(クラテクル)

事務所のWebサイトをリニューアルしました。

デザインは、白色をベースにゆったりと余白を取り、コーポレートカラー(ロゴマークが映える夜空の色)で引き締めています。シンプルで見やすいレイアウトにほんの少しだけ遊び心を加えました。サービス内容の詳細ページは、どうしても文字情報量が多くなってしまうため、各サービスにアイコンを配置し、直感的にも伝わるようにしています。

「お知らせ」の投稿や「制作実績」の追加には、CMS(WordPress)を導入しています。(既存テンプレートの流用はせず、本プロジェクトのオリジナルを作成)

「制作実績」では、ブロックエディタにカスタムブロック(サイトのオリジナルブロック)を追加し、カンプデザインやスクリーンショットなどの画像を自由にレイアウトしながら配置できるようにしています。投稿タイプごとに生成する画像サイズを制限し、サーバーへの負荷を抑えています。

ポートフォリオにはログイン機能を設置し、非公開にしています。

サイト種別
Corporate site
担当範囲
  • コンセプト設計
  • 企画・要件定義
  • 進行管理
  • UI/Webデザイン
  • コーディング
  • CMS構築
  • 運用・管理
  • 分析・改善
  • その他
URL
https://kratecre.com
krate:Cre(クラテクル)

メインビジュアルは、夜空にクラテクルのロゴマークの三日月を浮かべました。10年間変わらないクラテクルの名刺のデザインを踏襲しています。背景の流れ星は canvas で描画しています。負荷がかからないように描画領域をウィンドウサイズに合わせて、生成する流れ星の数を制限しています。レスポンシブにも対応しています。シンプルなアニメーションですが、三日月をより印象的に魅せることができました。

krate:Cre(クラテクル)

立場が違うお客さまそれぞれに、クラテクルのサービスを分かりやすく伝えるため、Webコンテンツ制作の作業工程を8つのフェーズに分けて、フェーズごとに作業内容を簡潔にわかりやすくまとめました。また、外部リソースをお探しの方に向けて、と私のスキルや使用ツール、対応の方針についても具体的に掲載しています。

krate:Cre(クラテクル)
krate:Cre(クラテクル)
krate:Cre(クラテクル)
krate:Cre(クラテクル)
krate:Cre(クラテクル)
krate:Cre(クラテクル)
krate:Cre(クラテクル)