物流現場11年 ×
Claude Codeで、
現場に効くツールを。

現場を知る人間が、AIで作る。

食品容器卸売業の物流部門で11年。日々の業務の中で感じてきた「ここ、自動化できたら…」を、AI駆動開発で形にしています。

できること。

小さく始めて、確実に動くものをお渡しします。

• Claude Code
• HTML
• CSS
• JavaScript
• GitHub
• Vercel

お仕事の進め方。

はじめての方でも安心して進められるよう、流れをシンプルにしています。

制作物。

実際に触って確認できる制作物です。このサイト以外は、すべて架空のデータ・店舗を題材にしたサンプルです。新しいものができしだい追加していきます。

TOOL

出荷リスト自動作成ツール(サンプル)

• 作ったもの受注CSVを読み込むと、届け先ごとの出荷リストと、商品ごとのピッキングリストを自動で作ります。
• 工夫した点数量の異常・必須項目の抜け・郵便番号の形式・重複行を先に見つけます。結果はExcelで開けるCSVで保存できます。
• 安心して使える点データはブラウザの中だけで処理し、サーバーには送りません。画面のデータはすべて架空です。

使ったもの: HTML・CSS・JavaScript / Claude Code(APIキーや外部サービスは使っていません)

試してみる →

TOOL

在庫・発注・出荷管理ツール(サンプル)

• 作ったもの出荷予定を入れると在庫を引き当て、1日の出荷量と入庫までの日数から発注点を計算し、下回った商品に発注数量を提案します。
• 工夫した点「あと何日で欠品するか」を出し、発注しても入庫が間に合わない商品は警告します。在庫が足りない出荷は登録できません。履歴にも残ります。
• 安心して使える点データはブラウザの中だけに保存し、サーバーには送りません。画面のデータはすべて架空です。

使ったもの: HTML・CSS・JavaScript / Claude Code(APIキーや外部サービスは使っていません)

試してみる →

WEB

食品容器卸売店のHPサンプル「MINATO PACK」(架空)

• 作ったもの架空の食品容器卸売店を題材にした、ホームページのサンプルです。
• 工夫した点写真のスライドショー、1文字ずつ浮かび上がるキャッチコピー、スクロールで動くアニメーション、商品ラインナップ、お知らせ、商品をカートに入れて購入手続きまで試せる画面(実際の決済は行われません)、入力チェック付きのお問い合わせフォーム、スマホ用メニューを備えています。

使ったもの: HTML・CSS・JavaScript / Claude Code / 写真はUnsplashのフリー素材(出典はページ下部に記載)

公開サイトを見る →

LP

整体院のランディングページ(サンプル・架空)

• 作ったもの実在しない整体院「整体院 ひだまり」を題材にした、1ページ完結のLPサンプルです。
• 工夫した点お悩み、選ばれる理由、施術の流れ、料金、お客様の声(架空)、院長紹介、アクセス・営業時間、お知らせ、よくある質問、予約フォームを1ページにまとめました。予約フォームは入力チェックと確認表示まで動きますが、送信してもデータはどこにも送られません。スマホでは予約ボタンを画面下に固定しています。

使ったもの: HTML・CSS・JavaScript / Claude Code / 写真はUnsplashのフリー素材(出典はページ下部に記載)

公開サイトを見る →

CHATBOT

よくある質問ボット

• 作ったものこのサイトの右下で動いている、経歴・できること・進め方などの質問に答えるFAQ型のボットです。
• 工夫した点直前の話題と会話履歴を覚えていて、「それは?」のような続きの質問にも対応します。AIではなく、サイトに書いた内容だけを返します。

使ったもの: HTML・CSS・JavaScript(APIキーや外部サービスは使っていません)

試してみる →

WEB

このポートフォリオサイト

• 作ったもの物流の経験とClaude Codeでできることをまとめた、自己紹介サイトです。

使ったもの: HTML・CSS・JavaScript / Claude Code / GitHub / Vercel

公開サイトを見る →