フロントエンド画面設計支援フロントエンド画面設計支援実務
電力管理ダッシュボード：運用画面・CSV更新フロー設計
電力オペレーター向けの業務ダッシュボードで、CSV更新を含む複雑な運用フローを、安全に扱える画面仕様へ整理した実務案件。確認・アップロード/ダウンロード・削除・バリデーション・エラー表示まで、実装を見据えて設計した。
社内ツールダッシュボードUXバリデーション・エラーUX
Loading...
支援サービスに直結しやすい代表案件を先にピックアップしています。背景・判断・実装の流れを短時間で把握できます。
電力オペレーター向けの業務ダッシュボードで、CSV更新を含む複雑な運用フローを、安全に扱える画面仕様へ整理した実務案件。確認・アップロード/ダウンロード・削除・バリデーション・エラー表示まで、実装を見据えて設計した。
非ネイティブ話者の面接練習を支える、キーボード完結のフラッシュカードアプリ。スクリーンリーダー対応、モーション制御、セマンティックなマークアップなど、アクセシビリティを前提に設計・実装した。
0→1フェーズの教育プラットフォームMVPで、唯一のフロントエンドエンジニアとして仕様調整・API連携・実装を横断して担当した案件。UX要件と技術制約を踏まえ、プロダクト初期立ち上げを支えた。
サービス軸・課題テーマ・案件種別で絞り込み、近い条件の実績にすぐアクセスできます。
サービス別
テーマ別
種別
電力オペレーター向けの業務ダッシュボードで、CSV更新を含む複雑な運用フローを、安全に扱える画面仕様へ整理した実務案件。確認・アップロード/ダウンロード・削除・バリデーション・エラー表示まで、実装を見据えて設計した。
最大約5言語規模の多言語サイトに対して、情報設計・ユーザビリティ調査設計・改善提案を行った案件。予約導線や購入判断情報の不足を整理し、サイトマップ・ワイヤー・調査票・改善提案資料へ落とし込んだ。
非ネイティブ話者の面接練習を支える、キーボード完結のフラッシュカードアプリ。スクリーンリーダー対応、モーション制御、セマンティックなマークアップなど、アクセシビリティを前提に設計・実装した。
0→1フェーズの教育プラットフォームMVPで、唯一のフロントエンドエンジニアとして仕様調整・API連携・実装を横断して担当した案件。UX要件と技術制約を踏まえ、プロダクト初期立ち上げを支えた。
Tailwind のカラーパレットやセマンティックトークンを前提に、WCAGコントラスト比をすばやく確認できる軽量ツール。実際のデザイン・開発フローで使いやすいよう、キーボードファーストの操作性も含めて設計・実装した。
金融B2B SaaS のコアプロダクト開発で、UIコンポーネント実装・共通UI改善・Storybookベースの設計整備・テスト実装を担当。海外チームと非同期で連携しながら、継続的なプロダクト開発に参加した。
月次PDFレポート作成を自動化する社内ツールで、可視化・データ取得・PDF生成までをフロントエンド側から整理・実装した案件。SQL構造をPrismaモデルに落とし込み、Chart.js と Puppeteer を使って実運用に耐えるレポート生成フローを整えた。
個人スタジオのサイト、オンラインジャーナル、サービスLPを、英語・日本語の両方を前提に情報設計・UX/UI設計・実装まで一貫して組み立てたプロジェクト。サービス導線、アクセシビリティ、多言語構造、コンテンツの見せ方を横断して整理している。
ブランド方針の整理から、情報設計・UI・実装・計測改善まで一貫して担当したリニューアル案件。商品理解・導線・サポート情報の出し方を調整し、自己解決しやすさと信頼感を高めた。
競合の多い東京エリアのヘアサロンに対して、顧客理解・価値提案・訴求設計・改善運用を一貫して整理した案件。オーナーやスタッフと並走しながら、ブランドの世界観、広告表現、価格設計、接客体験の整合を取り、継続的な改善につなげた。
国際スクラムチームで、レガシーアプリの改善や社内向け開発者ツールの実装に関わり、レトロスペクティブのリードやDEV→QA基準の整理にも参加した案件。
分散チーム向けのナレッジ共有プラットフォームを想定し、ユーザーフロー・投稿テンプレート・役割別ジャーニーを設計したケーススタディ。情報の流れを構造化し、運用される前提で画面と導線を整理した。