My Portfolio

Design + Coding

ご多用の中、ご覧いただき誠にありがとうございます。

index

01 自己紹介

02 スキル

03 制作理念

04 HP・LP制作

05 コミュニティ支援

06 AI活用・効率化

07 制作実績

08 お問い合わせ

KK

JavaScript

Node.js

Python

GAS

HTML/CSS

Next.js

discord.js

discord.py

GitHub

Vercel

Netlify

Claude

Claude Code

Codex

Metaplex

Firebase

Supabase

自己紹介

2025年7月

Vibe Coding を開始

AI支援開発に本格参入。discord.js・GAS・Three.jsを独学でマスター

2025年後半

CNP×RED° プロジェクト参加

日本最大級NFTコミュニティのDiscord Bot開発・AL管理・ミント支援を担当

2025年末

KAKERA NFTページ作成

KAKERA NFTの公式ページを制作。Mint・FAQ・Aboutなど複数ページを実装

2026年4月

KKコミュニティ立ち上げ

非エンジニア向けAIツール配布コミュニティをDiscordでローンチ

2026年4月

ORVA リリース

fal.ai連携のAI画像生成Chrome拡張を開発・公開

2026年5月

LEVEL UP サイト制作

ゴルフメディアサイトのワイヤーフレーム〜引継ぎドキュメントを一括制作。マルチページ・レスポンシブ対応

スキル

JavaScript

Node.js

Python

GAS

HTML/CSS

Next.js

discord.js

discord.py

GitHub

Vercel

Netlify

Claude

Claude Code

Codex

Metaplex

Make

API連携

Firebase

Supabase

Discord Bot 業務自動化 LP / Frontend Web3 / NFT AIツール開発

制作理念

「使える」を、誰にでも届ける

私が大切にしているのは、技術に詳しい人だけでなく、誰でも迷わず使えるプロダクトを届けることです。

Vibe Coding × AI活用によって、アイデアを素早く形にし、見た目の良さだけで終わらない「すぐ使える・すぐ伝わる」体験を設計します。

思わず触りたくなるデザインと触れた瞬間に価値が伝わる実装を両立し、目的に合わせた設計まで含めてご提案します。

HP・LP制作

伝わるWebページを、公開まで。

コミュニティの有無に関係なく、サービス・店舗・個人活動の魅力が伝わるページを制作します。見た目だけでなく、問い合わせや申込みにつながる構成から整えます。

構成整理デザイン実装公開

レスポンシブ対応まで制作

スマホ・タブレット・PCで見やすく使えるよう、画面幅に合わせた表示まで整えます。

お問い合わせ導線も対応

Googleフォームや外部フォームへの導線、問い合わせボタン、申込みにつながる配置まで設計します。

普通のHP制作案件として相談可能

トップページ、LP、サービス紹介、プロフィールページなど、Webページ単体の制作として目的に合わせて提案します。

コミュニティ立ち上げ・運用支援

参加後の体験まで、運営しやすく。

Discordサーバー設計、参加導線、オンボーディング、Bot開発まで、コミュニティ運営で必要になる仕組みをまとめて整えます。

Discord設計参加導線 Bot開発運用改善

迷わない参加導線

初参加の人が何をすればよいか分かるよう、チャンネル構成や案内を整理します。

運営負荷を下げるBot

ロール付与、ポイント管理、投稿管理、通知など、手作業を減らす仕組みを作ります。

Webページとの接続も可能

必要に応じて、告知ページやLPからDiscord参加後の体験まで一貫して設計できます。

AI活用・業務効率化

手作業を減らし、運用を軽く。

GAS、自動化ツール、AIを使った開発で、日々の繰り返し作業や連絡・集計・管理の負担を減らします。小さな自動化から、実際に使える業務ツールまで対応します。

課題整理自動化設計ツール実装運用改善

GAS・Makeで外部サービス連携

Googleフォーム、スプレッドシート、Gmail、Discordなどをつなぎ、通知や集計を自動化します。

AIを使った制作・開発

Claude、Claude Code、GPT、Codexなどを活用し、ページ制作や業務ツールを短期間で形にします。

