キガミッツ

キガミッツのトップ画像

ディレクション

UI/UXデザイン

Framer実装

[1]

Overview

デザイン事務所キガミッツの移転に伴う、コーポレートサイトの全面リニューアルを担当。旧サイトの課題であった情報への到達性を解消するため、デザインと実装の両面から、ポートフォリオとしての機能性を最大化させる再構築を行いました。

[2]

Goals

ミニマルな美学に基づき、クリエイティブを主役にするためのノイズレスなUI設計。社名の由来である「木」をモチーフにした幾何学的なシンボルをトップページに象徴的に配置。これをサイト全体の中心要素とすることで、抽象的ながらも一貫性のあるブランド体験を構築しました。ページ間の障壁をなくし、ユーザーがストレスなく実績を閲覧できる動線設計。

[3]

Insights

ユーザーの閲覧体験を妨げないよう、ローディングアニメーションの表示頻度を1度限りに制御。また、作品詳細ページでは、ユーザーの自然な垂直スクロールを水平方向の動きへと変換するインタラクションを採用しました。これは、既存のスクロールという慣習を維持しつつ、ポートフォリオとしての新鮮な視覚体験を提供するための設計です。

[4]

Outcome

更新しやすくするため、柔軟なCMS設計を導入。スピード感のあるローディング演出や、現在地を明示するナビゲーション設計により、デザイン事務所の美意識に相応しい、高精度でストレスフリーなデジタル体験を実現しました。

コンテンツ画像

キガミッツ

キガミッツのトップ画像

ディレクション

UI/UXデザイン

Framer実装

[1]

Overview

デザイン事務所キガミッツの移転に伴う、コーポレートサイトの全面リニューアルを担当。旧サイトの課題であった情報への到達性を解消するため、デザインと実装の両面から、ポートフォリオとしての機能性を最大化させる再構築を行いました。

[2]

Goals

ミニマルな美学に基づき、クリエイティブを主役にするためのノイズレスなUI設計。社名の由来である「木」をモチーフにした幾何学的なシンボルをトップページに象徴的に配置。これをサイト全体の中心要素とすることで、抽象的ながらも一貫性のあるブランド体験を構築しました。ページ間の障壁をなくし、ユーザーがストレスなく実績を閲覧できる動線設計。

[3]

Insights

ユーザーの閲覧体験を妨げないよう、ローディングアニメーションの表示頻度を1度限りに制御。また、作品詳細ページでは、ユーザーの自然な垂直スクロールを水平方向の動きへと変換するインタラクションを採用しました。これは、既存のスクロールという慣習を維持しつつ、ポートフォリオとしての新鮮な視覚体験を提供するための設計です。

[4]

Outcome

更新しやすくするため、柔軟なCMS設計を導入。スピード感のあるローディング演出や、現在地を明示するナビゲーション設計により、デザイン事務所の美意識に相応しい、高精度でストレスフリーなデジタル体験を実現しました。

コンテンツ画像

キガミッツ

キガミッツのトップ画像

ディレクション

UI/UXデザイン

Framer実装

[1]

Overview

デザイン事務所キガミッツの移転に伴う、コーポレートサイトの全面リニューアルを担当。旧サイトの課題であった情報への到達性を解消するため、デザインと実装の両面から、ポートフォリオとしての機能性を最大化させる再構築を行いました。

[2]

Goals

ミニマルな美学に基づき、クリエイティブを主役にするためのノイズレスなUI設計。社名の由来である「木」をモチーフにした幾何学的なシンボルをトップページに象徴的に配置。これをサイト全体の中心要素とすることで、抽象的ながらも一貫性のあるブランド体験を構築しました。ページ間の障壁をなくし、ユーザーがストレスなく実績を閲覧できる動線設計。

[3]

Insights

ユーザーの閲覧体験を妨げないよう、ローディングアニメーションの表示頻度を1度限りに制御。また、作品詳細ページでは、ユーザーの自然な垂直スクロールを水平方向の動きへと変換するインタラクションを採用しました。これは、既存のスクロールという慣習を維持しつつ、ポートフォリオとしての新鮮な視覚体験を提供するための設計です。

[4]

Outcome

更新しやすくするため、柔軟なCMS設計を導入。スピード感のあるローディング演出や、現在地を明示するナビゲーション設計により、デザイン事務所の美意識に相応しい、高精度でストレスフリーなデジタル体験を実現しました。

コンテンツ画像