未分類 HTML5のvideo要素で動画シークを快適にする方法｜Webアプリでネイティブシークを活かす実装ポイント
Webアプリで動画を扱うとき、再生UIを独自実装したくなる場面は多いです。学習サービス、レビュー画面、監視映像ビューア、動画編集の簡易ツールなどでは、アプリ全体のデザインに合わせてプレイヤーも作り込みたくなります。ただ、そのときに見落としや...
未分類 
python 有料ソフトなしで動画の前処理をしたい人へ｜ブラウザでマスク・切り出し・FPS変換ができる無料ツールを作りました
動画の前処理をしたいけれど、そこまで高機能な有料ソフトは使いたくない。そんな人向けに、ブラウザ上で動画のマスク、切り出し、FPS変換ができるシンプルな無料ツールを作りました。このツールは、プログラミングに詳しくない人でも使いやすいように、動...
非エンジニア向けコンテンツ 非エンジニア向け｜NumPy 2.0で不具合が出るときはPython 3.11＋NumPy 1.26構成を試す
最近、Pythonでアプリを作っていると、今まで動いていたコードが急にエラーになることがあります。 その原因のひとつとして疑いたいのが、NumPy 2.0系への更新です。NumPy 2.0は大きなメジャーアップデートで、NumPy公式のリリ...
非エンジニア向けコンテンツ Claude Codeでファイル選択機能を実装する方法｜非エンジニア向けに依頼プロセスを解説
前回までの記事では、VS Codeの導入やReact / Next.jsの開発環境構築を進めてきました。 今回はその続きとして、Claude Codeに指示を出しながら、Webアプリにファイル選択機能を実装する流れを整理します。この記事のポ...
非エンジニア向けコンテンツ 非エンジニア向け｜ReactとNext.jsの導入方法【VS CodeでWebアプリ開発を始める手順】
前回の記事では、非エンジニアがWebアプリ開発を始めるための準備として、VS Codeの導入方法を紹介しました。 まだVS Codeの準備が終わっていない方は、先に 非エンジニア向け｜Claude CodeとCodexを使うためのVS Co...
非エンジニア向けコンテンツ 非エンジニア向け｜Claude CodeとCodexを使うためのVS Code導入方法【日本語化・おすすめ拡張機能】
「Claude CodeやCodexを使ってみたいけれど、何を入れればいいのかわからない」──そんな非エンジニア向けに、この記事では Visual Studio Code（VS Code） の導入方法を、できるだけやさしく整理します。特にこ...
python 【保存版】顔のランドマークを抽出＆可視化するStreamlitアプリ
MediaPipe × Matplotlib × Streamlit｜CSV出力も対応しています。手の推定の時（）と同様、このmediapipeのアプリが何に使えるかはわかりませんが、とりあえず座標を出力できるようにしました。顔の変化が特徴...
python MediaPipe座標から親指と人差し指の距離を3Dで可視化するアプリ【Streamlit】
はじめに手の動きを分析する際に、親指と人差し指の距離というのは非常に重要なパラメータになります。例えばピンチ動作の解析や、把持の開始/終了判定、あるいは発達評価などにも応用できます。今回は、前回の手指の座標取得のアプリの記事（記事URL:）...
python 【Python】Streamlitアプリ公開の方法｜OpenCVとメモリでつまずかないために
Python × Webアプリの開発環境として定番になりつつある「Streamlit」ですが、いざ公開しようとすると意外とつまずくポイントもあります。筆者もこれまでにOpenCVやMediaPipeを使ったアプリを何本もデプロイしてきました...
ガジェット系 M5Stack Core2 × IMU × PaHubで動作分析！複数センサの同時計測を試してみた
M5Stack Core2 は、豊富な拡張モジュールを備えたマイコンボードです。とくに IMU（慣性計測ユニット） を活用すれば、手軽に姿勢角や動作情報を取得でき、動作分析やスポーツ評価にも応用が効きます。プログラムはC+ベースのArdui...