現場で使える形まで落とし込む

作って終わりではなく、非エンジニアでも迷わず使える画面や運用フローまで整えます。

制作実績

01

KKコミュニティ
ランディングページ

Three.js + GSAPでのインタラクティブなLP。非エンジニア向けのAIコミュニティ紹介。

Three.js GSAP Netlify

02

Discord Bot
（CNP×RED°）

音声チャンネル参加者エクスポート・AL管理・ロール自動付与の複合Bot。

discord.js Node.js

03

PayPal × Gmail
Make自動化システム

決済 → メール配信で完全自動化。

PayPal Gmail Make

04

AIページ要約
Chrome拡張

閲覧中ページの内容を取得し、Anthropic APIで要約するChrome拡張ツール。

Chrome拡張 Anthropic API JS

05

ORVA
Chrome拡張

fal.aiと連携したAI画像生成ツール。サイドパネルから生成・履歴管理まで対応。

Chrome拡張 fal.ai JS

06

チャレンジャーズ
運営支援Bot

毎朝の宣言投稿、ポイント管理、Notion連携、チケット作成、チャンネル表示切替まで備えた運営支援Bot。

discord.js Node.js Notion API node-cron

05

WORKS — 05

ORVA Chrome拡張

使用ツール

JavaScript、Chrome Extension、fal.ai

担当

企画、UI設計、実装

制作期間

2日

テーマカラー

ダークグリーン、エメラルド

第一印象

先進性、使いやすさ

開発背景

ブラウザ作業中でも、すぐにAI画像生成を試せる環境を作るため、サイドパネルから完結する画像生成Chrome拡張として開発しました。

実装ポイント

fal.ai API連携、モデル選択、画像生成数・比率指定、履歴管理、APIキー設定までを実装。開いてすぐ使える操作感を重視しました。

◈ORVA

⚙

モデル

GPT-image-2

OpenAI製GPT-image-2。品質で料金変動 | $0.01〜$0.22/枚

auto

Medium

×1

プロンプト

生成したい画像を説明...

▶ ネガティブプロンプト

履歴 0

06

WORKS — 06

チャレンジャーズ運営支援Bot

使用ツール

discord.js、Node.js、Notion API、node-cron

担当

Bot設計、実装、運用導線設計

主な機能

宣言投稿、ポイント管理、チケット、リンク集

連携

Notion DB、Discordチャンネル、権限管理

目的

参加率向上、運営負荷の軽減

開発背景

コミュニティ内で毎日の行動宣言や応援を自然に促し、運営側の対応も軽くするため、参加促進と管理をまとめて支えるBotとして制作しました。

実装ポイント

宣言モーダル、応援・休憩ボタン、日次重複防止、ポイントのNotion保存、チケット作成、チャンネル表示切替まで実装。参加者が迷わず使える操作感を重視しました。

CHALLENGERS SUPPORT BOT Online

# 今日の宣言

CB

おはようございます！

今日も一緒に宣言しましょう。下のボタンから今日の状態を選んでください。

宣言 +30pt

応援 +10pt

休憩 +5pt

Notionへ記録

日次重複防止

サポートチケット

問い合わせボタンから専用チャンネルを自動作成。対応後はクローズできます。

07

WORKS — 07

わくわくKKのAI創作コミュニティ運営

内容

AIツール配布、Discord運営、参加導線設計

提供ツール

LINE予約投稿、ORVA、Amazon商品比較ノート

対象

AIに興味はあるが始め方が分からない人

設計

30日で使いこなす体験導線

参加形態

無料Discordコミュニティ

運営背景

AIを知っているだけで終わらず、実際に触って日常に取り入れられる人を増やすため、自作ツールを入口にした無料コミュニティとして運営しています。

運営ポイント

LP、Discord参加導線、ツール配布、FAQ、参加後の質問導線まで設計。非エンジニアでも迷わずAI活用を始められる体験を重視しました。

お気軽にご連絡ください

Discord Bot開発・WEB制作・LP制作・GAS自動化・Web3開発など
お仕事のご依頼・ご相談はいつでもお待ちしております。

お問い合わせフォーム