UI/UX Designer
Yuki Nishimura

This is my design portfolio

Skills

私にできること

UI Design

  • Figma

    オートレイアウト、変数、コンポーネント/Variants を活用し、拡張性・一貫性を備えたデザインシステムと UI ライブラリを設計・運用できる。

  • 情報設計

    要件や行動フローをベースに、情報・アクションの整理やオブジェクトモデリングを用いて、サービス全体の画面構造(階層・ナビゲーション・遷移)を体系的に設計し、 UIの骨格となるワイヤーフレームを合理的かつ一貫性のある構造として構築できる。

  • ビジュアルデザイン

    サービスの性質やコンセプトに基づくトンマナ策定や、HIG/Material Design に準拠した設計を行い、視線誘導・可読性・操作性に配慮したUI設計ができる。

  • プロトタイピング

    インタラクションや遷移を備えたプロトタイプを構築し、操作性・設計意図を的確に共有するための検証用アセットとして運用できる。

UX Design

  • ユーザー理解

    ユーザーの行動特性・目的・課題を正確に把握するためのインタビューや簡易リサーチを実施し、 得られた知見を設計の根拠として整理・活用できる。

  • 競合・市場リサーチ

    類似サービスのフロー・情報構造・UIパターンを分析し、共通原則や差別化要素を抽出。 ユーザビリティや業界特性の観点から、設計判断に必要な示唆を得ることができる。

  • 企画・コンセプト定義

    リサーチ結果を基に、サービスの価値提供・体験ゴール・主要タスクを言語化し、 UI/UX設計の方向性となるコンセプトを一貫性のある形で定義できる。

  • 要件定義

    ユーザーの課題やニーズを調査から明確化し、プロダクトの目的やビジネス上の目標と照合しながら、必要な機能要件・非機能要件へ整理できる。

Web Design

  • 対応領域

    コーポレートサイトやサービス紹介のLPを対象に、企画・設計・デザイン・実装まで一貫したWebデザインを遂行できる。

  • ヒアリング

    目的・課題・訴求ポイントを整理し、サイト構成やデザインの方向性に必要な要件を引き出せる。

  • リサーチ

    競合サイトや業界トレンドを分析し、構成・導線・UIパターンの比較から、企画・デザイン判断に必要な示唆を得られる。

  • 情報設計

    サイトマップ、ユーザーシナリオ、ワイヤーフレームを用いて、情報構造と導線を明確に定義し、目的達成に最適化した構成を設計できる。

  • デザイン

    トンマナ作成(タイプグラフィ・配色・ビジュアル基調)、素材準備、写真加工を行い、世界観と可読性を両立したページデザインを構築できる。

Coding

  • HTML / CSS / Sass

    セマンティックな HTML 構造化、BEM によるスケーラブルな命名設計、SEO、レスポンシブ対応、アクセシビリティを考慮したマークアップを実装できる。

  • JavaScript(ES6)

    DOM 操作や入力バリデーション、モーダル・タブ・アコーディオンなどのインタラクションを実装し、UI の操作性を改善する動的処理を構築できる。

  • Git / GitHub

    コミット・ブランチ運用・マージを中心とした基本的なバージョン管理を行い、履歴管理や GitHub Pages を用いたサイト公開を安定して運用できる。

  • パフォーマンス最適化

    画像最適化、LCP 改善、fetchpriority / decoding / preload などの最適化手法を用いて、表示速度とユーザビリティを向上させる実装ができる。

Works

作品一覧

※本サイトでは、機密保持契約(NDA)の関係上、自主制作のプロダクトのみを掲載しています。
エントリー時には、実務で関わった案件の成果物も含めたポートフォリオ資料を別途ご提出しております。

SmartOrdee

飲食店の注文体験をスムーズにするQRコードオーダーシステムのUIデザインを制作しました

  • Webアプリ
  • リサーチ
  • コンセプト定義
  • 情報設計
  • ビジュアルデザイン
  • デザインシステム

Triplite

出張の社内申請をオンラインで行えるSaaSアプリのUIデザインを制作しました

  • Webアプリ
  • リサーチ
  • コンセプト定義
  • 情報設計
  • ビジュアルデザイン

Voislet

「評価されるための発信」から人々を解放する音声SNSのUIデザインを制作しました

  • iOSアプリ
  • リサーチ
  • コンセプト定義
  • 情報設計
  • ビジュアルデザイン

EcoHybe 店舗サイト

リサイクルショップEcoHybeの店舗サイトのデザインとコーディングを行いました

  • Webデザイン
  • コーディング
  • 店舗サイト

SmartOrdee アプリ紹介LP

飲食店の注文体験をスムーズにするQRコードオーダーアプリの紹介LPのデザインとコーディングを行いました

  • Webデザイン
  • コーディング
  • LP

Boulangerie Amande 店舗サイト

本格ベーカリーBoulangerie Amandeのホームページのデザインとコーディングを行いました

  • Webデザイン
  • コーディング
  • 店舗サイト

Hikora Design コーポレートサイト

DX事業を行う会社のコーポレートサイトのデザインとコーディングを行いました

  • Webデザイン
  • コーディング
  • コーポレートサイト

Design Notes

これまでの学習や実務経験を通して得たコーディング、Webデザイン、UI/UXデザインに関する知見を、自分なりに整理・言語化したドキュメントサイトです

  • Webデザイン
  • コーディング
  • ドキュメント

Deployment Checklist

Web制作のデプロイ前に確認したいチェックリストを制作しました。見やすさ、操作性、マークアップ、表示速度の4カテゴリで整理しています

  • Webデザイン
  • コーディング
  • チェックリスト

バナーデザイン

広告・キャンペーンを想定したバナーデザインの制作一覧。旅行、通信、サービスなど多様なジャンルを題材に、目的に応じた訴求力のあるビジュアルを制作しています。

  • バナーデザイン

Profile

自己紹介

Yuki Nishimura

UIUX Designer / Web Designer

経歴と現在

慶應義塾大学 経済学部卒
受託開発の会社にて、主にコーポレートサイトやサービス紹介のLPなど、Webデザインを中心とした案件に携わりつつ、 アプリケーションUIのデザインにも一部関わってきました。Web領域では構成設計からデザイン、静的コーディングまで一貫して担当し、 フリーランスとしてもコーポレートサイトやLP制作を中心に、要件整理から実装まで幅広く経験してきました。
制作を続ける中で、表層的なビジュアルだけではなく、ユーザーの目的や課題から構造全体を設計する領域により魅力を感じるようになり、 現在は UI/UX デザインを専門として深めていくことを志向しています。

デザインで大事にしていること

デザインを行う際には、意匠的な魅力だけでなく、「ユーザーが迷わず操作できるか」「課題や目的に対して本当に必要な構造か」という視点を常に重視しています。 課題や目的から必要な情報や機能を抽出し、それらを導線・遷移構造・情報の優先度として整理することで、負荷やストレスの少ない体験へと落とし込む設計を心がけています。
また、プロダクトはデザイナーだけでは成立しないため、実装コストや技術的制約への理解を前提に、 エンジニアとのコミュニケーションを密に取りながら現実的で再現性のある UI に仕上げることを大切にしています。

今後の展望

表層的な見た目の改善にとどまらず、ユーザーの目的や課題から本質的な構造を設計し、プロダクトそのものの価値向上に寄与できる UI/UX デザインに取り組んでいきたいと考えています。
また、ユーザー体験の向上だけでなく、事業全体を俯瞰しながらコストとリターンを踏まえた判断を行い、デザインを軸に事業へ貢献できるデザイナーを目指しています。