Loading Animation
0
Loading...
Design
nikkunがUI/UXに込める思い
nikkunの思うUI/UX
UI/UXデザインは、単に画面を美しく整えたり、アニメーションで目を引いたりするだけの作業ではありません。
その本質は、プロダクトに触れたユーザーの「感情」がどのように動き、どのような体験を持ち帰るか、設計することだと考えています。
AIをはじめとする記述・開発ツールの進化により、現代は「形を作る」ことのハードルがかつてないほど下がりました。
だからこそ、これからの時代は「なぜその形にしたのか」という、モノを作る前段階の意図の設計にこそ価値が宿ると考えています。
機能を届けるだけなら、優れたUIは数多く存在します。
しかし、人の記憶に残る、もう一度使いたいと感じる体験は、機能だけでは生まれません。
誰かがプロダクトを通じて何かを始めたくなる、未知の世界へ踏み出したくなる瞬間。
その小さな感情の変化を設計することが、私にとってのUI/UXデザインです。
nikkunのデザイン設計とその原点
私は昔からゲームが好きでした。
タイトル画面や最初に流れるBGM。まだ見たことのないステージ。
そこにいるだけで、「この先には何があるんだろう」と気になり、自分から先へ進みたくなる。
私はゲームが生み出す、この感覚に魅力を感じています。
そのため私のデザインでは、
もっと見たい。知りたい。実際に触れてみたい。
そうした興味が自然に次の操作へつながるような設計を目指しています。
情報を分かりやすく伝えることを前提に、ユーザーが自分から先へ進みたくなるきっかけを作る。
私は、プロダクトに触れる人の好奇心を次の行動へつなげるようなデザインを設計していきます。
Design Example 1
UI Design Example
Button UI Design
Content Container UI
nikkun Portfolioに込めた世界観
nikkun Portfolioは、これまでの成果物を並べるだけのサイトではありません。
私の価値観や制作への向き合い方を、一つの体験として表現することを目指しました。

サイト全体には、ゲームを連想させる構造やデザインを取り入れています。
経歴はステージ選択画面のように。背景は場所を探すセレクト画面のように。ボタンは次のページへ進む入口のように設計しています。
ページを順番に読むだけではなく、サイトの中を自分で進んでいるように感じられる構成を考えました。

私は人生を、ゲームのように捉えることがあります。
そして、その人生において、誰もが自分の物語を紡ぐ"プレイヤー"だと考えています。
人によってスタート地点や目標は異なり、その先で経験することも変わります。
だからこそ私は、さまざまな人生のプレイヤーが自分の物語を次へ進める、その「きっかけ」を作れる存在でありたいと考えています。

このサイトのレイアウトやアニメーションも、そうした考えから設計しました。
操作に迷わないことを前提に、その先を見たくなるきっかけを加える。
nikkun Portfolioでは、分かりやすさと世界観が両立するデザインを目指しています。

以下は、その一例です。
Button UI Design Detail

設計され抜いた「Button」

ボタンは、ユーザーが操作する上で最も重要な要素の一つです。
ボタンは大小用意されており、重要度に応じて使い分けられています。
また、ユーザーの思考を妨げないシームレスなフィードバックを実装しています。
UI Design Example Detail

統一感を追求したデザイン

コンテンツ全体で統一感の出るように、
角の丸みや色、状態などのデザインを統一しました。
アニメーションや動きも一定の統一性を持たせています。
Design Texture Detail

質感/物理法則のあるUI

UIに物理的な重みや弾力性を持たせることで、
操作に対する直感的な納得感を付与しています。
触れれば物理法則に則った自然なフィードバックを得ることができ、
例えばトグルスイッチは、壁に跳ね返るようボールのような弾力のある動きをします。
ユーザーに、明確な状態変化と心地よさを同時に提供します。
Variable Fonts Example

バリアブルフォントによる表現

バリアブルフォントは近年活発的に活用され始めてきた技術です。(この技術自体は2016年から存在しました。)
バリアブルフォントは、従来の太字やイタリック体と異なり、
より細かな制御、変形ができ、状態や量をわかりやすく表現することが可能です。
当サイトのロード画面にも使用しています。
Variable Fonts Example

アクセシビリティへの配慮

ぼかし、影、アニメーションなど、視覚効果は魅力的です。
ただしこれらはデバイスに負荷をかけ、かつ万人が受け入れるものではありません。
そこで、このポートフォリオではメニュー内に「視覚効果を減らす」設定トグルを追加。
より幅広い層が閲覧しやすいWebサイトを構築しました。
Variable Fonts Example

刷新されたバックグラウンドデザイン (新規)

2026年7月以前、このポートフォリオにはまだ何かが足りていないと感じていました。
結果的に、コンテナやフッター、メニューなどの背景がシンプルすぎたのが原因だとわかりました。
そこで2026年7月以降、より魅力的で、ゲーム感を感じられる新デザインに刷新しました。
単色に比べて高級感があり、カードやデジタルを連想しやすいデザインになっています。
UI/UXデザインの将来
私が作りたいのは、見た目や使いやすさだけで終わるUIではありません。
その先にある、

「何かを始めてみたくなる体験」

です。
幼い頃、3DSの電源を入れたときに感じた、新しい世界が始まる感覚。
それは今でも、私がデザインを考える上での原点になっています。

情報を分かりやすく届けながら、その先を見たいと思えるきっかけを作る。
私はこれからも、誰かが次へ進むきっかけとなり、その人のゲームを“スタートさせる”ような体験をデザインしていきます。

Thanks for reading — nikkun