VRChat想定アバター「葵那(Aona)」
完全オリジナルの3Dアバターモデル。PC/Android両対応、FBX・テクスチャ・Unity Packageまで含めた構成で、キャラクターモデリングから配布形式までまとめている。
商品ページ
Portfolio / Build Log
FA・制御系の視点で、実用寄りのWebツールと試作環境を作る。
制御盤・電装・現場作業で得た問題意識を起点に、ブラウザアプリ、ローカル処理ツール、信号処理、CAD風UI、データベース、学習コンテンツを実装しています。 外部サービスに依存しすぎない静的Web構成、ローカル処理、GitHub Pages公開、AI支援を使った高速な試作と検証が主な制作スタイルです。
AI利用について：
一部のプロジェクトでは、ChatGPT / Claude / Codex などのAIコーディング支援を使っています。
担当範囲は、課題設定、要件定義、仕様化、AIへの実装指示、動作確認、改善判断、ドキュメント整理です。
コードの完全自筆性よりも、課題を整理して動作する形に落とし込む工程を重視しています。
- FA / 電装
- HTML / CSS / JavaScript
- Python GUI
- PDF / OCR
- G-code / 3Dプリント
- GIS / Map UI
- Web Audio / MIDI
- GitHub Pages
- AI-assisted Development
- VRChat / Blender / Unity
10+公開または公開予定のWebツール
7扱っている技術領域: PDF, GIS, CAD, Audio, OCR, DB, Game
Local-firstPDFや音声など、可能な範囲でブラウザ内処理を優先
FA視点現場作業、帳票、制御、配線、G-codeを題材にした試作
踏破/走破徒歩で日光街道・しまなみ海道・山手線一周、自転車で東海道&国道一号線を完走
External Summary
外部の人にまず伝えたい要点。詳細は各プロジェクトを開くと確認できます。
実装の幅
静的Webアプリ、PDF処理、地図UI、VJ/音声処理、2D CAD風UI、学習サイト、ミニゲーム、データベースまで横断して作成。
現場寄りの課題設定
FA、帳票、G-code、配線、ローカル処理など、実務に近い問題を小さく分解してプロトタイプ化。
公開までの完走
アイデアで止めず、GitHub Pagesで動くURLまで出す。実装範囲、制約、次の改善点も記録。
AIの使い方
AI任せにせず、要件定義、実装指示、レビュー、検証、改善判断を自分で担当する開発補助として利用。
長距離を完走する計画力
徒歩で日光街道(東京→日光)、しまなみ海道(尾道→今治)、一日での山手線一周を制覇。自転車では東海道&国道一号線(東京→京都、大阪)を走破し、体力・計画・継続力を実地で積み上げている。
BOOTH Pickups
3D配布物の中から、外部向けに制作力が伝わりやすいものを選定。画像はローカル保存した軽量版を使用しています。
Featured Projects
主要プロジェクト。各カードは折りたたみ式です。
XNH_news-atlas / World News Map Viewer
世界ニュース、災害、自然イベントを地図・時間・カテゴリで俯瞰する静的Webアプリ。
XNH_news-atlas / World News Map Viewer
世界ニュース、災害、自然イベントを地図・時間・カテゴリで俯瞰する静的Webアプリ。
概要
ニュース記事や自然イベントを地理情報に結び、地図、イベント一覧、ヒートマップ、トレンド表示で確認するWebアプリ。
実装範囲
- MapLibre GL JSによるダークテーマ地図UI
- ニュースイベント一覧、カテゴリフィルタ、検索、時間範囲フィルタ
- RSS / GeoRSS / GeoJSON / 静的JSONを扱う更新フロー
- バックエンドを持たないGitHub Pages公開構成
評価される点
地図、時系列、カテゴリを同一UIで扱うため、単なるリンク集ではなく「どこで何が起きているか」を可視化できる。
技術課題
非ジオタグ記事の位置推定、誤配置の信頼度表示、ソース偏り、データ量増加時の表示負荷。
Tech
HTML / CSS / JavaScript / MapLibre GL JS / Python / GitHub Actions / RSS / GeoRSS / GeoJSON
XNH WebApp PDF Editor
ブラウザだけでPDFの読み込み、ページ編集、注釈、保存を行うローカル処理型PDFエディタ。
XNH WebApp PDF Editor
ブラウザだけでPDFの読み込み、ページ編集、注釈、保存を行うローカル処理型PDFエディタ。
概要
外部サービスへPDFを送信せず、ブラウザ内でページ操作と注釈追加を行うツール。
実装範囲
- PDF読み込み、ページサムネイル、ページ並び替え、削除、回転、結合、抽出
- 図形・テキスト注釈、Undo / Redo、保存処理
- CDN非依存、静的ホスティングで動く構成
評価される点
PDFを外部に送らない設計方針と、静的Webだけで実用的な編集操作を成立させている点。
技術課題
PDF本文は描画命令の集合であり、Wordのような意味的全文編集は難しい。編集可能範囲の明示が必要。
Tech
HTML / CSS / JavaScript / pdf.js / pdf-lib / Canvas / GitHub Pages
Links
VJ FX Maker
画像・動画・音声を読み込み、WebGL / Web Audio / Web MIDIで映像エフェクトを生成するVJツール。
VJ FX Maker
画像・動画・音声を読み込み、WebGL / Web Audio / Web MIDIで映像エフェクトを生成するVJツール。
概要
ブラウザ単体で映像素材、音声反応、シーン切替、タイムライン操作を検証するVJ用エフェクトメーカー。
実装範囲
- 素材読み込み、エフェクトレイヤー、A/Bシーン、クロスフェード
- BPM同期、音声反応、タイムライン、キーフレーム
- MIDI Learnによる外部操作の検証
評価される点
WebGL、Web Audio、Web MIDIを1画面にまとめ、ブラウザ上でライブ映像系UIの主要要素を検証している点。
技術課題
機能追加に伴うUI複雑化、ブラウザ差分、描画負荷、ライブ用途での安定性。
Tech
HTML / CSS / JavaScript / Canvas / WebGL / Web Audio API / Web MIDI API
SYNTH MATCH SPECTRA
Web Audio APIでシンセ音色を作り、耳と波形で一致を狙うブラウザゲーム。
SYNTH MATCH SPECTRA
Web Audio APIでシンセ音色を作り、耳と波形で一致を狙うブラウザゲーム。
概要
周波数、波形、フィルタ、歪み、空間系FXなどを調整し、ターゲット音色に近づけるミニゲーム兼シンセ実験環境。
実装範囲
- Web Audio APIによるオシレータ、フィルタ、FX、リミッタ
- フリープレイ、PCキーボード演奏、MIDI入力
- 波形表示、FFT風ビジュアル、レベル制のパラメータ解放
評価される点
音声合成、ゲームUI、入力処理、可視化を単一HTMLでまとめ、操作しながら音響パラメータを確認できる点。
技術課題
ブラウザごとのAudioContext制約、MIDI権限、FXを重ねた際の音量管理、モバイル操作性。
Links
2D CAD
ブラウザで図形編集やCAD風操作系を検証する2D CADプロトタイプ。
2D CAD
ブラウザで図形編集やCAD風操作系を検証する2D CADプロトタイプ。
概要
本格CADではなく、Web上で作図UI、図形編集、スナップや寸法操作の方向性を検証するプロトタイプ。
評価される点
FA/CAD系UIへの関心を、静的Webで触れる形に落とし込んでいる点。今後のDXF/SVG入出力や寸法線実装につなげやすい。
技術課題
拘束、寸法、スナップ、座標精度、保存形式、Undo / Redo。現状は作図UIの検証段階。
Tech
HTML / CSS / JavaScript / GitHub Pages / AI Studio
Links
DTMF Converter / DTMFの仕組み
電話のプッシュ音を周波数の組み合わせとして生成・検出する信号処理学習プロジェクト。
DTMF Converter / DTMFの仕組み
電話のプッシュ音を周波数の組み合わせとして生成・検出する信号処理学習プロジェクト。
Site Inventory
ホームページ全体の公開物。カテゴリごとに折りたたみで整理しています。
便利ツール / Web Apps
- QRコード読取・生成
- PDFエディター
- Audio Converter: 音声ファイル変換
- SVGコンバーター
- GIFコンバーター
- 科学計算機: 関数・単位・グラフ系の電卓
- 2D CADモドキ
- DTMFコンバーター
- VJ背景簡易映像エフェクトジェネレーター
ミニゲーム / Interactive
- SYNTH MATCH SPECTRA: Web Audioシンセ音色マッチゲーム
- FPVドローンゲーム
- ランダム俳句ジェネレーター
Study / Database
- インタラクティブ数学: 三角関数、カオス、フーリエ、確率などの視覚教材
- 世界ニュースマップ
- 日本の人工衛星/探査機DB
- 日本の科学研究機関DB
Creative / Profile
- VRChat活動記録
- Blender / Unity / VRChat向け制作
- 使用ソフト一覧: VS Code, Fusion 360, Blender, KiCad, GIMP, DaVinci Resolve, FL Studio Mobile
- Blog: 制作ログ、VRChat記事、サイト更新記録
Prototype / Study Backlog
まだ公開ページとして整っていない試作・学習テーマ。各項目は検証中です。
Penplot-Gcoder
SVG / DXF / 画像からペンプロッタ用G-codeを生成するデスクトップアプリ構想。
Penplot-Gcoder
SVG / DXF / 画像からペンプロッタ用G-codeを生成するデスクトップアプリ構想。
狙い
描画順序、ペン上下、塗りつぶし、プレビュー、実機向けG-code調整をまとめて扱う。
検証項目
SVG読み込み、2Dプレビュー、ペン上下G-code、単純な描画順最適化、実機制御を想定した安全確認。
Tech
Python / PyQt6 or PySide6 / svgpathtools / ezdxf / OpenCV / Shapely / NumPy / G-code
PDF ROI OCR Renamer
PDFの指定範囲をOCRし、抽出文字列からファイル名を生成する業務改善ツール構想。
PDF ROI OCR Renamer
PDFの指定範囲をOCRし、抽出文字列からファイル名を生成する業務改善ツール構想。
狙い
帳票PDFのファイル名変更や分類を、ROI指定と正規表現抽出で半自動化する。
検証項目
ROI保存、プレビュー、リネーム前確認、衝突時suffix、ログ出力、誤リネーム防止。
Tech
Python / PySide6 / PyMuPDF / PaddleOCR or Tesseract / Pillow / JSON設定 / 正規表現
MazeRouter_forKicad
KiCad向け自動配線ルータ。DSN/SES形式を介して外部ルータとして動かす研究テーマ。
MazeRouter_forKicad
KiCad向け自動配線ルータ。DSN/SES形式を介して外部ルータとして動かす研究テーマ。
狙い
基板配線の制約処理、迷路探索、設計ルール、ビア、ネット、クリアランスを扱う外部ルータの検証。
検証項目
小規模DSNの読み込み、グリッド化、単一ネット配線、SES出力の最小実験。
Tech
KiCad / DSN / SES / Rust / Python補助 / Maze Routing / EDA
Capability Map
経験のある領域と、試作・学習段階の領域を分けて記載しています。
実務寄り
FA、電装、PLC周辺、センサ、リレー、AC200 V系、Excel/CSV、帳票、現場トラブルの切り分け。
試作で使用
HTML/CSS/JavaScript、GitHub Pages、Python GUI、PDF処理、OCR、Web Audio、Canvas/WebGL、Web MIDI。
学習・研究中
G-code、ツールパス生成、KiCad自動配線、Rust、3Dプリンタ用スライサー、AIエージェント運用。
創作・表現
VRChat、Blender、Unity、VJ表現、俳句ジェネレーター、Web上の小規模実験。
How I Build
現場課題 / 作りたい機能
↓
要件を短く書く
↓
AI支援で実装案を比較する
↓
動作確認・エラー確認・ログ確認
↓
リスク箇所と操作性を修正する
↓
Demo / GitHub / Note として残す
↓
要件を短く書く
↓
AI支援で実装案を比較する
↓
動作確認・エラー確認・ログ確認
↓
リスク箇所と操作性を修正する
↓
Demo / GitHub / Note として残す